/* Layered professional dark theme — loaded last so Tailwind tokens and layout styles remap. */

html.dark {
    color-scheme: dark;
    background-color: #121212;
    color: #FFFFFF;
}

html.dark body,
html.dark body.bg-white,
html.dark body.bg-gray-50,
html.dark body.bg-gray-100,
html.dark body.dark\:bg-dark-bg,
html.dark body.dark\:bg-slate-900 {
    background-color: #121212 !important;
    color: #FFFFFF;
}

/* Page / app background */
html.dark .bg-dark-bg,
html.dark .dark\:bg-dark-bg,
html.dark .dark\:bg-\[\#05080A\],
html.dark .dark\:bg-slate-900,
html.dark .bg-slate-900 {
    background-color: #121212 !important;
}

/* Sidebar — never grouped with page, cards, or .bg-white */
html.dark #sidebar,
html.dark #sidebar.bg-white,
html.dark #sidebar.bg-black,
html.dark #sidebar.dark\:bg-black,
html.dark #sidebar.dark\:bg-dark-card,
html.dark .portal-sidebar {
    background-color: #1A1A1A !important;
}

html.dark .dark\:bg-\[\#070A0F\],
html.dark .dark\:bg-\[\#1A1A1A\] {
    background-color: #1A1A1A !important;
}

/* Primary cards, panels, modals */
html.dark .bg-dark-card,
html.dark .dark\:bg-dark-card,
html.dark .dark\:bg-\[\#0D141C\],
html.dark .dark\:bg-slate-800,
html.dark .dark\:bg-slate-800\/90,
html.dark .dark\:bg-slate-800\/80,
html.dark .dark\:bg-slate-800\/60,
html.dark .bg-white,
html.dark .card {
    background-color: #1E1E1E !important;
}

/* Nested cards, secondary panels, session chip, table headers */
html.dark .bg-dark-card2,
html.dark .dark\:bg-dark-card2,
html.dark .dark\:bg-\[\#151D28\],
html.dark .dark\:bg-\[\#262626\],
html.dark .bg-gray-50,
html.dark .bg-gray-100,
html.dark .bg-slate-50,
html.dark .bg-slate-100,
html.dark .bg-gray-50.sticky {
    background-color: #262626 !important;
}

/* Table headers stay nested even when they use dark:bg-dark-bg */
html.dark thead,
html.dark thead.bg-gray-50,
html.dark thead.bg-dark-bg,
html.dark thead.dark\:bg-dark-bg,
html.dark thead[class*="dark:bg-dark-bg"],
html.dark thead[class*="bg-dark-bg"],
html.dark table thead tr,
html.dark table thead th,
html.dark thead th,
html.dark .sticky-thead thead th,
html.dark .fee-board-table thead {
    background-color: #262626 !important;
}

html.dark body.bg-white,
html.dark body.bg-gray-50,
html.dark body.bg-gray-100,
html.dark body.dark\:bg-dark-bg,
html.dark body.dark\:bg-slate-900 {
    background-color: #121212 !important;
}

/* Hover rows and interactive lifts */
html.dark tbody tr:hover,
html.dark .hover\:bg-gray-50:hover,
html.dark .hover\:bg-gray-100:hover,
html.dark .hover\:bg-dark-bg:hover,
html.dark .hover\:bg-dark-card:hover,
html.dark .hover\:bg-dark-card2:hover,
html.dark .dark\:hover\:bg-dark-bg:hover,
html.dark .dark\:hover\:bg-dark-card:hover,
html.dark .dark\:hover\:bg-dark-card2:hover,
html.dark .dark\:hover\:bg-\[\#111111\]:hover,
html.dark .dark\:hover\:bg-white\/\[0\.06\]:hover {
    background-color: #2C2C2C !important;
}

html.dark #sidebar nav a:hover:not([class*="bg-primary-"]),
html.dark #sidebar nav button:hover:not([class*="bg-primary-"]) {
    background-color: #262626 !important;
}

html.dark .portal-sidebar-link:hover:not(.is-active) {
    background-color: #2C2C2C !important;
}

/* Body, headings, labels, sidebar, muted — never status/brand chips or primary buttons */
html.dark :is(
    .text-dark-text, .dark\:text-dark-text,
    .text-dark-muted, .dark\:text-dark-muted,
    .text-gray-300, .text-gray-400, .text-gray-500, .text-gray-600, .text-gray-700, .text-gray-800, .text-gray-900,
    .text-slate-100, .text-slate-200, .text-slate-300, .text-slate-400, .text-slate-500, .text-slate-600, .text-slate-700, .text-slate-800, .text-slate-900,
    .dark\:text-white, .dark\:text-slate-100, .dark\:text-slate-200, .dark\:text-slate-300, .dark\:text-slate-400, .dark\:text-slate-500,
    .dark\:text-gray-200, .dark\:text-gray-300, .dark\:text-gray-400, .dark\:text-gray-500,
    .section-title, .form-label
):not(.badge):not([class*="badge-"]):not(.btn-primary):not(.btn-danger):not(.is-active):not([class*="text-primary-"]):not([class*="text-green-"]):not([class*="text-emerald-"]):not([class*="text-red-"]):not([class*="text-rose-"]):not([class*="text-amber-"]):not([class*="text-yellow-"]):not([class*="text-orange-"]):not([class*="text-blue-"]):not([class*="text-sky-"]):not([class*="text-indigo-"]):not([class*="text-purple-"]):not([class*="bg-green-"]):not([class*="bg-red-"]):not([class*="bg-amber-"]):not([class*="bg-yellow-"]):not([class*="bg-emerald-"]):not([class*="bg-primary-"]) {
    color: #FFFFFF !important;
}

html.dark header .text-gray-500,
html.dark header .text-dark-muted,
html.dark #sidebar h1,
html.dark #sidebar p:not([class*="text-primary-"]),
html.dark #sidebar nav a:not([class*="bg-primary-"]),
html.dark #sidebar nav button:not([class*="bg-primary-"]),
html.dark .portal-sidebar-link:not(.is-active) {
    color: #FFFFFF !important;
}

/* Borders */
html.dark .border-dark-border,
html.dark .dark\:border-dark-border,
html.dark .dark\:border-\[\#1E2A3A\],
html.dark .dark\:border-\[\#333333\],
html.dark .border-gray-50,
html.dark .border-gray-100,
html.dark .border-gray-200,
html.dark .border-slate-200,
html.dark .dark\:border-slate-600,
html.dark .dark\:border-slate-600\/80,
html.dark .dark\:border-slate-600\/70,
html.dark .dark\:border-slate-600\/60,
html.dark #sidebar,
html.dark #sidebar .border-b,
html.dark #sidebar .border-r,
html.dark #sidebar .border-l {
    border-color: #333333 !important;
}

html.dark .border-gray-300,
html.dark .border-slate-300,
html.dark .dark\:border-\[\#404040\] {
    border-color: #404040 !important;
}

html.dark .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
html.dark .divide-gray-200 > :not([hidden]) ~ :not([hidden]),
html.dark .divide-dark-border > :not([hidden]) ~ :not([hidden]) {
    border-color: #333333 !important;
}

/* Inputs sit above cards */
html.dark input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="file"]):not([type="range"]):not([type="hidden"]),
html.dark select,
html.dark textarea,
html.dark .form-input,
html.dark .form-select {
    background-color: #2C2C2C !important;
    color: #FFFFFF !important;
    border-color: #333333 !important;
    color-scheme: dark;
}

html.dark input:focus:not([type="checkbox"]):not([type="radio"]),
html.dark select:focus,
html.dark textarea:focus,
html.dark .form-input:focus,
html.dark .form-select:focus {
    background-color: #2C2C2C !important;
    color: #FFFFFF !important;
}

html.dark input::placeholder,
html.dark textarea::placeholder,
html.dark .form-input::placeholder {
    color: #BDBDBD !important;
}

html.dark option {
    background-color: #2C2C2C !important;
    color: #FFFFFF !important;
}

html.dark input[type="file"] {
    background-color: #2C2C2C !important;
    color: #FFFFFF !important;
}

html.dark input[type="file"]::file-selector-button {
    background-color: #262626 !important;
    color: #FFFFFF !important;
    border-color: #333333 !important;
}

html.dark .btn-secondary {
    background-color: #262626 !important;
    color: #FFFFFF !important;
}

html.dark .btn-secondary:hover {
    background-color: #2C2C2C !important;
}

html.dark .badge-gray {
    background-color: #262626 !important;
    color: #FFFFFF !important;
}

html.dark .progress-bar {
    background-color: #262626 !important;
}

html.dark .skeleton {
    background-color: #262626 !important;
}

html.dark ::-webkit-scrollbar-track,
html.dark .custom-scrollbar::-webkit-scrollbar-track {
    background: #121212;
}

html.dark ::-webkit-scrollbar-thumb,
html.dark .custom-scrollbar::-webkit-scrollbar-thumb {
    background: #404040;
}

html.dark .shadow-sm {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.65), 0 0 0 1px #333333;
}

html.dark .shadow-md,
html.dark .hover\:shadow-md:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.65), 0 0 0 1px #333333;
}

html.dark .shadow-lg {
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.7), 0 0 0 1px #333333;
}