/* ═══════════════════════════════════════════════════════
   PathwayBihar Theme for Perfex CRM v1.1
   File: assets/css/custom.css
   ═══════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

:root {
  --pb-saffron:       #E8841A;
  --pb-saffron-dark:  #B5600D;
  --pb-navy:          #002A79;
  --pb-navy-mid:      #1A3A8F;
}

/* ── FONT ───────────────────────────────────────────── */
body, #side-menu li a, .btn, input, select,
textarea, .form-control, table,
.navbar-nav > li > a, .dropdown-menu > li > a,
h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', 'Roboto', sans-serif !important;
}

/* ── TOP NAVBAR ─────────────────────────────────────── */
#header {
  background: linear-gradient(to right, #002A79 0%, #1A3A8F 40%, #002A79 100%) !important;
  filter: none !important;
}
.navbar-nav > li > a { color: #ffffff !important; }
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus,
.navbar-nav .open > a { color: #F59E0B !important; background: rgba(255,255,255,0.10) !important; }
#header li > a.active { background: rgba(255,255,255,0.15) !important; border-radius: 6px !important; }

/* ══════════════════════════════════════════════════════
   SIDEBAR — COMPLETE FIX
   Problem: li .nav-second-level li { background: #fff }
   Fix: Override everything navy
   ══════════════════════════════════════════════════════ */

/* Sidebar container */
#side-menu,
#menu,
#menu .slimScrollDiv,
#menu .slimScroll { background: var(--pb-navy) !important; }

/* ALL list items — navy bg */
#side-menu li,
#side-menu li.active,
li .nav-second-level li,
#side-menu li .nav-second-level li,
#side-menu > li { background: transparent !important; border-bottom: 0 !important; }

/* ALL links — white text */
#side-menu li a,
#side-menu li > a,
#side-menu > li > a {
  color: rgba(255,255,255,0.85) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  font-family: 'Inter', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding: 11px 20px 11px 16px !important;
  background: transparent !important;
  border-radius: 0 !important;
  transition: all 0.15s ease !important;
}

/* Top level hover */
#side-menu.nav > li > a:hover,
#side-menu.nav > li > a:focus {
  background: rgba(232,132,26,0.18) !important;
  color: #F59E0B !important;
  border-bottom: 0 !important;
}

/* Top level active */
#side-menu li.active > a {
  background: rgba(232,132,26,0.22) !important;
  color: #F59E0B !important;
  border-left: 3px solid var(--pb-saffron) !important;
  border-radius: 0 !important;
  font-weight: 600 !important;
}

/* ── SUBMENU (nav-second-level) ─────────────────────── */
/* Container — navy bg, NOT white */
#side-menu li .nav-second-level,
#side-menu li ul.nav-second-level {
  background: rgba(0,0,0,0.20) !important;
}

/* Submenu li — transparent */
#side-menu li .nav-second-level li,
li .nav-second-level li {
  background: transparent !important;
  border-bottom: 0 !important;
}

/* Submenu links */
#side-menu li .nav-second-level li a,
#side-menu li .nav-second-level li > a {
  color: rgba(255,255,255,0.72) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  text-transform: none !important;
  padding: 8px 10px 8px 45px !important;
  letter-spacing: 0.01em !important;
  border-left: 0 !important;
  background: transparent !important;
}

/* Submenu hover */
#side-menu li .nav-second-level a:hover,
#side-menu li .nav-second-level li a:hover {
  background: rgba(232,132,26,0.15) !important;
  color: #F59E0B !important;
}

/* Submenu active pill */
#side-menu li .nav-second-level li.active a,
#side-menu li .nav-second-level li > a.active {
  color: #ffffff !important;
  background-color: var(--pb-saffron) !important;
  border-radius: 20px !important;
  padding: 5px 15px !important;
  margin: 6px 0 6px 30px !important;
  display: inline-block !important;
  border-left: 0 !important;
  font-weight: 600 !important;
}

