/* Common header styles */
html.color-header .topbar .navbar-nav .nav-link {
  color: #fff !important;
}
html.color-header .search-bar input {
  color: #413f3f;
  background-color: #fff !important;
  border: 1px solid rgb(241 241 241 / 15%) !important;
  box-shadow: inset 0 1px 2px rgb(0 0 0 / 0%);
}
html.color-header .search-bar input:focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.25);
}
html.color-header .search-bar input::placeholder {
  color: #08090a !important;
  opacity: 0.5 !important;
}
html.color-header .search-show {
  color: #221f1f;
}
html.color-header .user-info .user-name,
html.color-header .user-info .designattion,
html.color-header .mobile-toggle-menu {
  color: #fff;
}
html.color-header .user-box {
  border-left: 1px solid rgb(255 255 255 / 0.35) !important;
}
html.color-header .bx-arrow-back,
html.color-header .bx-bell,
html.color-header .bx-grid-alt {
  color: white;
}

/* Header and Sidebar background images */
html.color-header.headercolor1 .topbar,
html.color-sidebar.sidebarcolor1 #sidebar {
  background: linear-gradient(135deg, #5265db, #616cce, #5660a8);
}
html.color-header.headercolor2 .topbar,
html.color-sidebar.sidebarcolor2 #sidebar {
  background: linear-gradient(135deg, #919293, #4b5258, #8a939b);
}
html.color-header.headercolor3 .topbar,
html.color-sidebar.sidebarcolor3 #sidebar {
  background: linear-gradient(135deg, #1f9d63, #2ecc71, #6ff0b0);
}
html.color-header.headercolor4 .topbar,
html.color-sidebar.sidebarcolor4 #sidebar {
  background: linear-gradient(135deg, #2a0a3d, #5b1a7a, #9b6bff);
}
html.color-header.headercolor5 .topbar,
html.color-sidebar.sidebarcolor5 #sidebar {
  background: linear-gradient(135deg, #6a1b9a, #9c27b0, #d05cff);
}
html.color-header.headercolor6 .topbar,
html.color-sidebar.sidebarcolor6 #sidebar {
  background: linear-gradient(135deg, #b0003a, #e91e63, #ff6f9f);
}
html.color-header.headercolor7 .topbar,
html.color-sidebar.sidebarcolor7 #sidebar {
  background: linear-gradient(135deg, #e65100, #ff9800, #ffd180);
}
html.color-header.headercolor8 .topbar,
html.color-sidebar.sidebarcolor8 #sidebar {
  background: linear-gradient(135deg, #2b2d8f, #3f51b5, #7986ff);
}

/* Sidebar styles */
html.color-sidebar #sidebar {
  background-color: #171717;
  border-right: 1px solid rgb(228 228 228 / 0%);
}
html.color-sidebar .logobox {
  background-color: transparent;
  border-right: 1px solid #e4e4e400;
  border-bottom: 1px solid rgb(255 255 255 / 15%);
  position: absolute;
}

html.color-sidebar .menu-label {
  color: rgb(255 255 255 / 65%);
}
html.color-sidebar #sidebar .logobox .sidebar-logo {
  color: #ffffff;
}

html.color-sidebar .simplebar-scrollbar:before {
  background: rgba(255, 255, 255, 0.4);
}

html.color-sidebar #sidebar .sidebar-nav,
html.color-sidebar #sidebar .sidebar-nav:focus,
html.color-sidebar #sidebar .sidebar-nav:hover {
  text-decoration: none;
  background: rgb(255 255 255 / 15%);
}

html.color-sidebar #sidebar .sidebar-nav a:active,
html.color-sidebar #sidebar .sidebar-nav a:focus,
html.color-sidebar #sidebar .sidebar-nav a:hover {
  text-decoration: none;
  background: rgb(255 255 255 / 15%);
}

html.color-sidebar #sidebar .sidebar-nav span {
  text-decoration: none;
  color: rgb(255 255 255 / 85%);
}
html.color-sidebar #sidebar .sidebar-nav i {
  text-decoration: none;
  color: rgb(255 255 255 / 85%);
}
html.color-sidebar #sidebar .sidebar-nav a {
  color: rgb(255 255 255 / 85%);
}
html.color-sidebar #sidebar .sidebar-nav ul {
  border: 1px solid #ffffff00;
  background: rgb(255 255 255 / 0%);
}
html.color-sidebar #sidebar {
  background-size: 100% 100%;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
}

.switcher-wrapper .sidebarcolor1 {
  background: linear-gradient(135deg, #5265db, #616cce, #5660a8);
}
.switcher-wrapper .sidebarcolor2 {
  background: linear-gradient(135deg, #919293, #4b5258, #8a939b);
}
.switcher-wrapper .sidebarcolor3 {
  background: linear-gradient(135deg, #1f9d63, #2ecc71, #6ff0b0);
}
.switcher-wrapper .sidebarcolor4 {
  background: linear-gradient(135deg, #2a0a3d, #5b1a7a, #9b6bff);
}
.switcher-wrapper .sidebarcolor5 {
  background: linear-gradient(135deg, #6a1b9a, #9c27b0, #d05cff);
}
.switcher-wrapper .sidebarcolor6 {
  background: linear-gradient(135deg, #b0003a, #e91e63, #ff6f9f);
}
.switcher-wrapper .sidebarcolor7 {
  background: linear-gradient(135deg, #e65100, #ff9800, #ffd180);
}
.switcher-wrapper .sidebarcolor8 {
  background: linear-gradient(135deg, #2b2d8f, #3f51b5, #7986ff);
}

.switcher-body .headercolor1 {
  background: linear-gradient(135deg, #5265db, #616cce, #5660a8);
}
.switcher-body .headercolor2 {
  background: linear-gradient(135deg, #919293, #4b5258, #8a939b);
}
.switcher-body .headercolor3 {
  background: linear-gradient(135deg, #1f9d63, #2ecc71, #6ff0b0);
}
.switcher-body .headercolor4 {
  background: linear-gradient(135deg, #2a0a3d, #5b1a7a, #9b6bff);
}
.switcher-body .headercolor5 {
  background: linear-gradient(135deg, #6a1b9a, #9c27b0, #d05cff);
}
.switcher-body .headercolor6 {
  background: linear-gradient(135deg, #b0003a, #e91e63, #ff6f9f);
}
.switcher-body .headercolor7 {
  background: linear-gradient(135deg, #e65100, #ff9800, #ffd180);
}
.switcher-body .headercolor8 {
  background: linear-gradient(135deg, #2b2d8f, #3f51b5, #7986ff);
}

html.color-header .language-btn mat-icon {
  color: #e4e5e6 !important;
}

html.color-header .text-dark {
  color: #fff !important;
}
html.color-header .designation {
  color: #fff;
}
html.color-sidebar .sidebar-link.active {
  background: transparent;
}
html.color-header .logo-app-name {
  color: #e4e5e6 !important;
}
html.color-header.dark-theme .nav-item.active .nav-link {
  background-color: #6f7f8f !important;
}