.bg-cover {
  background-size: contain;
  background-color: #0d1b2a;
}
:root {
  --sent-background: #1b2838;
  --sent-color: #e0e0e0;
  --received-background: #162234;
  --received-color: #e0e0e0;
  --default-text-color: #e0e0e0;
  --muted-text-color: #8899aa;
  --dark-bg: #0a1628;
  --darker-bg: #060e1a;
  --panel-bg: #0a1628;
  --input-bg: #1b2838;
  --border-color: #2a3f5f;
  color-scheme: light dark;
  --oc-body-color-rgb: 110, 181, 255;
  --oc-success-rgb: 28, 200, 138;
}

body {
  background-color: #0d1b2a;
  color: var(--default-text-color) !important;
  font-family: "Montserrat", sans-serif;
}

a {
  color: #6eb5ff;
}

a:hover {
  color: #93cbff;
}

*::-webkit-scrollbar-thumb {
  background: #2a3f5f;
}

*::-webkit-scrollbar-track {
  background: #0d1b2a;
}

*:hover::-webkit-scrollbar-thumb {
  background: #3a6ea5;
}

.auth-body {
  background-color: #0d1b2a;
}

.auth-cover {
  background-color: transparent;
}

.auth-content {
  background: #0a1628;
  color: var(--default-text-color);
  border: 1px solid #1a2d4a;
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.35);
}

.alert-warning {
  background-color: #1b2838;
  border-color: #2a3f5f;
  color: #e0e0e0;
}

.alert-warning strong {
  color: #f0c040;
}

.alert-warning .btn-success {
  background-color: #2e7d32;
  border-color: #2e7d32;
}

.alert-warning .btn-success:hover {
  background-color: #388e3c;
  border-color: #388e3c;
}

.policy-agree-block .form-check-input {
  width: 18px;
  height: 18px;
  accent-color: #4fc3f7 !important;
  background-color: #1b2838 !important;
  border: 2px solid #4fc3f7 !important;
}

.policy-agree-block .form-check-label {
  color: #e0e0e0;
}

.policy-agree-block .form-check-label a {
  color: #4fc3f7;
  text-decoration: underline;
}

.policy-agree-block .form-check-label a:hover {
  color: #81d4fa;
}

.login-selector .nav-link {
  background: #1b2838;
  color: #8899aa;
}

.login-selector .nav-link.active {
  background: #3a6ea5 !important;
  color: #ffffff !important;
}

.login-selector .nav-link:hover {
  background: #2a5a8a !important;
  color: #ffffff !important;
}

.sent .message-data:before {
  display: none;
}

.replies .message-data:after {
  display: none;
}

.sent .chat-img-sgl,
.sent .chat-img-duo,
.sent .chat-img-grp,
.sent .chat-gif,
.sent .chat-txt,
.sent .chat-code,
.chat-fwd,
.sent .link-meta,
.sent .file-section,
.sent .video-section,
.sent .chat-replied-bubble,
.sent .chat-audio {
  background: var(--sent-background);
}

.replies .chat-img-sgl,
.replies .chat-img-duo,
.replies .chat-img-grp,
.replies .chat-gif,
.replies .chat-txt,
.replies .chat-code,
.replies .message-data small,
.replies .chat-fwd,
.replies .link-meta,
.replies .file-section,
.replies .video-section,
.replies .chat-replied-bubble,
.replies .chat-audio {
  background: var(--received-background);
}

.cht.replies .message-data,
.replies a.file-header {
  color: var(--received-color);
  background: var(--received-background);
}

.cht.sent .message-data,
.sent a.file-header {
  color: var(--sent-color);
}

.cht.replies .message-data {
  color: var(--received-color);
  background: var(--received-background);
  box-shadow: 2px 2px 4px -3px rgb(0 0 0 / 75%);
}

.cht.sent .message-data {
  color: var(--sent-color);
  background: var(--sent-background);
  box-shadow: -2px 2px 4px -3px rgb(0 0 0 / 75%);
}

