/* Dorsa dark theme — final override layer loaded after every page stylesheet. */

html:has(body.dark-mode) {
  color-scheme: dark;
  background: #07111f;
}

body.dark-mode {
  --background: #07111f;
  --surface: #0d1b2a;
  --surface-muted: #112338;
  --surface-elevated: #172d46;
  --surface-glass: rgba(13, 27, 42, .86);
  --border: #203a55;
  --border-strong: #31516f;
  --hover: #142a41;
  --active: #193752;
  --text: #e9f1f8;
  --text-muted: #9bafc3;
  --primary: #69a9ee;
  --primary-dark: #96c6f7;
  --primary-hover: #83baf2;
  --primary-light: #142f4b;
  --primary-glow: rgba(78, 158, 234, .22);
  --success: #4fd1a5;
  --success-light: #103a35;
  --warning: #f1ba61;
  --warning-light: #3c2d18;
  --danger: #ff7c86;
  --danger-light: #401f2a;
  --info: #67d4e7;
  --info-light: #113642;
  --gray-50: #0d1b2a;
  --gray-100: #112338;
  --gray-200: #203a55;
  --gray-300: #31516f;
  --gray-400: #758da4;
  --gray-500: #9bafc3;
  --gray-600: #b7c7d6;
  --gray-700: #cedae5;
  --gray-800: #e2eaf1;
  --gray-900: #f5f8fb;
  --white: #0d1b2a;
  --dm-bg-primary: var(--background);
  --dm-bg-secondary: var(--surface);
  --dm-bg-card: var(--surface);
  --dm-bg-elevated: var(--surface-elevated);
  --dm-bg-input: #091725;
  --dm-text-primary: var(--text);
  --dm-text-secondary: var(--text-muted);
  --dm-text-muted: #758da4;
  --dm-border: var(--border);
  --dm-border-light: var(--border-strong);
  --dm-shadow: rgba(0, 0, 0, .44);
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, .25);
  --shadow-sm: 0 5px 16px rgba(0, 0, 0, .22);
  --shadow-md: 0 18px 44px rgba(0, 0, 0, .32);
  --shadow-card: 0 1px 0 rgba(255, 255, 255, .035), 0 12px 30px rgba(0, 0, 0, .2);
  --shadow-card-hover: 0 1px 0 rgba(255, 255, 255, .055), 0 18px 42px rgba(0, 0, 0, .3);
  --chart-colors: #69a9ee, #50c9b2, #a991f7, #f1ba61, #ff8295, #61cfdf, #8ccf70, #c79bf2, #e89262, #7e9eff;
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 8%, rgba(46, 126, 205, .12), transparent 30rem),
    radial-gradient(circle at 88% 92%, rgba(40, 178, 159, .07), transparent 34rem),
    var(--background) !important;
  color: var(--text) !important;
}

body.dark-mode::after {
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(255, 255, 255, .012) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .012) 1px, transparent 1px);
  background-size: 36px 36px;
  content: '';
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .6), transparent 75%);
}