/* ── SETUP MENU (Settings sidebar) ─────────────────── */
#setup-menu-wrapper { background-color: var(--pb-navy) !important; }
#setup-menu > li > a { color: rgba(255,255,255,0.85) !important; font-family: 'Inter', sans-serif !important; }
#setup-menu li.active > a,
#setup-menu li > a:hover,
#setup-menu li > a:active,
#setup-menu li > a:focus {
  color: #F59E0B !important;
  background-color: rgba(232,132,26,0.18) !important;
}
#setup-menu .nav-second-level li:first-child { background: transparent !important; color: rgba(255,255,255,0.85) !important; }
#setup-menu li .nav-second-level li a { color: rgba(255,255,255,0.72) !important; background: transparent !important; }
#setup-menu li .nav-second-level li a:hover,
#setup-menu li .nav-second-level li a.active { color: #F59E0B !important; background-color: rgba(232,132,26,0.15) !important; }
#setup-menu li .nav-second-level li.active a {
  color: #fff !important;
  background-color: var(--pb-saffron) !important;
  border-radius: 20px !important;
}

/* ── SCROLLBAR ──────────────────────────────────────── */
#menu ::-webkit-scrollbar { width: 3px; }
#menu ::-webkit-scrollbar-track { background: transparent; }
#menu ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.2); border-radius: 3px; }

/* ── BUTTONS ────────────────────────────────────────── */
.btn-primary {
  background-color: var(--pb-saffron) !important;
  border-color: var(--pb-saffron) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(232,132,26,0.30) !important;
  transition: all 0.15s ease !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.open > .dropdown-toggle.btn-primary {
  background-color: var(--pb-saffron-dark, #B5600D) !important;
  border-color: var(--pb-saffron-dark, #B5600D) !important;
  box-shadow: 0 4px 14px rgba(232,132,26,0.40) !important;
  transform: translateY(-1px) !important;
}

/* ── FORMS ──────────────────────────────────────────── */
.form-control:focus {
  border-color: var(--pb-saffron) !important;
  box-shadow: 0 0 0 3px rgba(232,132,26,0.15) !important;
}

/* ── TABLES ─────────────────────────────────────────── */
.table > thead > tr > th {
  background-color: var(--pb-navy) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}
.table > tbody > tr:hover > td { background-color: rgba(232,132,26,0.04) !important; }

/* ── PAGE BG ────────────────────────────────────────── */
body { background-color: #F5F6FA !important; }

/* ── PANELS ─────────────────────────────────────────── */
.panel { border-radius: 10px !important; box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important; border: 1px solid #E5E7EB !important; }
.panel-heading { background: linear-gradient(135deg, var(--pb-navy), var(--pb-navy-mid)) !important; color: #ffffff !important; border-radius: 10px 10px 0 0 !important; }
.panel-title, .panel-heading .panel-title a { color: #ffffff !important; }

/* ── TABS ───────────────────────────────────────────── */
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover { color: var(--pb-saffron) !important; border-bottom: 3px solid var(--pb-saffron) !important; font-weight: 600 !important; }
.nav-tabs > li > a:hover { color: var(--pb-saffron) !important; }

/* ── LINKS ──────────────────────────────────────────── */
.text-primary { color: var(--pb-saffron) !important; }

/* ── PROGRESS/BADGES ────────────────────────────────── */
.progress-bar { background-color: var(--pb-saffron) !important; }
.label-primary, .badge-primary { background-color: var(--pb-saffron) !important; }

/* ── PAGINATION ─────────────────────────────────────── */
.pagination > .active > a,
.pagination > .active > span { background-color: var(--pb-saffron) !important; border-color: var(--pb-saffron) !important; }
.pagination > li > a:hover { background-color: rgba(232,132,26,0.10) !important; color: var(--pb-saffron) !important; }

/* ── SELECT2 ────────────────────────────────────────── */
.select2-container--default .select2-results__option--highlighted { background-color: var(--pb-saffron) !important; }
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple { border-color: var(--pb-saffron) !important; }

/* ── LOGIN PAGE ─────────────────────────────────────── */
#login-page { background: linear-gradient(135deg, #002A79 0%, #1A3A8F 100%) !important; }
.login-box { border-radius: 16px !important; box-shadow: 0 20px 60px rgba(0,0,0,0.20) !important; }

/* ── GLOBAL SCROLLBAR ───────────────────────────────── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #002A79; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #E8841A; }

/* ═══════════════════════════════════════════════════════
   END — PathwayBihar Theme v1.1
   ═══════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════
   SIDEBAR TEXT WRAP FIX v1.2
   Problem: Long menu items like "TIMESHEETS & LEAVE"
            wrap to 2 lines — looks broken
   ═══════════════════════════════════════════════════════ */

/* Fix 1: Sidebar wider — 240px instead of 210px */
#menu {
  width: 240px !important;
}
#wrapper {
  margin-left: 240px !important;
}
#setup-menu-wrapper {
  width: 240px !important;
}

/* Collapsed sidebar */
body.hide-sidebar:not(.show-sidebar) #menu {
  width: 0 !important;
}
body.hide-sidebar:not(.show-sidebar) #wrapper {
  margin-left: 0 !important;
}

/* Mobile */
body.page-small #menu {
  width: 240px !important;
}
body.page-small #wrapper {
  margin-left: 0 !important;
}
body.page-small.show-sidebar #menu {
  width: 240px !important;
}

