body{
    font-family: 'Tajawal', sans-serif;
    align-items: center;
    justify-content: center;
    background: url(https://chats.weblaz.com/media/chatrooms/background/12.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;    
}

.google-preloader{
     background-color: rgba(255, 255, 255, 0.75);
     border: 1px solid rgba(209, 213, 219, 0.3);
}
.google-preloader p{color:var(--body-color);}

/*  */

.chat-list-col {
    border-radius:15px 15px 15px 15px;
    color: white;
    background: rgba(255, 255, 255, 0.35);
    box-shadow: 0 8px 32px 0 rgb(0 0 0 / 10%);
    border: 1px solid rgba(255, 255, 255, 0.18);
}
.emojionearea.form-control {
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}

.room-user-search {
	background: #ffffff !important;
}

.nav-sidebar .nav-link.active {
	background: #ffffff;
	color: #4e4e4e;
}

.nav-sidebar .nav-link{
	color: #4e4e4e;
}

ul.nav.nav-pills.nav-justified.nav-sidebar {
	background: #ffffff;
}

.room-user-search {
	border: 1px solid #dedede !important;
	border-left: 0 !important;
	border-right: 0 !important;
}

.btn.btn-room-user-search {
	background: #dbdee0;
}

.chat-name {
	color: #4e4e4e;
}

.input-message-write {
    border-top: 1px solid #dedede;
    background: #ffffff00;
    backdrop-filter: blur(12px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgb(255 255 255 / 74%);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}

.panel-content {
}

.panel-content-right{
}

.online-status i {
	border-color: #ffffff;
}

.selected-chat {
backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background: rgb(255 255 255 / 49%) !important;
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}

.radio-container {
backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}

.chat-data-header,.nav-recent {
color: #4e4e4e;
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}


.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	color: #4e4e4e;
}

.nav-recent a.nav-link {
	color: #4e4e4e;
}

.user-info {
	color: #4e4e4e;
}

.topbar .select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered {
	background: #ffffff;
	color: #4e4e4e;
	border: 1px solid #dedede;
}


.radio-panel {
	box-shadow: none;
}

.selected-chat-col {
    background-color: transparent;
}

.chat-messages-col{
	border-right: 1px solid #dedede;
	border-left: 1px solid #dedede;
}

.topbar {
	    border-bottom: 1px solid #dedede00;
	box-shadow: 0 8px 8px -8px rgb(0 0 0 / 10%);
}

.base-min .nav-pills .nav-link.active, .nav-pills .show > .nav-link, #auth-modal .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	color: #fff;
}

.group-item {
	background: #fff;
}

.nav-search {
	border-bottom: none;
}

.group-sep:after {
	background: #ffffff;
}	


.group-sep {
	color: #e5e5e5;
}

#room-selector {
	background: #ffffff;
}


.room-selected {
    color: #4e4e4e;
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 20px;
}

.launch-modal {
    background: var(--blue);
    color: white;
}	

.bottom-login-section{
	background: #fff;
	border-right: none;
	border-top: 1px solid #dedede;
}

.user-fname {
	color: #4e4e4e;
}

.is-typing {
	background: #fff;
}

.theme-selector,.bottom-login-section #langSelector {
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}

.chat-nav {
    backdrop-filter: blur(10px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgb(255 255 255 / 62%);
    border-radius: 3px 15px 15px 15px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}
.fu_search_toggle {
    background: var(--msg-hover-bg);
}
.online-list, .dm-list,.fav-list {
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}
.modal-content {
    border: 1px solid #d9dcde26;
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}
.group_card{
    width: 100%;
    background-color: rgb(255 255 255 / 52%);
    border: 1px solid rgba(209, 213, 219, 0.3);
}
.active_container {
    border: 1px solid rgba(209, 213, 219, 0.3);
    background-color: rgb(255 255 255 / 46%);
}
.stats{
background: var(--white) !important;
    color: #000 !important;
}
.reply-msg-row-show {
backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}