/* Sign-in page uses its own template but follows the same system preference. */
html body.dark-mode .auth-wrapper { position: relative; z-index: 1; }
html body.dark-mode .auth-card {
  border: 1px solid var(--border-strong) !important;
  background: linear-gradient(145deg, rgba(18, 37, 57, .96), rgba(9, 23, 37, .98)) !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .42), inset 0 1px rgba(255, 255, 255, .04) !important;
}
html body.dark-mode .auth-card .subtitle { color: var(--text-muted) !important; }
html body.dark-mode .auth-card label { color: #c5d4e1 !important; }
html body.dark-mode .auth-card .logo-bg {
  border: 1px solid rgba(255, 255, 255, .72);
  background: #fff !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
}
html body.auth-page.dark-mode::before {
  height: 4px;
  background: linear-gradient(90deg, #2f7abe, #58b7cc, #4fd1a5) !important;
  box-shadow: 0 4px 18px rgba(72, 168, 215, .22);
}

/* Shell */
html body.dark-mode .dashboard-layout,
html body.dark-mode main,
html body.dark-mode main > .container,
html body.dark-mode .container.main-content,
html body.dark-mode .main-content,
html body.dark-mode main > div,
html body.dark-mode .py-4,
html body.dark-mode .py-5 {
  background-color: transparent !important;
  background-image: none !important;
  color: var(--text) !important;
}

html body.dark-mode .sidebar {
  border-color: var(--border) !important;
  background: linear-gradient(180deg, #0d1c2c 0%, #091624 100%) !important;
  box-shadow: -18px 0 48px rgba(0, 0, 0, .16) !important;
}

html body.dark-mode .sidebar-header {
  border-color: rgba(105, 169, 238, .14) !important;
  background: rgba(255, 255, 255, .012) !important;
}

html body.dark-mode .sidebar-brand-mark {
  background: linear-gradient(145deg, #2e78bc, #42a9c4) !important;
  color: #fff !important;
  box-shadow: 0 8px 22px rgba(42, 133, 198, .28) !important;
}

html body.dark-mode .sidebar-brand strong,
html body.dark-mode .navbar-context strong,
html body.dark-mode .user-name { color: #f4f8fc !important; }
html body.dark-mode .sidebar-brand small,
html body.dark-mode .navbar-eyebrow,
html body.dark-mode .user-role,
html body.dark-mode .sidebar-section-label,
html body.dark-mode .sidebar-footer-note { color: #7f97ad !important; }

html body.dark-mode .nav-link,
html body.dark-mode .nav-group-toggle,
html body.dark-mode .nav-subgroup-toggle {
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #a9bacb !important;
}

html body.dark-mode .nav-link i,
html body.dark-mode .nav-group-toggle i,
html body.dark-mode .nav-subgroup-toggle i { color: #7891a8 !important; }

html body.dark-mode .nav-link:hover,
html body.dark-mode .nav-group-toggle:hover,
html body.dark-mode .nav-subgroup-toggle:hover,
html body.dark-mode .nav-group.open > .nav-group-toggle {
  border-color: rgba(105, 169, 238, .12) !important;
  background: rgba(105, 169, 238, .08) !important;
  color: #dce9f5 !important;
}

html body.dark-mode .nav-link.active {
  border-color: rgba(105, 169, 238, .22) !important;
  border-right-color: #69a9ee !important;
  background: linear-gradient(90deg, rgba(105, 169, 238, .06), rgba(105, 169, 238, .17)) !important;
  color: #8fc1f4 !important;
  box-shadow: inset -3px 0 #69a9ee, 0 7px 22px rgba(0, 0, 0, .12) !important;
}

html body.dark-mode .nav-link:hover i,
html body.dark-mode .nav-link.active i,
html body.dark-mode .nav-group-toggle:hover i { color: #78b5f1 !important; }

html body.dark-mode .sidebar-nav { scrollbar-color: #2d4c68 transparent; }
html body.dark-mode .sidebar-nav::-webkit-scrollbar-thumb { background: #2d4c68; }
html body.dark-mode .sidebar-footer-note { border-color: var(--border) !important; }

html body.dark-mode .navbar {
  border-color: rgba(111, 151, 187, .18) !important;
  background: rgba(9, 22, 36, .82) !important;
  box-shadow: 0 10px 34px rgba(0, 0, 0, .22) !important;
  backdrop-filter: blur(18px) saturate(135%);
}

html body.dark-mode .page-title-icon,
html body.dark-mode .st-page-header__icon {
  background: linear-gradient(145deg, #2d78bd, #397ea4) !important;
  color: #fff !important;
  box-shadow: 0 8px 22px rgba(36, 115, 181, .28) !important;
}

html body.dark-mode .filter-header i,
html body.dark-mode .settings-card-header h2 i {
  background: rgba(105, 169, 238, .11) !important;
  color: #75b3f0 !important;
}

html body.dark-mode .stat-pill-icon.blue { background: rgba(105, 169, 238, .14) !important; color: #8bc0f3 !important; }
html body.dark-mode .stat-pill-icon.purple { background: rgba(169, 145, 247, .14) !important; color: #bba9fa !important; }
html body.dark-mode .stat-pill-icon.green { background: rgba(79, 209, 165, .13) !important; color: #6eddb9 !important; }

html body.dark-mode .sidebar-toggle-btn,
html body.dark-mode .nav-icon-btn,
html body.dark-mode .nav-user {
  border-color: transparent !important;
  background: transparent !important;
  color: #a9bacb !important;
}

html body.dark-mode .sidebar-toggle-btn:hover,
html body.dark-mode .nav-icon-btn:hover,
html body.dark-mode .nav-user:hover {
  border-color: rgba(105, 169, 238, .18) !important;
  background: rgba(105, 169, 238, .1) !important;
  color: #8fc1f4 !important;
}

html body.dark-mode .user-avatar {
  border: 1px solid rgba(105, 169, 238, .34) !important;
  background: linear-gradient(145deg, #173b5d, #225071) !important;
  color: #a7d1f8 !important;
  box-shadow: 0 0 0 3px rgba(105, 169, 238, .08) !important;
}
html body.dark-mode .nav-separator { background: var(--border) !important; }
html body.dark-mode #healthStatusDot { border: 2px solid #0a1827 !important; }

html body.dark-mode .dropdown-menu,
html body.dark-mode .notifications-dropdown,
html body.dark-mode .user-dropdown {
  border: 1px solid var(--border-strong) !important;
  background: rgba(13, 27, 42, .97) !important;
  box-shadow: 0 24px 65px rgba(0, 0, 0, .48) !important;
  backdrop-filter: blur(22px);
}

html body.dark-mode .dropdown-header,
html body.dark-mode .dropdown-content,
html body.dark-mode #navAlertList { border-color: var(--border) !important; background: transparent !important; }

html body.dark-mode .dropdown-menu a,
html body.dark-mode .dropdown-item,
html body.dark-mode .user-dropdown-action { color: var(--text) !important; background: transparent !important; }
html body.dark-mode .dropdown-menu a:hover,
html body.dark-mode .dropdown-item:hover,
html body.dark-mode .user-dropdown-action:hover { background: var(--hover) !important; }

/* Typography and muted content */
html body.dark-mode h1,
html body.dark-mode h2,
html body.dark-mode h3,
html body.dark-mode h4,
html body.dark-mode h5,
html body.dark-mode h6,
html body.dark-mode .page-title,
html body.dark-mode .panel-title,
html body.dark-mode .chart-title,
html body.dark-mode .modal-title { color: #f4f8fc !important; }

html body.dark-mode p,
html body.dark-mode td,
html body.dark-mode .text-muted,
html body.dark-mode .subtitle,
html body.dark-mode .page-subtitle,
html body.dark-mode .page-header p,
html body.dark-mode .card-subtitle,
html body.dark-mode .stat-label,
html body.dark-mode .cell-sub,
html body.dark-mode .info-label,
html body.dark-mode .form-text,
html body.dark-mode small { color: var(--text-muted) !important; }

html body.dark-mode a { color: var(--primary) !important; }
html body.dark-mode ::selection { background: rgba(105, 169, 238, .3); color: #fff; }
html body.dark-mode :focus-visible { outline-color: rgba(105, 169, 238, .62) !important; }

/* Surfaces shared by dashboard, management, profiles, trends, targets and FOC. */
html body.dark-mode .card,
html body.dark-mode .card-modern,
html body.dark-mode .dash-card,
html body.dark-mode .chart-card,
html body.dark-mode .stat-card,
html body.dark-mode .quick-stat-card,
html body.dark-mode .table-card,
html body.dark-mode .table-container,
html body.dark-mode .filter-card,
html body.dark-mode .filter-bar,
html body.dark-mode .upload-section,
html body.dark-mode .uploaded-files,
html body.dark-mode .company-card,
html body.dark-mode .product-card,
html body.dark-mode .detail-panel,
html body.dark-mode .info-card,
html body.dark-mode .comparison-card,
html body.dark-mode .form-card,
html body.dark-mode .settings-card,
html body.dark-mode .profile-card,
html body.dark-mode .st-card,
html body.dark-mode .st-target-card,
html body.dark-mode .st-inner-card,
html body.dark-mode .st-modal__content,
html body.dark-mode .modal-content {
  border-color: var(--border) !important;
  background: linear-gradient(145deg, rgba(18, 36, 55, .96), rgba(11, 25, 39, .98)) !important;
  color: var(--text) !important;
  box-shadow: var(--shadow-card) !important;
}

html body.dark-mode .card:hover,
html body.dark-mode .dash-card:hover,
html body.dark-mode .stat-card:hover,
html body.dark-mode .quick-stat-card:hover,
html body.dark-mode .company-card:hover,
html body.dark-mode .product-card:hover {
  border-color: rgba(105, 169, 238, .32) !important;
  box-shadow: var(--shadow-card-hover) !important;
}

html body.dark-mode .card-header,
html body.dark-mode .card-footer,
html body.dark-mode .card-header-modern,
html body.dark-mode .card-body-modern,
html body.dark-mode .dash-card-header,
html body.dark-mode .panel-header,
html body.dark-mode .modal-header,
html body.dark-mode .modal-footer,
html body.dark-mode .st-card__header,
html body.dark-mode .st-card__body,
html body.dark-mode .st-inner-card__header,
html body.dark-mode .st-modal__header,
html body.dark-mode .st-modal__body,
html body.dark-mode .st-modal__footer {
  border-color: var(--border) !important;
  background-color: transparent !important;
  background-image: none !important;
  color: var(--text) !important;
}

html body.dark-mode .page-header,
html body.dark-mode .toolbar,
html body.dark-mode .controls-bar,
html body.dark-mode .stats-bar,
html body.dark-mode .chart-container,
html body.dark-mode .quick-stats-container,
html body.dark-mode .health-grid-container,
html body.dark-mode .comparison-interactive-section,
html body.dark-mode .comparison-workspace-dual,
html body.dark-mode .comparison-side,
html body.dark-mode .chart-main-container,
html body.dark-mode .chart-wrapper2,
html body.dark-mode .header-actions,
html body.dark-mode .stats-grid {
  border-color: var(--border) !important;
  background-color: transparent !important;
  background-image: none !important;
  color: var(--text) !important;
}

html body.dark-mode .settings-page { background: transparent !important; }
html body.dark-mode .settings-nav {
  border-color: var(--border) !important;
  background: linear-gradient(160deg, #102238, #0b1a2a) !important;
  box-shadow: var(--shadow-card) !important;
}
html body.dark-mode .settings-nav-item { color: #b3c4d3 !important; background: transparent !important; }
html body.dark-mode .settings-nav-item:hover { background: var(--hover) !important; color: #edf4fa !important; }
html body.dark-mode .settings-nav-item.active {
  border: 1px solid rgba(105, 169, 238, .2) !important;
  background: rgba(64, 133, 198, .22) !important;
  color: #87bcf1 !important;
}
html body.dark-mode .settings-card-body { background: transparent !important; }
html body.dark-mode .toggle-row,
html body.dark-mode .section-divider { border-color: var(--border) !important; background-color: transparent !important; }
html body.dark-mode .slider { background: #36516a !important; }
html body.dark-mode input:checked + .slider { background: #3c8bd3 !important; }
html body.dark-mode .slider::before { background: #edf5fb !important; box-shadow: 0 2px 5px rgba(0, 0, 0, .35) !important; }

html body.dark-mode .kpi-box,
html body.dark-mode .kpi-hero,
html body.dark-mode .stat-pill,
html body.dark-mode .manager-item,
html body.dark-mode .info-item,
html body.dark-mode .bucket-card,
html body.dark-mode .cc-footer,
html body.dark-mode .pc-footer,
html body.dark-mode .cc-sales-rank,
html body.dark-mode .pc-sales-rank,
html body.dark-mode .product-item,
html body.dark-mode .info-row,
html body.dark-mode .comp-cell,
html body.dark-mode .drop-zone,
html body.dark-mode .upload-box,
html body.dark-mode .no-results,
html body.dark-mode .empty-state,
html body.dark-mode .loading-box {
  border-color: var(--border) !important;
  background: rgba(255, 255, 255, .025) !important;
  color: var(--text) !important;
}

/* Forms */
html body.dark-mode input:not([type='checkbox']):not([type='radio']):not([type='range']),
html body.dark-mode textarea,
html body.dark-mode select,
html body.dark-mode .form-control,
html body.dark-mode .form-input,
html body.dark-mode .st-input,
html body.dark-mode .st-select,
html body.dark-mode .sort-select,
html body.dark-mode .filter-select,
html body.dark-mode .date-input,
html body.dark-mode .file-input {
  border: 1px solid var(--border-strong) !important;
  background-color: #091725 !important;
  color: #e5eef7 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

html body.dark-mode input:hover,
html body.dark-mode textarea:hover,
html body.dark-mode select:hover { border-color: #456987 !important; }

html body.dark-mode input:focus,
html body.dark-mode textarea:focus,
html body.dark-mode select:focus,
html body.dark-mode .form-control:focus,
html body.dark-mode .form-input:focus,
html body.dark-mode .st-input:focus,
html body.dark-mode .st-select:focus {
  border-color: #69a9ee !important;
  background-color: #0b1b2b !important;
  box-shadow: 0 0 0 3px rgba(105, 169, 238, .16), inset 0 1px 0 rgba(255, 255, 255, .03) !important;
}

html body.dark-mode input::placeholder,
html body.dark-mode textarea::placeholder { color: #687f95 !important; opacity: 1; }
html body.dark-mode select option { background: #0d1b2a; color: var(--text); }
html body.dark-mode input:-webkit-autofill { -webkit-text-fill-color: var(--text); box-shadow: 0 0 0 1000px #0b1b2b inset !important; }
html body.dark-mode .form-label,
html body.dark-mode .filter-label,
html body.dark-mode .filter-group label,
html body.dark-mode .st-label,
html body.dark-mode label { color: #b7c7d6 !important; }
html body.dark-mode input[type='file']::file-selector-button { border: 0; border-left: 1px solid var(--border); background: var(--surface-elevated); color: var(--text); }

/* Buttons */
html body.dark-mode .btn,
html body.dark-mode .action-btn,
html body.dark-mode .edit-btn,
html body.dark-mode .view-btn,
html body.dark-mode .st-btn,
html body.dark-mode .dropdown-toggle,
html body.dark-mode .close-btn,
html body.dark-mode .btn-icon {
  border-color: var(--border-strong) !important;
  background-color: var(--surface-elevated) !important;
  background-image: none !important;
  color: #d9e6f1 !important;
  box-shadow: none !important;
}

html body.dark-mode .btn:hover,
html body.dark-mode .action-btn:hover,
html body.dark-mode .edit-btn:hover,
html body.dark-mode .view-btn:hover,
html body.dark-mode .st-btn:hover,
html body.dark-mode .dropdown-toggle:hover,
html body.dark-mode .close-btn:hover,
html body.dark-mode .btn-icon:hover {
  border-color: #527795 !important;
  background-color: #1d3a56 !important;
  color: #fff !important;
}

html body.dark-mode .btn-primary,
html body.dark-mode .btn-primary-custom,
html body.dark-mode .btn-filter,
html body.dark-mode .st-btn--primary {
  border-color: #4d92d6 !important;
  background: linear-gradient(135deg, #397fc2, #28699f) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(30, 105, 170, .24) !important;
}
html body.dark-mode .btn-success,
html body.dark-mode .btn-excel,
html body.dark-mode .st-btn--teal { border-color: #329d84 !important; background: #267b69 !important; color: #fff !important; }
html body.dark-mode .btn-danger,
html body.dark-mode .st-btn--danger { border-color: #c55261 !important; background: #983c4b !important; color: #fff !important; }
html body.dark-mode .st-btn--amber { border-color: #bc8130 !important; background: #8f6227 !important; color: #fff !important; }
html body.dark-mode .btn-ghost,
html body.dark-mode .btn-secondary,
html body.dark-mode .st-btn--ghost,
html body.dark-mode .btn-clear { border-color: var(--border) !important; background: rgba(255, 255, 255, .035) !important; color: #b7c7d6 !important; }

/* Tables */
html body.dark-mode .table-container,
html body.dark-mode .table-wrap,
html body.dark-mode .responsive-table-wrapper,
html body.dark-mode .st-table-wrap { scrollbar-color: #365774 #0a1725; }

html body.dark-mode table,
html body.dark-mode .table,
html body.dark-mode .data-table,
html body.dark-mode .st-table { border-color: var(--border) !important; background: transparent !important; color: var(--text) !important; }
html body.dark-mode table thead,
html body.dark-mode table th,
html body.dark-mode .data-table th,
html body.dark-mode .st-table th {
  border-color: var(--border) !important;
  background: #11263a !important;
  color: #c5d6e5 !important;
}
html body.dark-mode table td,
html body.dark-mode .data-table td,
html body.dark-mode .st-table td { border-color: rgba(49, 81, 111, .65) !important; background: transparent !important; color: #b7c7d6 !important; }
html body.dark-mode table tbody tr { background: rgba(6, 17, 29, .12) !important; }
html body.dark-mode table tbody tr:nth-child(even) { background: rgba(34, 61, 85, .23) !important; }
html body.dark-mode table tbody tr:hover { background: rgba(66, 133, 194, .14) !important; }

/* Status chips retain meaning instead of becoming gray cards. */
html body.dark-mode .badge,
html body.dark-mode .tag,
html body.dark-mode .chip,
html body.dark-mode [class*='badge-'],
html body.dark-mode [class*='status-'] { border-color: currentColor !important; background-image: none !important; }
html body.dark-mode .badge-success,
html body.dark-mode .status-success,
html body.dark-mode .badge-approved { background-color: var(--success-light) !important; color: #69ddb8 !important; }
html body.dark-mode .badge-warning,
html body.dark-mode .status-warning,
html body.dark-mode .badge-pending { background-color: var(--warning-light) !important; color: #f3c675 !important; }
html body.dark-mode .badge-danger,
html body.dark-mode .status-danger,
html body.dark-mode .badge-rejected { background-color: var(--danger-light) !important; color: #ff939c !important; }
html body.dark-mode .badge-info,
html body.dark-mode .status-info { background-color: var(--info-light) !important; color: #7cdaea !important; }
html body.dark-mode .badge-secondary { background-color: #26384b !important; color: #b5c5d3 !important; }

/* Charts, maps and data visualizations */
html body.dark-mode canvas { color-scheme: dark; }
html body.dark-mode .chart-wrapper,
html body.dark-mode .chart-box,
html body.dark-mode .chart-card-body,
html body.dark-mode .expiry-chart,
html body.dark-mode .pie-chart,
html body.dark-mode .map-wrap,
html body.dark-mode #branchMap {
  border-color: var(--border) !important;
  background-color: transparent !important;
  background-image: none !important;
}
html body.dark-mode .highcharts-background { fill: transparent; }
html body.dark-mode .highcharts-grid-line { stroke: #203a55; }
html body.dark-mode .highcharts-axis-line,
html body.dark-mode .highcharts-tick { stroke: #31516f; }
html body.dark-mode .highcharts-axis-labels text,
html body.dark-mode .highcharts-legend-item text,
html body.dark-mode .highcharts-title,
html body.dark-mode .highcharts-subtitle { fill: #aabed0 !important; color: #aabed0 !important; }
html body.dark-mode .leaflet-container { background: #0b1b2a !important; }
html body.dark-mode .leaflet-control { filter: brightness(.82) saturate(.8); }

/* Modals, alerts, date picker and loading states */
html body.dark-mode .modal,
html body.dark-mode .st-modal { background: rgba(2, 9, 17, .7) !important; backdrop-filter: blur(9px); }
html body.dark-mode .alert { border-color: var(--border-strong) !important; color: var(--text) !important; }
html body.dark-mode .alert-success { background: var(--success-light) !important; color: #78dfbd !important; }
html body.dark-mode .alert-warning { background: var(--warning-light) !important; color: #f2c476 !important; }
html body.dark-mode .alert-danger { background: var(--danger-light) !important; color: #ff9aa3 !important; }
html body.dark-mode .alert-info { background: var(--info-light) !important; color: #83ddeb !important; }
html body.dark-mode jdp-container { border: 1px solid var(--border-strong) !important; background: #0d1b2a !important; color: var(--text) !important; box-shadow: var(--shadow-md) !important; }
html body.dark-mode jdp-container * { border-color: var(--border) !important; color: inherit; }
html body.dark-mode jdp-container .jdp-day:not(.disabled):hover,
html body.dark-mode jdp-container .jdp-day.selected { background: var(--primary) !important; color: #07111f !important; }
html body.dark-mode .loader-content { border-color: var(--border-strong) !important; background: rgba(9, 22, 36, .96) !important; box-shadow: 0 24px 70px rgba(0, 0, 0, .5) !important; }
html body.dark-mode .loader-text { color: #dce9f5 !important; }
html body.dark-mode .spinner { background: radial-gradient(farthest-side, #69a9ee 94%, transparent) top/9px 9px no-repeat, conic-gradient(transparent 30%, #69a9ee) !important; }
html body.dark-mode .sales-ticker { border-color: rgba(105, 169, 238, .18) !important; background: linear-gradient(90deg, #07111f, #10273d, #07111f) !important; box-shadow: 0 5px 24px rgba(0, 0, 0, .3); }

/* Legacy/bootstrap utility colors that otherwise remain bright. */
html body.dark-mode .bg-white,
html body.dark-mode .bg-light { background-color: var(--surface) !important; }
html body.dark-mode .border,
html body.dark-mode .border-top,
html body.dark-mode .border-bottom { border-color: var(--border) !important; }
html body.dark-mode .text-dark { color: var(--text) !important; }
html body.dark-mode .text-secondary { color: var(--text-muted) !important; }
html body.dark-mode hr { border-color: var(--border) !important; opacity: 1; }

html body.dark-mode * { scrollbar-color: #31516f #091725; }
html body.dark-mode *::-webkit-scrollbar { width: 9px; height: 9px; }
html body.dark-mode *::-webkit-scrollbar-track { background: #091725; }
html body.dark-mode *::-webkit-scrollbar-thumb { border: 2px solid #091725; border-radius: 999px; background: #31516f; }
html body.dark-mode *::-webkit-scrollbar-thumb:hover { background: #456987; }

@media (max-width: 1024px) {
  html body.dark-mode .sidebar.open { box-shadow: -20px 0 65px rgba(0, 0, 0, .55) !important; }
  html body.dark-mode .sidebar-backdrop { background: rgba(2, 9, 17, .68) !important; backdrop-filter: blur(4px); }
}

@media (prefers-reduced-motion: reduce) {
  body.dark-mode::after { display: none; }
}