/* Fix 2: NO text wrap on menu items */
#side-menu li a,
#side-menu > li > a,
#setup-menu > li > a {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: flex !important;
  align-items: center !important;
  line-height: 1.3 !important;
  min-height: 44px !important;
}

/* Fix 3: Icon stays inline */
#side-menu li a i.menu-icon,
#side-menu > li > a i {
  flex-shrink: 0 !important;
  margin-right: 12px !important;
  width: 20px !important;
  text-align: center !important;
}

/* Fix 4: Arrow stays at right */
#side-menu li a .arrow,
#side-menu li a .fa.arrow {
  margin-left: auto !important;
  flex-shrink: 0 !important;
}

/* Fix 5: Submenu also no wrap */
#side-menu li .nav-second-level li a {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ═══════════════════════════════════════════════════════
   END FIX v1.2
   ═══════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════
   v2.0 FIXES — Applied on top of v1.1
   4 targeted fixes, nothing else changed
   ═══════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────
   FIX 1: SIDEBAR SCROLL
   #menu position:fixed → sidebar never scrolls with page
   #wrapper padding-top:63px → content starts below header
   ────────────────────────────────────────────────────── */
#header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
}

#menu {
  position: fixed !important;
  top: 63px !important;
  left: 0 !important;
  bottom: 0 !important;
  height: calc(100vh - 63px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  z-index: 100 !important;
}

#wrapper {
  padding-top: 63px !important;
}

/* ──────────────────────────────────────────────────────
   FIX 2: SUBMENU WHITE BOX
   Culprit: "li .nav-second-level li { background:#fff }"
   Fix: html body prefix gives highest specificity
   ────────────────────────────────────────────────────── */
html body li .nav-second-level li,
html body #side-menu li.active,
html body #side-menu li {
  background: transparent !important;
}

html body #side-menu li .nav-second-level,
html body #side-menu li ul.nav-second-level,
html body ul.nav-second-level {
  background: rgba(0,0,0,0.20) !important;
}

/* ──────────────────────────────────────────────────────
   FIX 3: QUICK LINKS (HAMMER/GAVEL) DARK DROPDOWN
   Original: .dropdown-menu li a { color:#333 } — dark text on white bg
   Fix: Navy dark dropdown with white text
   ────────────────────────────────────────────────────── */
#side-menu li.quick-links .dropdown-menu {
  background: #1A3A8F !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.30) !important;
  padding: 6px !important;
  min-width: 180px !important;
}

/* Triangle arrow pointing to gavel icon — match navy */
#side-menu li.quick-links .dropdown-menu:before {
  border-bottom-color: rgba(255,255,255,0.15) !important;
}
#side-menu li.quick-links .dropdown-menu:after {
  border-bottom-color: #1A3A8F !important;
}