div[data-msg-type="5"].cht.replies .chat-txt,
div[data-msg-type="5"].cht.replies .link-preview {
  box-shadow: 2px 2px 4px -3px rgb(0 0 0 / 75%);
}

div[data-msg-type="5"].cht.sent .chat-txt,
div[data-msg-type="5"].cht.sent .link-preview {
  box-shadow: -2px 2px 4px -3px rgb(0 0 0 / 75%);
}

.room-bar {
  background-color: var(--dark-bg);
  border-right: 1px solid #1a2d4a;
}

.main-panel {
  border-right: 1px solid #1a2d4a;
}

.sidebar-wrapper,
.channel-list {
  background-color: #0a1628;
  color: var(--default-text-color);
}

.cn-tab .pill {
  background-color: #eee;
}

.cn-tab .pill.active {
  background-color: #8bc34a;
}

.unread-indicator {
  background-color: #d63939;
}

.channel-cat:hover,
.channel-item:hover,
.channel-item.active {
  background-color: #162234;
}

.username-bottom {
  color: var(--default-text-color);
}

.dropdown-menu {
  background: #0a1628;
  color: var(--default-text-color);
}

.dropdown-item.active,
.dropdown-item:active,
.dropdown-item:hover {
  color: var(--default-text-color);
  background-color: #162234;
}

.navbar-collapse.collapse.show {
  background-color: var(--dark-bg) !important;
  border-radius: 5px;
}

.navbar-collapse.collapse.show .nav-link,
.navbar-collapse.collapse.show .btn-outline-light,
.navbar-collapse.collapse.show .btn-ghost-light {
  color: var(--default-text-color) !important;
}

.navbar-collapse.collapse.show .btn-outline-light {
  border-color: var(--default-text-color) !important;
}

.navbar-collapse.collapse.show .dropdown-menu {
  background: var(--dark-bg);
  color: var(--default-text-color);
  border-color: var(--border-color);
}

.navbar-collapse.collapse.show .dropdown-item {
  color: var(--default-text-color);
}

.navbar-collapse.collapse.show .dropdown-item.active,
.navbar-collapse.collapse.show .dropdown-item:active,
.navbar-collapse.collapse.show .dropdown-item:hover {
  color: var(--default-text-color);
  background-color: #162234;
}

.link-dark {
  color: var(--default-text-color);
}

.link-dark:hover,
.link-dark:focus {
  color: #6eb5ff;
}

.navbar {
  color: var(--default-text-color);
}

.btn-dark,
.btn-outline-dark,
.btn-ghost-dark {
  border: 0;
  --oc-btn-color: var(--default-text-color);
  --oc-btn-color-interactive: var(--default-text-color);
  --oc-btn-color-text: #fafbfc;
}

.btn-ghost-dark:active,
.btn-ghost-dark:hover {
  background-color: var(--dark-bg);
}

.editor-container {
  background-color: var(--input-bg);
}

.editor-icon {
  color: var(--default-text-color);
}

.editor-icon:hover,
.attachment-col.dropup:hover {
  color: #6eb5ff;
}

.rightbar-wrapper {
  background-color: var(--dark-bg);
}

.user-row:hover {
  color: var(--default-text-color);
  background-color: #162234;
}

#rpanel-tab {
  background-color: #0a1628;
}

.right-panel .nav-pills .nav-link.active,
.right-panel .nav-pills .show > .nav-link {
  color: var(--default-text-color);
  background-color: var(--dark-bg);
}

.private-messages .private-item,
.action-item {
  background-color: var(--input-bg);
}

.attachments-container {
  border-color: var(--input-bg);
}

.form-control,
.form-select {
  background-color: var(--input-bg);
  border-color: transparent;
  border: 0;
}

.form-check-input {
  background-color: var(--input-bg);
}

.form-control:focus {
  color: var(--default-text-color);
  background-color: var(--input-bg);
  border-color: transparent;
  outline: 0;
  box-shadow: 0;
}

.form-hint {
  color: #ccc;
}

.btn-upload {
  background-color: var(--input-bg);
  color: var(--default-text-color);
  border-color: transparent;
}

.input-group-flat .input-group-text {
  background: var(--input-bg);
  border-color: transparent;
}

