/* ══════════════════════════════════════════════════════════════════════════
   OMAS Theme System — Light / Dark
   Single centralized source for all theme colors, sitewide. Loaded last so
   its [data-theme="dark"] overrides reliably win the cascade. Do not add
   theme-specific colors to individual module CSS files or inline <style>
   blocks — extend this file instead.

   How it works:
   - <html> carries data-theme="light" or data-theme="dark", set as early as
     possible (inline script in <head>, before first paint) by
     assets/js/omas-theme.js, from localStorage or prefers-color-scheme.
   - :root defines the light palette (also the fallback for any var() used
     without a theme attribute yet).
   - [data-theme="dark"] redefines the SAME variable names, so every
     existing component that already uses var(--text-primary),
     var(--bg-secondary), var(--border-color) etc. (most of style.css,
     layout.css, dashboard.css, data-table.css) picks up the dark palette
     automatically with zero further changes.
   - A second layer of --omas-* variables gives new/rewritten code a clear,
     purpose-named set to reach for (see the list in section 2).
   - A handful of components that use literal hex colors instead of
     var() (badges, icon buttons, notification categories, calendar) get
     explicit [data-theme="dark"] .class overrides below.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Existing sitewide variables — dark redefinition ─────────────────── */
:root {
    --success-soft: #e2f6d5;
    --danger-soft: #fbdcdd;
    --warning-soft: #fdf1cd;
}

[data-theme="dark"] {
    /* Brand / accent — brightened slightly so the same indigo identity
       stays legible on dark surfaces instead of reading muddy. */
    --primary-color: #7c6fef;
    --primary-dark: #6355e8;
    --primary-light: #a79cff;
    --primary-soft: rgba(124, 111, 239, 0.18);
    --secondary-color: #8b93a7;
    --accent-color: #f0a742;
    --accent-gold: #fcd34d;

    /* Semantic palette — brightened for contrast on dark surfaces */
    --success-color: #34d399;
    --success-deep: #6ee7b7;
    --danger-color: #f87171;
    --danger-deep: #fca5a5;
    --warning-color: #fbbf24;
    --warning-deep: #fcd34d;
    --info-color: #7c6fef;

    --success-soft: rgba(52, 211, 153, 0.16);
    --danger-soft: rgba(248, 113, 113, 0.16);
    --warning-soft: rgba(251, 191, 36, 0.16);

    /* Text — near-white with a faint lavender tint, never pure white */
    --text-primary: #f1f0fa;
    --text-secondary: #b7b3d6;
    --text-muted: #8783a6;

    /* Surface — layered dark, not flat black */
    --bg-primary: #1c1b30;
    --bg-secondary: #131226;
    --bg-tertiary: #262541;

    --border-color: #322f52;
    --border-dark: #423e6b;

    --shadow-sm: 0 1px 2px 0 rgba(0,0,0,0.35);
    --shadow-md: 0 4px 10px -1px rgba(0,0,0,0.4);
    --shadow-lg: 0 10px 24px -3px rgba(0,0,0,0.5);
}

/* ── 2. New purpose-named variables (the spec this project's dark-mode
   work should converge on going forward) — aliased to the palette above so
   there is exactly one source of truth per theme. ──────────────────────── */
:root {
    --omas-bg: var(--bg-secondary);
    --omas-surface: var(--bg-primary);
    --omas-surface-secondary: var(--bg-tertiary);
    --omas-text: var(--text-primary);
    --omas-text-muted: var(--text-secondary);
    --omas-border: var(--border-color);
    --omas-primary: var(--primary-color);
    --omas-primary-hover: var(--primary-dark);
    --omas-shadow: var(--shadow-md);
    --omas-input-bg: var(--bg-primary);
    --omas-table-header: var(--bg-secondary);
    --omas-table-row: var(--bg-primary);
    --omas-table-hover: var(--bg-tertiary);
    --omas-sidebar-bg: #2e2b8c;
    --omas-sidebar-text: rgba(255, 255, 255, 0.92);
    --omas-header-bg: var(--bg-primary);
    --omas-header-text: var(--text-primary);
    --omas-modal-bg: var(--bg-primary);
}

[data-theme="dark"] {
    --omas-sidebar-bg: #211f45;
    --omas-table-header: var(--bg-tertiary);
}

/* ── 3. Smooth, bounded theme transition ─────────────────────────────────
   Applied only for ~250ms around a theme switch (see omas-theme.js), not
   permanently, so it never fights or replaces any component's own hover/
   interaction transitions the rest of the time. */
.omas-theme-transitioning,
.omas-theme-transitioning * {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease,
                box-shadow 0.2s ease, fill 0.2s ease, stroke 0.2s ease !important;
}

@media (prefers-reduced-motion: reduce) {
    .omas-theme-transitioning,
    .omas-theme-transitioning * {
        transition: none !important;
    }
}

/* ── 4. Theme toggle button (topnav) ─────────────────────────────────────── */
.theme-toggle-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid transparent;
    background: none;
    color: var(--text-secondary);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.theme-toggle-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--primary-color);
}
.theme-toggle-btn:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}
.theme-toggle-btn .theme-toggle-icon {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transform: rotate(-90deg) scale(0.6);
    transition: opacity 0.25s ease, transform 0.35s cubic-bezier(.34,1.56,.64,1);
}
/* Icon communicates the action available, not the current state:
   in light mode the button offers "switch to dark" (moon), in dark mode
   it offers "switch to light" (sun). */
.theme-toggle-btn .theme-toggle-icon--moon { opacity: 1; transform: rotate(0deg) scale(1); }
[data-theme="dark"] .theme-toggle-btn .theme-toggle-icon--moon { opacity: 0; transform: rotate(90deg) scale(0.6); }
[data-theme="dark"] .theme-toggle-btn .theme-toggle-icon--sun { opacity: 1; transform: rotate(0deg) scale(1); }

/* ── 5. Sidebar — already a dark surface in both themes (deliberate,
   Linear-style dark product rail); only deepen it slightly in dark mode so
   it still reads as a distinct, lighter layer against the darker page. ─── */
[data-theme="dark"] .sidebar {
    background-color: var(--omas-sidebar-bg);
    border-right-color: rgba(255, 255, 255, 0.08);
}

/* ── 6. Dropdown / notification items, toast, modal ──────────────────────── */
[data-theme="dark"] .notification-item.unread {
    background-color: rgba(124, 111, 239, 0.14);
}
[data-theme="dark"] .notification-item.unread:hover {
    background-color: rgba(124, 111, 239, 0.22);
}
[data-theme="dark"] .notification-item:hover {
    background-color: var(--bg-tertiary);
}
[data-theme="dark"] .notif-dropdown-footer {
    border-top-color: var(--border-color);
}
[data-theme="dark"] .dropdown-header {
    border-bottom-color: var(--border-color);
}
[data-theme="dark"] .dropdown-item:hover {
    background-color: var(--bg-tertiary);
}
[data-theme="dark"] .dropdown-divider {
    background-color: var(--border-color);
}
[data-theme="dark"] .notif-badge {
    border-color: var(--bg-primary);
}
[data-theme="dark"] .modal-header,
[data-theme="dark"] .modal-footer {
    border-color: var(--border-color);
}

/* ── 7. omas-* table/component system (data-table.css) — literal hex
   values by design (a self-contained component library); themed here
   rather than converting every declaration to var(). ────────────────────── */
[data-theme="dark"] .omas-stat {
    background: var(--bg-primary);
    border-color: var(--border-color);
    box-shadow: var(--shadow-sm);
}
[data-theme="dark"] .omas-stat-label { color: var(--text-secondary); }
[data-theme="dark"] .omas-stat-value { color: var(--text-primary); }

[data-theme="dark"] .omas-card {
    background: var(--bg-primary);
    border-color: var(--border-color);
}

