/* ==========================================================================
   Expedite WMS / Perfex CRM - Global Custom Styles
   Sidebar Theme: Deep Midnight Navy (#001B57)
   ========================================================================== */

/* Main Sidebar & Setup Menu Containers */
aside#menu,
.sidebar,
.admin .sidebar {
  background-color: #001B57 !important;
  background: #001B57 !important;
  position: absolute !important;
  top: 0 !important;
  bottom: auto !important;
  min-height: 100% !important;
  min-height: 100vh !important;
  height: auto !important;
  padding-bottom: 60px !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
  z-index: 60;
}

#setup-menu-wrapper {
  background-color: #001B57 !important;
  background: #001B57 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
  min-height: 100% !important;
  min-height: 100vh !important;
  /* Must render above the main sidebar (z-index: 60 above) - both are opaque
     navy panels covering the same left-hand band, so without this the Setup
     customizer opens correctly but is fully hidden behind the main sidebar. */
  z-index: 61 !important;
  /* Pin to the viewport instead of the document flow. The Setup menu list is
     shorter than the main sidebar's (which grows with every WMS nav item),
     so with position:absolute + min-height:100% its box ends before the main
     sidebar's does - once the page is scrolled past that point, the old/main
     sidebar shows through underneath for the rest of the page. Fixed + a
     pinned top/bottom always covers the full viewport, and overflow:auto
     (already set in style.css) lets the menu list scroll internally instead. */
  position: fixed !important;
  top: 0 !important;
  bottom: 0 !important;
  height: auto !important;
}

/* Ensure navigation list has Midnight Navy background */
#side-menu,
.sidebar #side-menu {
  background-color: #001B57 !important;
  background: #001B57 !important;
}

/* Content wrapper min-height to prevent background clipping */
#wrapper {
  min-height: 100% !important;
  min-height: 100vh !important;
}

/* Setup Header & Close Button */
#setup-menu-wrapper .customizer-heading {
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
#setup-menu-wrapper .close-customizer {
  color: #cbd5e1 !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
  cursor: pointer !important;
  transition: all 0.15s ease-in-out !important;
}
#setup-menu-wrapper .close-customizer:hover,
#setup-menu-wrapper .close-customizer:focus {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.2) !important;
}

/* User Profile Widget in Sidebar */
.sidebar-user-profile .dropdown-toggle {
  background-color: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}
.sidebar-user-profile .dropdown-toggle:hover,
.sidebar-user-profile .dropdown-toggle:focus {
  background-color: rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
}
.sidebar-user-profile span {
  color: #f1f5f9 !important;
}
.sidebar-user-profile .tw-text-neutral-500,
.sidebar-user-profile .tw-text-neutral-300 {
  color: #94a3b8 !important;
}

/* Top-level Menu Items (Both Main Sidebar & Setup Menu) */
.sidebar ul.nav#side-menu > li > a,
.sidebar ul.nav#side-menu li a,
.sidebar ul.nav#setup-menu > li > a,
.sidebar ul.nav#setup-menu li a,
#setup-menu-wrapper #setup-menu li a {
  color: #cbd5e1 !important;
  font-weight: 500 !important;
}

.sidebar ul.nav#side-menu li a i.menu-icon,
.sidebar ul.nav#setup-menu li a i.menu-icon,
#setup-menu-wrapper #setup-menu li a i.menu-icon {
  color: #94a3b8 !important;
}

.sidebar ul.nav#side-menu li a .menu-text,
.sidebar ul.nav#setup-menu li a .menu-text,
#setup-menu-wrapper #setup-menu li a .menu-text {
  color: inherit !important;
}

/* Hover & Active States (Both Main Sidebar & Setup Menu) */
.sidebar ul.nav#side-menu > li:hover > a:first-child,
.sidebar ul.nav#side-menu > li.active > a:first-child,
.sidebar ul.nav#setup-menu > li:hover > a:first-child,
.sidebar ul.nav#setup-menu > li.active > a:first-child,
#setup-menu-wrapper #setup-menu > li:hover > a:first-child,
#setup-menu-wrapper #setup-menu > li.active > a:first-child {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 6px;
}

.sidebar ul.nav#side-menu > li:hover > a:first-child i.menu-icon,
.sidebar ul.nav#side-menu > li.active > a:first-child i.menu-icon,
.sidebar ul.nav#side-menu li.active > a i.menu-icon,
.sidebar ul.nav#setup-menu > li:hover > a:first-child i.menu-icon,
.sidebar ul.nav#setup-menu > li.active > a:first-child i.menu-icon,
.sidebar ul.nav#setup-menu li.active > a i.menu-icon,
#setup-menu-wrapper #setup-menu > li:hover > a:first-child i.menu-icon,
#setup-menu-wrapper #setup-menu > li.active > a:first-child i.menu-icon,
#setup-menu-wrapper #setup-menu li.active > a i.menu-icon {
  color: #ffffff !important;
}

/* Submenu Accordion (.nav-second-level) for Both Menus */
.sidebar ul.nav#side-menu li .nav-second-level,
.sidebar ul.nav#setup-menu li .nav-second-level,
#setup-menu-wrapper #setup-menu li .nav-second-level {
  background: rgba(0, 15, 50, 0.45) !important;
  border-radius: 6px;
  margin: 3px 0 !important;
  padding: 4px 0 !important;
}

.sidebar ul.nav#side-menu li .nav-second-level li a,
.sidebar ul.nav#setup-menu li .nav-second-level li a,
#setup-menu-wrapper #setup-menu li .nav-second-level li a {
  color: #94a3b8 !important;
  background: transparent !important;
  border: 0 !important;
}

.sidebar ul.nav#side-menu li .nav-second-level li a:hover,
.sidebar ul.nav#side-menu li .nav-second-level li a:focus,
.sidebar ul.nav#setup-menu li .nav-second-level li a:hover,
.sidebar ul.nav#setup-menu li .nav-second-level li a:focus,
#setup-menu-wrapper #setup-menu li .nav-second-level li a:hover,
#setup-menu-wrapper #setup-menu li .nav-second-level li a:focus {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-radius: 4px;
}

.sidebar ul.nav#side-menu li .nav-second-level li.active a,
.sidebar ul.nav#setup-menu li .nav-second-level li.active a,
#setup-menu-wrapper #setup-menu li .nav-second-level li.active a {
  color: #ffffff !important;
  font-weight: 600 !important;
  background: rgba(255, 255, 255, 0.12) !important;
  border-radius: 4px;
}

.sidebar ul.nav#side-menu li .nav-second-level li a .sub-menu-text,
.sidebar ul.nav#setup-menu li .nav-second-level li a .sub-menu-text,
#setup-menu-wrapper #setup-menu li .nav-second-level li a .sub-menu-text {
  color: inherit !important;
}

/* Sidebar & Setup Arrows */
.sidebar .arrow,
.sidebar .fa.arrow:before,
#setup-menu-wrapper .arrow,
#setup-menu-wrapper .fa.arrow:before {
  color: #94a3b8 !important;
}
.sidebar .active > a > .fa.arrow:before,
#setup-menu-wrapper .active > a > .fa.arrow:before {
  color: #ffffff !important;
}