.input-group-flat:focus-within .form-control,
.input-group-flat:focus-within .input-group-text {
  border-color: transparent !important;
}

.link-secondary:hover,
.link-secondary:focus {
  color: var(--default-text-color);
}

#cnemoji-leftlist,
.cnemoji-categname,
#cnemoji-info {
  background-color: #0d1b2a !important;
}

#cnemoji-leftlist > svg {
  fill: #e0e0e0 !important;
}

.nav-link:hover,
.nav-link:focus {
  color: #6eb5ff;
}

.current-reacts {
  background: #0a1628;
}

.channel-list-bottom {
  background: #0a1628;
}

.non-login-message,
.non-join-message,
.non-chat-select,
.user-restricted,
.permission-denied-editor,
.forward-selection {
  background-color: var(--input-bg);
}

.disc-cat-row {
  color: var(--default-text-color);
}

.disc-cat-row:hover {
  color: var(--default-text-color);
  background-color: #162234;
}

.card {
  background-color: var(--dark-bg);
  transition: 0.3s;
}

.card-header {
  color: var(--default-text-color);
}

.card-footer {
  background-color: var(--dark-bg);
}

a .card:hover {
  background-color: var(--darker-bg);
}

.room-image {
  border-color: var(--dark-bg);
}

.room-list-row a:hover {
  color: var(--default-text-color);
  text-decoration: none;
}

.profile-header {
  border: 0;
}

.profile-header .profile-header-info {
  color: var(--default-text-color);
  background-color: var(--dark-bg);
}

.profile-header-user-avatar {
  border-color: var(--dark-bg);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: var(--default-text-color);
  background-color: var(--dark-bg);
}

.sidebar-profile .nav-link {
  color: var(--default-text-color);
}

.sidebar-profile .nav-link:hover {
  color: var(--default-text-color);
  background-color: #162234;
}

.topbar-private {
  background-color: #0a1628;
}

.search_chatroom {
  border: none !important;
}

.modal-header,
.modal-content {
  background-color: #0a1628;
  border-color: #1a2d4a;
}

.media-tab .file-section {
  background-color: var(--received-background);
}

.media-tab .file-header {
  color: var(--received-color);
}

.radio-station,
.radio-volume-display {
  color: var(--default-text-color);
}

.radio-station:hover {
  color: var(--default-text-color);
}

.navbar-scrolled {
  background-color: var(--dark-bg) !important;
  color: var(--default-text-color);
}

.navbar-scrolled,
.navbar-scrolled .nav-link {
  color: var(--default-text-color) !important;
}

.navbar-scrolled .nav-link.active,
.navbar-scrolled .nav-link:hover {
  color: #6eb5ff !important;
}

.btn-outline-dark:hover {
  background-color: #3a6ea5 !important;
}

.form-selectgroup-label {
  background: var(--input-bg);
  border: 0;
  color: #fff;
}

.form-selectgroup .form-selectgroup-label {
  background: var(--input-bg);
  border: 0;
  color: #fff;
}

.form-selectgroup-input:checked + .form-selectgroup-label {
  color: #fff;
  background: #3a6ea5;
  border-color: #3a6ea5;
}

.form-selectgroup .form-selectgroup-input:checked + .form-selectgroup-label {
  color: #fff;
  background: #3a6ea5;
  border-color: #3a6ea5;
}

.form-selectgroup-label:hover {
  color: #fff;
}

.footer {
  border-color: var(--input-bg);
  background-color: var(--dark-bg);
}

.form-selectgroup-label:hover {
  background: #3a6ea5;
}

.form-selectgroup .form-selectgroup-label:hover {
  color: #fff;
  background: #3a6ea5;
}

.text-muted {
  color: var(--default-text-color) !important;
}

#main-login {
  background: #3a6ea5 !important;
  color: #ffffff !important;
  border-color: #3a6ea5 !important;
}

#main-login:hover {
  background: #2a5a8a !important;
  border-color: #2a5a8a !important;
}

.btn-dark {
  background: #3a6ea5 !important;
  color: #ffffff !important;
  border-color: #3a6ea5 !important;
}