/* All li inside quick links */
#side-menu li.quick-links .dropdown-menu li {
  background: transparent !important;
  border-bottom: 0 !important;
}

/* Links inside quick links dropdown */
#side-menu li.quick-links .dropdown-menu li a {
  color: rgba(255,255,255,0.90) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  padding: 9px 14px !important;
  border-radius: 6px !important;
  background: transparent !important;
  display: block !important;
  transition: all 0.15s !important;
}

#side-menu li.quick-links .dropdown-menu li a:hover {
  background: rgba(232,132,26,0.22) !important;
  color: #F59E0B !important;
}

#side-menu li.quick-links .dropdown-menu li a i {
  margin-right: 8px !important;
  color: rgba(255,255,255,0.65) !important;
}

#side-menu li.quick-links .dropdown-menu li a:hover i {
  color: #F59E0B !important;
}

/* ──────────────────────────────────────────────────────
   FIX 4: SETUP MENU (JS COMPATIBLE)
   ONLY changing: bg color + text colors
   NOT touching: position, display, top, min-height
   (JS controls those)
   ────────────────────────────────────────────────────── */
#setup-menu-wrapper {
  background-color: var(--pb-navy) !important;
  width: 240px !important;
  z-index: 200 !important;
  /* position:absolute — JS controls this */
  /* display — JS controls this */
  /* top — JS controls this */
  /* min-height — JS controls this */
}

#setup-menu > li > a,
#setup-menu li > a {
  color: rgba(255,255,255,0.90) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  background: transparent !important;
  display: block !important;
}

/* IMPORTANT: Beat original "color:#333 !important" on hover */
#setup-menu li > a:hover,
#setup-menu li > a:active,
#setup-menu li > a:focus,
#setup-menu li > a.active {
  color: #F59E0B !important;
  background-color: rgba(232,132,26,0.18) !important;
}

#setup-menu li.active > a {
  color: #F59E0B !important;
  background-color: rgba(232,132,26,0.22) !important;
  border-left: 3px solid #E8841A !important;
  font-weight: 700 !important;
}

/* Setup submenu section heading */
#setup-menu .nav-second-level li:first-child {
  background: transparent !important;
  color: rgba(255,255,255,0.45) !important;
  font-size: 10px !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
}

/* Setup submenu links */
#setup-menu li .nav-second-level li a {
  color: rgba(255,255,255,0.78) !important;
  background: transparent !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  display: block !important;
  transition: all 0.15s !important;
}

#setup-menu li .nav-second-level li a:hover,
#setup-menu li .nav-second-level li a.active {
  color: #F59E0B !important;
  background-color: rgba(232,132,26,0.15) !important;
}

#setup-menu li .nav-second-level li.active a {
  color: #fff !important;
  background-color: #E8841A !important;
  border-radius: 20px !important;
  display: inline-block !important;
  padding: 5px 14px !important;
  margin: 5px 0 5px 12px !important;
  font-weight: 600 !important;
}

/* ──────────────────────────────────────────────────────
   MODALS / DROPDOWNS Z-INDEX
   (above fixed header/sidebar)
   ────────────────────────────────────────────────────── */
.modal           { z-index: 10500 !important; }
.modal-backdrop  { z-index: 10400 !important; }
.dropdown-menu   { z-index: 10001 !important; }

/* ═══════════════════════════════════════════════════════
   END v2.0 FIXES
   ═══════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════
   v2.0 FIXES
   ═══════════════════════════════════════════════════════ */

/* ── FIX 1: HEADER + SIDEBAR FIXED ─────────────────── */
#header {
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  width: 100% !important; height: 63px !important;
  z-index: 9999 !important;
}
#menu {
  position: fixed !important;
  top: 63px !important; left: 0 !important; bottom: 0 !important;
  height: calc(100vh - 63px) !important;
  overflow-y: auto !important; overflow-x: hidden !important;
  z-index: 998 !important;
}
#wrapper { padding-top: 63px !important; }
body.hide-sidebar:not(.show-sidebar) #menu { left: -240px !important; }
body.hide-sidebar:not(.show-sidebar) #wrapper { margin-left: 0 !important; }

