/*
 * Servesk CRM dark mode
 * Loaded after the legacy/app and Uiverse refinement layers so it can translate
 * older hard-coded light surfaces without requiring every module to be rewritten.
 */

/* Theme toggle is part of the shared UI in both themes. */
[data-theme-toggle] {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}
.bh-theme-toggle,
.portal-theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.bh-theme-toggle .fa-sun,
.portal-theme-toggle .fa-sun { color: #f59e0b; }
.bh-theme-toggle .fa-moon,
.portal-theme-toggle .fa-moon { color: inherit; }

@media (max-width: 560px) {
    /* Other utility actions intentionally collapse on phones; theme stays reachable. */
    .bh-header-actions > .bh-theme-toggle { display: inline-flex !important; }
}

html[data-theme="dark"] {
    color-scheme: dark;
    --bh-ui-bg: #080d18;
    --bh-ui-surface: #111827;
    --bh-ui-surface-soft: #172033;
    --bh-ui-text: #e7edf7;
    --bh-ui-muted: #94a3b8;
    --bh-ui-border: #283548;
    --bh-ui-border-strong: #3a4a61;
    --bh-ui-danger: #f87171;
    --bh-ui-success: #4ade80;
    --bh-ui-warning: #fbbf24;
    --bh-ui-shadow: 0 1px 2px rgba(0,0,0,.24), 0 10px 28px rgba(0,0,0,.18);
    --bh-ui-shadow-hover: 0 2px 5px rgba(0,0,0,.30), 0 15px 34px rgba(0,0,0,.24);
    --pfx-body-bg: #080d18;
    --pfx-card-bg: #111827;
}

html[data-theme="dark"],
html[data-theme="dark"] body {
    background: #080d18 !important;
    color: #e7edf7;
}

html[data-theme="dark"] body::selection,
html[data-theme="dark"] ::selection {
    background: color-mix(in srgb, var(--pfx-primary, #3b82f6) 38%, #111827);
    color: #fff;
}

/* App shell -------------------------------------------------------------- */
html[data-theme="dark"] #perfex-wrapper,
html[data-theme="dark"] #perfex-main,
html[data-theme="dark"] #perfex-content {
    background: #080d18 !important;
    color: #e7edf7;
}

html[data-theme="dark"] #perfex-header {
    background: rgba(13, 20, 34, .96) !important;
    border-bottom-color: #263348 !important;
    box-shadow: 0 1px 0 rgba(255,255,255,.025), 0 8px 24px rgba(0,0,0,.12) !important;
}

html[data-theme="dark"] .header-mobile-logo,
html[data-theme="dark"] .header-user-name,
html[data-theme="dark"] .header-user-caret {
    color: #e5e7eb !important;
}

html[data-theme="dark"] .header-btn,
html[data-theme="dark"] .bh-header-action,
html[data-theme="dark"] .sidebar-toggle-btn,
html[data-theme="dark"] .bh-mobile-search-button {
    background: #121b2a !important;
    border-color: #2e3b50 !important;
    color: #b8c4d6 !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.2) !important;
}
html[data-theme="dark"] .header-btn:hover,
html[data-theme="dark"] .bh-header-action:hover,
html[data-theme="dark"] .sidebar-toggle-btn:hover,
html[data-theme="dark"] .bh-mobile-search-button:hover {
    background: #1a2638 !important;
    border-color: #41516a !important;
    color: #fff !important;
}
html[data-theme="dark"] .header-user-chip:hover {
    background: #151f30 !important;
    border-color: #2e3b50 !important;
}
html[data-theme="dark"] .header-divider { background: #2e3b50 !important; }

html[data-theme="dark"] .header-search input,
html[data-theme="dark"] #global-search-input {
    background: #111a29 !important;
    color: #e7edf7 !important;
    border-color: #354359 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}
html[data-theme="dark"] .header-search input::placeholder,
html[data-theme="dark"] #global-search-input::placeholder { color: #738198 !important; }
html[data-theme="dark"] .header-search input:focus,
html[data-theme="dark"] #global-search-input:focus { background: #0f1826 !important; }
html[data-theme="dark"] .header-search-icon { color: #718096 !important; }

html[data-theme="dark"] .header-dropdown-panel,
html[data-theme="dark"] .bh-global-search-results,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .dropdown-content {
    background: #111827 !important;
    border-color: #2c394d !important;
    color: #dce5f2 !important;
    box-shadow: 0 20px 52px rgba(0,0,0,.48) !important;
}
html[data-theme="dark"] .user-menu-header { border-color: #283548 !important; }
html[data-theme="dark"] .user-menu-header .u-name { color: #f1f5f9 !important; }
html[data-theme="dark"] .user-menu-header .u-email { color: #94a3b8 !important; }
html[data-theme="dark"] .user-menu-item,
html[data-theme="dark"] .bh-search-result { color: #cbd5e1 !important; }
html[data-theme="dark"] .user-menu-item:hover,
html[data-theme="dark"] .bh-search-result:hover,
html[data-theme="dark"] .bh-search-result.active { background: #1a2638 !important; color: #fff !important; }
html[data-theme="dark"] .bh-search-result-icon {
    background: color-mix(in srgb, var(--pfx-primary) 20%, #111827) !important;
}

@media (max-width: 768px) {
    html[data-theme="dark"] body.mobile-search-open .header-search {
        background: #0d1422 !important;
        border-bottom-color: #2b384d !important;
        box-shadow: 0 12px 28px rgba(0,0,0,.38) !important;
    }
}

/* Typography ------------------------------------------------------------- */
html[data-theme="dark"] .page-title-area h1,
html[data-theme="dark"] .page-title-area h2,
html[data-theme="dark"] .card-title,
html[data-theme="dark"] .modal-title,
html[data-theme="dark"] .panel-title,
html[data-theme="dark"] #perfex-content h1,
html[data-theme="dark"] #perfex-content h2,
html[data-theme="dark"] #perfex-content h3,
html[data-theme="dark"] #perfex-content h4,
html[data-theme="dark"] #perfex-content h5,
html[data-theme="dark"] #perfex-content h6 {
    color: #f1f5f9;
}
html[data-theme="dark"] .page-subtitle,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] small,
html[data-theme="dark"] .help-text,
html[data-theme="dark"] .form-text,
html[data-theme="dark"] .stat-card-label,
html[data-theme="dark"] .stat-card-sub { color: #94a3b8 !important; }
html[data-theme="dark"] a:not(.btn):not(.sidebar-nav a):not(.submenu a) { text-underline-offset: 2px; }

/* Cards, panels, widgets ------------------------------------------------- */
html[data-theme="dark"] .card,
html[data-theme="dark"] .bh-module-card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .pfx-card,
html[data-theme="dark"] .data-card,
html[data-theme="dark"] .widget,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .kanban-column,
html[data-theme="dark"] .kanban-card,
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .tab-content {
    background: #111827 !important;
    color: #dce5f2 !important;
    border-color: #283548 !important;
    box-shadow: var(--bh-ui-shadow) !important;
}
html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer,
html[data-theme="dark"] .panel-heading,
html[data-theme="dark"] .panel-footer,
html[data-theme="dark"] .widget-header {
    background: #111827 !important;
    border-color: #283548 !important;
    color: #e7edf7 !important;
}
html[data-theme="dark"] .card-footer { background: #0f1725 !important; }
html[data-theme="dark"] .stat-card-value { color: #f8fafc !important; }
html[data-theme="dark"] .bh-page-icon,
html[data-theme="dark"] .bh-empty-icon {
    background: #172236 !important;
}

/* Forms ----------------------------------------------------------------- */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="url"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="time"],
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] input[type="datetime-local"],
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    background: #0e1725 !important;
    color: #e5e7eb !important;
    border-color: #39485e !important;
    caret-color: #fff;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #718096 !important; opacity: 1; }
html[data-theme="dark"] select option { background: #111827; color: #e5e7eb; }
html[data-theme="dark"] label,
html[data-theme="dark"] .form-label { color: #cbd5e1 !important; }
html[data-theme="dark"] input:disabled,
html[data-theme="dark"] select:disabled,
html[data-theme="dark"] textarea:disabled,
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly] {
    background: #141e2e !important;
    color: #7f8da3 !important;
    border-color: #29384d !important;
    opacity: 1;
}
html[data-theme="dark"] input[type="checkbox"],
html[data-theme="dark"] input[type="radio"] { accent-color: var(--pfx-primary); }
html[data-theme="dark"] .bh-upload-zone {
    background: #0f1826 !important;
    color: #b9c5d7 !important;
    border-color: #3a4a61 !important;
}
html[data-theme="dark"] .bh-upload-zone:hover {
    background: color-mix(in srgb, var(--pfx-primary) 8%, #0f1826) !important;
}

/* Buttons --------------------------------------------------------------- */
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-default,
html[data-theme="dark"] .btn-light {
    background: #162132 !important;
    color: #d9e2ef !important;
    border-color: #3a4a61 !important;
}
html[data-theme="dark"] .btn-secondary:hover,
html[data-theme="dark"] .btn-default:hover,
html[data-theme="dark"] .btn-light:hover {
    background: #202e43 !important;
    color: #fff !important;
    border-color: #53647d !important;
}
html[data-theme="dark"] .btn-danger:not(.btn-solid-danger) {
    background: #28151a !important;
    color: #fca5a5 !important;
    border-color: #6b2e38 !important;
}
html[data-theme="dark"] .btn-danger:hover { background: #3a1b22 !important; color: #fecaca !important; }

/* Tables ---------------------------------------------------------------- */
html[data-theme="dark"] .table-container,
html[data-theme="dark"] .table-responsive,
html[data-theme="dark"] .responsive-table {
    background: #111827 !important;
    border-color: #2c394d !important;
}
html[data-theme="dark"] .perfex-table,
html[data-theme="dark"] table { color: #d7e0ed; }
html[data-theme="dark"] .perfex-table thead tr,
html[data-theme="dark"] table thead tr { background: #151f30 !important; }
html[data-theme="dark"] .perfex-table thead th,
html[data-theme="dark"] table thead th {
    background: #151f30 !important;
    color: #98a7bc !important;
    border-color: #314056 !important;
}
html[data-theme="dark"] .perfex-table tbody td,
html[data-theme="dark"] table tbody td {
    color: #d2dce9;
    border-color: #273448 !important;
}
html[data-theme="dark"] .perfex-table tbody tr:hover td,
html[data-theme="dark"] table tbody tr:hover td { background: #162132 !important; }
html[data-theme="dark"] table tbody tr:nth-child(even) td.bg-striped { background: #0f1826 !important; }

/* Tabs, nav and pagination --------------------------------------------- */
html[data-theme="dark"] .nav-tabs,
html[data-theme="dark"] .tabs,
html[data-theme="dark"] .tab-nav { border-color: #2c394d !important; }
html[data-theme="dark"] .nav-tabs a,
html[data-theme="dark"] .tab-link { color: #94a3b8 !important; }
html[data-theme="dark"] .nav-tabs a:hover,
html[data-theme="dark"] .tab-link:hover { color: #e5e7eb !important; background: #151f30 !important; }
html[data-theme="dark"] .nav-tabs .active > a,
html[data-theme="dark"] .tab-link.active { color: #fff !important; border-color: var(--pfx-primary) !important; }
html[data-theme="dark"] .bh-pag-btn {
    background: #111827 !important;
    color: #cbd5e1 !important;
    border-color: #334155 !important;
}
html[data-theme="dark"] .bh-pag-btn:hover { background: #1a2638 !important; color: #fff !important; }
html[data-theme="dark"] .bh-pag-btn.active { background: var(--pfx-primary) !important; color: #fff !important; border-color: var(--pfx-primary) !important; }

/* Alerts and status badges --------------------------------------------- */
html[data-theme="dark"] .alert-success { background: #0d281c !important; color: #86efac !important; border-color: #245c3b !important; }
html[data-theme="dark"] .alert-danger,
html[data-theme="dark"] .alert-error { background: #30161b !important; color: #fca5a5 !important; border-color: #6f3039 !important; }
html[data-theme="dark"] .alert-warning { background: #30250d !important; color: #fde68a !important; border-color: #735c1d !important; }
html[data-theme="dark"] .alert-info { background: #102740 !important; color: #93c5fd !important; border-color: #285685 !important; }
html[data-theme="dark"] .alert-dismiss:hover { background: rgba(255,255,255,.07) !important; }
html[data-theme="dark"] .badge-primary { background: #142b50 !important; color: #93c5fd !important; border-color: #274d7e !important; }
html[data-theme="dark"] .badge-success { background: #102a1d !important; color: #86efac !important; border-color: #286143 !important; }
html[data-theme="dark"] .badge-warning { background: #30260e !important; color: #fde68a !important; border-color: #715d20 !important; }
html[data-theme="dark"] .badge-danger { background: #32181e !important; color: #fca5a5 !important; border-color: #70313b !important; }
html[data-theme="dark"] .badge-info { background: #10283a !important; color: #7dd3fc !important; border-color: #27556c !important; }
html[data-theme="dark"] .badge-secondary { background: #202b3b !important; color: #cbd5e1 !important; border-color: #3b4a5f !important; }
html[data-theme="dark"] .badge-purple { background: #281b47 !important; color: #c4b5fd !important; border-color: #57408d !important; }

/* Modals and overlays --------------------------------------------------- */
html[data-theme="dark"] .modal-overlay { background: rgba(0,0,0,.66) !important; }
html[data-theme="dark"] .modal-dialog,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .pfx-modal-content,
html[data-theme="dark"] [role="dialog"] {
    background: #111827 !important;
    color: #dce5f2 !important;
    border-color: #2f3d52 !important;
}
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer { border-color: #2c394d !important; background: #111827 !important; }
html[data-theme="dark"] .modal-close { color: #94a3b8 !important; }
html[data-theme="dark"] .modal-close:hover { background: #1b2739 !important; color: #fff !important; }

/* Editors --------------------------------------------------------------- */
html[data-theme="dark"] .jodit-container,
html[data-theme="dark"] .jodit-toolbar__box,
html[data-theme="dark"] .jodit-workplace,
html[data-theme="dark"] .jodit-status-bar,
html[data-theme="dark"] .jodit-wysiwyg,
html[data-theme="dark"] .jodit-ui-group,
html[data-theme="dark"] .jodit-ui-button {
    background-color: #111827 !important;
    color: #dce5f2 !important;
    border-color: #34435a !important;
}
html[data-theme="dark"] .jodit-ui-button:hover { background-color: #1b2739 !important; }
html[data-theme="dark"] .jodit-icon { fill: #cbd5e1 !important; }

/* Legacy inline light palette translation ------------------------------
 * Many older module views use inline light colors. Restrict these rules to
 * application/portal content so email/PDF/public document rendering is untouched.
 */
html[data-theme="dark"] #perfex-content [style*="background:#fff"],
html[data-theme="dark"] #perfex-content [style*="background: #fff"],
html[data-theme="dark"] #perfex-content [style*="background:white"],
html[data-theme="dark"] #perfex-content [style*="background: white"],
html[data-theme="dark"] #perfex-content [style*="background:#ffffff"],
html[data-theme="dark"] #perfex-content [style*="background: #ffffff"],
html[data-theme="dark"] .portal-content [style*="background:#fff"],
html[data-theme="dark"] .portal-content [style*="background: #fff"],
html[data-theme="dark"] .portal-content [style*="background:#ffffff"],
html[data-theme="dark"] .portal-content [style*="background: #ffffff"] {
    background: #111827 !important;
}
html[data-theme="dark"] #perfex-content [style*="background:#f8fafc"],
html[data-theme="dark"] #perfex-content [style*="background: #f8fafc"],
html[data-theme="dark"] #perfex-content [style*="background:#f9fafb"],
html[data-theme="dark"] #perfex-content [style*="background: #f9fafb"],
html[data-theme="dark"] #perfex-content [style*="background:#fafafa"],
html[data-theme="dark"] #perfex-content [style*="background: #fafafa"],
html[data-theme="dark"] #perfex-content [style*="background:#f4f4f5"],
html[data-theme="dark"] #perfex-content [style*="background: #f4f4f5"],
html[data-theme="dark"] .portal-content [style*="background:#f8fafc"],
html[data-theme="dark"] .portal-content [style*="background: #f8fafc"],
html[data-theme="dark"] .portal-content [style*="background:#f9fafb"],
html[data-theme="dark"] .portal-content [style*="background: #f9fafb"] {
    background: #151f30 !important;
}
html[data-theme="dark"] #perfex-content [style*="color:#111827"],
html[data-theme="dark"] #perfex-content [style*="color: #111827"],
html[data-theme="dark"] #perfex-content [style*="color:#0f172a"],
html[data-theme="dark"] #perfex-content [style*="color: #0f172a"],
html[data-theme="dark"] #perfex-content [style*="color:#1f2937"],
html[data-theme="dark"] #perfex-content [style*="color: #1f2937"],
html[data-theme="dark"] #perfex-content [style*="color:#374151"],
html[data-theme="dark"] #perfex-content [style*="color: #374151"],
html[data-theme="dark"] #perfex-content [style*="color:#334155"],
html[data-theme="dark"] #perfex-content [style*="color: #334155"],
html[data-theme="dark"] #perfex-content [style*="color:#475569"],
html[data-theme="dark"] #perfex-content [style*="color: #475569"],
html[data-theme="dark"] .portal-content [style*="color:#111827"],
html[data-theme="dark"] .portal-content [style*="color: #111827"],
html[data-theme="dark"] .portal-content [style*="color:#374151"],
html[data-theme="dark"] .portal-content [style*="color: #374151"] {
    color: #e2e8f0 !important;
}
html[data-theme="dark"] #perfex-content [style*="color:#6b7280"],
html[data-theme="dark"] #perfex-content [style*="color: #6b7280"],
html[data-theme="dark"] #perfex-content [style*="color:#64748b"],
html[data-theme="dark"] #perfex-content [style*="color: #64748b"],
html[data-theme="dark"] #perfex-content [style*="color:#94a3b8"],
html[data-theme="dark"] #perfex-content [style*="color: #94a3b8"],
html[data-theme="dark"] .portal-content [style*="color:#6b7280"],
html[data-theme="dark"] .portal-content [style*="color: #6b7280"] {
    color: #94a3b8 !important;
}
html[data-theme="dark"] #perfex-content [style*="border:1px solid #e5e7eb"],
html[data-theme="dark"] #perfex-content [style*="border: 1px solid #e5e7eb"],
html[data-theme="dark"] #perfex-content [style*="border:1px solid #e2e8f0"],
html[data-theme="dark"] #perfex-content [style*="border: 1px solid #e2e8f0"],
html[data-theme="dark"] #perfex-content [style*="border:1px solid #d1d5db"],
html[data-theme="dark"] #perfex-content [style*="border: 1px solid #d1d5db"],
html[data-theme="dark"] .portal-content [style*="border:1px solid #e5e7eb"],
html[data-theme="dark"] .portal-content [style*="border: 1px solid #e5e7eb"] {
    border-color: #334155 !important;
}

/* Client portal --------------------------------------------------------- */
html[data-theme="dark"] body .portal-wrap,
html[data-theme="dark"] .portal-main,
html[data-theme="dark"] .portal-content { background: #080d18 !important; color: #dce5f2; }
html[data-theme="dark"] .portal-topbar {
    background: #0d1422 !important;
    border-bottom-color: #2b384d !important;
}
html[data-theme="dark"] .portal-topbar-title { color: #f1f5f9 !important; }
html[data-theme="dark"] .portal-hamburger { color: #e5e7eb !important; }
.portal-theme-toggle {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    margin-left: auto;
    margin-right: 10px;
    border: 1px solid #dbe2ea;
    border-radius: 10px;
    background: #fff;
    color: #475569;
}
html[data-theme="dark"] .portal-theme-toggle {
    background: #121b2a !important;
    border-color: #2e3b50 !important;
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .portal-theme-toggle:hover { background: #1a2638 !important; color: #fff !important; }
html[data-theme="dark"] .portal-topbar select { background: #111827 !important; color: #e5e7eb !important; border-color: #39485e !important; }

/* Staff login / password / MFA ----------------------------------------- */
html[data-theme="dark"] body .bhl-page:not([style]),
html[data-theme="dark"] .bh-login-wrap,
html[data-theme="dark"] .mfa-page { background-color: #080d18 !important; color: #e5e7eb; }
html[data-theme="dark"] .bhl-card,
html[data-theme="dark"] .bh-login-card,
html[data-theme="dark"] .mfa-card {
    background: #111827 !important;
    color: #e5e7eb !important;
    border-color: #334155 !important;
    box-shadow: 0 24px 70px rgba(0,0,0,.48) !important;
}
html[data-theme="dark"] .bhl-brand-name,
html[data-theme="dark"] .bhl-headline,
html[data-theme="dark"] .mfa-title { color: #f8fafc !important; }
html[data-theme="dark"] .bhl-subline,
html[data-theme="dark"] .bhl-portal-desc,
html[data-theme="dark"] .mfa-sub,
html[data-theme="dark"] .mfa-hint-text { color: #94a3b8 !important; }
html[data-theme="dark"] .bhl-role-btn,
html[data-theme="dark"] .bhl-input,
html[data-theme="dark"] .mfa-input,
html[data-theme="dark"] .mfa-icon,
html[data-theme="dark"] .mfa-hint {
    background: #0e1725 !important;
    color: #e5e7eb !important;
    border-color: #3a4a61 !important;
}
html[data-theme="dark"] .bhl-role-btn .col strong { color: #dbe4f0 !important; }
html[data-theme="dark"] .bhl-role-btn .col small,
html[data-theme="dark"] .bhl-label,
html[data-theme="dark"] .mfa-label { color: #94a3b8 !important; }
html[data-theme="dark"] .bhl-role-btn:hover { background: #162132 !important; border-color: #53647d !important; }
html[data-theme="dark"] .bhl-role-btn.active {
    background: color-mix(in srgb, #2563eb 14%, #0e1725) !important;
    border-color: #3b82f6 !important;
}
html[data-theme="dark"] .bhl-role-btn.active .col strong { color: #bfdbfe !important; }
html[data-theme="dark"] .bhl-role-btn.active .col small { color: #93c5fd !important; }
html[data-theme="dark"] .mfa-card { border-color: color-mix(in srgb, #3b82f6 75%, #334155) !important; }
html[data-theme="dark"] hr { border-color: #2d3a4e !important; }

/* Portal authentication ------------------------------------------------ */
html[data-theme="dark"] .portal-login-card,
html[data-theme="dark"] .portal-login-header,
html[data-theme="dark"] .portal-login-body {
    background: #111827 !important;
    color: #e5e7eb !important;
    border-color: #2d3a4e !important;
}
html[data-theme="dark"] .portal-login-header h1 { color: #f8fafc !important; }

/* Date picker / browser autofill --------------------------------------- */
html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus {
    -webkit-text-fill-color: #e5e7eb;
    -webkit-box-shadow: 0 0 0 1000px #0e1725 inset !important;
    caret-color: #fff;
}
html[data-theme="dark"] ::-webkit-calendar-picker-indicator { filter: invert(.82); }
html[data-theme="dark"] ::-webkit-scrollbar { width: 11px; height: 11px; }
html[data-theme="dark"] ::-webkit-scrollbar-track { background: #0b1220; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #334155; border: 2px solid #0b1220; border-radius: 999px; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #475569; }

/* Standalone auth pages keep the appearance switch reachable before login. */
.standalone-theme-toggle {
    position: fixed;
    top: max(14px, env(safe-area-inset-top));
    right: max(14px, env(safe-area-inset-right));
    z-index: 50;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dbe2ea;
    border-radius: 12px;
    background: rgba(255,255,255,.92);
    color: #475569;
    box-shadow: 0 8px 24px rgba(15,23,42,.10);
    backdrop-filter: blur(10px);
}
.standalone-theme-toggle:hover { background: #fff; color: #0f172a; }
html[data-theme="dark"] .standalone-theme-toggle {
    background: rgba(17,24,39,.92) !important;
    color: #cbd5e1 !important;
    border-color: #37465d !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.34) !important;
}
html[data-theme="dark"] .standalone-theme-toggle:hover { background: #1b2739 !important; color: #fff !important; }

/* The account-menu appearance row doubles as a clear text fallback for the icon toggle. */
.bh-user-theme-item {
    width: 100%;
    border: 0;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

html[data-theme="dark"] .notif-item,
html[data-theme="dark"] .notif-panel-footer { border-color: #283548 !important; }
html[data-theme="dark"] .notif-item:hover,
html[data-theme="dark"] .notif-panel-footer { background: #151f30 !important; }
html[data-theme="dark"] .notif-text strong { color: #e5e7eb !important; }
html[data-theme="dark"] .notif-text p,
html[data-theme="dark"] .notif-time,
html[data-theme="dark"] .notif-empty { color: #94a3b8 !important; }
html[data-theme="dark"] .user-menu-item.u-danger:hover { background: #31171d !important; color: #fca5a5 !important; }
html[data-theme="dark"] .portal-topbar [style*="color:#6b7280"],
html[data-theme="dark"] .portal-topbar [style*="color: #6b7280"] { color: #94a3b8 !important; }

/* Dashboard module --------------------------------------------------------
 * The dashboard ships its own <style> block after the global stylesheet, so
 * its light palette needs explicit !important dark-theme overrides here.
 */
html[data-theme="dark"] .bhd-greeting {
    color: #f8fafc !important;
}
html[data-theme="dark"] .bhd-subline,
html[data-theme="dark"] .bhd-kpi-label,
html[data-theme="dark"] .bhd-kpi-sub,
html[data-theme="dark"] .bhd-small-stat-lbl,
html[data-theme="dark"] .bhd-rev-label,
html[data-theme="dark"] .bhd-activity-sub,
html[data-theme="dark"] .bhd-activity-ts,
html[data-theme="dark"] .bhd-tkt-client,
html[data-theme="dark"] .bhd-tkt-age,
html[data-theme="dark"] .bhd-inv-client,
html[data-theme="dark"] .bhd-donut-leg-pct {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .bhd-refresh-btn {
    background: #162132 !important;
    border-color: #34445b !important;
    color: #d9e2ef !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.18) !important;
}
html[data-theme="dark"] .bhd-refresh-btn:hover {
    background: #202e43 !important;
    border-color: #50627c !important;
    color: #fff !important;
}
html[data-theme="dark"] .bhd-header-actions .bhd-refresh-btn[style*="#fef2f2"] {
    background: #32181e !important;
    border-color: #6f3039 !important;
    color: #fca5a5 !important;
}
html[data-theme="dark"] .bhd-header-actions .bhd-refresh-btn[style*="#fef2f2"]:hover {
    background: #421e26 !important;
    border-color: #8b3c48 !important;
    color: #fecaca !important;
}

html[data-theme="dark"] .bhd-kpi,
html[data-theme="dark"] .bhd-small-stat,
html[data-theme="dark"] .bhd-card {
    background: #111827 !important;
    border-color: #283548 !important;
    color: #dce5f2 !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.22), 0 8px 24px rgba(0,0,0,.08) !important;
}
html[data-theme="dark"] .bhd-kpi:hover,
html[data-theme="dark"] .bhd-small-stat:hover,
html[data-theme="dark"] .bhd-card:hover {
    background: #131d2d !important;
}
html[data-theme="dark"] .bhd-kpi:hover,
html[data-theme="dark"] .bhd-small-stat:hover {
    box-shadow: 0 10px 28px rgba(0,0,0,.28) !important;
}
html[data-theme="dark"] .bhd-kpi-value,
html[data-theme="dark"] .bhd-small-stat-val {
    color: #f8fafc !important;
}
html[data-theme="dark"] .bhd-kpi-icon,
html[data-theme="dark"] .bhd-small-stat-icon {
    background: #172236 !important;
    background: color-mix(in srgb, var(--bhd-color, #3b82f6) 18%, #111827) !important;
}
html[data-theme="dark"] .bhd-kpi-badge {
    background: #32181e !important;
    color: #fca5a5 !important;
}

html[data-theme="dark"] .bhd-card-header {
    background: #111827 !important;
    border-bottom-color: #263448 !important;
}
html[data-theme="dark"] .bhd-card-title {
    color: #dce5f2 !important;
}
html[data-theme="dark"] .bhd-card-body {
    color: #dce5f2 !important;
}
html[data-theme="dark"] #bhd-activity-ts {
    color: #64748b !important;
}

html[data-theme="dark"] .bhd-activity-item,
html[data-theme="dark"] .bhd-tkt-row,
html[data-theme="dark"] .bhd-inv-row,
html[data-theme="dark"] .bhd-client-row {
    border-bottom-color: #243246 !important;
}
html[data-theme="dark"] .bhd-activity-item:hover,
html[data-theme="dark"] .bhd-tkt-row:hover,
html[data-theme="dark"] .bhd-inv-row:hover,
html[data-theme="dark"] .bhd-client-row:hover {
    background: #172236 !important;
}
html[data-theme="dark"] .bhd-activity-text,
html[data-theme="dark"] .bhd-tkt-subject,
html[data-theme="dark"] .bhd-inv-num,
html[data-theme="dark"] .bhd-inv-amt,
html[data-theme="dark"] .bhd-client-name,
html[data-theme="dark"] .bhd-client-rev,
html[data-theme="dark"] .bhd-donut-leg-item,
html[data-theme="dark"] .bhd-pipeline-label,
html[data-theme="dark"] .bhd-pipeline-count {
    color: #dce5f2 !important;
}
html[data-theme="dark"] .bhd-activity-status[style] {
    background: #202b3b !important;
    color: #aab7c9 !important;
}

html[data-theme="dark"] .bhd-client-bar-wrap,
html[data-theme="dark"] .bhd-pipeline-track {
    background: #263448 !important;
}
html[data-theme="dark"] .bhd-client-rank {
    background: #202b3b !important;
    color: #aab7c9 !important;
}
html[data-theme="dark"] .bhd-client-rank.gold {
    background: #3a2b0c !important;
    color: #fbbf24 !important;
}
html[data-theme="dark"] .bhd-client-rank.silver {
    background: #263142 !important;
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .bhd-client-rank.bronze {
    background: #3a2414 !important;
    color: #fb923c !important;
}

html[data-theme="dark"] .bhd-donut-svg circle:first-of-type {
    stroke: #263448 !important;
}
html[data-theme="dark"] .bhd-donut-svg text {
    fill: #f8fafc !important;
}

html[data-theme="dark"] .bhd-alert-warn {
    background: #30161b !important;
    border-color: #6f3039 !important;
    color: #fca5a5 !important;
}
html[data-theme="dark"] .bhd-alert-warn a {
    color: #f87171 !important;
}
html[data-theme="dark"] .bhd-empty {
    color: #94a3b8 !important;
}
html[data-theme="dark"] .bhd-empty i:not([style*="color"]) {
    color: #40506a !important;
}

/* Make the large dashboard regions read as deliberate dark surfaces rather
 * than white islands on a black canvas. */
html[data-theme="dark"] .bhd-grid-2,
html[data-theme="dark"] .bhd-grid-3,
html[data-theme="dark"] .bhd-three-grid,
html[data-theme="dark"] .bhd-kpi-grid,
html[data-theme="dark"] .bhd-small-stats {
    color: #dce5f2;
}

/* Invoice / Billing settings ---------------------------------------------
 * modules/invoices/views/settings.php ships a page-local light palette.
 * These rules intentionally target only that settings UI so invoice/PDF
 * output and other public documents remain unaffected.
 */
html[data-theme="dark"] .inv-settings-wrap {
    color: #dce5f2 !important;
}
html[data-theme="dark"] .inv-settings-section {
    background: #111827 !important;
    border-color: #2b394d !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.22), 0 10px 28px rgba(0,0,0,.10) !important;
}
html[data-theme="dark"] .inv-settings-section-header {
    background: #151f30 !important;
    border-bottom-color: #2b394d !important;
}
/* Preserve the intentional Stripe brand gradient. */
html[data-theme="dark"] .inv-settings-section-header[style*="linear-gradient"] {
    background: linear-gradient(90deg,#4f46e5,#635bff) !important;
    border-bottom-color: rgba(255,255,255,.12) !important;
}
html[data-theme="dark"] .inv-settings-section-title {
    color: #f8fafc !important;
}
html[data-theme="dark"] .inv-settings-section-desc {
    color: #94a3b8 !important;
}
html[data-theme="dark"] .inv-settings-body {
    background: #111827 !important;
}
html[data-theme="dark"] .inv-settings-wrap .form-label,
html[data-theme="dark"] .inv-settings-wrap label:not(.inv-settings-toggle) {
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .inv-settings-wrap .form-control,
html[data-theme="dark"] .inv-settings-wrap input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] .inv-settings-wrap select,
html[data-theme="dark"] .inv-settings-wrap textarea {
    background: #0d1726 !important;
    border-color: #35445a !important;
    color: #e5edf7 !important;
}
html[data-theme="dark"] .inv-settings-wrap .form-control::placeholder,
html[data-theme="dark"] .inv-settings-wrap input::placeholder,
html[data-theme="dark"] .inv-settings-wrap textarea::placeholder {
    color: #718096 !important;
    opacity: 1 !important;
}
html[data-theme="dark"] .inv-settings-wrap .form-control:focus,
html[data-theme="dark"] .inv-settings-wrap input:not([type="checkbox"]):not([type="radio"]):focus,
html[data-theme="dark"] .inv-settings-wrap select:focus,
html[data-theme="dark"] .inv-settings-wrap textarea:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59,130,246,.16) !important;
}
html[data-theme="dark"] .inv-settings-toggle {
    background: #151f30 !important;
    border-color: #34445b !important;
}
html[data-theme="dark"] .inv-settings-toggle:hover {
    background: #192538 !important;
    border-color: #465a75 !important;
}
html[data-theme="dark"] .inv-settings-toggle:has(input:checked) {
    background: #102544 !important;
    border-color: #3567a8 !important;
}
html[data-theme="dark"] .inv-settings-toggle .toggle-label {
    color: #e5edf7 !important;
}
html[data-theme="dark"] .inv-settings-toggle .toggle-hint {
    color: #94a3b8 !important;
}

/* The invoice settings template contains several inline light-mode colors. */
html[data-theme="dark"] .inv-settings-wrap [style*="color:#374151"],
html[data-theme="dark"] .inv-settings-wrap [style*="color: #374151"],
html[data-theme="dark"] .inv-settings-wrap [style*="color:#6b7280"],
html[data-theme="dark"] .inv-settings-wrap [style*="color: #6b7280"] {
    color: #aebcd0 !important;
}
html[data-theme="dark"] .inv-settings-wrap [style*="border-top:1px solid #f3f4f6"],
html[data-theme="dark"] .inv-settings-wrap [style*="border-top: 1px solid #f3f4f6"] {
    border-top-color: #2b394d !important;
}
html[data-theme="dark"] .inv-settings-wrap [style*="background:#fff"],
html[data-theme="dark"] .inv-settings-wrap [style*="background: #fff"] {
    background: #151f30 !important;
    border-color: #3a4a61 !important;
}
html[data-theme="dark"] .inv-settings-wrap [style*="background:#f3f4f6"],
html[data-theme="dark"] .inv-settings-wrap [style*="background: #f3f4f6"] {
    background: #1a2638 !important;
    color: #d8e2ef !important;
    border-color: #3a4a61 !important;
}
html[data-theme="dark"] .inv-settings-wrap [style*="background:#fef3c7"],
html[data-theme="dark"] .inv-settings-wrap [style*="background: #fef3c7"] {
    background: #35280d !important;
    color: #f6c96a !important;
    border-color: #66501e !important;
}
html[data-theme="dark"] .inv-settings-wrap code {
    background: #0b1320 !important;
    color: #c4d4e9 !important;
    border-color: #34445b !important;
}
html[data-theme="dark"] .inv-settings-wrap table,
html[data-theme="dark"] .inv-settings-wrap td,
html[data-theme="dark"] .inv-settings-wrap th {
    color: #dce5f2 !important;
    border-color: #2b394d !important;
}

/* Invoice Settings title/subtitle are inline-styled outside .inv-settings-wrap. */
html[data-theme="dark"] .page-title-area h1 {
    color: #f8fafc !important;
}
html[data-theme="dark"] .page-title-area [style*="color:#6b7280"],
html[data-theme="dark"] .page-title-area [style*="color: #6b7280"] {
    color: #94a3b8 !important;
}

/* =====================================================
   1.1.15 - Global footer dark-mode correction
   The base application footer uses an explicit white background.
===================================================== */
html[data-theme="dark"] #perfex-footer {
    background: #0f1725 !important;
    color: #94a3b8 !important;
    border-top-color: #283548 !important;
}
html[data-theme="dark"] #perfex-footer a {
    color: #8ab4ff !important;
}
html[data-theme="dark"] #perfex-footer a:hover,
html[data-theme="dark"] #perfex-footer a:focus-visible {
    color: #b8d2ff !important;
}

/* --------------------------------------------------------------------------
   1.1.16 - Hub card hover correction
   Sales Center / Finance Center / Misc previously used inline mouseover JS.
   Updating element.style caused browsers to reserialize `background:#fff`,
   which made the legacy attribute-based dark selector stop matching and left
   cards permanently white. These cards now use stable classes only.
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .bh-hub-card {
    background: #111827 !important;
    border-color: #2b394d !important;
    color: #e5edf8 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .18) !important;
}

html[data-theme="dark"] .bh-hub-card:hover,
html[data-theme="dark"] .bh-hub-card:focus-visible {
    background: #151f30 !important;
    border-color: #42536d !important;
    color: #f8fafc !important;
    box-shadow: 0 12px 28px -14px rgba(0, 0, 0, .65) !important;
}

html[data-theme="dark"] .bh-hub-card-title {
    color: #f8fafc !important;
}

html[data-theme="dark"] .bh-hub-card-desc {
    color: #9fb0c6 !important;
}

html[data-theme="dark"] .bh-hub-card-stat {
    border-top-color: #29384d !important;
    color: var(--bh-hub-accent, #60a5fa) !important;
}

html[data-theme="dark"] .bh-hub-card-icon {
    background: color-mix(in srgb, var(--bh-hub-accent, #3b82f6) 16%, #111827) !important;
}


/* --------------------------------------------------------------------------
   1.1.17 - Legacy hub-card fallback
   This deliberately targets the exact old card signature so a cached legacy
   Sales/Finance Center template cannot turn white in dark mode even before the
   JavaScript compatibility repair upgrades it to .bh-hub-card.
   -------------------------------------------------------------------------- */
html[data-theme="dark"] #perfex-content a[style*="padding:22px"][style*="border-radius:14px"][style*="flex-direction:column"],
html[data-theme="dark"] #perfex-content a[style*="padding: 22px"][style*="border-radius: 14px"][style*="flex-direction: column"] {
    background: #111827 !important;
    border-color: #2b394d !important;
    color: #e5edf8 !important;
}
html[data-theme="dark"] #perfex-content a[style*="padding:22px"][style*="border-radius:14px"][style*="flex-direction:column"]:hover,
html[data-theme="dark"] #perfex-content a[style*="padding: 22px"][style*="border-radius: 14px"][style*="flex-direction: column"]:hover,
html[data-theme="dark"] #perfex-content a[style*="padding:22px"][style*="border-radius:14px"][style*="flex-direction:column"]:focus-visible,
html[data-theme="dark"] #perfex-content a[style*="padding: 22px"][style*="border-radius: 14px"][style*="flex-direction: column"]:focus-visible {
    background: #151f30 !important;
    border-color: #42536d !important;
    color: #f8fafc !important;
    box-shadow: 0 12px 28px -14px rgba(0,0,0,.65) !important;
}