[data-theme="dark"] .omas-table thead th {
    background: var(--omas-table-header);
    color: var(--text-secondary);
    border-bottom-color: var(--border-color);
}
[data-theme="dark"] .omas-table tbody td {
    border-bottom-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .omas-table tbody tr:hover { background: var(--omas-table-hover); }
[data-theme="dark"] .omas-table tbody tr.selected { background: rgba(124, 111, 239, 0.14); }
[data-theme="dark"] .omas-table tbody tr.selected:hover { background: rgba(124, 111, 239, 0.22); }
[data-theme="dark"] .omas-name { color: var(--text-primary); }
[data-theme="dark"] .omas-sub { color: var(--text-muted); }

[data-theme="dark"] .omas-badge--success  { background: rgba(52, 211, 153, 0.16); color: #6ee7b7; }
[data-theme="dark"] .omas-badge--warning  { background: rgba(251, 191, 36, 0.16); color: #fcd34d; }
[data-theme="dark"] .omas-badge--danger   { background: rgba(248, 113, 113, 0.16); color: #fca5a5; }
[data-theme="dark"] .omas-badge--neutral  { background: var(--bg-tertiary); color: var(--text-secondary); }
[data-theme="dark"] .omas-badge--purple   { background: rgba(196, 181, 253, 0.18); color: #c4b5fd; }
[data-theme="dark"] .omas-badge--info     { background: rgba(125, 211, 252, 0.16); color: #7dd3fc; }

[data-theme="dark"] .omas-icon-btn { background: var(--bg-primary); border-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .omas-icon-btn--primary:hover { background: rgba(124, 111, 239, 0.16); border-color: var(--primary-color); }
[data-theme="dark"] .omas-icon-btn--info:hover    { background: rgba(125, 211, 252, 0.14); border-color: #7dd3fc; }
[data-theme="dark"] .omas-icon-btn--warning:hover { background: rgba(251, 191, 36, 0.14); border-color: #fbbf24; }
[data-theme="dark"] .omas-icon-btn--danger:hover  { background: rgba(248, 113, 113, 0.14); border-color: #f87171; }
[data-theme="dark"] .omas-icon-btn--success:hover { background: rgba(52, 211, 153, 0.14); border-color: #34d399; }

[data-theme="dark"] .omas-empty,
[data-theme="dark"] .omas-loading { color: var(--text-muted); }
[data-theme="dark"] .omas-loading-spinner { border-color: var(--bg-tertiary); border-top-color: var(--primary-color); }

[data-theme="dark"] .omas-pagination { border-top-color: var(--border-color); }
[data-theme="dark"] .omas-pagination-info,
[data-theme="dark"] .omas-per-page { color: var(--text-secondary); }
[data-theme="dark"] .omas-per-page select {
    background: var(--bg-primary); border-color: var(--border-color); color: var(--text-primary);
}
[data-theme="dark"] .omas-page-btn {
    background: var(--bg-primary); border-color: var(--border-color); color: var(--text-secondary);
}
[data-theme="dark"] .omas-page-btn:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .omas-page-btn.active { background: var(--primary-color); border-color: var(--primary-color); color: #fff; }
[data-theme="dark"] .omas-page-ellipsis { color: var(--text-muted); }

/* ── 9. dashboard.css calendar / lists ────────────────────────────────────── */
[data-theme="dark"] .calendar-day.today { color: #ffffff; }

/* ── 10. Scrollbars — dark surfaces get a lighter thumb, same geometry ──── */
[data-theme="dark"] ::-webkit-scrollbar-track { background: transparent; }
[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background-color: var(--border-dark);
    border-radius: 9999px;
}
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background-color: var(--text-muted); }
[data-theme="dark"] * { scrollbar-color: var(--border-dark) transparent; }

/* ── 11. Chart.js canvases — let the surrounding card's background show
   through instead of forcing a white rectangle behind the plot. ────────── */
[data-theme="dark"] canvas { background: transparent; }

/* ── 12. dashboard.php — inline .db-* component classes (literal hex by
   design, same pattern as the omas-* system above). The dashboard's own
   Chart.js instances read their colors live via chartTheme() in its
   <script>, driven by the same [data-theme] attribute. ─────────────────── */
[data-theme="dark"] .db-kpi { background: var(--bg-primary); border-color: var(--border-color); }
[data-theme="dark"] .db-kpi-label { color: var(--text-secondary); }
[data-theme="dark"] .db-kpi-note { color: var(--text-muted); }
[data-theme="dark"] .db-kpi-value--amber { color: #fcd34d; }

[data-theme="dark"] .db-card,
[data-theme="dark"] .db-revcard { background: var(--bg-primary); border-color: var(--border-color); }
[data-theme="dark"] .db-card-header { border-bottom-color: var(--border-color); }
[data-theme="dark"] .db-card-title,
[data-theme="dark"] .db-revcard-title { color: var(--text-primary); }
[data-theme="dark"] .db-revcard-subtitle { color: var(--text-muted); }

[data-theme="dark"] .db-type-badge { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .db-period-pill { background: var(--bg-primary); border-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .db-period-pill:hover { border-color: var(--primary-light); color: var(--primary-light); }
[data-theme="dark"] .db-period-pill.active { background: var(--primary-color); border-color: var(--primary-color); color: #fff; }

[data-theme="dark"] .db-donut-center-pct,
[data-theme="dark"] .db-smix-pct { color: var(--text-primary); }
[data-theme="dark"] .db-donut-center-label,
[data-theme="dark"] .db-smix-subtitle,
[data-theme="dark"] .db-smix-pct-label { color: var(--text-muted); }
[data-theme="dark"] .db-legend-name { color: var(--text-secondary); }
[data-theme="dark"] .db-legend-pct { color: var(--text-primary); }

[data-theme="dark"] .db-smix-badge { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .db-smix-row:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .db-smix-row.is-dominant { background: var(--primary-soft); }
[data-theme="dark"] .db-smix-row.is-dominant:hover { background: rgba(124,111,239,0.24); }
[data-theme="dark"] .db-smix-row-name { color: var(--text-secondary); }
[data-theme="dark"] .db-smix-row.is-dominant .db-smix-row-name { color: var(--primary-light); }
[data-theme="dark"] .db-smix-row.is-zero .db-smix-row-name { color: var(--text-muted); }
[data-theme="dark"] .db-smix-row-pct { color: var(--text-primary); }
[data-theme="dark"] .db-smix-row.is-zero .db-smix-row-pct { color: var(--text-muted); }
[data-theme="dark"] .db-smix-row-track { background: var(--bg-tertiary); }

[data-theme="dark"] .db-tbl thead th { color: var(--text-muted); background: var(--bg-tertiary); }
[data-theme="dark"] .db-tbl tbody tr { border-bottom-color: var(--border-color); }
[data-theme="dark"] .db-tbl tbody tr:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .db-tbl tbody td { color: var(--text-secondary); }

[data-theme="dark"] .db-person-name,
[data-theme="dark"] .db-event-title { color: var(--text-primary); }
[data-theme="dark"] .db-person-sub,
[data-theme="dark"] .db-event-time { color: var(--text-muted); }
[data-theme="dark"] .db-event { border-bottom-color: var(--border-color); }
[data-theme="dark"] .db-event-icon { background: var(--primary-soft); }

[data-theme="dark"] .db-pill--green  { background: rgba(52,211,153,0.16); color: #6ee7b7; }
[data-theme="dark"] .db-pill--amber  { background: rgba(251,191,36,0.16); color: #fcd34d; }
[data-theme="dark"] .db-pill--red    { background: rgba(248,113,113,0.16); color: #fca5a5; }
[data-theme="dark"] .db-pill--blue   { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .db-pill--purple { background: rgba(196,181,253,0.18); color: #c4b5fd; }
[data-theme="dark"] .db-pill--gray   { background: var(--bg-tertiary); color: var(--text-secondary); }

[data-theme="dark"] .db-leave-row { border-bottom-color: var(--border-color); }
[data-theme="dark"] .db-leave-row:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .db-leave-meta { color: var(--text-muted); }
[data-theme="dark"] .db-leave-meta strong { color: var(--text-secondary); }
[data-theme="dark"] .db-leave-days { background: var(--bg-tertiary); color: var(--text-secondary); }

[data-theme="dark"] .db-prog-label { color: var(--text-secondary); }
[data-theme="dark"] .db-prog-track { background: var(--bg-tertiary); }

[data-theme="dark"] .db-qaction { background: var(--bg-primary); border-color: var(--border-color); color: var(--text-primary); }
[data-theme="dark"] .db-qaction:hover { color: var(--text-primary); box-shadow: 0 10px 22px rgba(0,0,0,0.35); }

[data-theme="dark"] .db-divider-title { color: var(--text-primary); }
[data-theme="dark"] .db-divider-line { background: var(--border-color); }

[data-theme="dark"] .db-empty { color: var(--text-muted); }

/* ── 13. secretariat.css (.sec-*) ─────────────────────────────────────────── */
[data-theme="dark"] .sec-page .card {
    border-color: var(--border-color);
    box-shadow: var(--shadow-sm);
}
[data-theme="dark"] .sec-page .card-header {
    background: var(--bg-primary);
    border-bottom-color: var(--border-color);
}

[data-theme="dark"] .sec-page .btn-outline-secondary,
[data-theme="dark"] .sec-page .btn-outline-primary,
[data-theme="dark"] .sec-page .btn-outline-danger,
[data-theme="dark"] .sec-page .btn-outline-success {
    background: var(--bg-primary);
    border-color: var(--border-color);
    color: var(--text-secondary);
}
[data-theme="dark"] .sec-page .btn-outline-secondary:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .sec-page .btn-outline-primary { color: var(--primary-light); border-color: var(--border-dark); }
[data-theme="dark"] .sec-page .btn-outline-primary:hover { background: var(--primary-soft); }
[data-theme="dark"] .sec-page .btn-outline-danger { color: #fca5a5; border-color: rgba(248,113,113,0.35); }
[data-theme="dark"] .sec-page .btn-outline-danger:hover { background: rgba(248,113,113,0.14); }
[data-theme="dark"] .sec-page .btn-outline-success { color: #6ee7b7; border-color: rgba(52,211,153,0.35); }
[data-theme="dark"] .sec-page .btn-outline-success:hover { background: rgba(52,211,153,0.14); }

[data-theme="dark"] .sec-kpi {
    background: var(--bg-primary);
    border-color: var(--border-color);
    box-shadow: var(--shadow-sm);
}
[data-theme="dark"] .sec-kpi:hover { box-shadow: var(--shadow-lg); }
[data-theme="dark"] .sec-kpi-label { color: var(--text-secondary); }
[data-theme="dark"] .sec-kpi-value { color: var(--text-primary); }

[data-theme="dark"] .sec-quicklink {
    background: var(--bg-primary);
    border-color: var(--border-color);
    box-shadow: var(--shadow-sm);
}
[data-theme="dark"] .sec-quicklink:hover { box-shadow: var(--shadow-lg); }
[data-theme="dark"] .sec-quicklink-icon { background: var(--primary-color); }
[data-theme="dark"] .sec-quicklink-title { color: var(--text-primary); }
[data-theme="dark"] .sec-quicklink-desc { color: var(--text-muted); }

[data-theme="dark"] .sec-entity-chip { background: var(--bg-primary); border-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .sec-entity-chip:hover { border-color: var(--primary-color); background: var(--primary-soft); color: var(--primary-light); }

[data-theme="dark"] .sec-status-pill { background: var(--bg-primary); border-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .sec-status-pill:hover { border-color: var(--primary-color); background: var(--primary-soft); }

[data-theme="dark"] .sec-filter-select,
[data-theme="dark"] input.sec-filter-select {
    background: var(--bg-primary);
    border-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .sec-filter-select:focus,
[data-theme="dark"] input.sec-filter-select:focus { outline-color: var(--primary-light); }

[data-theme="dark"] .sec-page .task-tabs,
[data-theme="dark"] .sec-tabs {
    background: var(--bg-tertiary);
    border-color: var(--border-color);
}
[data-theme="dark"] .sec-tab { color: var(--text-secondary); }
[data-theme="dark"] .sec-tab:hover { color: var(--text-primary); }
[data-theme="dark"] .sec-tab.active {
    background: var(--bg-primary);
    color: var(--primary-light);
    box-shadow: var(--shadow-sm);
}

[data-theme="dark"] .sec-table-wrap { border-color: var(--border-color); }
[data-theme="dark"] .sec-table thead th {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
    border-bottom-color: var(--border-color);
}
[data-theme="dark"] .sec-table tbody td {
    border-bottom-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .sec-table tbody tr:hover { background: var(--bg-tertiary); }

[data-theme="dark"] .sec-icon-btn {
    background: var(--bg-primary);
    border-color: var(--border-color);
    color: var(--text-secondary);
}
[data-theme="dark"] .sec-icon-btn:hover { box-shadow: var(--shadow-md); }
[data-theme="dark"] .sec-icon-btn--edit { color: var(--primary-light); }
[data-theme="dark"] .sec-icon-btn--edit:hover { background: var(--primary-soft); border-color: var(--border-dark); color: var(--primary-light); }
[data-theme="dark"] .sec-icon-btn--pdf { color: #fca5a5; }
[data-theme="dark"] .sec-icon-btn--pdf:hover { background: rgba(248,113,113,0.14); border-color: rgba(248,113,113,0.35); color: #fca5a5; }
[data-theme="dark"] .sec-icon-btn--excel { color: #6ee7b7; }
[data-theme="dark"] .sec-icon-btn--excel:hover { background: rgba(52,211,153,0.14); border-color: rgba(52,211,153,0.35); color: #6ee7b7; }
[data-theme="dark"] .sec-icon-btn--delete { color: var(--text-muted); }
[data-theme="dark"] .sec-icon-btn--delete:hover { background: rgba(248,113,113,0.14); border-color: rgba(248,113,113,0.35); color: #fca5a5; }

[data-theme="dark"] .sec-empty { color: var(--text-muted); }
[data-theme="dark"] .sec-approvals-search { color: var(--text-muted); }

[data-theme="dark"] .sec-approval-card {
    background: var(--bg-primary);
    border-color: var(--border-color);
    box-shadow: var(--shadow-sm);
}
[data-theme="dark"] .sec-approval-card:hover { box-shadow: var(--shadow-lg); }
[data-theme="dark"] .sec-approval-info h4 { color: var(--text-primary); }
[data-theme="dark"] .sec-approval-code { color: var(--text-muted); }
[data-theme="dark"] .sec-wait-chip { background: var(--bg-tertiary); color: var(--text-secondary); }
[data-theme="dark"] .sec-wait-chip.overdue { background: #f87171; color: #1c1b30; }
[data-theme="dark"] .sec-approval-meta { color: var(--text-secondary); }
[data-theme="dark"] .sec-stat-num { color: var(--primary-light); }
[data-theme="dark"] .sec-stat-lbl { color: var(--text-secondary); }

[data-theme="dark"] .sec-tracker-card.missing  { background: rgba(248,113,113,0.12); border-color: rgba(248,113,113,0.3); }
[data-theme="dark"] .sec-tracker-card.late     { background: rgba(251,191,36,0.12); border-color: rgba(251,191,36,0.3); }
[data-theme="dark"] .sec-tracker-card.pending  { background: rgba(251,191,36,0.1); border-color: rgba(251,191,36,0.25); }
[data-theme="dark"] .sec-tracker-card.rejected { background: rgba(248,113,113,0.14); border-color: rgba(248,113,113,0.35); }
[data-theme="dark"] .sec-tracker-card.ok       { background: rgba(52,211,153,0.12); border-color: rgba(52,211,153,0.3); }
[data-theme="dark"] .sec-tracker-lbl { color: var(--text-primary); }
[data-theme="dark"] .missing .sec-tracker-num  { color: #fca5a5; }
[data-theme="dark"] .late    .sec-tracker-num  { color: #fcd34d; }
[data-theme="dark"] .pending .sec-tracker-num  { color: #fcd34d; }
[data-theme="dark"] .rejected .sec-tracker-num { color: #fca5a5; }
[data-theme="dark"] .ok      .sec-tracker-num  { color: #6ee7b7; }
[data-theme="dark"] .missing .sec-entity-list li  { background: rgba(248,113,113,0.16); }
[data-theme="dark"] .late    .sec-entity-list li  { background: rgba(251,191,36,0.16); }
[data-theme="dark"] .pending .sec-entity-list li  { background: rgba(251,191,36,0.14); }
[data-theme="dark"] .rejected .sec-entity-list li { background: rgba(248,113,113,0.18); }

[data-theme="dark"] .sec-cons-period { background: var(--bg-tertiary); color: var(--text-primary); }
[data-theme="dark"] .sec-cons-table-wrap { border-color: var(--border-dark); }
[data-theme="dark"] .sec-cons-table th { background: var(--primary-soft); color: var(--primary-light); border-bottom-color: var(--border-color); }
[data-theme="dark"] .sec-cons-table td { border-bottom-color: var(--border-color); color: var(--text-primary); }
[data-theme="dark"] .sec-cons-total-row td { background: rgba(251,191,36,0.14); border-top-color: #fbbf24; }
[data-theme="dark"] .sec-net-pos { color: #6ee7b7; }
[data-theme="dark"] .sec-net-neg { color: #fca5a5; }

[data-theme="dark"] .sec-cons-chevron-btn { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .sec-cons-chevron-btn:hover { background: rgba(124,111,239,0.28); }
[data-theme="dark"] .sec-cons-district-row td { border-bottom-color: var(--border-color); }
[data-theme="dark"] .sec-cons-district-wrap { background: var(--bg-tertiary); }
[data-theme="dark"] .sec-cons-district-table {
    background: var(--bg-primary);
    border-color: var(--border-color);
}
[data-theme="dark"] .sec-cons-district-table th { background: var(--bg-tertiary); color: var(--text-secondary); }
[data-theme="dark"] .sec-cons-district-table td { border-bottom-color: var(--border-color); color: var(--text-primary); }

[data-theme="dark"] .sec-progress-track { background: var(--bg-tertiary); }

[data-theme="dark"] .sec-settings-section h3 { color: var(--primary-light); border-bottom-color: var(--border-dark); }
[data-theme="dark"] .sec-toggle-slider { background: var(--border-dark); }
[data-theme="dark"] .sec-toggle-slider::before { background: var(--text-primary); }
[data-theme="dark"] .sec-toggle-switch input:checked + .sec-toggle-slider { background: #34d399; }

[data-theme="dark"] .sec-rpt-meta { color: var(--text-secondary); }
[data-theme="dark"] .sec-wf-timeline { border-color: var(--border-color); }
[data-theme="dark"] .sec-wf-step { background: var(--bg-tertiary); border-right-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .sec-wf-step.done   { background: rgba(52,211,153,0.16); color: #6ee7b7; }
[data-theme="dark"] .sec-wf-step.active { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .sec-wf-step.fail   { background: rgba(248,113,113,0.16); color: #fca5a5; }

[data-theme="dark"] .sec-readonly-notice,
[data-theme="dark"] .sec-readonly-notice--warning { background: rgba(251,191,36,0.14); border-color: rgba(251,191,36,0.35); color: #fcd34d; }
[data-theme="dark"] .sec-readonly-notice--danger { background: rgba(248,113,113,0.14); border-color: rgba(248,113,113,0.35); color: #fca5a5; }
[data-theme="dark"] .sec-readonly-notice--info { background: var(--primary-soft); border-color: rgba(124,111,239,0.35); color: var(--primary-light); }

[data-theme="dark"] .sec-spr-wrap { border-color: var(--primary-color); }
[data-theme="dark"] .sec-spr-table th,
[data-theme="dark"] .sec-spr-table td { border-color: var(--border-color); }
[data-theme="dark"] .sec-spr-table .th-section { background: var(--bg-tertiary); color: var(--text-primary); }
[data-theme="dark"] .sec-spr-table .th-group { background: var(--primary-dark); color: var(--text-primary); }
[data-theme="dark"] .sec-spr-table .th-col { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .sec-spr-table .td-name { background: var(--bg-tertiary); color: var(--text-primary); }
[data-theme="dark"] .sec-spr-inp { color: var(--text-primary); }
[data-theme="dark"] .sec-spr-inp:focus { outline-color: var(--primary-light); background: var(--primary-soft); }
[data-theme="dark"] .sec-spr-calc { background: rgba(52,211,153,0.14); color: #6ee7b7; }
[data-theme="dark"] .sec-spr-total td { background: rgba(251,191,36,0.14); border-top-color: #fbbf24; }
[data-theme="dark"] .sec-spr-total .td-name { background: rgba(251,191,36,0.14); }
[data-theme="dark"] .sec-td-actions { background: var(--bg-tertiary); }
[data-theme="dark"] .sec-btn-del-row:hover { background: rgba(248,113,113,0.16); }
[data-theme="dark"] .sec-btn-add-row { background: var(--primary-soft); border-color: var(--border-dark); color: var(--primary-light); }
[data-theme="dark"] .sec-btn-add-row:hover { background: rgba(124,111,239,0.28); }

/* ── 14. employees.php (.emp-*) — overrides live only here; employees.php
   itself is never edited, it stays the untouched master reference. ─────── */
[data-theme="dark"] .emp-stat {
    background: var(--bg-primary);
    border-color: var(--border-color);
    box-shadow: var(--shadow-sm);
}
[data-theme="dark"] .emp-stat:hover { box-shadow: var(--shadow-lg); }
[data-theme="dark"] .emp-stat-label { color: var(--text-secondary); }
[data-theme="dark"] .emp-stat-value { color: var(--text-primary); }

[data-theme="dark"] .emp-card {
    background: var(--bg-primary);
    border-color: var(--border-color);
    box-shadow: var(--shadow-sm);
}

[data-theme="dark"] .emp-table thead th {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
    border-bottom-color: var(--border-color);
}
[data-theme="dark"] .emp-table tbody td {
    border-bottom-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .emp-table tbody tr:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .emp-avatar { background: var(--primary-color); }
[data-theme="dark"] .emp-name { color: var(--text-primary); }
[data-theme="dark"] .emp-sub { color: var(--text-muted); }

[data-theme="dark"] .emp-badge--active     { background: rgba(52,211,153,0.16); color: #6ee7b7; }
[data-theme="dark"] .emp-badge--leave      { background: rgba(251,191,36,0.16); color: #fcd34d; }
[data-theme="dark"] .emp-badge--suspended  { background: rgba(248,113,113,0.16); color: #fca5a5; }
[data-theme="dark"] .emp-badge--terminated { background: var(--bg-tertiary); color: var(--text-secondary); }
[data-theme="dark"] .emp-badge--retired    { background: rgba(196,181,253,0.18); color: #c4b5fd; }

[data-theme="dark"] .emp-icon-btn { background: var(--bg-primary); border-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .emp-icon-btn:hover { box-shadow: var(--shadow-md); }
[data-theme="dark"] .emp-icon-btn--view { color: var(--primary-light); }
[data-theme="dark"] .emp-icon-btn--view:hover { background: var(--primary-soft); border-color: var(--border-dark); }
[data-theme="dark"] .emp-icon-btn--jd { color: #7dd3fc; }
[data-theme="dark"] .emp-icon-btn--jd:hover { background: rgba(125,211,252,0.14); border-color: rgba(125,211,252,0.35); }
[data-theme="dark"] .emp-icon-btn--edit { color: #fcd34d; }
[data-theme="dark"] .emp-icon-btn--edit:hover { background: rgba(251,191,36,0.14); border-color: rgba(251,191,36,0.35); }
[data-theme="dark"] .emp-empty { color: var(--text-muted); }

[data-theme="dark"] .emp-pagination { border-top-color: var(--border-color); }
[data-theme="dark"] .emp-pagination-info,
[data-theme="dark"] .emp-per-page { color: var(--text-secondary); }
[data-theme="dark"] .emp-per-page select { background: var(--bg-primary); border-color: var(--border-color); color: var(--text-primary); }
[data-theme="dark"] .emp-page-btn { background: var(--bg-primary); border-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .emp-page-btn:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .emp-page-btn.active { background: var(--primary-color); border-color: var(--primary-color); color: #fff; }
[data-theme="dark"] .emp-page-ellipsis { color: var(--text-muted); }

/* ── 15. accounts.php (.acc-*) ────────────────────────────────────────────── */
[data-theme="dark"] .acc-tabs { border-bottom-color: var(--border-color); }
[data-theme="dark"] .acc-tab { color: var(--text-secondary); }
[data-theme="dark"] .acc-tab:hover { color: var(--primary-color); background: var(--bg-tertiary); }
[data-theme="dark"] .acc-tab.active { color: var(--primary-color); border-bottom-color: var(--primary-color); background: var(--primary-soft); }
[data-theme="dark"] .acc-tab .tab-badge { background: var(--danger-color); box-shadow: 0 1px 3px rgba(248,113,113,.4); }

[data-theme="dark"] .acc-card {
    background: var(--bg-primary);
    border-color: var(--border-color);
    box-shadow: var(--shadow-sm);
}
[data-theme="dark"] .acc-card:hover { box-shadow: 0 6px 16px rgba(0,0,0,.35); }
[data-theme="dark"] .acc-card.blue::before,
[data-theme="dark"] .acc-card.blue .acc-card-icon   { background: var(--primary-color); }
[data-theme="dark"] .acc-card.red::before,
[data-theme="dark"] .acc-card.red .acc-card-icon    { background: var(--danger-color); }
[data-theme="dark"] .acc-card.green::before,
[data-theme="dark"] .acc-card.green .acc-card-icon  { background: var(--success-color); }
[data-theme="dark"] .acc-card.orange::before,
[data-theme="dark"] .acc-card.orange .acc-card-icon { background: var(--warning-color); }
[data-theme="dark"] .acc-card-label { color: var(--text-secondary); }
[data-theme="dark"] .acc-card-value { color: var(--text-primary); }
[data-theme="dark"] .acc-card-sub { color: var(--text-muted); }

[data-theme="dark"] .acc-procurement-card {
    background: var(--bg-primary);
    border-color: var(--border-color);
    box-shadow: var(--shadow-sm);
}
[data-theme="dark"] .acc-procurement-label,
[data-theme="dark"] .acc-procurement-note { color: var(--text-secondary); }
[data-theme="dark"] .acc-procurement-value { color: var(--text-primary); }

[data-theme="dark"] .stmt-popup,
[data-theme="dark"] .acc-modal { background: rgba(0,0,0,.65); }
[data-theme="dark"] .stmt-content,
[data-theme="dark"] .acc-modal-body {
    background: var(--bg-primary);
    box-shadow: 0 20px 50px rgba(0,0,0,.5);
}
[data-theme="dark"] .stmt-close,
[data-theme="dark"] .acc-modal-close { background: var(--bg-tertiary); color: var(--text-secondary); }
[data-theme="dark"] .stmt-close:hover,
[data-theme="dark"] .acc-modal-close:hover { background: var(--border-color); color: var(--text-primary); }
[data-theme="dark"] .stmt-header { border-bottom-color: var(--primary-color); }
[data-theme="dark"] .stmt-header h2 { color: var(--primary-color); }

[data-theme="dark"] .budget-chip { background: var(--primary-soft); color: var(--primary-light); }

/* ── 16. job-assignments.css + job-description.php ───────────────────────── */
[data-theme="dark"] .jobs-kpi { background: var(--bg-primary); border-color: var(--border-color); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .jobs-kpi:hover { box-shadow: var(--shadow-lg); }
[data-theme="dark"] .jobs-kpi--blue::after,
[data-theme="dark"] .jobs-kpi--blue .jobs-kpi-icon { background: var(--primary-color); }
[data-theme="dark"] .jobs-kpi--amber::after,
[data-theme="dark"] .jobs-kpi--amber .jobs-kpi-icon { background: var(--warning-color); }
[data-theme="dark"] .jobs-kpi--purple::after,
[data-theme="dark"] .jobs-kpi--purple .jobs-kpi-icon { background: #8b5cf6; }
[data-theme="dark"] .jobs-kpi--green::after,
[data-theme="dark"] .jobs-kpi--green .jobs-kpi-icon { background: var(--success-color); }
[data-theme="dark"] .jobs-kpi-label { color: var(--text-secondary); }
[data-theme="dark"] .jobs-kpi-value { color: var(--text-primary); }

[data-theme="dark"] .jobs-page .card { border-color: var(--border-color); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .jobs-page .card-header { background: var(--bg-primary); border-bottom-color: var(--border-color); }
[data-theme="dark"] .jobs-page .card-header h3 { color: var(--text-primary); }

[data-theme="dark"] .jobs-page .table-container { border-color: var(--border-color); }
[data-theme="dark"] .jobs-page .table-container table.table thead th {
    background: var(--bg-tertiary); color: var(--text-secondary); border-bottom-color: var(--border-color);
}
[data-theme="dark"] .jobs-page .table-container table.table tbody tr:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .jobs-page .table-container table.table tbody tr:not(:last-child) td { border-bottom-color: var(--border-color); }
[data-theme="dark"] .jobs-page .table-container table.table td.text-center.text-muted { color: var(--text-muted); }
[data-theme="dark"] .jobs-page .table-container table.table td strong { color: var(--text-primary); }
[data-theme="dark"] .jobs-page .table-container table.table td .update-note { color: var(--text-muted); }
[data-theme="dark"] .jobs-readmore { color: var(--primary-light); }

[data-theme="dark"] .jobs-detail-section { border-bottom-color: var(--border-color); }
[data-theme="dark"] .jobs-detail-section h4 { color: var(--text-primary); }
[data-theme="dark"] .jobs-detail-label { color: var(--text-secondary); }
[data-theme="dark"] .jobs-detail-value { color: var(--text-primary); }
[data-theme="dark"] .jobs-update-item { border-bottom-color: var(--border-color); }

[data-theme="dark"] .task-tabs { background: var(--bg-tertiary); border-color: var(--border-color); }
[data-theme="dark"] .task-tab { color: var(--text-secondary); }
[data-theme="dark"] .task-tab:hover { color: var(--text-primary); }
[data-theme="dark"] .task-tab.active { background: var(--bg-primary); color: var(--primary-color); box-shadow: var(--shadow-sm); }

[data-theme="dark"] .progress-track,
[data-theme="dark"] .subtask-kanban-progress { background: var(--bg-tertiary); }
[data-theme="dark"] .progress-fill,
[data-theme="dark"] .subtask-kanban-progress div { background: var(--primary-color); }

[data-theme="dark"] .performance-good  { background: rgba(52, 211, 153, 0.16); color: #6ee7b7; }
[data-theme="dark"] .performance-medium { background: rgba(251, 191, 36, 0.16); color: #fcd34d; }
[data-theme="dark"] .performance-low   { background: rgba(248, 113, 113, 0.16); color: #fca5a5; }

[data-theme="dark"] .subtask-kanban-col { background: var(--bg-tertiary); }
[data-theme="dark"] .subtask-kanban-col-title { color: var(--text-primary); }
[data-theme="dark"] .subtask-kanban-card { background: var(--bg-primary); border-color: var(--border-color); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .subtask-kanban-card-title { color: var(--text-primary); }
[data-theme="dark"] .subtask-agenda-day { border-bottom-color: var(--border-color); }
[data-theme="dark"] .subtask-agenda-date { color: var(--text-primary); }

[data-theme="dark"] .job-card { background: var(--bg-primary); border-color: var(--border-color); }
[data-theme="dark"] .job-empty { background: var(--bg-secondary); border-color: var(--border-color); color: var(--text-muted); }
[data-theme="dark"] .job-pill { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .job-summary-item { background: var(--bg-tertiary); }

/* ── 17. performance-shared.css ───────────────────────────────────────────── */
[data-theme="dark"] .pm-welcome { background: var(--primary-color); }

[data-theme="dark"] .pm-kpi { background: var(--bg-primary); border-color: var(--border-color); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .pm-kpi:hover { box-shadow: var(--shadow-lg); }
[data-theme="dark"] .pm-kpi-label { color: var(--text-secondary); }
[data-theme="dark"] .pm-kpi--blue::after,   [data-theme="dark"] .pm-kpi-icon--blue   { background: var(--primary-color); }
[data-theme="dark"] .pm-kpi--amber::after,  [data-theme="dark"] .pm-kpi-icon--amber  { background: var(--warning-color); }
[data-theme="dark"] .pm-kpi--green::after,  [data-theme="dark"] .pm-kpi-icon--green  { background: var(--success-color); }
[data-theme="dark"] .pm-kpi--red::after,    [data-theme="dark"] .pm-kpi-icon--red    { background: var(--danger-color); }
[data-theme="dark"] .pm-kpi--purple::after, [data-theme="dark"] .pm-kpi-icon--purple { background: #8b5cf6; }
[data-theme="dark"] .pm-kpi--teal::after,   [data-theme="dark"] .pm-kpi-icon--teal   { background: #2dd4bf; }
[data-theme="dark"] .pm-kpi-value--blue   { color: var(--primary-light); }
[data-theme="dark"] .pm-kpi-value--amber  { color: #fcd34d; }
[data-theme="dark"] .pm-kpi-value--green  { color: #6ee7b7; }
[data-theme="dark"] .pm-kpi-value--red    { color: #fca5a5; }
[data-theme="dark"] .pm-kpi-value--purple { color: #c4b5fd; }
[data-theme="dark"] .pm-kpi-value--teal   { color: #5eead4; }

[data-theme="dark"] .pm-card { background: var(--bg-primary); border-color: var(--border-color); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .pm-card-header { border-bottom-color: var(--border-color); }
[data-theme="dark"] .pm-card-title { color: var(--text-primary); }

[data-theme="dark"] .pm-tbl thead th { color: var(--text-muted); background: var(--bg-tertiary); border-bottom-color: var(--border-color); }
[data-theme="dark"] .pm-tbl tbody tr { border-bottom-color: var(--border-color); }
[data-theme="dark"] .pm-tbl tbody tr:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .pm-tbl tbody td { color: var(--text-secondary); }

[data-theme="dark"] .pm-person-name { color: var(--text-primary); }
[data-theme="dark"] .pm-person-sub { color: var(--text-muted); }

[data-theme="dark"] .pm-pill--green  { background: rgba(52, 211, 153, 0.16); color: #6ee7b7; }
[data-theme="dark"] .pm-pill--amber  { background: rgba(251, 191, 36, 0.16); color: #fcd34d; }
[data-theme="dark"] .pm-pill--red    { background: rgba(248, 113, 113, 0.16); color: #fca5a5; }
[data-theme="dark"] .pm-pill--blue   { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .pm-pill--purple { background: rgba(196, 181, 253, 0.18); color: #c4b5fd; }
[data-theme="dark"] .pm-pill--gray   { background: var(--bg-tertiary); color: var(--text-secondary); }

[data-theme="dark"] .pm-prog-label { color: var(--text-secondary); }
[data-theme="dark"] .pm-prog-track { background: var(--bg-tertiary); }

[data-theme="dark"] .pm-event { border-bottom-color: var(--border-color); }
[data-theme="dark"] .pm-event-icon { background: var(--primary-soft); }
[data-theme="dark"] .pm-event-title { color: var(--text-primary); }
[data-theme="dark"] .pm-event-time { color: var(--text-muted); }

[data-theme="dark"] .pm-divider-title { color: var(--text-primary); }
[data-theme="dark"] .pm-divider-line { background: var(--border-color); }
[data-theme="dark"] .pm-empty { color: var(--text-muted); }

[data-theme="dark"] .pmeval-score-title,
[data-theme="dark"] .pmgoals-section-title { color: var(--text-primary); }
[data-theme="dark"] .pmeval-score-row { background: var(--bg-tertiary); border-color: var(--border-color); }
[data-theme="dark"] .pmeval-score-criterion { color: var(--text-secondary); }
[data-theme="dark"] .pmeval-score-criterion em { color: var(--text-muted); }

/* ── 18. calendar.css ─────────────────────────────────────────────────────── */
[data-theme="dark"] .cal-kpi { background: var(--bg-primary); border-color: var(--border-color); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .cal-kpi:hover { box-shadow: var(--shadow-lg); }
[data-theme="dark"] .cal-kpi--blue::after,   [data-theme="dark"] .cal-kpi-icon--blue   { background: var(--primary-color); }
[data-theme="dark"] .cal-kpi--purple::after, [data-theme="dark"] .cal-kpi-icon--purple { background: #8b5cf6; }
[data-theme="dark"] .cal-kpi--amber::after,  [data-theme="dark"] .cal-kpi-icon--amber  { background: var(--warning-color); }
[data-theme="dark"] .cal-kpi--green::after,  [data-theme="dark"] .cal-kpi-icon--green  { background: var(--success-color); }
[data-theme="dark"] .cal-kpi-label { color: var(--text-secondary); }
[data-theme="dark"] .cal-kpi-value { color: var(--text-primary); }

[data-theme="dark"] .cal-view-toggle { background: var(--bg-tertiary); border-color: var(--border-color); }
[data-theme="dark"] .cal-view-toggle .btn { color: var(--text-secondary); }
[data-theme="dark"] .cal-view-toggle .btn:hover { color: var(--text-primary); }
[data-theme="dark"] .cal-view-toggle .btn.active { background: var(--bg-primary); color: var(--primary-color); box-shadow: var(--shadow-sm); }

[data-theme="dark"] .cal-page .card { border-color: var(--border-color); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .cal-page .card-header { background: var(--bg-primary); border-bottom-color: var(--border-color); }

[data-theme="dark"] .calendar-grid-wrap { border-color: var(--border-color); background: var(--bg-primary); }
[data-theme="dark"] .calendar-weekdays div { background: var(--bg-tertiary); border-bottom-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .calendar-day { border-right-color: var(--border-color); border-bottom-color: var(--border-color); background: var(--bg-primary); }
[data-theme="dark"] .calendar-day:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .calendar-day.other-month { background: var(--bg-secondary); color: var(--text-muted); }
[data-theme="dark"] .calendar-day.selected { outline-color: var(--primary-color); background: var(--primary-soft); }
[data-theme="dark"] .calendar-day.today .calendar-day-number { background: var(--primary-color); color: #fff; }

[data-theme="dark"] .calendar-stat { background: var(--bg-tertiary); border-color: var(--border-color); }
[data-theme="dark"] .calendar-stat .label { color: var(--text-secondary); }

[data-theme="dark"] .calendar-event-card { border-color: var(--border-color); background: var(--bg-primary); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .calendar-event-card:hover { box-shadow: var(--shadow-md); }
[data-theme="dark"] .calendar-pill { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .calendar-pill.itinerary { background: rgba(196, 181, 253, 0.18); color: #c4b5fd; }
[data-theme="dark"] .calendar-empty { border-color: var(--border-dark); background: var(--bg-tertiary); color: var(--text-muted); }

[data-theme="dark"] .year-month-card { border-color: var(--border-color); background: var(--bg-primary); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .year-month-card:hover { box-shadow: var(--shadow-lg); border-color: var(--primary-light); }
[data-theme="dark"] .year-month-header { color: var(--text-primary); }
[data-theme="dark"] .year-mini-weekdays span { color: var(--text-muted); }
[data-theme="dark"] .year-mini-day { color: var(--text-secondary); }
[data-theme="dark"] .year-mini-day.has-event { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .year-mini-day.today { outline-color: var(--primary-color); }
[data-theme="dark"] .year-mini-day.selected { background: var(--primary-soft); }
[data-theme="dark"] .year-mini-day .dot { background: #a78bfa; }

[data-theme="dark"] .itinerary-item { border-color: var(--border-color); background: var(--bg-primary); }
[data-theme="dark"] .itinerary-item:hover { box-shadow: var(--shadow-md); }

/* ── 19. payroll.css ──────────────────────────────────────────────────────── */
[data-theme="dark"] .payroll-page { background: var(--bg-secondary); }
[data-theme="dark"] .payroll-header { background: var(--bg-primary); }
[data-theme="dark"] .form-select-sm { background: var(--bg-primary); color: var(--text-primary); border-color: var(--border-color); }
[data-theme="dark"] .payroll-summary { background: var(--bg-secondary); }
[data-theme="dark"] .summary-card { background: var(--bg-primary); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .summary-card:hover { box-shadow: var(--shadow-md); }
[data-theme="dark"] .summary-card--indigo { --summary-accent: var(--primary-color); }
[data-theme="dark"] .summary-card--blue   { --summary-accent: #60a5fa; }
[data-theme="dark"] .summary-card--red    { --summary-accent: var(--danger-color); }
[data-theme="dark"] .summary-card--green  { --summary-accent: var(--success-color); }

[data-theme="dark"] .sheet-tabs { background: var(--bg-tertiary); }
[data-theme="dark"] .sheet-tab { background: var(--bg-primary); }
[data-theme="dark"] .sheet-tab.active { background: var(--bg-secondary); }
[data-theme="dark"] .sheet-tab:hover:not(.active) { background: var(--border-color); }

[data-theme="dark"] .payroll-table-container { background: var(--bg-primary); }
[data-theme="dark"] .payroll-table thead,
[data-theme="dark"] .payroll-table th { background: var(--omas-table-header); }
[data-theme="dark"] .payroll-table td { border-color: var(--border-color); }
[data-theme="dark"] .payroll-table tbody tr:hover { background: var(--bg-tertiary); }

[data-theme="dark"] .payroll-table td[contenteditable="true"] { background: var(--bg-primary); }
[data-theme="dark"] .payroll-table td[contenteditable="true"]:hover {
    background: rgba(251, 191, 36, 0.12);
    outline-color: var(--warning-color);
}
[data-theme="dark"] .payroll-table td[contenteditable="true"]:focus {
    background: var(--primary-soft);
    outline-color: var(--primary-color);
}
[data-theme="dark"] .payroll-table td.calculated {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}
[data-theme="dark"] .payroll-table td.net-pay {
    background: var(--success-soft);
    color: var(--success-color);
}

/* ── 20. payroll.php (inline <style>) ────────────────────────────────────── */
[data-theme="dark"] .payroll-container { background: var(--bg-primary); }
[data-theme="dark"] .month-selector select { border-color: var(--border-color); background: var(--bg-primary); color: var(--text-primary); }
[data-theme="dark"] .review-note { background: var(--warning-soft); color: var(--warning-deep); border-left-color: var(--warning-color); }
[data-theme="dark"] .review-meta { color: var(--text-secondary); }
[data-theme="dark"] .tabs { border-bottom-color: var(--border-color); }
[data-theme="dark"] .tab { color: var(--text-secondary); }
[data-theme="dark"] .tab.active,
[data-theme="dark"] .tab:hover { color: var(--primary-color); }
[data-theme="dark"] .tab.active { border-bottom-color: var(--primary-color); }
[data-theme="dark"] .table-container { border-color: var(--border-color); }
[data-theme="dark"] .payroll-table th,
[data-theme="dark"] .payroll-table td { border-color: var(--border-color); }
[data-theme="dark"] .payroll-table th { background: var(--primary-color); }
[data-theme="dark"] .payroll-table tbody tr:hover { background: var(--bg-tertiary); }
[data-theme="dark"] .payroll-table th:nth-child(1) { background: var(--primary-color); }
[data-theme="dark"] .payroll-table td:nth-child(1) { background: var(--bg-primary); }

[data-theme="dark"] .editable { background: var(--bg-primary) !important; }
[data-theme="dark"] .editable:hover { background: var(--primary-soft) !important; }
[data-theme="dark"] .calculated { background: var(--bg-tertiary) !important; color: var(--text-secondary); }
[data-theme="dark"] td.calculated[style*="f0f9ff"] { background: var(--primary-soft) !important; }

[data-theme="dark"] .payroll-table input:focus { outline-color: var(--primary-light); background: var(--primary-soft); }
[data-theme="dark"] .wage-scale-card { background: var(--bg-primary); border-color: var(--border-color); }
[data-theme="dark"] .wage-scale-card h3,
[data-theme="dark"] .scale-label,
[data-theme="dark"] .scale-value { color: var(--primary-color); }
[data-theme="dark"] .scale-item { border-color: var(--border-color); background: var(--bg-tertiary); }
[data-theme="dark"] .scale-item.editable-scale { background: var(--bg-primary); }
[data-theme="dark"] .scale-input { border-color: var(--primary-light); background: var(--bg-primary); color: var(--text-primary); }
[data-theme="dark"] .scale-percentage { color: var(--text-secondary); }

[data-theme="dark"] p[style*="64748b"] { color: var(--text-secondary) !important; }
[data-theme="dark"] a[style*="f1f5f9"][style*="5546e0"] { background: var(--bg-tertiary) !important; color: var(--primary-color) !important; }

/* ── 21. salary-slips.php — page chrome (.ss-*); the payslip document
   itself (.slip-*) stays literal light "paper" colors in both themes,
   since it's a rendered/printed document, not app UI. ──────────────────── */
[data-theme="dark"] .ss-card { background: var(--bg-primary); }
[data-theme="dark"] .ss-card-label { color: var(--text-secondary); }
[data-theme="dark"] .ss-card-value { color: var(--text-primary); }
[data-theme="dark"] .ss-card-sub { color: var(--text-muted); }
[data-theme="dark"] .ss-filters select,
[data-theme="dark"] .ss-filters input {
    background: var(--bg-primary);
    border-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .ss-tab { color: var(--text-secondary); }
[data-theme="dark"] .ss-tab:hover,
[data-theme="dark"] .ss-tab.active { color: var(--primary-light); }
[data-theme="dark"] .ss-tab.active { border-bottom-color: var(--primary-light); }
[data-theme="dark"] .ss-empty { color: var(--text-muted); }

/* ── 22. leave-requests.css ───────────────────────────────────────────────── */
[data-theme="dark"] .leave-tabs { background: var(--bg-tertiary); }
[data-theme="dark"] .leave-tab.active { background: var(--bg-primary); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .flow-step { background: var(--bg-tertiary); }
[data-theme="dark"] .flow-step.done { background: var(--success-soft); color: var(--success-deep); }
[data-theme="dark"] .flow-step.active { background: var(--primary-soft); color: var(--primary-light); }
[data-theme="dark"] .detail-card { background: var(--bg-tertiary); }

/* ── 23. leave-requests.php (inline / JS-set styles) ─────────────────────── */
[data-theme="dark"] #leave_total_days { background: var(--bg-tertiary) !important; }
[data-theme="dark"] .lr-note { background: var(--primary-soft); color: var(--primary-light); border-color: var(--border-color); }
[data-theme="dark"] .leave-balance-info--unlimited { background: var(--primary-soft); border-color: var(--border-dark); color: var(--primary-light); }
[data-theme="dark"] .leave-balance-info--ok { background: var(--success-soft); border-color: rgba(52,211,153,0.4); color: #6ee7b7; }
[data-theme="dark"] .leave-balance-info--none { background: var(--danger-soft); border-color: rgba(248,113,113,0.4); color: #fca5a5; }
[data-theme="dark"] .leave-routing-notice { background: var(--primary-soft); color: var(--primary-light); border-color: var(--border-dark); }
[data-theme="dark"] .form-input--readonly { background: var(--bg-tertiary); color: var(--text-secondary); }
[data-theme="dark"] span[style*="94a3b8"],
[data-theme="dark"] small[style*="64748b"],
[data-theme="dark"] span[style*="64748b"],
[data-theme="dark"] td[style*="64748b"] { color: var(--text-secondary) !important; }
[data-theme="dark"] h4[style*="334155"] { color: var(--text-primary) !important; }
[data-theme="dark"] .detail-card[style*="fca5a5"] { border-color: var(--danger-color) !important; }

/* ── 24. admin.css ────────────────────────────────────────────────────────── */
[data-theme="dark"] .role-body { background: var(--bg-primary); }
[data-theme="dark"] .activity-icon { background: rgba(125, 211, 252, 0.16); }
[data-theme="dark"] .toggle-slider,
[data-theme="dark"] .perm-slider { background-color: var(--bg-tertiary); }
[data-theme="dark"] .stat-card-admin { background: var(--bg-primary); }
[data-theme="dark"] .backup-item { background: var(--bg-primary); }
[data-theme="dark"] #permTableBody tr:hover { background-color: var(--bg-tertiary); }
[data-theme="dark"] #permissionMatrix .table th { color: var(--text-secondary); }

/* ── 25. admin-settings.css ───────────────────────────────────────────────── */
[data-theme="dark"] .adm-header-icon,
[data-theme="dark"] .stg-category-icon,
[data-theme="dark"] .stg-integration-icon { background: var(--primary-color); }

[data-theme="dark"] .stg-category-card,
[data-theme="dark"] .stg-integration-tile { background: var(--bg-primary); }

[data-theme="dark"] .stg-unsaved-badge {
    background: rgba(251, 191, 36, 0.16);
    border-color: rgba(251, 191, 36, 0.35);
    color: #fcd34d;
}
[data-theme="dark"] .stg-unsaved-badge .dot { background: #fbbf24; }
[data-theme="dark"] .stg-saved-hint { color: #6ee7b7; }
[data-theme="dark"] .stg-status-badge { background: rgba(125, 211, 252, 0.16); color: #7dd3fc; }
[data-theme="dark"] .stg-backup-note {
    background: rgba(251, 191, 36, 0.16);
    border-color: rgba(251, 191, 36, 0.35);
    color: #fcd34d;
}

/* ── 26. admin.php (inline style="" attributes — no <style> block exists) ─── */
[data-theme="dark"] #cr_current_role { background: var(--bg-tertiary) !important; color: var(--text-primary) !important; }
[data-theme="dark"] #employeeInfo { background: var(--bg-secondary) !important; }
[data-theme="dark"] #wa_es_webhook_url { background: var(--bg-tertiary) !important; color: var(--text-primary) !important; }
[data-theme="dark"] #smtpAdventistNotice,
[data-theme="dark"] #smtpOutlookNotice {
    background: var(--primary-soft) !important;
    border-color: rgba(124, 111, 239, 0.4) !important;
    color: var(--text-primary) !important;
}
[data-theme="dark"] #smtpGmailNotice {
    background: rgba(251, 191, 36, 0.16) !important;
    border-color: rgba(251, 191, 36, 0.35) !important;
    color: #fcd34d !important;
}
[data-theme="dark"] #esPwdSetLabel,
[data-theme="dark"] #smsTokenSetLabel,
[data-theme="dark"] #waTokenSetLabel,
[data-theme="dark"] #waSecretSetLabel { color: #6ee7b7 !important; }
[data-theme="dark"] [onclick*="fillSmtpPreset('adventist')"] {
    background: var(--primary-soft) !important;
    border-color: var(--primary-color) !important;
    color: var(--primary-light) !important;
}
[data-theme="dark"] [onclick^="fillSmtpPreset("]:not([onclick*="'adventist'"]) {
    background: var(--bg-primary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* ── 27. entities.php (inline style="" on the two account cards) ─────────── */
[data-theme="dark"] #createEntityForm .row .col-6:nth-child(1) .card {
    background: var(--bg-primary) !important;
    border-color: rgba(124, 111, 239, 0.35) !important;
}
[data-theme="dark"] #createEntityForm .row .col-6:nth-child(1) .card h4 { color: var(--primary-light) !important; }
[data-theme="dark"] #createEntityForm .row .col-6:nth-child(2) .card {
    background: var(--bg-primary) !important;
    border-color: rgba(52, 211, 153, 0.35) !important;
}
[data-theme="dark"] #createEntityForm .row .col-6:nth-child(2) .card h4 { color: #6ee7b7 !important; }

/* ── 28. reconciliation.css ───────────────────────────────────────────────── */
[data-theme="dark"] .recon-container { background: var(--bg-secondary); }
[data-theme="dark"] .back-btn { background: var(--bg-tertiary); color: var(--primary-color); }
[data-theme="dark"] .back-btn:hover { background: var(--primary-soft); }

[data-theme="dark"] .recon-tabs { border-bottom-color: var(--border-color); }
[data-theme="dark"] .recon-tab { color: var(--text-secondary); }
[data-theme="dark"] .recon-tab.active,
[data-theme="dark"] .recon-tab:hover { color: var(--primary-color); }

[data-theme="dark"] .recon-filters { background: var(--bg-secondary); border-color: var(--border-color); }
[data-theme="dark"] .filter-group label { color: var(--text-secondary); }
[data-theme="dark"] .filter-group select,
[data-theme="dark"] .filter-group input {
    background: var(--bg-primary); border-color: var(--border-color); color: var(--text-primary);
}

[data-theme="dark"] .recon-card { box-shadow: var(--shadow-sm); }
[data-theme="dark"] .recon-card-blue   { background: var(--primary-color); }
[data-theme="dark"] .recon-card-green  { background: var(--success-color); color: #0b1e17; }
[data-theme="dark"] .recon-card-yellow { background: var(--warning-color); color: #1c1b30; }
[data-theme="dark"] .recon-card-red    { background: var(--danger-color); }

[data-theme="dark"] .recon-table th,
[data-theme="dark"] .recon-table td { border-color: var(--border-color); }
[data-theme="dark"] .recon-table th { background: var(--primary-color); }
[data-theme="dark"] .recon-table tbody tr:hover { background: var(--bg-tertiary); }

[data-theme="dark"] .detail-header { background: var(--bg-secondary); border-color: var(--border-color); }

[data-theme="dark"] .summary-box { background: var(--bg-secondary); border-color: var(--border-color); }
[data-theme="dark"] .summary-box h4 { color: var(--primary-light); border-bottom-color: var(--border-color); }
[data-theme="dark"] .summary-line { color: var(--text-secondary); }
[data-theme="dark"] .summary-line.total { border-top-color: var(--primary-color); color: var(--primary-light); }
[data-theme="dark"] .summary-line.flagged span:last-child { color: var(--danger-color); }
[data-theme="dark"] .summary-recon { border-left-color: var(--primary-color); }

[data-theme="dark"] .sub-tabs { border-bottom-color: var(--border-color); }
[data-theme="dark"] .sub-tab { color: var(--text-muted); }
[data-theme="dark"] .sub-tab.active,
[data-theme="dark"] .sub-tab:hover { color: var(--primary-color); }

[data-theme="dark"] .txn-panel h3 { color: var(--primary-light); }

[data-theme="dark"] .row-flagged         { background: rgba(251, 191, 36, 0.14) !important; }
[data-theme="dark"] .row-flagged:hover   { background: rgba(251, 191, 36, 0.22) !important; }
[data-theme="dark"] .row-unmatched       { background: rgba(248, 113, 113, 0.14) !important; }
[data-theme="dark"] .row-unmatched:hover { background: rgba(248, 113, 113, 0.22) !important; }
[data-theme="dark"] .amount-group-start td { border-top-color: rgba(124, 111, 239, 0.35) !important; }

[data-theme="dark"] .empty-msg { color: var(--text-muted); }

[data-theme="dark"] #partial-bulk-toolbar { background: var(--primary-soft); border-color: var(--border-color); }
[data-theme="dark"] .toolbar-hint { color: var(--primary-light); }
[data-theme="dark"] th.partial-check-col { background: var(--primary-color); }

[data-theme="dark"] #filter-amt-min,
[data-theme="dark"] #filter-amt-max { background: var(--bg-primary); }
[data-theme="dark"] #filter-amt-min:focus,
[data-theme="dark"] #filter-amt-max:focus { box-shadow: 0 0 0 3px var(--primary-soft); }
[data-theme="dark"] .sort-btn { background: var(--bg-primary); }

[data-theme="dark"] .match-source { background: rgba(125, 211, 252, 0.1); border-color: rgba(125, 211, 252, 0.35); }
[data-theme="dark"] .match-source h4 { color: #7dd3fc; }
[data-theme="dark"] .upload-info { background: var(--bg-secondary); border-color: var(--border-color); }

/* reconciliation.css re-implements these with its own hardcoded colors
   rather than reusing style.css's shared (already var-based) versions —
   scoped to .recon-container so the sitewide .btn-primary/.modal/etc.
   elsewhere are unaffected. */
[data-theme="dark"] .recon-container .table-container { border-color: var(--border-color); }
[data-theme="dark"] .recon-container .btn-primary { background: var(--primary-color); color: #fff; }
[data-theme="dark"] .recon-container .btn-primary:hover { background: var(--primary-dark); }
[data-theme="dark"] .recon-container .btn-success { background: var(--success-color); color: #0b1e17; }
[data-theme="dark"] .recon-container .btn-success:hover { background: #2bb686; }
[data-theme="dark"] .recon-container .btn-secondary { background: var(--bg-tertiary); color: var(--text-primary); }
[data-theme="dark"] .recon-container .btn-secondary:hover { background: var(--border-dark); }
[data-theme="dark"] .recon-container .btn-warning { background: var(--warning-color); color: #241c04; }
[data-theme="dark"] .recon-container .btn-warning:hover { background: #e0a012; }
[data-theme="dark"] .recon-container .modal { background: rgba(0,0,0,0.65); }
[data-theme="dark"] .recon-container .modal-content { background: var(--bg-primary); box-shadow: var(--shadow-lg); }
[data-theme="dark"] .recon-container .modal-header,
[data-theme="dark"] .recon-container .modal-footer { border-color: var(--border-color); }
[data-theme="dark"] .recon-container .modal-close { color: var(--text-muted); }
[data-theme="dark"] .recon-container .modal-close:hover { color: var(--text-secondary); }
[data-theme="dark"] .recon-container .form-label { color: var(--text-secondary); }
[data-theme="dark"] .recon-container .form-input,
[data-theme="dark"] .recon-container .form-select {
    background: var(--bg-primary); border-color: var(--border-color); color: var(--text-primary);
}
[data-theme="dark"] .recon-container .form-input:focus,
[data-theme="dark"] .recon-container .form-select:focus {
    border-color: var(--primary-color); box-shadow: 0 0 0 3px var(--primary-soft);
}