/* ── FIX 2: SUBMENU WHITE BOX ───────────────────────── */
html body li .nav-second-level li,
html body #side-menu li.active,
html body #side-menu li { background: transparent !important; }
html body #side-menu li .nav-second-level,
html body ul.nav-second-level { background: rgba(0,0,0,0.20) !important; }

/* ── FIX 3: QUICK LINKS DARK DROPDOWN ──────────────── */
#side-menu li.quick-links .dropdown-menu {
  background: #1A3A8F !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.30) !important;
  padding: 6px !important; min-width: 180px !important;
  z-index: 10001 !important;
}
#side-menu li.quick-links .dropdown-menu:before { border-bottom-color: rgba(255,255,255,0.15) !important; }
#side-menu li.quick-links .dropdown-menu:after  { border-bottom-color: #1A3A8F !important; }
#side-menu li.quick-links .dropdown-menu li     { background: transparent !important; border: 0 !important; }
#side-menu li.quick-links .dropdown-menu li a {
  color: rgba(255,255,255,0.90) !important;
  font-size: 13px !important; font-weight: 500 !important;
  text-transform: none !important; padding: 9px 14px !important;
  border-radius: 6px !important; background: transparent !important;
  display: block !important;
}
#side-menu li.quick-links .dropdown-menu li a:hover {
  background: rgba(232,132,26,0.22) !important; color: #F59E0B !important;
}

/* ── FIX 4: SETUP MENU OVERLAY ─────────────────────── */
#setup-menu-wrapper {
  position: fixed !important;
  top: 63px !important; left: 0 !important; bottom: 0 !important;
  width: 240px !important;
  height: calc(100vh - 63px) !important;
  overflow-y: auto !important; overflow-x: hidden !important;
  z-index: 999 !important;
  background: #001e5e !important;
  box-shadow: 4px 0 20px rgba(0,0,0,0.40) !important;
}

/* Backdrop — pointer-events:none so content clicks work */
#setup-menu-wrapper.display-block::before {
  content: '' !important;
  position: fixed !important;
  top: 63px !important; left: 240px !important;
  right: 0 !important; bottom: 0 !important;
  background: rgba(0,0,0,0.25) !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* ══════════════════════════════════════════════════════
   SETUP HEADER — TITLE LEFT, ✕ RIGHT

   HTML:
   <li>
     <a class="close-customizer"><i class="fa fa-close"></i></a>
     <span class="customizer-heading">Settings</span>
   </li>

   FIX:
   li → position:relative, height:52px
   .customizer-heading → position:absolute, left:16px, centered
   .close-customizer → position:absolute, RIGHT:12px, centered
   No flex needed — absolute positioning
   ══════════════════════════════════════════════════════ */
#setup-menu > li:first-child {
  position: relative !important;
  display: block !important;
  height: 52px !important;
  border-bottom: 1px solid rgba(255,255,255,0.12) !important;
  background: rgba(0,0,0,0.20) !important;
  flex-direction: unset !important;
  padding: 0 !important;
}

/* SETUP title — absolute left */
#setup-menu > li:first-child .customizer-heading {
  position: absolute !important;
  left: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: rgba(255,255,255,0.95) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  right: 50px !important;     /* prevent overlap with ✕ */
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ✕ button — absolute RIGHT */
#setup-menu > li:first-child .close-customizer {
  position: absolute !important;
  right: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.12) !important;
  color: rgba(255,255,255,0.85) !important;
  font-size: 12px !important;
  cursor: pointer !important;
  transition: all 0.15s !important;
  text-decoration: none !important;
}
#setup-menu > li:first-child .close-customizer:hover {
  background: rgba(232,132,26,0.40) !important;
  color: #F59E0B !important;
}