.btn-dark:hover {
  background: #2a5a8a !important;
  border-color: #2a5a8a !important;
}

.select2-container--bootstrap4 .select2-selection {
  background-color: var(--input-bg);
  border: 0;
}

.select2-dropdown {
  background-color: var(--dark-bg);
}

.select2-container--bootstrap4 .select2-dropdown,
.select2-container--bootstrap4 .select2-dropdown.select2-dropdown--above {
  border: none;
}

.select2-search--dropdown .select2-search__field {
  background: var(--input-bg);
  border: 0;
  color: var(--default-text-color);
}

.replied-content,
.replies .replied-to {
  background: #1b2838;
  color: var(--default-text-color);
}

.reply-msg-row .replied-to {
  background-color: #162234;
}

.mini-brand-seperator {
  background-color: var(--input-bg);
}

.is-typing {
  background-color: var(--input-bg);
  color: var(--default-text-color);
}

.reply-msg-row {
  background-color: var(--input-bg);
}

.reply-msg-row .replied-content,
.reply-msg-row .replied-to {
  background: #162234;
  color: var(--default-text-color);
}

.chat-actions i {
  color: var(--default-text-color);
}

.chat-actions i:hover {
  color: #fff;
}

.popover {
  background-color: #0a1628;
  color: var(--default-text-color);
  border: 1px solid #1a2d4a;
}

.popover-body {
  color: var(--default-text-color);
}

.bs-popover-top > .popover-arrow::after,
.bs-popover-auto[data-popper-placement^="top"] > .popover-arrow::after,
.bs-popover-top > .popover-arrow::before,
.bs-popover-auto[data-popper-placement^="top"] > .popover-arrow::before {
  border-top-color: #0a1628;
}

.bs-popover-bottom > .popover-arrow::after,
.bs-popover-auto[data-popper-placement^="bottom"] > .popover-arrow::after,
.bs-popover-bottom > .popover-arrow::before,
.bs-popover-auto[data-popper-placement^="bottom"] > .popover-arrow::before {
  border-bottom-color: #0a1628;
}

.bs-popover-start > .popover-arrow::after,
.bs-popover-auto[data-popper-placement^="left"] > .popover-arrow::after,
.bs-popover-start > .popover-arrow::before,
.bs-popover-auto[data-popper-placement^="left"] > .popover-arrow::before {
  border-left-color: #0a1628;
}

.bs-popover-start > .popover-arrow::after,
.bs-popover-auto[data-popper-placement^="right"] > .popover-arrow::after,
.bs-popover-start > .popover-arrow::before,
.bs-popover-auto[data-popper-placement^="right"] > .popover-arrow::before {
  border-right-color: #0a1628;
}

.user-image {
  border-color: #0a1628;
}

.navbar.topbar {
  background-color: var(--panel-bg);
}

.mobile-bottom-nav {
  background: #0d1b2a !important;
  border-top: 1px solid #2a3f5f;
}

.mobile-bottom-nav .nav-link,
.mobile-bottom-nav .btn {
  color: var(--default-text-color);
}

.topbar .nav-link,
.topbar .nav-item,
.topbar button,
.mobile-bottom-nav .nav-link,
.mobile-bottom-nav .btn,
.mobile-bottom-nav small,
.topbar .nav-link small,
.topbar .nav-item small,
.topbar button small {
  color: #fff !important;
}

.topbar .nav-link small,
.topbar .nav-item small,
.topbar button small,
.mobile-bottom-nav small {
  color: #fff !important;
}

.topbar .ti,
.topbar .nav-link i,
.topbar .btn-ghost-dark i,
.mobile-bottom-nav .ti,
.mobile-bottom-nav .nav-link i,
.mobile-bottom-nav .btn i {
  color: #fff !important;
}