/* ── SETUP NAV ITEMS ────────────────────────────────── */
#setup-menu > li > a,
#setup-menu li > a {
  color: rgba(255,255,255,0.88) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding: 11px 20px 11px 16px !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  min-height: 44px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  transition: all 0.15s !important;
}
#setup-menu li > a:hover,
#setup-menu li > a:focus,
#setup-menu li > a:active {
  color: #F59E0B !important;
  background: rgba(232,132,26,0.18) !important;
}
#setup-menu li.active > a {
  color: #F59E0B !important;
  background: rgba(232,132,26,0.22) !important;
  border-left: 3px solid #E8841A !important;
  font-weight: 600 !important;
}
#setup-menu li > a i.menu-icon {
  flex-shrink: 0 !important;
  margin-right: 11px !important;
  width: 18px !important;
  text-align: center !important;
  color: rgba(255,255,255,0.70) !important;
}
#setup-menu li > a:hover i.menu-icon { color: #F59E0B !important; }
#setup-menu li > a .fa.arrow {
  margin-left: auto !important;
  flex-shrink: 0 !important;
  color: rgba(255,255,255,0.40) !important;
  float: none !important;
}

/* ── HELP TAB — same alignment as others ───────────────
   HTML: <li><a href="..." target="_blank">Help</a></li>
   No icon in HTML — add via ::before
   ──────────────────────────────────────────────────── */
#setup-menu > li:last-child {
  border-top: 1px solid rgba(255,255,255,0.08) !important;
  margin-top: 4px !important;
}
#setup-menu > li:last-child > a {
  color: rgba(255,255,255,0.88) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding: 11px 20px 11px 16px !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  min-height: 44px !important;
  gap: 11px !important;
  transition: all 0.15s !important;
}
/* Question icon via ::before */
#setup-menu > li:last-child > a::before {
  content: '\f059' !important;
  font-family: 'FontAwesome' !important;
  font-size: 14px !important;
  width: 18px !important;
  text-align: center !important;
  flex-shrink: 0 !important;
  color: rgba(255,255,255,0.70) !important;
}
#setup-menu > li:last-child > a:hover {
  color: #F59E0B !important;
  background: rgba(232,132,26,0.18) !important;
}
#setup-menu > li:last-child > a:hover::before { color: #F59E0B !important; }

/* ── SETUP SUBMENU ──────────────────────────────────── */
html body #setup-menu li .nav-second-level,
html body #setup-menu ul.nav-second-level { background: rgba(0,0,0,0.20) !important; }
html body #setup-menu li .nav-second-level li,
html body #setup-menu li { background: transparent !important; }
#setup-menu .nav-second-level li:first-child {
  background: transparent !important; color: rgba(255,255,255,0.40) !important;
  font-size: 10px !important; letter-spacing: 0.10em !important;
  text-transform: uppercase !important; padding: 6px 16px 2px !important;
}
#setup-menu li .nav-second-level li a {
  color: rgba(255,255,255,0.75) !important;
  font-size: 12.5px !important; font-weight: 400 !important;
  text-transform: none !important; padding: 8px 10px 8px 20px !important;
  background: transparent !important; display: block !important;
  transition: all 0.15s !important;
}
#setup-menu li .nav-second-level li a:hover,
#setup-menu li .nav-second-level li a.active {
  color: #F59E0B !important; background: rgba(232,132,26,0.15) !important;
}
#setup-menu li .nav-second-level li.active a {
  color: #fff !important; background-color: #E8841A !important;
  border-radius: 20px !important; display: inline-block !important;
  padding: 5px 14px !important; margin: 5px 0 5px 12px !important;
  font-weight: 600 !important;
}
#setup-menu-wrapper::-webkit-scrollbar { width: 3px; }
#setup-menu-wrapper::-webkit-scrollbar-track { background: transparent; }
#setup-menu-wrapper::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 3px; }

/* ── Z-INDEX ─────────────────────────────────────────── */
.modal { z-index: 10500 !important; }
.modal-backdrop { z-index: 10400 !important; }
.dropdown-menu { z-index: 10001 !important; }

/* ═══════════════════════════════════════════════════════
   END v2.0
   ═══════════════════════════════════════════════════════ */