.topbar .ti.text-success,
.topbar .ti-leaf.text-success,
.topbar .nav-link .ti.text-success,
.topbar .nav-link .ti-leaf.text-success,
.mobile-bottom-nav .ti.text-success,
.mobile-bottom-nav .ti-leaf.text-success,
.mobile-bottom-nav .nav-link .ti.text-success,
.mobile-bottom-nav .nav-link .ti-leaf.text-success,
.mobile-bottom-nav .btn .ti.text-success,
.mobile-bottom-nav .btn .ti-leaf.text-success {
  color: #2fb344 !important;
}

.mobile-bottom-nav .dropdown-menu .ti,
.mobile-bottom-nav .dropdown-menu .dropdown-item i {
  color: inherit;
}

.mobile-bottom-nav .dropdown-menu .online {
  color: #1cc88a !important;
}

.mobile-bottom-nav .dropdown-menu .offline {
  color: #c8c8c7 !important;
}

.mobile-bottom-nav .online {
  color: #1cc88a !important;
}

.mobile-bottom-nav .dropdown-menu .busy {
  color: #e74a3b !important;
}

.mobile-bottom-nav .dropdown-menu .away {
  color: #f6c23e !important;
}

.form-selectgroup-boxes
  .form-selectgroup-input:checked
  + .form-selectgroup-label
  .form-selectgroup-title {
  color: #ffffff;
}

.ms-container .ms-selectable,
.ms-container .ms-selection {
  background: var(--dark-bg);
  color: var(--default-text-color);
}
.ms-list {
  border-color: #2a3f5f !important;
}

/* Modern top navigation */
.navbar-scrolled {
  background: linear-gradient(135deg, #0a1f3a 0%, #11406d 100%) !important;
  border-bottom: 1px solid #2a537c;
  box-shadow: 0 10px 26px rgba(3, 20, 36, 0.48);
  backdrop-filter: saturate(135%) blur(10px);
  -webkit-backdrop-filter: saturate(135%) blur(10px);
}

.navbar-scrolled .nav-link,
.navbar-scrolled .navbar-toggler-icon {
  color: #e6f4ff !important;
}

.navbar-scrolled .nav-link {
  border-radius: 999px;
  padding: 0.34rem 0.62rem;
  margin: 0 0.1rem;
  transition:
    background-color 0.18s ease,
    color 0.18s ease;
}

.navbar-scrolled .nav-link.active,
.navbar-scrolled .nav-link:hover {
  color: #8fd8ff !important;
  background: rgba(110, 181, 255, 0.25);
}

.navbar-scrolled .menu-dd .btn-outline-dark,
.navbar-scrolled .menu-dd .btn-ghost-dark {
  color: #e6f4ff !important;
  border-color: #4a84b5 !important;
}

.navbar-scrolled .menu-dd .btn-outline-dark:hover,
.navbar-scrolled .menu-dd .btn-ghost-dark:hover {
  color: #8fd8ff !important;
  background: rgba(110, 181, 255, 0.25) !important;
}

.navbar-collapse.collapse.show {
  background: linear-gradient(180deg, #0a1b31 0%, #0f3257 100%) !important;
  border: 1px solid #2a537c;
  box-shadow: 0 14px 30px rgba(2, 17, 31, 0.48);
}

.navbar-collapse.collapse.show .nav-link,
.navbar-collapse.collapse.show .btn-outline-light,
.navbar-collapse.collapse.show .btn-ghost-light {
  color: #e6f4ff !important;
}

.navbar-collapse.collapse.show .btn-outline-light {
  border-color: #4a84b5 !important;
}

.navbar-collapse.collapse.show .dropdown-menu {
  background: #0e2744;
  border-color: #2a537c;
}

.navbar-collapse.collapse.show .dropdown-item {
  color: #e6f4ff;
}

.navbar-collapse.collapse.show .dropdown-item.active,
.navbar-collapse.collapse.show .dropdown-item:active,
.navbar-collapse.collapse.show .dropdown-item:hover {
  color: #8fd8ff;
  background: rgba(110, 181, 255, 0.25);
}

.ms-container .ms-selectable li.ms-elem-selectable,
.ms-container .ms-selection li.ms-elem-selection {
  border-color: #2a3f5f !important;
  color: var(--default-text-color);
}

.ms-container .ms-selectable li.disabled,
.ms-container .ms-selection li.disabled {
  background-color: #0a1628;
}

.room-manage-row {
  color: var(--default-text-color);
}

.room-manage-row:hover {
  background-color: #162234;
}

.card-header-tabs .nav-link.active,
.card-header-tabs .nav-link:hover {
  background-color: #0a1628;
  border-bottom-color: #0a1628;
  color: #6eb5ff;
  border-color: #1a2d4a #1a2d4a #f5f7fb00;
}

.toast {
  background: #1b2838;
  color: #e0e0e0;
}

.card-header {
  background-color: var(--darker-bg);
}

.online {
  color: #1cc88a !important;
}

.ti.text-success,
.ti-leaf.text-success {
  color: #2fb344 !important;
}

.mobile-bottom-nav .ti.text-success,
.mobile-bottom-nav .ti-leaf.text-success,
.topbar .ti.text-success,
.topbar .ti-leaf.text-success {
  color: #2fb344 !important;
}

.online-status .ti {
  background: rgb(10 22 40);
}

.user-row:hover .online-status .ti {
  background: #162234;
}

.social-seperator div {
  background: #0d1b2a;
}

#auth-modal .social-seperator div {
  background: #0a1628;
}

.is-typing:before {
  border-left-color: #1b2838;
  border-top-color: #1b2838;
}

.noti-content {
  color: var(--default-text-color);
}

.noti-item.noti-read {
  background: #0d1b2a;
}

.noti-item {
  background: #1b2838;
}

.noti-time {
  color: #6eb5ff;
}

.noti-item:hover {
  background: #162234;
}

.notifications-panel-card.dropdown-menu,
.notifications-panel-card .card,
.notifications-panel-card .card-header,
.notifications-panel-card .card-body.notifications,
.notifications-panel-card .notification-list {
  background-color: #0a1628;
  color: var(--default-text-color);
  border-color: #1a2d4a;
}

.notifications-panel-card .card-title,
.notifications-panel-card .card-header .btn,
.notifications-panel-card .notification-list,
.notifications-panel-card .noti-content {
  color: var(--default-text-color);
}

.notifications-panel-card .alert,
.notifications-panel-card .alert-info {
  background-color: #162234;
  border-color: #2a3f5f;
  color: var(--default-text-color);
}

.offcanvas {
  background: #0a1628;
}

.offcanvas.offcanvas-end {
  border-color: #1a2d4a;
}

.offcanvas-header .btn-close {
  filter: invert(1);
}

.chat-search-results {
  color: var(--default-text-color);
}

.chat-search-result {
  background: #162234;
}

.chat-search-result:hover {
  background-color: #1b2838;
}

.form-control:-webkit-autofill {
  box-shadow: 0 0 0 1000px var(--input-bg) inset;
}

#pills-guest .input-group-text {
  color: var(--default-text-color);
}

.channel-list-bottom .dropdown-toggle:hover {
  background-color: #1b2838;
}

.green-audio-player {
  background-color: #0a1628;
}

.icon-lock {
  background-image: url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="%23d1d1d1" height="800px" width="800px" version="1.1" id="Layer_1" viewBox="0 0 330 330" xml:space="preserve"><g id="XMLID_518_"><path id="XMLID_519_" d="M65,330h200c8.284,0,15-6.716,15-15V145c0-8.284-6.716-15-15-15h-15V85c0-46.869-38.131-85-85-85 S80.001,38.131,80.001,85v45H65c-8.284,0-15,6.716-15,15v170C50,323.284,56.716,330,65,330z M110.001,85 c0-30.327,24.673-55,54.999-55c30.327,0,55,24.673,55,55v45H110.001V85z"/></g></svg>');
}

.pvt-cnl {
  background: #0a1628;
}

.active .pvt-cnl,
.channel-item:hover .pvt-cnl {
  background: #162234;
}

.top-channel-icon .pvt-cnl {
  background: var(--dark-bg);
}

.forwarding .cht:hover,
.forwarding .selected {
  background: #0a1628 !important;
}

.voice-channel-container {
  background: #0a1628;
  border-top: none;
}