/*
 * RakuOps Dark Mode
 * Scoped to html.dark-mode — toggled per-user preference.
 * All rules use !important to override inline styles and component CSS.
 */

/* ── CSS Variables ──────────────────────────────────────────────────────── */
html.dark-mode {
    --dm-bg:         #0f172a;
    --dm-surface:    #1e293b;
    --dm-surface2:   #273549;
    --dm-surface3:   #2f3f55;
    --dm-border:     rgba(255,255,255,0.08);
    --dm-border2:    rgba(255,255,255,0.12);
    --dm-text:       #e2e8f0;
    --dm-text-2:     #cbd5e1;
    --dm-text-muted: #94a3b8;
    --dm-text-faint: #64748b;
    --dm-input-bg:   #1e293b;
    color-scheme: dark;
}

/* ── Global Layout ──────────────────────────────────────────────────────── */
html.dark-mode body,
html.dark-mode .container-scroller { background: var(--dm-bg) !important; color: var(--dm-text) !important; }

html.dark-mode .page-body-wrapper { background: var(--dm-bg) !important; }
html.dark-mode .main-panel        { background: var(--dm-bg) !important; }
html.dark-mode .content-wrapper   { background: var(--dm-bg) !important; }
html.dark-mode .footer            { background: var(--dm-surface) !important; border-top-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .footer a          { color: #818cf8 !important; }
html.dark-mode .footer .text-muted { color: var(--dm-text-faint) !important; }

/* Vertical center layouts */
html.dark-mode .vertical-center .page-body-wrapper,
html.dark-mode .vertical-center .menu { background: var(--dm-bg) !important; }

/* ── Topbar / Navbar ────────────────────────────────────────────────────── */
html.dark-mode .navbar {
    background: var(--dm-surface) !important;
    border-bottom: 1px solid var(--dm-border) !important;
    box-shadow: 0 1px 8px rgba(0,0,0,.4) !important;
}
html.dark-mode .navbar .mdi { color: #94a3b8 !important; }
html.dark-mode #aiCreditsCount { color: #94a3b8 !important; }
html.dark-mode #darkModeBtn .mdi { color: #94a3b8 !important; }
html.dark-mode #navbar-search-input {
    background: var(--dm-surface2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
html.dark-mode #navbar-search-input::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode #navbar-search-kbd {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-faint) !important;
}
html.dark-mode #searchRecommendations {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
html.dark-mode .profile-icon { background-color: #334155 !important; }

/* ── Sidebar ────────────────────────────────────────────────────────────── */
html.dark-mode .sidebar,
html.dark-mode .sidebar-offcanvas {
    background: #0d1a2e !important;
    border-right: 1px solid var(--dm-border) !important;
}
html.dark-mode .sidebar .nav-item .nav-link { color: #94a3b8 !important; }
html.dark-mode .sidebar .nav-item .nav-link i { color: #64748b !important; }
html.dark-mode .sidebar .nav-item.active > .nav-link,
html.dark-mode .sidebar .nav-item:hover > .nav-link { color: #e2e8f0 !important; background: rgba(255,255,255,0.05) !important; }
html.dark-mode .sidebar .nav-item.active > .nav-link i,
html.dark-mode .sidebar .nav-item:hover > .nav-link i { color: #6366f1 !important; }
html.dark-mode .sidebar-icon-only .sidebar .nav-item:hover .nav-link .menu-title { background: var(--dm-surface) !important; color: var(--dm-text) !important; }

/* ── Bootstrap Cards ────────────────────────────────────────────────────── */
html.dark-mode .card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .card-header { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .card-body { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode .card-footer { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .card-title,
html.dark-mode .card-text { color: var(--dm-text) !important; }

/* ── Bootstrap Tables ───────────────────────────────────────────────────── */
html.dark-mode .table { color: var(--dm-text) !important; }
html.dark-mode .table th { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border) !important; }
html.dark-mode .table td { border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .table-striped tbody tr:nth-of-type(odd) td { background: rgba(255,255,255,0.02) !important; }
html.dark-mode .table-hover tbody tr:hover td { background: var(--dm-surface2) !important; }
html.dark-mode .table-bordered { border-color: var(--dm-border) !important; }
html.dark-mode .table-bordered th,
html.dark-mode .table-bordered td { border-color: var(--dm-border) !important; }

/* ── Bootstrap Forms ────────────────────────────────────────────────────── */
html.dark-mode .form-control,
html.dark-mode input[type="text"],
html.dark-mode input[type="email"],
html.dark-mode input[type="password"],
html.dark-mode input[type="search"],
html.dark-mode input[type="number"],
html.dark-mode input[type="url"],
html.dark-mode input[type="tel"],
html.dark-mode input[type="date"],
html.dark-mode input[type="time"],
html.dark-mode input[type="datetime-local"],
html.dark-mode textarea,
html.dark-mode select {
    background: var(--dm-input-bg) !important;
    border-color: var(--dm-border2) !important;
    color: var(--dm-text) !important;
}
html.dark-mode .form-control:focus,
html.dark-mode input:focus,
html.dark-mode textarea:focus,
html.dark-mode select:focus {
    background: var(--dm-surface2) !important;
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 3px rgba(99,102,241,.2) !important;
    color: var(--dm-text) !important;
}
html.dark-mode select option { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode .form-control::placeholder,
html.dark-mode input::placeholder,
html.dark-mode textarea::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode label { color: var(--dm-text-2) !important; }
html.dark-mode .form-text,
html.dark-mode small { color: var(--dm-text-muted) !important; }
html.dark-mode .custom-control-label::before { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; }

/* ── Bootstrap Dropdowns ────────────────────────────────────────────────── */
html.dark-mode .dropdown-menu:not(.mega-menu):not(.new-menu) {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.4) !important;
}
html.dark-mode .dropdown-menu:not(.mega-menu):not(.new-menu) .dropdown-item { color: var(--dm-text) !important; }
html.dark-mode .dropdown-menu:not(.mega-menu):not(.new-menu) .dropdown-item:hover,
html.dark-mode .dropdown-menu:not(.mega-menu):not(.new-menu) .dropdown-item:focus { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }
html.dark-mode .dropdown-menu:not(.mega-menu):not(.new-menu) .dropdown-header { color: var(--dm-text-muted) !important; }
html.dark-mode .dropdown-divider { border-color: var(--dm-border) !important; }

/* ── Bootstrap Modals ───────────────────────────────────────────────────── */
html.dark-mode .modal-content { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .modal-header { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .modal-body { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode .modal-footer { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .modal-title { color: var(--dm-text) !important; }
html.dark-mode .close { color: var(--dm-text-muted) !important; }

/* ── Bootstrap Alerts ───────────────────────────────────────────────────── */
html.dark-mode .alert-info    { background: rgba(59,130,246,.12) !important; border-color: rgba(59,130,246,.25) !important; color: #93c5fd !important; }
html.dark-mode .alert-success { background: rgba(16,185,129,.12) !important; border-color: rgba(16,185,129,.25) !important; color: #6ee7b7 !important; }
html.dark-mode .alert-warning { background: rgba(245,158,11,.12) !important; border-color: rgba(245,158,11,.25) !important; color: #fcd34d !important; }
html.dark-mode .alert-danger  { background: rgba(220,38,38,.12) !important; border-color: rgba(220,38,38,.25) !important; color: #fca5a5 !important; }

/* ── Bootstrap Badges (light ones need adjustment) ──────────────────────── */
html.dark-mode .badge-light  { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }
html.dark-mode .badge-secondary { background: #374151 !important; color: #e2e8f0 !important; }

/* ── Bootstrap List Group ───────────────────────────────────────────────── */
html.dark-mode .list-group-item {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
html.dark-mode .list-group-item:hover { background: var(--dm-surface2) !important; }
html.dark-mode .list-group-item.active { background: #6366f1 !important; border-color: #6366f1 !important; }

/* ── Bootstrap Buttons (light variants) ─────────────────────────────────── */
html.dark-mode .btn-light,
html.dark-mode .btn-white { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .btn-light:hover { background: var(--dm-surface3) !important; }
html.dark-mode .btn-outline-secondary { border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .btn-outline-secondary:hover { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }

/* ── Bootstrap Nav Tabs ─────────────────────────────────────────────────── */
html.dark-mode .nav-tabs { border-color: var(--dm-border) !important; }
html.dark-mode .nav-tabs .nav-link { color: var(--dm-text-muted) !important; border-color: transparent !important; }
html.dark-mode .nav-tabs .nav-link:hover { color: var(--dm-text) !important; border-color: var(--dm-border) !important; }
html.dark-mode .nav-tabs .nav-link.active { background: var(--dm-surface) !important; border-color: var(--dm-border) var(--dm-border) var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode .tab-content { background: transparent !important; }

/* ── Bootstrap Progress ─────────────────────────────────────────────────── */
html.dark-mode .progress { background: var(--dm-surface2) !important; }

/* ── Bootstrap Pagination ───────────────────────────────────────────────── */
html.dark-mode .page-item .page-link { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: #93c5fd !important; }
html.dark-mode .page-item.active .page-link { background: #6366f1 !important; border-color: #6366f1 !important; color: #fff !important; }
html.dark-mode .page-item.disabled .page-link { background: var(--dm-surface) !important; color: var(--dm-text-faint) !important; }

/* ── Bootstrap misc ─────────────────────────────────────────────────────── */
html.dark-mode hr { border-color: var(--dm-border) !important; }
html.dark-mode .text-muted { color: var(--dm-text-muted) !important; }
html.dark-mode .text-dark { color: var(--dm-text) !important; }
html.dark-mode .bg-white { background: var(--dm-surface) !important; }
html.dark-mode .bg-light { background: var(--dm-surface2) !important; }
html.dark-mode .border { border-color: var(--dm-border) !important; }
html.dark-mode .border-bottom { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .border-top { border-top-color: var(--dm-border) !important; }
html.dark-mode h1,html.dark-mode h2,html.dark-mode h3,html.dark-mode h4,html.dark-mode h5,html.dark-mode h6 { color: var(--dm-text) !important; }
html.dark-mode p { color: var(--dm-text-2) !important; }
html.dark-mode a:not(.btn):not(.dropdown-item):not(.nav-link):not(.badge) { color: #93c5fd; }

/* ── Slide Panels ───────────────────────────────────────────────────────── */
html.dark-mode .slide-panel { background: var(--dm-surface) !important; border-left: 1px solid var(--dm-border) !important; }
html.dark-mode .slide-panel-content,
html.dark-mode .slide-panel-body { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode .slide-panel-footer,
html.dark-mode .sp-ft { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode .sp-hd { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .sp-hd h5,
html.dark-mode .sp-hd span { color: var(--dm-text) !important; }

/* ── Create Checklist Panel (cc-*) ─────────────────────────────────────── */
/* The header gradient is intentionally kept as-is (indigo) — looks good in dark mode */
html.dark-mode #panelCreateChecklist .sp-hd { background: linear-gradient(135deg,#6366f1,#4f46e5) !important; }

/* Welcome screen */
html.dark-mode .cc-welcome-heading h4 { color: var(--dm-text) !important; }
html.dark-mode .cc-welcome-heading p  { color: var(--dm-text-muted) !important; }

/* Option cards */
html.dark-mode .cc-opt { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .cc-opt:hover { border-color: transparent !important; box-shadow: 0 8px 24px rgba(0,0,0,.4) !important; }
html.dark-mode .cc-opt.ai::before    { background: linear-gradient(145deg,rgba(109,40,217,.18),rgba(99,102,241,.12)) !important; }
html.dark-mode .cc-opt.tmpl::before  { background: linear-gradient(145deg,rgba(29,78,216,.18),rgba(59,130,246,.12)) !important; }
html.dark-mode .cc-opt.blank::before { background: linear-gradient(145deg,rgba(100,116,139,.12),rgba(71,85,105,.08)) !important; }
html.dark-mode .cc-opt-title { color: var(--dm-text) !important; }
html.dark-mode .cc-opt-desc  { color: var(--dm-text-muted) !important; }
html.dark-mode .cc-opt.blank .cc-opt-ico { background: linear-gradient(135deg,var(--dm-surface3),var(--dm-border)) !important; color: var(--dm-text-muted) !important; }

/* Recent list */
html.dark-mode .cc-recent-label { color: var(--dm-text-faint) !important; }
html.dark-mode .cc-recent-item  { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .cc-recent-item:hover { border-color: rgba(99,102,241,.4) !important; background: var(--dm-surface3) !important; }
html.dark-mode .cc-recent-ico   { background: rgba(99,102,241,.18) !important; color: #a5b4fc !important; }
html.dark-mode .cc-recent-name  { color: var(--dm-text-2) !important; }
html.dark-mode .cc-recent-arrow { color: rgba(99,102,241,.4) !important; }

/* Back button */
html.dark-mode .cc-back-btn { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .cc-back-btn:hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }

/* Sub-view headers */
html.dark-mode .cc-sub-header h5 { color: var(--dm-text) !important; }
html.dark-mode .cc-sub-header p  { color: var(--dm-text-muted) !important; }

/* Prompt chips */
html.dark-mode .cc-chip { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.3) !important; color: #a5b4fc !important; }
html.dark-mode .cc-chip:hover { background: #6366f1 !important; border-color: #6366f1 !important; color: #fff !important; }

/* Labels, textareas, inputs */
html.dark-mode .cc-label { color: var(--dm-text-muted) !important; }
html.dark-mode .cc-label .opt { color: var(--dm-text-faint) !important; }
html.dark-mode .cc-textarea,
html.dark-mode .cc-input { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .cc-textarea::placeholder,
html.dark-mode .cc-input::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode .cc-textarea:focus,
html.dark-mode .cc-input:focus { border-color: #6366f1 !important; box-shadow: 0 0 0 3px rgba(99,102,241,.15) !important; }
html.dark-mode .cc-char-count { color: var(--dm-text-faint) !important; }

/* Industry cards */
html.dark-mode .cc-ind-card { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .cc-ind-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,.4) !important; border-color: transparent !important; }
html.dark-mode .cc-ind-name { color: var(--dm-text) !important; }
html.dark-mode .cc-ind-desc { color: var(--dm-text-muted) !important; }

/* Preview rows */
html.dark-mode .cc-preview-hd h5 { color: var(--dm-text) !important; }
html.dark-mode .cc-preview-hd p  { color: var(--dm-text-muted) !important; }
html.dark-mode .cc-preview-row { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .cc-preview-num  { background: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }
html.dark-mode .cc-preview-name { color: var(--dm-text-2) !important; }
html.dark-mode .cc-preview-desc { color: var(--dm-text-muted) !important; }

/* AI result — generated title box */
html.dark-mode #checklistTitleContainer { background: rgba(99,102,241,.12) !important; border-color: rgba(99,102,241,.3) !important; }
html.dark-mode #checklistGeneratedTitle { color: #a5b4fc !important; }
html.dark-mode #checklistGeneratedDescription { color: var(--dm-text-muted) !important; }

/* Loading state */
html.dark-mode #processingIcon h6 { color: var(--dm-text) !important; }
html.dark-mode #processingIcon p  { color: var(--dm-text-muted) !important; }
html.dark-mode .cc-progress-dots span { background: rgba(99,102,241,.4) !important; }

/* Generated checklist items */
html.dark-mode .checklist-item { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .checklist-item:hover { border-color: rgba(99,102,241,.4) !important; box-shadow: 0 2px 8px rgba(0,0,0,.3) !important; }
html.dark-mode .ci-num  { background: linear-gradient(135deg,rgba(109,40,217,.3),rgba(99,102,241,.2)) !important; color: #c4b5fd !important; }
html.dark-mode .ci-body h6 { color: var(--dm-text) !important; }
html.dark-mode .ci-body p  { color: var(--dm-text-muted) !important; }

/* Footer */
html.dark-mode #ccPanelFooter { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }

/* Messages */
html.dark-mode .cc-msg-ok  { background: rgba(16,185,129,.12) !important; color: #6ee7b7 !important; border-color: rgba(16,185,129,.25) !important; }
html.dark-mode .cc-msg-err { background: rgba(220,38,38,.12) !important; color: #fca5a5 !important; border-color: rgba(220,38,38,.25) !important; }

/* Global Issue Work Order Panel */
html.dark-mode #globalIssuePanel > div { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode #globalIssuePanel label { color: var(--dm-text-2) !important; }

/* ── Dashboard Overview — Kanban Board (kb-*) ───────────────────────────── */
html.dark-mode .kb-board { background: var(--dm-bg) !important; }
html.dark-mode .kb-column { background: var(--dm-surface2) !important; border: 1px solid var(--dm-border) !important; }
html.dark-mode .kb-col-header { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .kb-col-header--inprogress { background: rgba(99,102,241,.15) !important; border-bottom-color: rgba(99,102,241,.25) !important; }
html.dark-mode .kb-col-header--done { background: rgba(16,185,129,.1) !important; border-bottom-color: rgba(16,185,129,.2) !important; }
html.dark-mode .kb-col-title { color: var(--dm-text) !important; }
html.dark-mode .kb-col-subtitle { color: var(--dm-text-muted) !important; }
html.dark-mode .kb-col-body .card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .kb-col-body .card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.4) !important; }
html.dark-mode .kb-col-body .card h6 { color: var(--dm-text) !important; }
html.dark-mode .kb-col-body .card p.text-muted { color: var(--dm-text-muted) !important; }
/* Kanban CTA — form inputs */
html.dark-mode .kb-col-body .card .form-control { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .kb-col-body .card .form-control::placeholder { color: var(--dm-text-muted) !important; }
html.dark-mode .kb-col-body .card .form-check-label { color: var(--dm-text-muted) !important; }
html.dark-mode .kb-col-body .card .form-check-input { border-color: var(--dm-border2) !important; }
/* Kanban CTA — Complete / Submit buttons */
html.dark-mode .kb-col-body .card .btnComplete {
  background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.35) !important;
  color: #a5b4fc !important; border-width: 1.5px !important; border-style: solid !important;
}
html.dark-mode .kb-col-body .card .btnComplete:hover { background: rgba(99,102,241,.28) !important; color: #c7d2fe !important; }
/* Approve / Reject buttons */
html.dark-mode .kb-col-body .card .btnApprove {
  background: rgba(16,185,129,.12) !important; border-color: rgba(16,185,129,.3) !important;
  color: #6ee7b7 !important; border-width: 1.5px !important; border-style: solid !important;
}
html.dark-mode .kb-col-body .card .btnApprove:hover { background: rgba(16,185,129,.22) !important; }
html.dark-mode .kb-col-body .card .btnReject {
  background: rgba(220,38,38,.12) !important; border-color: rgba(220,38,38,.3) !important;
  color: #fca5a5 !important; border-width: 1.5px !important; border-style: solid !important;
}
html.dark-mode .kb-col-body .card .btnReject:hover { background: rgba(220,38,38,.22) !important; }
html.dark-mode .kb-wo-card { background: rgba(99,102,241,.1) !important; border-left-color: #6366f1 !important; }
html.dark-mode .kb-wo-badge { background: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }
html.dark-mode .kb-wo-view-btn { background: rgba(99,102,241,.15) !important; color: #a5b4fc !important; }
html.dark-mode .kb-wo-view-btn:hover { background: rgba(99,102,241,.25) !important; }
html.dark-mode .kb-suggestions { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .kb-suggestions .list-group-item { background: var(--dm-surface) !important; color: var(--dm-text) !important; border-color: var(--dm-border) !important; }
html.dark-mode .kb-suggestions .list-group-item:hover { background: var(--dm-surface2) !important; }

/* Kanban task detail panel */
html.dark-mode .kbp-content { background: var(--dm-surface) !important; }
html.dark-mode .kbp-header { background: var(--dm-surface2) !important; }

/* ── Checklist List (cl-*, mc-*, mr-*) ─────────────────────────────────── */
html.dark-mode .cl-tab-bar { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .cl-tab-btn { color: var(--dm-text-muted) !important; }
html.dark-mode .cl-tab-btn:not(.active):hover { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }
html.dark-mode .cl-tab-btn.active { color: var(--dm-text) !important; }
html.dark-mode .cl-tab-btn:not(.active) .cl-tab-count { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }

html.dark-mode .mr-filter-bar { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .mr-filter-label { color: var(--dm-text-faint) !important; }
html.dark-mode .mr-chip { background: var(--dm-surface) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .mr-chip:hover { border-color: #6366f1 !important; color: #a5b4fc !important; }
html.dark-mode .mr-chip.active { background: #6366f1 !important; border-color: #6366f1 !important; color: #fff !important; }
html.dark-mode .mr-sep { background: var(--dm-border) !important; }
html.dark-mode .mr-search { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .mr-search:focus { background: var(--dm-surface2) !important; border-color: #6366f1 !important; }
html.dark-mode .mr-count-badge { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .mr-stat-icon.blue  { background: rgba(59,130,246,.15)  !important; }
html.dark-mode .mr-stat-icon.green { background: rgba(16,185,129,.15)  !important; }
html.dark-mode .mr-stat-icon.amber { background: rgba(245,158,11,.15)  !important; }
html.dark-mode .mr-stat-icon.red   { background: rgba(220,38,38,.15)   !important; }
html.dark-mode .mr-stat-value { color: var(--dm-text) !important; }
html.dark-mode .mr-stat-label { color: var(--dm-text-muted) !important; }

html.dark-mode .mc-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .mc-card:hover { border-color: #6366f1 !important; box-shadow: 0 8px 24px rgba(0,0,0,.4) !important; }
html.dark-mode .mc-card-title { color: var(--dm-text) !important; }
html.dark-mode .mc-card-desc { color: var(--dm-text-muted) !important; }
html.dark-mode .mc-card-run-id { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .mc-progress-bar { background: var(--dm-surface2) !important; }
html.dark-mode .mc-progress-label { color: var(--dm-text-muted) !important; }
html.dark-mode .mc-progress-value { color: var(--dm-text) !important; }
html.dark-mode .mc-card-meta { border-color: var(--dm-border) !important; }
html.dark-mode .mc-meta-item { color: var(--dm-text-muted) !important; }
html.dark-mode .mc-meta-item i { color: var(--dm-text-faint) !important; }
html.dark-mode .mc-btn-secondary { background: var(--dm-surface2) !important; color: var(--dm-text-2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .mc-btn-secondary:hover { background: var(--dm-surface3) !important; }
html.dark-mode .mc-btn-response { background: rgba(16,185,129,.1) !important; border-color: rgba(16,185,129,.25) !important; color: #34d399 !important; }
html.dark-mode .mc-btn-ai { background: rgba(124,58,237,.12) !important; border-color: rgba(124,58,237,.25) !important; color: #c4b5fd !important; }
html.dark-mode .mc-btn-review { background: rgba(99,102,241,.12) !important; border-color: rgba(99,102,241,.25) !important; color: #a5b4fc !important; }
html.dark-mode .mc-section-header { border-color: var(--dm-border) !important; }
html.dark-mode .mc-section-title { color: var(--dm-text) !important; }
html.dark-mode .mc-section-title .count-badge { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .mc-empty h3 { color: var(--dm-text) !important; }
html.dark-mode .mc-empty p { color: var(--dm-text-muted) !important; }

/* Status badges (light background variants) */
html.dark-mode .mc-status-badge.overdue   { background: rgba(220,38,38,.15)  !important; color: #fca5a5 !important; }
html.dark-mode .mc-status-badge.due-soon  { background: rgba(217,119,6,.15)  !important; color: #fcd34d !important; }
html.dark-mode .mc-status-badge.in-progress,
html.dark-mode .mc-status-badge.ongoing   { background: rgba(99,102,241,.15) !important; color: #a5b4fc !important; }
html.dark-mode .mc-status-badge.completed { background: rgba(5,150,105,.15)  !important; color: #6ee7b7 !important; }

/* Manage Runs stat icons */
html.dark-mode .stat-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .stat-value { color: var(--dm-text) !important; }
html.dark-mode .stat-label { color: var(--dm-text-muted) !important; }
html.dark-mode .stat-icon.blue  { background: rgba(59,130,246,.15) !important; }
html.dark-mode .stat-icon.green { background: rgba(16,185,129,.15) !important; }
html.dark-mode .stat-icon.amber { background: rgba(245,158,11,.15) !important; }
html.dark-mode .stat-icon.red   { background: rgba(220,38,38,.15)  !important; }
html.dark-mode .filter-bar { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .filter-group-label { color: var(--dm-text-faint) !important; }
html.dark-mode .filter-chip { background: var(--dm-surface) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .filter-chip.active { background: #3b82f6 !important; border-color: #3b82f6 !important; color: #fff !important; }
html.dark-mode .filter-chip:hover { border-color: #3b82f6 !important; color: #93c5fd !important; }
html.dark-mode .filter-sep { background: var(--dm-border) !important; }
html.dark-mode .run-search { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .runs-section-title { color: var(--dm-text) !important; }
html.dark-mode .runs-count-badge { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }

/* ── Checklist Viewer (viewer-*) ────────────────────────────────────────── */
html.dark-mode .viewer-left-panel { background: var(--dm-surface) !important; border-right-color: var(--dm-border) !important; }
html.dark-mode .viewer-left-panel::-webkit-scrollbar-thumb { background: var(--dm-surface3) !important; }
html.dark-mode .viewer-step { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .viewer-step:hover { background: var(--dm-surface2) !important; border-color: rgba(99,102,241,.35) !important; }
html.dark-mode .viewer-step.active { background: rgba(59,130,246,.12) !important; border-color: #3b82f6 !important; }
html.dark-mode .viewer-step-index { color: var(--dm-text-muted) !important; }
html.dark-mode .viewer-panel-header { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .viewer-progress-wrapper { background: var(--dm-surface2) !important; }
html.dark-mode .viewer-task-title { color: var(--dm-text) !important; }
html.dark-mode .viewer-task-desc { color: var(--dm-text-muted) !important; }
html.dark-mode .viewer-section-title { color: var(--dm-text-faint) !important; }
html.dark-mode .viewer-element { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .viewer-element label { color: var(--dm-text-2) !important; }
html.dark-mode .viewer-element input,
html.dark-mode .viewer-element textarea,
html.dark-mode .viewer-element select { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .viewer-htmlbox { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }
html.dark-mode .viewer-media { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .viewer-save-btn { background: #2563eb !important; }

/* AI validation result */
html.dark-mode .ai-validation-result { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .ai-validation-result .ai-validation-feedback { color: var(--dm-text-2) !important; }
html.dark-mode .ai-guidance-panel { background: rgba(14,116,144,.15) !important; border-color: rgba(14,116,144,.25) !important; }
html.dark-mode .ai-guidance-text { color: #67e8f9 !important; }

/* Incomplete/warning overlays */
html.dark-mode .viewer-incomplete-badge { background: rgba(146,64,14,.2) !important; color: #fcd34d !important; border-color: rgba(146,64,14,.3) !important; }

/* Signature pad */
html.dark-mode canvas[id*="signature"],
html.dark-mode .signature-pad-wrapper { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }

/* ── Operations Manager (ops-*) ─────────────────────────────────────────── */
html.dark-mode .ops-stat-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .ops-stat-card.critical { background: linear-gradient(135deg, var(--dm-surface) 0%, rgba(185,28,28,.2) 100%) !important; border-left-color: #dc2626 !important; }
html.dark-mode .ops-stat-card.warning  { background: linear-gradient(135deg, var(--dm-surface) 0%, rgba(180,83,9,.2) 100%) !important; border-left-color: #f59e0b !important; }
html.dark-mode .ops-stat-card.success  { background: linear-gradient(135deg, var(--dm-surface) 0%, rgba(4,120,87,.2) 100%) !important; border-left-color: #10b981 !important; }
html.dark-mode .ops-stat-value { color: var(--dm-text) !important; }
html.dark-mode .ops-stat-label { color: var(--dm-text-muted) !important; }
html.dark-mode .ops-section { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .ops-section-header { border-color: var(--dm-border) !important; }
html.dark-mode .ops-section-title { color: var(--dm-text) !important; }
html.dark-mode .ops-insight-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .ops-insight-value { color: var(--dm-text) !important; }
html.dark-mode .ops-insight-label { color: var(--dm-text-muted) !important; }
html.dark-mode .ops-perf-mini { background: var(--dm-surface2) !important; }
html.dark-mode .ops-perf-mini-title { color: var(--dm-text-muted) !important; }
html.dark-mode .ops-decision-card { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .ops-decision-card.severity-critical { background: linear-gradient(135deg, var(--dm-surface2) 0%, rgba(185,28,28,.2) 100%) !important; }
html.dark-mode .ops-decision-title { color: var(--dm-text) !important; }
html.dark-mode .ops-decision-desc { color: var(--dm-text-muted) !important; }
html.dark-mode .ops-decision-meta { color: var(--dm-text-faint) !important; }
html.dark-mode .ops-runs-table th { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border) !important; }
html.dark-mode .ops-runs-table td { border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .ops-runs-table tr:hover td { background: var(--dm-surface2) !important; }
html.dark-mode .ops-workload-card { background: var(--dm-surface2) !important; }
html.dark-mode .ops-workload-card.overloaded { background: rgba(185,28,28,.15) !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .ops-workload-name { color: var(--dm-text) !important; }
html.dark-mode .ops-workload-label { color: var(--dm-text-muted) !important; }
html.dark-mode .ops-bottleneck-item { background: var(--dm-surface2) !important; }
html.dark-mode .ops-bottleneck-item.warning { background: rgba(180,83,9,.1) !important; }
html.dark-mode .ops-bottleneck-item.critical { background: rgba(185,28,28,.1) !important; }
html.dark-mode .ops-bottleneck-name { color: var(--dm-text) !important; }
html.dark-mode .ops-bottleneck-meta { color: var(--dm-text-muted) !important; }
html.dark-mode .ops-activity-item { border-color: var(--dm-border) !important; }
html.dark-mode .ops-activity-text { color: var(--dm-text) !important; }
html.dark-mode .ops-activity-time { color: var(--dm-text-faint) !important; }
html.dark-mode .ops-empty { color: var(--dm-text-muted) !important; }
html.dark-mode .ops-empty p { color: var(--dm-text-muted) !important; }
html.dark-mode .ops-page-btn { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: #93c5fd !important; }
html.dark-mode .ops-page-btn:hover:not(:disabled) { background: #6366f1 !important; border-color: #6366f1 !important; color: #fff !important; }
html.dark-mode .ops-page-btn:disabled { color: var(--dm-text-faint) !important; }
html.dark-mode .ops-page-info,
html.dark-mode .ops-pagination-info { color: var(--dm-text-muted) !important; }
html.dark-mode .ops-group-label { color: var(--dm-text-faint) !important; }
html.dark-mode .ops-group-label::after { background: var(--dm-border) !important; }

/* ── Work Orders (wo-*) ─────────────────────────────────────────────────── */
html.dark-mode .wo-tabbar { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .wo-tab { color: var(--dm-text-muted) !important; border-color: transparent !important; }
html.dark-mode .wo-tab:hover { color: #a5b4fc !important; }
html.dark-mode .wo-tab.active { color: #6366f1 !important; border-bottom-color: #6366f1 !important; }
html.dark-mode .wo-page-bg { background: var(--dm-bg) !important; }
html.dark-mode .wo-table-wrap { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .wo-table th { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border) !important; }
html.dark-mode .wo-table td { color: var(--dm-text) !important; border-color: var(--dm-border) !important; }
html.dark-mode .wo-table tr:hover td { background: var(--dm-surface2) !important; }
html.dark-mode .wo-filters { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .wo-filter-select { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .wo-filter-clear { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .wo-filter-clear:hover { background: var(--dm-surface3) !important; }
html.dark-mode .wo-tpl-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .wo-tpl-card:hover { border-color: #a5b4fc !important; box-shadow: 0 4px 16px rgba(0,0,0,.4) !important; }
html.dark-mode .wo-tpl-name { color: var(--dm-text) !important; }
html.dark-mode .wo-tpl-desc { color: var(--dm-text-muted) !important; }

/* Work order status badges */
html.dark-mode .wo-badge-open        { background: rgba(29,78,216,.15)  !important; color: #93c5fd !important; border-color: rgba(29,78,216,.25) !important; }
html.dark-mode .wo-badge-assigned    { background: rgba(6,95,70,.15)    !important; color: #6ee7b7 !important; border-color: rgba(6,95,70,.25) !important; }
html.dark-mode .wo-badge-in_progress { background: rgba(146,64,14,.15)  !important; color: #fcd34d !important; border-color: rgba(146,64,14,.25) !important; }
html.dark-mode .wo-badge-on_hold     { background: rgba(91,33,182,.15)  !important; color: #c4b5fd !important; border-color: rgba(91,33,182,.25) !important; }
html.dark-mode .wo-badge-completed   { background: rgba(20,83,45,.15)   !important; color: #86efac !important; border-color: rgba(20,83,45,.25) !important; }
html.dark-mode .wo-badge-verified    { background: rgba(19,78,74,.15)   !important; color: #5eead4 !important; border-color: rgba(19,78,74,.25) !important; }
html.dark-mode .wo-badge-cancelled   { background: rgba(153,27,27,.15)  !important; color: #fca5a5 !important; border-color: rgba(153,27,27,.25) !important; }

/* ── Assets (am-*) ──────────────────────────────────────────────────────── */
html.dark-mode .am-card,
html.dark-mode [class*="am-"] { color: var(--dm-text) !important; }
html.dark-mode .am-manage-card,
html.dark-mode .am-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,.4) !important; }
html.dark-mode .am-metric { color: var(--dm-text-muted) !important; }
html.dark-mode .am-bar-track { background: var(--dm-surface2) !important; }

/* ── Kanban card date tags ───────────────────────────────────────────────── */
html.dark-mode .kanban-col,
html.dark-mode .kanban-header { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .kanban-card { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .kanban-tag-assigned  { background: rgba(29,78,216,.15)  !important; color: #93c5fd !important; border-color: rgba(29,78,216,.25) !important; }
html.dark-mode .kanban-tag-due       { background: rgba(109,40,217,.15) !important; color: #c4b5fd !important; border-color: rgba(109,40,217,.25) !important; }
html.dark-mode .kanban-tag-overdue   { background: rgba(185,28,28,.15)  !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .kanban-tag-completed { background: rgba(21,128,61,.15)  !important; color: #86efac !important; border-color: rgba(21,128,61,.25) !important; }
html.dark-mode .kanban-tag-late      { background: rgba(194,65,12,.15)  !important; color: #fb923c !important; border-color: rgba(194,65,12,.25) !important; }
html.dark-mode .kanban-tag-tat       { background: rgba(67,56,202,.15)  !important; color: #a5b4fc !important; border-color: rgba(67,56,202,.25) !important; }

/* ── AI Notifications dropdown ──────────────────────────────────────────── */
html.dark-mode .ai-notif-dropdown { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .ai-notif-item { background: var(--dm-surface2) !important; }
html.dark-mode .ai-notif-item:hover { background: var(--dm-surface3) !important; }
html.dark-mode .ai-notif-item-subject { color: var(--dm-text) !important; }
html.dark-mode .ai-notif-item-time { color: var(--dm-text-faint) !important; }
html.dark-mode .dropdown-header { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .ai-notif-item.severity-critical { background: rgba(185,28,28,.12) !important; }
html.dark-mode .ai-notif-item.severity-high     { background: rgba(194,65,12,.1)  !important; }
html.dark-mode .ai-notif-item.severity-low      { background: rgba(101,163,13,.08)!important; }

/* ── Help Panel (panelHelp / hp-* / hc-*) ──────────────────────────────── */
html.dark-mode #panelHelp .slide-panel-content { background: var(--dm-surface) !important; }

/* Nav bar (back button row) */
html.dark-mode #helpNavBar { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode #helpNavBack { background: var(--dm-surface3) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode #helpNavBack:hover { background: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode #helpNavTitle { color: var(--dm-text) !important; }

/* Results bar */
html.dark-mode #helpResultsBar { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode #helpResultsLabel { color: var(--dm-text-faint) !important; }

/* Section labels */
html.dark-mode .hp-section-lbl { color: var(--dm-text-faint) !important; }

/* Topic rows (browse list) */
html.dark-mode .hp-topic-row { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .hp-topic-row:hover { background: var(--dm-surface2) !important; }
html.dark-mode .hp-topic-name  { color: var(--dm-text) !important; }
html.dark-mode .hp-topic-sect  { color: var(--dm-text-faint) !important; }
html.dark-mode .hp-topic-arrow { color: var(--dm-border2) !important; }

/* Topic detail — intro block */
html.dark-mode .hp-topic-intro { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .hp-intro-text  { color: var(--dm-text-2) !important; }
html.dark-mode .hp-goto-btn { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.3) !important; color: #a5b4fc !important; }
html.dark-mode .hp-goto-btn:hover { background: rgba(99,102,241,.25) !important; border-color: rgba(99,102,241,.45) !important; color: #c7d2fe !important; }

/* Steps */
html.dark-mode .hp-steps-lbl  { color: var(--dm-text-faint) !important; }
html.dark-mode .hp-step-row   { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .hp-step-title { color: var(--dm-text) !important; }
html.dark-mode .hp-step-body  { color: var(--dm-text-muted) !important; }

/* Tips */
html.dark-mode .hp-tips-wrap { background: var(--dm-surface2) !important; }
html.dark-mode .hp-tips-lbl  { color: var(--dm-text-faint) !important; }
html.dark-mode .hp-tip-row p { color: var(--dm-text-muted) !important; }

/* Search result rows */
html.dark-mode .hp-sr-row   { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .hp-sr-row:hover { background: var(--dm-surface2) !important; }
html.dark-mode .hp-sr-title   { color: var(--dm-text) !important; }
html.dark-mode .hp-sr-preview { color: var(--dm-text-faint) !important; }
html.dark-mode .hp-sr-arrow   { color: var(--dm-border2) !important; }

/* Empty state */
html.dark-mode .hp-empty i  { color: var(--dm-surface3) !important; }
html.dark-mode .hp-empty h6 { color: var(--dm-text-muted) !important; }
html.dark-mode .hp-empty p  { color: var(--dm-text-faint) !important; }

/* AI chat messages area */
html.dark-mode #helpChatMessages { background: var(--dm-bg) !important; }
html.dark-mode .hc-ai   .hc-bubble { background: var(--dm-surface2) !important; color: var(--dm-text-2) !important; box-shadow: 0 1px 3px rgba(0,0,0,.3) !important; }
html.dark-mode .hc-ai   .hc-avatar { background: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }
html.dark-mode .hc-user .hc-avatar { background: var(--dm-surface3) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .hc-cta-btn { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.3) !important; color: #a5b4fc !important; }
html.dark-mode .hc-cta-btn:hover { background: rgba(99,102,241,.25) !important; border-color: rgba(99,102,241,.45) !important; color: #c7d2fe !important; }
html.dark-mode .hc-typing-dots span { background: var(--dm-text-faint) !important; }

/* Unified input row */
html.dark-mode #helpUnifiedRow  { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode #helpUnifiedIcon { color: var(--dm-text-faint) !important; }
html.dark-mode #helpUnifiedInput { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode #helpUnifiedInput:focus { border-color: #6366f1 !important; background: var(--dm-surface3) !important; }
html.dark-mode #helpUnifiedInput::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode #helpUnifiedClear { color: var(--dm-text-muted) !important; }
html.dark-mode #helpUnifiedClear:hover { color: var(--dm-text) !important; }

/* AI mode indicator bar */
html.dark-mode #helpAiModeBar { background: rgba(99,102,241,.12) !important; border-top-color: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }
html.dark-mode #helpAiModeBar button { color: #a5b4fc !important; }
html.dark-mode #helpAiModeBar button:hover { color: #c7d2fe !important; }

html.dark-mode #spConfirmPanel { background: var(--dm-surface) !important; color: var(--dm-text) !important; }

/* ── spConfirm (confirmation panel) ────────────────────────────────────── */
html.dark-mode #spConfirmOverlay { background: rgba(0,0,0,.6) !important; }
html.dark-mode #spConfirmBox { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; box-shadow: 0 20px 60px rgba(0,0,0,.5) !important; }
html.dark-mode #spConfirmTitle { color: var(--dm-text) !important; }
html.dark-mode #spConfirmMsg { color: var(--dm-text-muted) !important; }
html.dark-mode #spConfirmCancel { background: var(--dm-surface2) !important; color: var(--dm-text) !important; border-color: var(--dm-border) !important; }

/* ── Toast / notifications ──────────────────────────────────────────────── */
html.dark-mode .toast { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .toast-header { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }

/* ── Profile & user views ───────────────────────────────────────────────── */
html.dark-mode .profile-icon { background-color: #374151 !important; }

/* ── Media Library ──────────────────────────────────────────────────────── */
html.dark-mode .media-card,
html.dark-mode .media-item { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .media-filename { color: var(--dm-text) !important; }
html.dark-mode .media-meta { color: var(--dm-text-muted) !important; }

/* ── ACL / Roles page ───────────────────────────────────────────────────── */
html.dark-mode .acl-toolbar { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .acl-search { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .acl-page-bg { background: var(--dm-bg) !important; }

html.dark-mode .acl-role-card,
html.dark-mode .role-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .acl-role-card-footer { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode .acl-role-name { color: var(--dm-text) !important; }
html.dark-mode .acl-role-desc { color: var(--dm-text-muted) !important; }
html.dark-mode .acl-role-badge-system { background: rgba(99,102,241,.18) !important; color: #a5b4fc !important; }
html.dark-mode .acl-member-pill { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }

html.dark-mode .acl-btn-members { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.3) !important; }
html.dark-mode .acl-btn-perms   { background: rgba(124,58,237,.15) !important; border-color: rgba(124,58,237,.3) !important; }
html.dark-mode .acl-btn-edit    { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .acl-btn-delete  { background: var(--dm-surface2) !important; }
html.dark-mode .acl-btn-edit:hover  { background: var(--dm-border) !important; color: var(--dm-text) !important; }

html.dark-mode .slide-panel-acl { background: var(--dm-surface) !important; }
html.dark-mode .acl-panel-header { background: linear-gradient(135deg, var(--dm-surface2) 0%, var(--dm-surface) 100%) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .acl-panel-header-icon { background: rgba(99,102,241,.2) !important; }
html.dark-mode .acl-panel-header h5 { color: var(--dm-text) !important; }
html.dark-mode .acl-panel-header-sub { color: var(--dm-text-muted) !important; }
html.dark-mode .acl-panel-close { color: var(--dm-text-muted) !important; }
html.dark-mode .acl-panel-close:hover { background: var(--dm-surface2) !important; color: var(--dm-text) !important; border-color: var(--dm-border) !important; }
html.dark-mode .slide-panel-body { background: var(--dm-bg) !important; }
html.dark-mode .slide-panel-footer { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }

html.dark-mode .acl-field label,
html.dark-mode .acl-members-label,
html.dark-mode .acl-assign-box label { color: var(--dm-text-muted) !important; }
html.dark-mode .acl-field .form-control { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }

html.dark-mode .acl-footer-btn-ghost { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .acl-footer-btn-ghost:hover { background: var(--dm-border) !important; }

html.dark-mode .permission-item { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .perm-name { color: var(--dm-text) !important; }
html.dark-mode .perm-desc { color: var(--dm-text-muted) !important; }

html.dark-mode .acl-assign-box { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .acl-assign-box .small { color: var(--dm-text-muted) !important; }
html.dark-mode .acl-assign-row select { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }

html.dark-mode .member-item { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .member-name  { color: var(--dm-text) !important; }
html.dark-mode .member-email { color: var(--dm-text-muted) !important; }

html.dark-mode .acl-confirm-box { background: var(--dm-surface) !important; }
html.dark-mode .acl-confirm-title { color: var(--dm-text) !important; }
html.dark-mode .acl-confirm-msg   { color: var(--dm-text-muted) !important; }

/* ── Schedule Manager ───────────────────────────────────────────────────── */
html.dark-mode .schedule-card,
html.dark-mode .sched-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .sched-time { color: var(--dm-text-muted) !important; }

/* ── Automation page ────────────────────────────────────────────────────── */
html.dark-mode .rule-card,
html.dark-mode .automation-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }

/* ── AI Credits page ────────────────────────────────────────────────────── */
html.dark-mode .credits-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }

/* ── Inline-style overrides (catch-all for common light patterns) ─────────
   These catch inline style="background:#fff" etc. on generic containers.    */
html.dark-mode .content-wrapper div[style*="background:#fff"],
html.dark-mode .content-wrapper div[style*="background: #fff"],
html.dark-mode .content-wrapper div[style*="background:white"],
html.dark-mode .content-wrapper div[style*="background: white"] {
    background: var(--dm-surface) !important;
}
html.dark-mode .content-wrapper div[style*="background:#f8fafc"],
html.dark-mode .content-wrapper div[style*="background: #f8fafc"],
html.dark-mode .content-wrapper div[style*="background:#f1f5f9"],
html.dark-mode .content-wrapper div[style*="background: #f1f5f9"],
html.dark-mode .content-wrapper div[style*="background:#fafbfc"],
html.dark-mode .content-wrapper div[style*="background: #fafbfc"] {
    background: var(--dm-surface2) !important;
}
html.dark-mode .content-wrapper [style*="color:#1e293b"],
html.dark-mode .content-wrapper [style*="color: #1e293b"],
html.dark-mode .content-wrapper [style*="color:#0f172a"],
html.dark-mode .content-wrapper [style*="color: #0f172a"],
html.dark-mode .content-wrapper [style*="color:#334155"],
html.dark-mode .content-wrapper [style*="color: #334155"],
html.dark-mode .content-wrapper [style*="color:#374151"],
html.dark-mode .content-wrapper [style*="color: #374151"],
html.dark-mode .content-wrapper [style*="color:#475569"],
html.dark-mode .content-wrapper [style*="color: #475569"] {
    color: var(--dm-text) !important;
}
html.dark-mode .content-wrapper [style*="border-color:#e2e8f0"],
html.dark-mode .content-wrapper [style*="border-bottom:1px solid #e2e8f0"],
html.dark-mode .content-wrapper [style*="border-top:1px solid #e2e8f0"] {
    border-color: var(--dm-border) !important;
}
html.dark-mode .content-wrapper [style*="color:#64748b"],
html.dark-mode .content-wrapper [style*="color: #64748b"] {
    color: var(--dm-text-muted) !important;
}
html.dark-mode .content-wrapper [style*="color:#94a3b8"],
html.dark-mode .content-wrapper [style*="color: #94a3b8"] {
    color: var(--dm-text-faint) !important;
}

/* ── Scrollbars ─────────────────────────────────────────────────────────── */
html.dark-mode ::-webkit-scrollbar { width: 8px; height: 8px; }
html.dark-mode ::-webkit-scrollbar-track { background: var(--dm-bg); }
html.dark-mode ::-webkit-scrollbar-thumb { background: var(--dm-surface3); border-radius: 4px; }
html.dark-mode ::-webkit-scrollbar-thumb:hover { background: #3f5370; }

/* ── Checklist List page (cl-*, mr-stat-card, mc-section, AI panel) ─────── */

/* Tab bar */
html.dark-mode .cl-tab-bar { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .cl-tab-btn { color: var(--dm-text-muted) !important; }
html.dark-mode .cl-tab-btn:not(.active):hover { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }
html.dark-mode .cl-tab-btn:not(.active) .cl-tab-count { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .cl-tab-btn:not(.active) .cl-tab-count.active-dot { background: rgba(220,38,38,.2) !important; color: #fca5a5 !important; }

/* Search toolbar */
html.dark-mode .cl-search-input { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .cl-search-input:focus { background: var(--dm-surface2) !important; border-color: #6366f1 !important; }
html.dark-mode .cl-search-icon { color: var(--dm-text-faint) !important; }
html.dark-mode .cl-count-label { color: var(--dm-text-muted) !important; }

/* Checklist cards */
html.dark-mode .cl-card { background: var(--dm-surface) !important; box-shadow: 0 1px 4px rgba(0,0,0,.3), 0 0 0 1px var(--dm-border) !important; }
html.dark-mode .cl-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.4), 0 0 0 1px rgba(99,102,241,.35) !important; }
html.dark-mode .cl-card-icon { background: rgba(255,255,255,.07) !important; }
html.dark-mode .cl-card-name { color: var(--dm-text) !important; }
html.dark-mode .cl-card-desc { color: var(--dm-text-muted) !important; }
html.dark-mode .cl-card-desc--empty { color: var(--dm-text-faint) !important; }
html.dark-mode .cl-card-footer { border-top-color: var(--dm-border) !important; }
html.dark-mode .cl-card-meta { color: var(--dm-text-faint) !important; }

/* Ordered badge */
html.dark-mode .cl-ordered-badge.is-ordered  { background: rgba(91,33,182,.2) !important; color: #c4b5fd !important; }
html.dark-mode .cl-ordered-badge.not-ordered { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }

/* Card action buttons */
html.dark-mode .cl-btn-run-card { background: rgba(21,128,61,.15) !important; color: #86efac !important; }
html.dark-mode .cl-btn-run-card:hover { background: #166534 !important; color: #fff !important; }
html.dark-mode .cl-btn-open { background: rgba(67,56,202,.15) !important; color: #a5b4fc !important; }
html.dark-mode .cl-btn-open:hover { background: #4338ca !important; color: #fff !important; text-decoration: none !important; }
html.dark-mode .cl-btn-delete { background: transparent !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .cl-btn-delete:hover { background: rgba(185,28,28,.15) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.3) !important; }

/* Empty state */
html.dark-mode .cl-empty-icon { background: var(--dm-surface2) !important; }
html.dark-mode .cl-empty-title { color: var(--dm-text) !important; }
html.dark-mode .cl-empty-sub { color: var(--dm-text-muted) !important; }

/* My Runs stat cards */
html.dark-mode .mr-stat-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .mr-stat-icon.blue  { background: rgba(59,130,246,.15) !important; }
html.dark-mode .mr-stat-icon.green { background: rgba(16,185,129,.15) !important; }
html.dark-mode .mr-stat-icon.amber { background: rgba(245,158,11,.15) !important; }
html.dark-mode .mr-stat-icon.red   { background: rgba(220,38,38,.15)  !important; }
html.dark-mode .mr-stat-value { color: var(--dm-text) !important; }
html.dark-mode .mr-stat-label { color: var(--dm-text-muted) !important; }

/* My Runs section wrapper */
html.dark-mode .mc-section { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .mc-section-header { border-color: var(--dm-border) !important; }
html.dark-mode .mc-section-title { color: var(--dm-text) !important; }
html.dark-mode .mc-section-title .count-badge { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .mc-empty-icon { background: rgba(16,185,129,.1) !important; }

/* AI Assistant Panel */
html.dark-mode .ai-modify-content { background: var(--dm-surface) !important; box-shadow: 0 10px 40px rgba(0,0,0,.5) !important; }
html.dark-mode .ai-modify-messages { background: var(--dm-surface2) !important; }
html.dark-mode .ai-message-assistant .ai-message-content { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text-2) !important; }
html.dark-mode .ai-message-assistant .ai-message-content li { color: var(--dm-text-muted) !important; }
html.dark-mode .ai-message-loading .ai-message-content { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .ai-message-loading .spinner { border-color: var(--dm-border2) !important; border-top-color: #8b5cf6 !important; }
html.dark-mode .ai-modify-input-container { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode .ai-modify-input-container textarea { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }

/* ── Schedule Manager (sm-*) ─────────────────────────────────────────────── */

/* Main sections */
html.dark-mode .sm-section { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .sm-section-header { border-color: var(--dm-border) !important; background: var(--dm-surface2) !important; }
html.dark-mode .sm-section-title { color: var(--dm-text) !important; }
html.dark-mode .sm-section-icon { background: rgba(99,102,241,.2) !important; }
html.dark-mode .sm-section-body { color: var(--dm-text) !important; }

/* Subsection divider & header */
html.dark-mode .sm-subsection-divider { background: var(--dm-border) !important; }
html.dark-mode .sm-subsection-header { color: var(--dm-text-muted) !important; }
html.dark-mode .sm-sub-scheduled { background: rgba(29,78,216,.15)  !important; color: #93c5fd !important; }
html.dark-mode .sm-sub-active    { background: rgba(180,83,9,.15)   !important; color: #fcd34d !important; }
html.dark-mode .sm-sub-done      { background: rgba(21,128,61,.15)  !important; color: #86efac !important; }
html.dark-mode .sm-sub-badge     { color: var(--dm-text) !important; }
html.dark-mode .sm-sub-badge-blue  { background: rgba(29,78,216,.15)  !important; color: #93c5fd !important; }
html.dark-mode .sm-sub-badge-amber { background: rgba(180,83,9,.15)   !important; color: #fcd34d !important; }
html.dark-mode .sm-sub-badge-green { background: rgba(21,128,61,.15)  !important; color: #86efac !important; }

/* View all link */
html.dark-mode .sm-view-all-link { color: #93c5fd !important; }
html.dark-mode .sm-view-all-link:hover { color: #a5b4fc !important; }

/* Table */
html.dark-mode .sm-table { color: var(--dm-text) !important; }
html.dark-mode .sm-table thead th { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .sm-table tbody tr { border-color: var(--dm-border) !important; }
html.dark-mode .sm-table tbody tr:hover { background: var(--dm-surface2) !important; }
html.dark-mode .sm-table td { color: var(--dm-text) !important; }
html.dark-mode .sm-cell-primary   { color: var(--dm-text) !important; }
html.dark-mode .sm-cell-secondary { color: var(--dm-text-muted) !important; }
html.dark-mode .sm-muted          { color: var(--dm-text-faint) !important; }

/* Date badge */
html.dark-mode .sm-date-badge { background: rgba(29,78,216,.15) !important; color: #93c5fd !important; border-color: rgba(29,78,216,.25) !important; }

/* Progress */
html.dark-mode .sm-progress-bar   { background: var(--dm-surface2) !important; }
html.dark-mode .sm-progress-label { color: var(--dm-text-muted) !important; }

/* Overdue */
html.dark-mode .sm-overdue-text  { color: #fca5a5 !important; }
html.dark-mode .sm-overdue-badge { background: rgba(185,28,28,.15) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .sm-row-overdue       { background: rgba(185,28,28,.07) !important; }
html.dark-mode .sm-row-overdue:hover { background: rgba(185,28,28,.13) !important; }

/* Duration badge */
html.dark-mode .sm-duration { background: rgba(21,128,61,.12) !important; color: #86efac !important; }

/* Buttons */
html.dark-mode .sm-btn-outline       { background: var(--dm-surface2) !important; color: #a5b4fc !important; border-color: rgba(99,102,241,.3) !important; }
html.dark-mode .sm-btn-outline:hover { background: rgba(99,102,241,.15) !important; }
html.dark-mode .sm-btn-danger-ghost       { background: transparent !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.3) !important; }
html.dark-mode .sm-btn-danger-ghost:hover { background: rgba(185,28,28,.12) !important; }

/* Empty state */
html.dark-mode .sm-empty-state { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .sm-empty-state i { color: var(--dm-text-faint) !important; }
html.dark-mode .sm-empty-state p { color: var(--dm-text-muted) !important; }

/* Confirm dialog */
html.dark-mode .confirm-dialog-overlay { background: rgba(0,0,0,.6) !important; }
html.dark-mode .confirm-dialog-box { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; box-shadow: 0 20px 60px rgba(0,0,0,.5) !important; }

/* AI panel */
html.dark-mode .sm-ai-content { background: var(--dm-surface) !important; box-shadow: 0 10px 40px rgba(0,0,0,.5) !important; }
html.dark-mode .sm-ai-messages { background: var(--dm-surface2) !important; }
html.dark-mode .sm-ai-msg-assistant .sm-ai-msg-content { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text-2) !important; }
html.dark-mode .sm-ai-msg-assistant .sm-ai-msg-content li { color: var(--dm-text-muted) !important; }
html.dark-mode .sm-ai-msg-loading .sm-ai-msg-content { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .sm-ai-msg-loading .sm-spinner { border-color: var(--dm-border2) !important; border-top-color: #8b5cf6 !important; }
html.dark-mode .sm-ai-msg-error .sm-ai-msg-content { background: rgba(185,28,28,.15) !important; border-color: rgba(185,28,28,.3) !important; color: #fca5a5 !important; }
html.dark-mode .sm-ai-input-row { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode .sm-ai-textarea { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .sm-ai-textarea:focus { border-color: #8b5cf6 !important; }

/* Task chips */
html.dark-mode .sm-task-chip { background: rgba(109,40,217,.18) !important; color: #c4b5fd !important; border-color: rgba(109,40,217,.3) !important; }
html.dark-mode .sm-task-chip:hover { background: rgba(109,40,217,.28) !important; }

/* Task detail modal panel */
html.dark-mode .sm-task-modal-panel { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode .sm-task-modal-body { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode .sm-task-field-label { color: var(--dm-text-faint) !important; }
html.dark-mode .sm-task-field-value { color: var(--dm-text) !important; }
html.dark-mode .sm-task-loading { color: var(--dm-text-muted) !important; }
html.dark-mode .sm-task-loading .sm-spinner { border-color: var(--dm-border2) !important; border-top-color: #8b5cf6 !important; }
html.dark-mode .sm-task-badge-todo       { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .sm-task-badge-inprogress { background: rgba(133,77,14,.2) !important; color: #fcd34d !important; }
html.dark-mode .sm-task-badge-done       { background: rgba(22,101,52,.2) !important; color: #86efac !important; }
html.dark-mode .sm-task-badge-overdue    { background: rgba(153,27,27,.2) !important; color: #fca5a5 !important; }

/* ── Work Orders — Slide Panels (wo-sp-*) ───────────────────────────────── */

/* Panel container & overlay */
html.dark-mode .wo-sp-panel { background: var(--dm-surface) !important; }

/* Header */
html.dark-mode .wo-sp-header { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .wo-sp-header span { color: var(--dm-text) !important; }
html.dark-mode .wo-sp-header button { color: var(--dm-text-muted) !important; }
html.dark-mode .wo-sp-header button:hover { color: var(--dm-text) !important; }

/* Body & footer */
html.dark-mode .wo-sp-body { background: var(--dm-surface) !important; }
html.dark-mode .wo-sp-footer { background: var(--dm-surface) !important; border-top-color: var(--dm-border) !important; }

/* Fields */
html.dark-mode .wo-sp-field label { color: var(--dm-text-muted) !important; }
html.dark-mode .wo-sp-input { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .wo-sp-input:focus { border-color: #6366f1 !important; }
html.dark-mode .wo-toggle-label { color: var(--dm-text-muted) !important; }

/* Info box */
html.dark-mode .wo-sp-info { background: rgba(3,105,161,.12) !important; border-color: rgba(56,189,248,.2) !important; color: #7dd3fc !important; }

/* Buttons */
html.dark-mode .wo-sp-btn-cancel { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .wo-sp-btn-cancel:hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }

/* ── Work Orders — Confirm Dialog (wo-confirm-*) ─────────────────────────── */
html.dark-mode .wo-confirm-box { background: var(--dm-surface) !important; box-shadow: 0 12px 40px rgba(0,0,0,.5) !important; }
html.dark-mode .wo-confirm-title { color: var(--dm-text) !important; }
html.dark-mode .wo-confirm-body  { color: var(--dm-text-muted) !important; }
html.dark-mode .wo-confirm-cancel { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .wo-confirm-cancel:hover { background: var(--dm-surface3) !important; }

/* ── Work Orders — Table row action buttons ──────────────────────────────── */
html.dark-mode .wo-row-btn { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .wo-row-btn:hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .wo-row-btn-danger { background: rgba(185,28,28,.12) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .wo-row-btn-danger:hover { background: rgba(185,28,28,.22) !important; }

/* ── Work Orders — Template card buttons ─────────────────────────────────── */
html.dark-mode .wo-tpl-btn-outline { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border) !important; }
html.dark-mode .wo-tpl-btn-outline:hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .wo-tpl-btn-danger { background: rgba(185,28,28,.12) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .wo-tpl-btn-danger:hover { background: rgba(185,28,28,.22) !important; }

/* ── Orgchart / People page (po-*) ─────────────────────────────────────── */
/* Override the CSS token variables used throughout the orgchart page */
html.dark-mode { --c-border: rgba(255,255,255,0.08); --c-bg: #1e293b; --c-text: #e2e8f0; --c-muted: #94a3b8; --c-faint: #64748b; }

html.dark-mode .po-setup { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .po-setup-title { color: var(--dm-text) !important; }
html.dark-mode .po-step-num { background: rgba(99,102,241,.2) !important; border-color: rgba(99,102,241,.4) !important; color: #a5b4fc !important; }
html.dark-mode .po-step-label { color: var(--dm-text) !important; }
html.dark-mode .po-step:not(:last-child)::after { background: var(--dm-border) !important; }

html.dark-mode .po-tabbar { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .po-tab { color: var(--dm-text-muted) !important; border-bottom-color: transparent !important; }
html.dark-mode .po-tab:hover { color: var(--dm-text) !important; }
html.dark-mode .po-tab.active { color: #a5b4fc !important; border-bottom-color: #6366f1 !important; }
html.dark-mode .po-tab-badge { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .po-tab.active .po-tab-badge { background: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }

html.dark-mode .po-filter-bar { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .po-search-wrap { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .po-search-inp { background: transparent !important; color: var(--dm-text) !important; }
html.dark-mode .po-search-inp::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode .po-chip { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .po-chip.active { background: #6366f1 !important; border-color: #6366f1 !important; color: #fff !important; }

html.dark-mode .po-item-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .po-item-card:hover { border-color: rgba(99,102,241,.4) !important; box-shadow: 0 4px 16px rgba(0,0,0,.4) !important; }
html.dark-mode .po-item-header { border-bottom-color: var(--dm-border) !important; background: var(--dm-surface2) !important; }
html.dark-mode .po-item-footer { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode .po-item-name { color: var(--dm-text) !important; }
html.dark-mode .po-item-role,
html.dark-mode .po-item-meta { color: var(--dm-text-muted) !important; }

html.dark-mode .po-table thead th { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border) !important; }
html.dark-mode .po-table tbody td { color: var(--dm-text-muted) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .po-table tbody tr:hover td { background: var(--dm-surface2) !important; }
html.dark-mode .po-badge-inactive { background: var(--dm-surface2) !important; color: var(--dm-text-faint) !important; }
html.dark-mode .po-badge-inactive::before { background: var(--dm-text-faint) !important; }

html.dark-mode .po-icon-btn { background: var(--dm-surface) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .po-icon-btn:hover { background: var(--dm-surface2) !important; color: var(--dm-text) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .po-icon-btn-danger:hover { background: rgba(185,28,28,.15) !important; border-color: rgba(185,28,28,.3) !important; color: #fca5a5 !important; }
html.dark-mode .po-assign-btn { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.3) !important; color: #a5b4fc !important; }

html.dark-mode .po-page-btn { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .po-page-btn:hover { background: var(--dm-surface2) !important; }
html.dark-mode .po-page-btn.active { background: #6366f1 !important; border-color: #6366f1 !important; color: #fff !important; }

/* Slide panel (po-sp-*) */
html.dark-mode .po-sp-hd { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .po-sp-hd-danger { background: rgba(185,28,28,.15) !important; border-bottom-color: rgba(185,28,28,.25) !important; }
html.dark-mode .po-sp-x:hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .po-sp-body { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode .po-sp-footer { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode .po-sp-field label { color: var(--dm-text-muted) !important; }
html.dark-mode .po-sp-cancel { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .po-sp-cancel:hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .po-sp-delete { background: rgba(185,28,28,.12) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .po-sp-save { background: #6366f1 !important; border-color: #4f46e5 !important; }

/* ── AI Agent Chat page ──────────────────────────────────────────────────── */
html.dark-mode .agent-chat-container { background: var(--dm-bg) !important; }
html.dark-mode .chat-sidebar { background: var(--dm-surface) !important; border-right-color: var(--dm-border) !important; }
html.dark-mode .sidebar-header { border-bottom-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .sidebar-header h5 { color: var(--dm-text) !important; }
html.dark-mode .quick-status-card { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .status-label { color: var(--dm-text-faint) !important; }
html.dark-mode .conversation-item:hover { background: var(--dm-surface2) !important; }
html.dark-mode .conversation-item.active { background: rgba(99,102,241,.15) !important; }
html.dark-mode .conv-title { color: var(--dm-text) !important; }
html.dark-mode .conv-date { color: var(--dm-text-faint) !important; }
html.dark-mode .quick-actions { border-top-color: var(--dm-border) !important; }
html.dark-mode .action-label { color: var(--dm-text-faint) !important; }
html.dark-mode .quick-action-btn { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }
html.dark-mode .quick-action-btn:hover { background: var(--dm-surface3) !important; }
html.dark-mode .chat-main { background: var(--dm-surface) !important; }
html.dark-mode .chat-header { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .chat-title h5 { color: var(--dm-text) !important; }
html.dark-mode .chat-subtitle { color: var(--dm-text-muted) !important; }
html.dark-mode .chat-messages { background: var(--dm-bg) !important; }
html.dark-mode .message.assistant .message-avatar { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .message.assistant .message-content { background: var(--dm-surface2) !important; color: var(--dm-text-2) !important; }
html.dark-mode .message-time { color: var(--dm-text-faint) !important; }
html.dark-mode .suggestion-btn { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .suggestion-btn:hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .typing-indicator span { background: var(--dm-text-faint) !important; }
html.dark-mode .chat-input-area { border-top-color: var(--dm-border) !important; background: var(--dm-surface) !important; }
html.dark-mode .input-hints { color: var(--dm-text-faint) !important; }
html.dark-mode .send-btn:disabled { background: var(--dm-surface3) !important; }

/* ── Checklist Viewer — AI components ───────────────────────────────────── */
html.dark-mode .ai-reasoning-overview { color: var(--dm-text-2) !important; }
html.dark-mode .ai-reasoning-section-title { color: var(--dm-text-faint) !important; }
html.dark-mode .ai-reasoning-list li { color: var(--dm-text-muted) !important; }
html.dark-mode .ai-reasoning-loading .spinner { border-color: var(--dm-border2) !important; border-top-color: #8b5cf6 !important; }
html.dark-mode .ai-ops-decision-title { color: var(--dm-text) !important; }
html.dark-mode .ai-ops-decision-desc { color: var(--dm-text-muted) !important; }
html.dark-mode .ai-ops-decision.severity-critical { background: linear-gradient(135deg, var(--dm-surface2) 0%, rgba(185,28,28,.2) 100%) !important; }
html.dark-mode .ai-validation-result.valid   { background: rgba(5,150,105,.12) !important; border-color: rgba(5,150,105,.25) !important; }
html.dark-mode .ai-validation-result.invalid { background: rgba(185,28,28,.12) !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .ai-validation-result.warning { background: rgba(180,83,9,.12) !important; border-color: rgba(180,83,9,.25) !important; }
html.dark-mode .ai-validation-summary { color: var(--dm-text) !important; }
html.dark-mode .ai-validation-details { color: var(--dm-text-muted) !important; }
html.dark-mode .ai-guidance-content { color: var(--dm-text-2) !important; }
html.dark-mode .ai-guidance-loading .spinner { border-color: var(--dm-border2) !important; border-top-color: #0891b2 !important; }
html.dark-mode .verify-btn.active { background: #6366f1 !important; border-color: #4f46e5 !important; color: #fff !important; }

/* ── Operations Manager — extras ────────────────────────────────────────── */
html.dark-mode .ops-header { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .ops-health-badge.good    { background: rgba(5,150,105,.15) !important; color: #34d399 !important; border-color: rgba(5,150,105,.25) !important; }
html.dark-mode .ops-health-badge.warning { background: rgba(180,83,9,.15) !important; color: #fcd34d !important; border-color: rgba(180,83,9,.25) !important; }
html.dark-mode .ops-health-badge.bad     { background: rgba(185,28,28,.15) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .ops-progress-bar { background: var(--dm-surface2) !important; }
html.dark-mode .ops-task-title { color: var(--dm-text) !important; }
html.dark-mode .ops-task-meta,
html.dark-mode .ops-task-meta span { color: var(--dm-text-faint) !important; }
html.dark-mode .ops-modal-header { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .ops-modal-body { background: var(--dm-surface) !important; }
html.dark-mode .ops-modal-body .ops-workload-card { background: var(--dm-surface2) !important; }
html.dark-mode .ops-modal-body .ops-workload-card.overloaded { background: rgba(185,28,28,.15) !important; }
html.dark-mode .card-details-stat { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .card-details-stat-value { color: var(--dm-text) !important; }
html.dark-mode .card-details-stat-label { color: var(--dm-text-muted) !important; }
html.dark-mode .card-details-list-item { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .card-details-list-name { color: var(--dm-text) !important; }
html.dark-mode .card-details-run-item { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .card-details-run-name { color: var(--dm-text) !important; }
html.dark-mode .card-details-run-meta .badge-secondary { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }

/* ── Team Kanban — extras ────────────────────────────────────────────────── */
html.dark-mode .tkb-filter-select { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .tkb-filter-select option { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode .tkb-avatar { background: var(--dm-surface3) !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .tkb-filter-bar { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .tkb-filter-chip { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .tkb-filter-chip.active { background: #6366f1 !important; border-color: #6366f1 !important; color: #fff !important; }

/* ── Automation page — extras ───────────────────────────────────────────── */
html.dark-mode .rules-card .table thead th { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border) !important; }
html.dark-mode .rules-card .table tbody tr { border-color: var(--dm-border) !important; }
html.dark-mode .rules-card .table tbody tr:hover { background: var(--dm-surface2) !important; }
html.dark-mode .rule-name,
html.dark-mode .metric-rule-name,
html.dark-mode .metric-exec-name { color: var(--dm-text) !important; }
html.dark-mode .metric-rule-row:hover { background: var(--dm-surface2) !important; box-shadow: none !important; }
html.dark-mode .metric-rule-icon,
html.dark-mode .metric-rule-arrow { color: var(--dm-text-faint) !important; }
html.dark-mode .metric-exec-row { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .empty-state-icon { background: var(--dm-surface2) !important; }
html.dark-mode .empty-state-title { color: var(--dm-text-muted) !important; }
html.dark-mode .section-heading-icon { background: var(--dm-surface2) !important; }
html.dark-mode .badge-status-rejected { background: rgba(185,28,28,.15) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .badge-action-post_webhook { background: rgba(29,78,216,.15) !important; color: #93c5fd !important; border-color: rgba(29,78,216,.25) !important; }
html.dark-mode .execution-icon.rejected { background: rgba(185,28,28,.15) !important; color: #fca5a5 !important; }
/* Rule-panel (rp-*) */
html.dark-mode .rp-label { color: var(--dm-text-muted) !important; }
html.dark-mode .rp-input { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .rp-input:focus { border-color: #6366f1 !important; background: var(--dm-surface2) !important; }
html.dark-mode .rp-input-suffix { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .rp-flow-block { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .rp-flow-arrow-circle { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text-faint) !important; }
html.dark-mode .rp-flow-line { background: var(--dm-border) !important; }
html.dark-mode .rp-toggle-track { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .rp-toggle-thumb { background: var(--dm-surface3) !important; }
html.dark-mode .rp-toggle-title { color: var(--dm-text) !important; }
html.dark-mode .rp-toggle-desc { color: var(--dm-text-muted) !important; }
html.dark-mode .rp-config-section .form-label { color: var(--dm-text-muted) !important; }
html.dark-mode .rp-close:hover { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }
html.dark-mode .rp-btn-cancel { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .rp-btn-cancel:hover { background: var(--dm-surface3) !important; }

/* ── Assets page — extras ───────────────────────────────────────────────── */
html.dark-mode .am-page-bg { background: var(--dm-bg) !important; }
html.dark-mode .am-group-hd { background: none !important; color: var(--dm-text-faint) !important; border-bottom-color: var(--dm-border2) !important; }
html.dark-mode .am-group-hd:hover { color: var(--dm-text-muted) !important; }
html.dark-mode .am-group-hd i { color: var(--dm-text-faint) !important; }
html.dark-mode .am-group-hd:hover i { color: #a5b4fc !important; }
html.dark-mode .am-group-count { background: var(--dm-surface2) !important; color: var(--dm-text-faint) !important; }
html.dark-mode .am-group-chevron { color: var(--dm-text-faint) !important; }
html.dark-mode .am-tab { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .am-tab.active { border-bottom-color: #6366f1 !important; color: #a5b4fc !important; }
html.dark-mode .am-manage-card-hd { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .am-field-lbl { color: var(--dm-text-muted) !important; }
html.dark-mode .am-field-inp { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .am-cc-hd { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .am-sensor-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-sensor-card.selected { border-color: #6366f1 !important; background: rgba(99,102,241,.08) !important; }
html.dark-mode .am-sensor-card-name { color: var(--dm-text) !important; }
html.dark-mode .am-sensor-card-token,
html.dark-mode .am-sensor-card-icon { color: var(--dm-text-muted) !important; }
html.dark-mode .am-asset-row { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-asset-row:hover { background: var(--dm-surface2) !important; }
html.dark-mode .am-asset-row.selected { background: rgba(99,102,241,.08) !important; border-color: #6366f1 !important; }
html.dark-mode .am-asset-row-name { color: var(--dm-text) !important; }
html.dark-mode .am-asset-search { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .am-table th { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-table td { border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .am-devtype-tab { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .am-devtype-tab.active { background: #6366f1 !important; border-color: #4f46e5 !important; color: #fff !important; }
html.dark-mode .am-devtype-tab:hover:not(.active) { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .am-req-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-req-title { color: var(--dm-text) !important; }
html.dark-mode .am-req-list { color: var(--dm-text-muted) !important; }
html.dark-mode .am-pre { background: var(--dm-surface2) !important; color: var(--dm-text-2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-kbd { background: var(--dm-surface3) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .am-inst-note { background: rgba(3,105,161,.12) !important; border-color: rgba(56,189,248,.2) !important; color: #7dd3fc !important; }
html.dark-mode .am-callout-warn { background: rgba(180,83,9,.12) !important; border-color: rgba(180,83,9,.25) !important; color: #fcd34d !important; }
html.dark-mode .am-token-hero-label { color: var(--dm-text-muted) !important; }
html.dark-mode .am-token-hero-topic { color: var(--dm-text) !important; }
html.dark-mode .am-cmd-row .am-copy-btn { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .am-cmd-row .am-copy-btn:hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .am-listener-indicator { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-listener-status-txt { color: var(--dm-text-muted) !important; }
html.dark-mode .am-listener-stop-btn { background: rgba(185,28,28,.12) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .am-listener-stop-btn:hover { background: rgba(185,28,28,.22) !important; }
html.dark-mode .am-empty h5 { color: var(--dm-text-muted) !important; }
html.dark-mode .sensor-row { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .sensor-row:hover { background: var(--dm-surface2) !important; }
html.dark-mode .sensor-name { color: var(--dm-text) !important; }
html.dark-mode .sensor-val { color: var(--dm-text) !important; }
html.dark-mode .sensor-token-val { color: var(--dm-text-muted) !important; }
html.dark-mode .thr-row { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .thr-row:hover { background: var(--dm-surface2) !important; }
html.dark-mode .thr-label { color: var(--dm-text-muted) !important; }
html.dark-mode .thr-input { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .thr-input::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode .unit-chip { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .unit-chip.active { background: #6366f1 !important; border-color: #4f46e5 !important; color: #fff !important; }
html.dark-mode .usage-chart-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .usage-chart-name { color: var(--dm-text) !important; }
html.dark-mode .usage-asset-hd { color: var(--dm-text-muted) !important; }
html.dark-mode .usage-range-btn.active { background: #6366f1 !important; border-color: #4f46e5 !important; color: #fff !important; }
html.dark-mode .usage-range-btn:hover:not(.active) { background: var(--dm-surface2) !important; }

/* ── Assets — panel rebuild (spd-* / sk-* / am-* additions) ─────────────── */
/* Main-page tab bar */
html.dark-mode .am-tabbar { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; box-shadow: 0 1px 3px rgba(0,0,0,.3) !important; }
/* Asset cards: dark-on-dark — raise to surface so they pop */
html.dark-mode .am-asset-card { background: var(--dm-surface) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .am-card-meta { color: var(--dm-text-faint) !important; }
html.dark-mode .am-card-meta strong { color: var(--dm-text-muted) !important; }
/* Manage-tab white cards */
html.dark-mode .am-manage-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-act-btn:hover { background: var(--dm-surface2) !important; color: #a5b4fc !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-act-del:hover { background: rgba(239,68,68,.12) !important; color: #f87171 !important; border-color: rgba(239,68,68,.3) !important; }
/* Live tab & Usage tab inline-styled headings */
html.dark-mode #tab-live h5,
html.dark-mode #tab-usage h5 { color: var(--dm-text) !important; }
html.dark-mode #tab-live p,
html.dark-mode #tab-usage p { color: var(--dm-text-muted) !important; }
/* Usage combined chart container (inline background:#fff) */
html.dark-mode #usageCombinedChart { background: var(--dm-surface) !important; }
html.dark-mode #usageRangePicker { background: var(--dm-surface2) !important; }
/* spd-* tab bar (inside detail panel) */
html.dark-mode .spd-tabs { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .spd-tab { color: var(--dm-text-muted) !important; }
html.dark-mode .spd-tab:hover { color: var(--dm-text) !important; }
html.dark-mode .spd-tab.active { color: #a5b4fc !important; border-bottom-color: #6366f1 !important; }
/* Sensor tiles */
html.dark-mode .spd-sensor-tile { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: 0 1px 4px rgba(0,0,0,.25) !important; }
html.dark-mode .spd-sensor-tile:hover { box-shadow: 0 4px 12px rgba(0,0,0,.35) !important; }
/* Content cards */
html.dark-mode .spd-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .spd-card-hd { color: var(--dm-text-muted) !important; border-bottom-color: var(--dm-border) !important; }
/* Chip button (light-blue → dark-blue) */
html.dark-mode .spd-chip-btn { background: rgba(59,130,246,.12) !important; border-color: rgba(59,130,246,.3) !important; color: #93c5fd !important; }
html.dark-mode .spd-chip-btn:hover { background: rgba(59,130,246,.22) !important; }
/* Skill cards */
html.dark-mode .sk-active-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .sk-upsell-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .sk-upsell-card:hover { box-shadow: 0 2px 8px rgba(99,102,241,.2) !important; }
/* Purchased/not-linked upsell highlight (overrides inline border/bg) */
html.dark-mode .sk-upsell-card[style*="#eef2ff"],
html.dark-mode .sk-upsell-card[style*="#c7d2fe"] { background: rgba(99,102,241,.1) !important; border-color: rgba(99,102,241,.35) !important; }
/* Result pills */
html.dark-mode .sk-result-pill { background: rgba(99,102,241,.18) !important; color: #a5b4fc !important; }
html.dark-mode .sk-result-warn  { background: rgba(180,83,9,.18) !important; color: #fcd34d !important; }
html.dark-mode .sk-result-ok    { background: rgba(16,185,129,.18) !important; color: #6ee7b7 !important; }
html.dark-mode .am-wiz-step-title { color: var(--dm-text) !important; }
html.dark-mode .am-wiz-step-sub   { color: var(--dm-text-muted) !important; }
html.dark-mode .am-wiz-step-body  { color: var(--dm-text-2) !important; }
html.dark-mode .am-wiz-rail-dot { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; }
html.dark-mode .am-wiz-rail-item.active .am-wiz-rail-dot { background: #6366f1 !important; border-color: #4f46e5 !important; }
html.dark-mode .am-wiz-rail-item.done .am-wiz-rail-dot  { background: #10b981 !important; border-color: #059669 !important; }
html.dark-mode .am-wiz-rail-item + .am-wiz-rail-item::before { background: var(--dm-border) !important; }
html.dark-mode .am-wiz-btn-secondary { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .am-wiz-btn-secondary:hover:not(:disabled) { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .am-tuya-cfg-hd { color: var(--dm-text) !important; }
html.dark-mode .am-tuya-cfg-sub { color: var(--dm-text-muted) !important; }
html.dark-mode .am-tuya-ch-table th { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; border-color: var(--dm-border) !important; }
html.dark-mode .am-tuya-ch-table td { border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .am-tuya-step-num   { background: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }
html.dark-mode .am-tuya-step-title { color: var(--dm-text) !important; }
html.dark-mode .status-retired { background: var(--dm-surface2) !important; color: var(--dm-text-faint) !important; }
html.dark-mode .status-retired::before { background: var(--dm-text-faint) !important; }
html.dark-mode .am-bm-val { color: var(--dm-text) !important; }
html.dark-mode .t-cmt { color: var(--dm-text-muted) !important; }
html.dark-mode .sp-section-hd { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .sp-action-btn { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .sp-btn-cancel { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .sp-btn-cancel:hover { background: var(--dm-surface3) !important; }
html.dark-mode .sp-btn-delete { background: rgba(185,28,28,.12) !important; color: #fca5a5 !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode .sp-btn-save { background: #6366f1 !important; border-color: #4f46e5 !important; }
html.dark-mode .sp-field .form-control { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .sp-field label { color: var(--dm-text-muted) !important; }
html.dark-mode .am-act-btn:hover { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }
html.dark-mode .am-act-del:hover { background: rgba(185,28,28,.12) !important; color: #fca5a5 !important; }
html.dark-mode .am-btn-ghost { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .am-btn-ghost:hover { background: var(--dm-surface3) !important; }
html.dark-mode .am-ring { border-color: var(--dm-border2) !important; }

/* ── Employees page — hardcoded gaps missed in first pass ───────────────── */
html.dark-mode .po-toolbar  { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .po-card     { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .po-page-bg  { background: var(--dm-bg) !important; }
html.dark-mode .po-search   { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .po-search::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode .po-avatar   { background: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }
html.dark-mode .po-name-text  { color: var(--dm-text) !important; }
html.dark-mode .po-email-text { color: var(--dm-text-faint) !important; }
html.dark-mode .po-table tbody tr:hover td { background: var(--dm-surface2) !important; }
html.dark-mode .po-badge-active   { background: rgba(5,150,105,.15) !important; color: #34d399 !important; }
html.dark-mode .po-badge-active::before   { background: #10b981 !important; }
html.dark-mode .po-badge-inactive { background: var(--dm-surface2) !important; color: var(--dm-text-faint) !important; }
html.dark-mode .po-badge-inactive::before { background: var(--dm-text-faint) !important; }
html.dark-mode .po-item-icon    { background: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }
html.dark-mode .po-item-name    { color: var(--dm-text) !important; }
html.dark-mode .po-item-sub     { color: var(--dm-text-faint) !important; }
html.dark-mode .po-item-footer  { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode .po-assign-btn   { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.35) !important; color: #a5b4fc !important; }
html.dark-mode .po-assign-btn:hover { background: rgba(99,102,241,.25) !important; border-color: rgba(99,102,241,.5) !important; }
html.dark-mode .po-icon-btn       { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .po-icon-btn-danger { border-color: rgba(185,28,28,.3) !important; color: #fca5a5 !important; }
html.dark-mode .po-page-btn { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .po-empty i  { color: var(--dm-text-faint) !important; }
html.dark-mode .po-empty h5 { color: var(--dm-text-muted) !important; }
html.dark-mode .po-empty    { color: var(--dm-text-faint) !important; }

/* Slide panel header gradient + icon */
html.dark-mode .po-sp-hd { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode .po-sp-hd-danger { background: rgba(185,28,28,.2) !important; color: #fca5a5 !important; border-bottom-color: rgba(185,28,28,.3) !important; }
html.dark-mode .po-sp-icon        { background: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }
html.dark-mode .po-sp-icon-danger { background: rgba(185,28,28,.15) !important; color: #fca5a5 !important; }
html.dark-mode .po-sp-x:hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .po-sp-body  { background: var(--dm-surface) !important; }
html.dark-mode .po-sp-footer { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode .po-sp-field label { color: var(--dm-text-muted) !important; }
html.dark-mode .po-sp-cancel { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .po-sp-cancel:hover { background: var(--dm-surface3) !important; }

/* ── Employee Performance Report (rep-*) ───────────────────────────────── */
html.dark-mode .rep-toolbar { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .rep-date-input { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .rep-date-input::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode .rep-range-select { background-color: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .rep-spinner { border-color: var(--dm-border2) !important; border-top-color: #6366f1 !important; }
html.dark-mode .rep-page-bg { background: var(--dm-bg) !important; }
html.dark-mode .rep-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .rep-card-header { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .rep-card-title { color: var(--dm-text) !important; }
html.dark-mode .rep-empty-icon { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-faint) !important; }
html.dark-mode .rep-empty-title { color: var(--dm-text-muted) !important; }
html.dark-mode .rep-empty-sub   { color: var(--dm-text-faint) !important; }
html.dark-mode .rep-avatar { background: rgba(99,102,241,.2) !important; color: #a5b4fc !important; }
html.dark-mode .rep-user-email { color: var(--dm-text) !important; }
html.dark-mode .rep-user-desig { color: var(--dm-text-faint) !important; }
html.dark-mode .rep-item-name  { color: var(--dm-text) !important; }
html.dark-mode .rep-item-desc  { color: var(--dm-text-faint) !important; }
html.dark-mode .rep-badge-checklist { background: rgba(29,78,216,.15) !important; color: #93c5fd !important; }
html.dark-mode .rep-badge-task      { background: rgba(5,150,105,.15) !important; color: #34d399 !important; }

/* DataTable inside rep-table-wrap */
html.dark-mode #rep-table-wrap table.dataTable thead th { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; color: var(--dm-text-faint) !important; }
html.dark-mode #rep-table-wrap table.dataTable tbody td { border-bottom-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode #rep-table-wrap table.dataTable tbody tr:hover td,
html.dark-mode .rep-clickable-row:hover td { background: var(--dm-surface2) !important; }
html.dark-mode #rep-table-wrap .dataTables_wrapper { background: var(--dm-surface) !important; color: var(--dm-text-muted) !important; }
html.dark-mode #rep-table-wrap .dataTables_wrapper .dataTables_filter input { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode #rep-table-wrap .dataTables_wrapper .dataTables_length select { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode #rep-table-wrap .dataTables_wrapper .dataTables_info { color: var(--dm-text-faint) !important; }
html.dark-mode #rep-table-wrap .dataTables_wrapper .dataTables_paginate .paginate_button { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode #rep-table-wrap .dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.current) { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }

/* AI panel error bubble (shared across pages) */
html.dark-mode .ai-message-error .ai-message-content { background: rgba(185,28,28,.15) !important; border-color: rgba(185,28,28,.3) !important; color: #fca5a5 !important; }

/* ── /organization (list-organization) ──────────────────────────────────── */
html.dark-mode .org-page-bg { background: var(--dm-bg) !important; }
html.dark-mode .org-section-hd { color: var(--dm-text-faint) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .org-section-hd i { color: var(--dm-text-faint) !important; }
html.dark-mode .org-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
/* Inline text color overrides inside cards */
html.dark-mode .org-card strong { color: var(--dm-text) !important; }
html.dark-mode .org-card p      { color: var(--dm-text-muted) !important; }
html.dark-mode .org-info-label  { color: var(--dm-text-faint) !important; }
html.dark-mode .org-info-value  { color: var(--dm-text) !important; }
html.dark-mode .org-code { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
/* Banners — class-based and inline-style variants */
html.dark-mode .org-banner-warn   { background: rgba(253,230,138,.08) !important; border-color: rgba(253,230,138,.2) !important; }
html.dark-mode .org-banner-danger { background: rgba(254,202,202,.08) !important; border-color: rgba(254,202,202,.2) !important; }
html.dark-mode .org-banner-info   { background: rgba(186,230,253,.08) !important; border-color: rgba(186,230,253,.2) !important; }
html.dark-mode .org-banner       { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .org-banner strong { color: var(--dm-text) !important; }
html.dark-mode .org-banner p      { color: var(--dm-text-muted) !important; }
html.dark-mode .org-banner-icon   { background: var(--dm-surface3) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .org-action-btn { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.35) !important; color: #a5b4fc !important; }
html.dark-mode .org-action-btn:hover { background: rgba(99,102,241,.3) !important; }
html.dark-mode .org-btn-leave { background: rgba(239,68,68,.1) !important; border-color: rgba(239,68,68,.25) !important; color: #fca5a5 !important; }
html.dark-mode .org-btn-leave:hover { background: rgba(239,68,68,.2) !important; }
html.dark-mode .org-tab-bar { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .org-tab-btn { color: var(--dm-text-faint) !important; }
html.dark-mode .org-tab-btn.active { background: #6366f1 !important; color: #fff !important; }
html.dark-mode .org-tab-btn:not(.active):hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .org-input { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .org-input::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode .org-input:focus { border-color: #6366f1 !important; box-shadow: 0 0 0 3px rgba(99,102,241,.15) !important; }
html.dark-mode .org-field-label { color: var(--dm-text-muted) !important; }
html.dark-mode .org-subdomain-suffix { color: var(--dm-text-faint) !important; }
html.dark-mode .org-field-error { color: #fca5a5 !important; }
html.dark-mode .org-submit-btn { background: #6366f1 !important; border-color: #4f46e5 !important; }
html.dark-mode .org-noorg-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .org-noorg-card h4 { color: var(--dm-text) !important; }
html.dark-mode .org-noorg-card p  { color: var(--dm-text-muted) !important; }
html.dark-mode .org-noorg-header h4 { color: var(--dm-text) !important; }
html.dark-mode .org-noorg-header p  { color: var(--dm-text-muted) !important; }
html.dark-mode .org-noorg-icon { background: var(--dm-surface2) !important; color: var(--dm-text-faint) !important; }
html.dark-mode .org-pending-chip { background: rgba(253,230,138,.08) !important; border-color: rgba(253,230,138,.2) !important; color: #fbbf24 !important; }
/* Leave panel */
html.dark-mode #spLeaveOrg .sp-hd { background: rgba(185,28,28,.2) !important; border-bottom-color: rgba(185,28,28,.3) !important; }
html.dark-mode #spLeaveOrg .sp-hd-icon { background: rgba(185,28,28,.2) !important; color: #fca5a5 !important; }
html.dark-mode #spLeaveOrg .sp-bd > div { background: rgba(185,28,28,.12) !important; border-color: rgba(185,28,28,.25) !important; }
html.dark-mode #spLeaveOrg .sp-bd p { color: var(--dm-text-muted) !important; }

/* ── Subscription billing partial ───────────────────────────────────────── */
html.dark-mode .plan-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .plan-card:hover { border-color: rgba(99,102,241,.4) !important; background: rgba(99,102,241,.06) !important; }
html.dark-mode .plan-card.selected { border-color: #6366f1 !important; background: rgba(99,102,241,.12) !important; }
html.dark-mode .plan-card.current  { border-color: #10b981 !important; background: rgba(16,185,129,.08) !important; }
html.dark-mode .cycle-toggle { background: var(--dm-surface2) !important; }
html.dark-mode .cycle-toggle button { color: var(--dm-text-muted) !important; }
html.dark-mode .cycle-toggle button:not(.active):hover { background: var(--dm-surface3) !important; color: var(--dm-text) !important; }
html.dark-mode .sub-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .sub-card-hd { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .sub-card-hd-title { color: var(--dm-text) !important; }
html.dark-mode .sub-status-active  { background: rgba(5,150,105,.15) !important;  color: #34d399 !important; }
html.dark-mode .sub-status-active::before  { background: #10b981 !important; }
html.dark-mode .sub-status-trial   { background: rgba(245,158,11,.12) !important; color: #fbbf24 !important; }
html.dark-mode .sub-status-trial::before   { background: #f59e0b !important; }
html.dark-mode .sub-status-expired { background: var(--dm-surface2) !important;   color: var(--dm-text-faint) !important; }
html.dark-mode .sub-status-expired::before { background: var(--dm-text-faint) !important; }
html.dark-mode .sub-status-overdue { background: rgba(185,28,28,.15) !important;  color: #fca5a5 !important; }
html.dark-mode .sub-status-overdue::before { background: #ef4444 !important; }
html.dark-mode .sub-overdue-banner { background: rgba(185,28,28,.12) !important; border-color: rgba(185,28,28,.25) !important; color: #fca5a5 !important; }
html.dark-mode .sub-info-lbl { color: var(--dm-text-faint) !important; }
html.dark-mode .sub-info-val { color: var(--dm-text) !important; }
html.dark-mode .sub-note { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .sub-note i { color: var(--dm-text-faint) !important; }
html.dark-mode .sub-btn-secondary { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .sub-btn-secondary:hover { background: var(--dm-surface3) !important; }
html.dark-mode #trialQuickStart { background: rgba(22,163,74,.08) !important; border-color: rgba(134,239,172,.2) !important; }
html.dark-mode .tqs-feat { color: var(--dm-text-muted) !important; }
html.dark-mode #tqs-divider { color: var(--dm-text-faint) !important; }
html.dark-mode #tqs-divider::before,
html.dark-mode #tqs-divider::after { background: var(--dm-border) !important; }
html.dark-mode #paymentHistoryContent .table th { color: var(--dm-text-faint) !important; }
html.dark-mode #paymentHistoryContent .table td { color: var(--dm-text-muted) !important; border-color: var(--dm-border) !important; }

/* ── /organization/users (manage-users) ─────────────────────────────────── */
/* --c-border/bg/text/muted/faint already overridden at html.dark-mode scope (line 930) */
html.dark-mode .po-toolbar-bar { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .po-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .po-card-hd { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .po-card-title { color: var(--dm-text) !important; }
html.dark-mode .po-user-row { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .po-user-row:hover { background: var(--dm-surface2) !important; }
html.dark-mode .po-user-name  { color: var(--dm-text) !important; }
html.dark-mode .po-user-email { color: var(--dm-text-faint) !important; }
html.dark-mode .po-role-select { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .po-badge-role { background: rgba(99,102,241,.15) !important; color: #a5b4fc !important; }
html.dark-mode .po-req-row { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .po-req-row:hover { background: var(--dm-surface2) !important; }
html.dark-mode .po-btn-approve { background: rgba(5,150,105,.15) !important; color: #34d399 !important; }
html.dark-mode .po-btn-approve:hover { background: rgba(5,150,105,.25) !important; }
html.dark-mode .po-btn-reject  { background: rgba(185,28,28,.12) !important; color: #fca5a5 !important; }
html.dark-mode .po-btn-reject:hover  { background: rgba(185,28,28,.22) !important; }
html.dark-mode .po-btn-remove  { background: rgba(185,28,28,.12) !important; color: #fca5a5 !important; }
html.dark-mode .po-btn-remove:hover  { background: rgba(185,28,28,.22) !important; }

/* ── /ai-credits ────────────────────────────────────────────────────────── */
html.dark-mode .aic-page-bg { background: var(--dm-bg) !important; }
html.dark-mode .aic-section-hd { color: var(--dm-text-faint) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .aic-section-hd i { color: var(--dm-text-faint) !important; }
html.dark-mode .aic-balance-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .aic-ring-lbl   { color: var(--dm-text-faint) !important; }
html.dark-mode .aic-balance-num { color: var(--dm-text) !important; }
html.dark-mode .aic-balance-num span { color: var(--dm-text-faint) !important; }
html.dark-mode .aic-balance-desc { color: var(--dm-text-muted) !important; }
html.dark-mode .aic-feature-text { color: var(--dm-text-muted) !important; }
html.dark-mode .aic-tier-row { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .aic-tier-divider { background: var(--dm-border) !important; }
html.dark-mode .aic-tier-green  { background: rgba(5,150,105,.15) !important; color: #34d399 !important; }
html.dark-mode .aic-tier-amber  { background: rgba(217,119,6,.15) !important; color: #fbbf24 !important; }
html.dark-mode .aic-tier-purple { background: rgba(99,102,241,.15) !important; color: #a5b4fc !important; }
html.dark-mode .aic-fchip-green  { background: rgba(5,150,105,.12) !important; border-color: rgba(5,150,105,.25) !important; color: #34d399 !important; }
html.dark-mode .aic-fchip-amber  { background: rgba(217,119,6,.12) !important; border-color: rgba(217,119,6,.25) !important; color: #fbbf24 !important; }
html.dark-mode .aic-fchip-purple { background: rgba(99,102,241,.12) !important; border-color: rgba(99,102,241,.25) !important; color: #a5b4fc !important; }
html.dark-mode .aic-pkg-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .aic-pkg-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,.3) !important; }
html.dark-mode .aic-pkg-card.aic-pkg-best { border-color: #6366f1 !important; }
html.dark-mode .aic-pkg-icon { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.3) !important; }
html.dark-mode .aic-pkg-name { color: var(--dm-text) !important; }
html.dark-mode .aic-pkg-credits-num { color: var(--dm-text) !important; }
html.dark-mode .aic-pkg-credits-num.best { color: #818cf8 !important; }
html.dark-mode .aic-pkg-credits-label { color: var(--dm-text-faint) !important; }
html.dark-mode .aic-pkg-rate { color: var(--dm-text-faint) !important; }
html.dark-mode .aic-pkg-divider { background: var(--dm-border) !important; }
html.dark-mode .aic-pkg-currency { color: var(--dm-text-muted) !important; }
html.dark-mode .aic-pkg-price { color: var(--dm-text) !important; }
html.dark-mode .aic-buy-btn { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.3) !important; color: #a5b4fc !important; }
html.dark-mode .aic-buy-btn:hover { background: #6366f1 !important; color: #fff !important; border-color: #4f46e5 !important; }
html.dark-mode .aic-pkg-empty { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .aic-pkg-empty i { color: var(--dm-text-faint) !important; }
html.dark-mode .aic-pkg-empty p { color: var(--dm-text-faint) !important; }
html.dark-mode .aic-table-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .aic-table thead tr { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .aic-table th { background: var(--dm-surface2) !important; color: var(--dm-text-faint) !important; }
html.dark-mode .aic-table tbody tr { border-bottom-color: var(--dm-border) !important; }
html.dark-mode .aic-table tbody tr:hover td { background: var(--dm-surface2) !important; }
html.dark-mode .aic-table td { color: var(--dm-text-muted) !important; }
html.dark-mode .aic-table-footer { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }
html.dark-mode .aic-txn-count { color: var(--dm-text-faint) !important; }
html.dark-mode .aic-type-usage    { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .aic-pg-btn { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .aic-pg-btn:hover:not([disabled]) { border-color: #a5b4fc !important; background: rgba(99,102,241,.15) !important; color: #a5b4fc !important; }
html.dark-mode .aic-pg-btn.aic-pg-active { background: #4f46e5 !important; border-color: #4f46e5 !important; color: #fff !important; }
html.dark-mode .aic-pg-ellipsis { color: var(--dm-text-faint) !important; }
html.dark-mode .aic-pg-info { color: var(--dm-text-faint) !important; }

/* ── /media (media/library) ─────────────────────────────────────────────── */
html.dark-mode .ml-page-bg { background: var(--dm-bg) !important; }
html.dark-mode .ml-toolbar-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .ml-search-icon { color: var(--dm-text-faint) !important; }
html.dark-mode .ml-search-input { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .ml-search-input::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode .ml-search-input:focus { border-color: #6366f1 !important; background: var(--dm-surface) !important; }
html.dark-mode .ml-filter-bar { background: var(--dm-surface2) !important; }
html.dark-mode .ml-filter-btn { color: var(--dm-text-muted) !important; }
html.dark-mode .ml-filter-btn.active { background: var(--dm-surface3) !important; color: #a5b4fc !important; box-shadow: 0 1px 4px rgba(0,0,0,.3) !important; }
html.dark-mode .ml-filter-btn:not(.active):hover { color: var(--dm-text) !important; }
html.dark-mode .ml-grid-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: none !important; }
html.dark-mode .ml-state-box { color: var(--dm-text-faint) !important; }
html.dark-mode .ml-empty-icon { background: var(--dm-surface2) !important; color: var(--dm-text-faint) !important; }
/* JS-generated media cards */
html.dark-mode .media-card { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
html.dark-mode .media-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,.35) !important; }
html.dark-mode .media-thumbnail-placeholder { background: linear-gradient(135deg, var(--dm-surface2) 0%, var(--dm-surface3) 100%) !important; color: var(--dm-text-faint) !important; }
html.dark-mode .media-filename { color: var(--dm-text) !important; }
html.dark-mode .media-meta { color: var(--dm-text-faint) !important; }
html.dark-mode .type-badge.image { background: rgba(5,150,105,.15) !important; color: #34d399 !important; }
html.dark-mode .type-badge.video { background: rgba(29,78,216,.15) !important; color: #93c5fd !important; }
html.dark-mode .upload-zone { background: var(--dm-surface2) !important; border-color: rgba(99,102,241,.35) !important; }
html.dark-mode .upload-zone:hover,
html.dark-mode .upload-zone.dragover { border-color: #6366f1 !important; background: rgba(99,102,241,.1) !important; }
html.dark-mode .upload-progress-item { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .upload-progress-item .filename { color: var(--dm-text) !important; }
html.dark-mode .ml-meta-box { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .ml-btn-download { background: rgba(99,102,241,.15) !important; border-color: rgba(99,102,241,.3) !important; color: #a5b4fc !important; }
html.dark-mode .ml-btn-download:hover { background: #4f46e5 !important; color: #fff !important; border-color: #4f46e5 !important; }
html.dark-mode .ml-delete-warn { background: rgba(185,28,28,.12) !important; color: #fca5a5 !important; }
html.dark-mode .btn-view   { background: rgba(99,102,241,.12) !important; border-color: rgba(99,102,241,.25) !important; color: #a5b4fc !important; }
html.dark-mode .btn-view:hover { background: #4f46e5 !important; color: #fff !important; border-color: #4f46e5 !important; }
html.dark-mode .btn-delete { background: rgba(185,28,28,.1) !important; border-color: rgba(185,28,28,.25) !important; color: #fca5a5 !important; }
html.dark-mode .btn-delete:hover { background: #ef4444 !important; color: #fff !important; border-color: #ef4444 !important; }

/* ── Topbar / Navbar ────────────────────────────────────────────────────── */
html.dark-mode .navbar.bg-white,
html.dark-mode .navbar { background: var(--dm-surface) !important; border-bottom: 1px solid var(--dm-border) !important; }

/* Search bar */
html.dark-mode #navbar-search-input { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode #navbar-search-input::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode #navbar-search-input:focus { background: var(--dm-surface) !important; border-color: #6366f1 !important; box-shadow: 0 0 0 3px rgba(99,102,241,.15) !important; }
html.dark-mode #navbar-search-icon { color: var(--dm-text-faint) !important; }
html.dark-mode #navbar-search-kbd { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text-faint) !important; }
html.dark-mode #searchRecommendations { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: 0 8px 32px rgba(0,0,0,.4) !important; }

/* Icon buttons (settings, help, dark-mode toggle) */
html.dark-mode #navbar-search-wrap ~ div a[href*="organization"],
html.dark-mode #helpBtn,
html.dark-mode #darkModeBtn { color: var(--dm-text-muted) !important; }
html.dark-mode #helpBtn:hover,
html.dark-mode #darkModeBtn:hover { background: rgba(255,255,255,.08) !important; }
html.dark-mode .mdi-cogs,
html.dark-mode .mdi-flash,
html.dark-mode .mdi-bell-ring,
html.dark-mode .mdi-help-circle-outline,
html.dark-mode #darkModeIcon { color: var(--dm-text-muted) !important; }

/* AI credits display */
html.dark-mode #aiCreditsCount { color: var(--dm-text-muted) !important; }

/* Notifications dropdown */
html.dark-mode .ai-notif-dropdown { background: var(--dm-surface) !important; border: 1px solid var(--dm-border) !important; }
html.dark-mode .ai-notif-dropdown .dropdown-header { background: var(--dm-surface2) !important; border-bottom-color: var(--dm-border) !important; }
html.dark-mode .ai-notif-dropdown .dropdown-header span { color: var(--dm-text) !important; }
html.dark-mode .ai-notif-item { background: var(--dm-surface2) !important; }
html.dark-mode .ai-notif-item:hover { background: var(--dm-surface3) !important; }
html.dark-mode .ai-notif-item.severity-critical { background: rgba(185,28,28,.15) !important; }
html.dark-mode .ai-notif-item.severity-high     { background: rgba(234,88,12,.12) !important; }
html.dark-mode .ai-notif-item.severity-low      { background: rgba(101,163,13,.1) !important; }
html.dark-mode .ai-notif-item-type    { color: var(--dm-text-faint) !important; }
html.dark-mode .ai-notif-item-subject { color: var(--dm-text) !important; }
html.dark-mode .ai-notif-item-time    { color: var(--dm-text-faint) !important; }

/* Profile & generic dropdowns inside navbar */
html.dark-mode .navbar .dropdown-menu { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; box-shadow: 0 8px 24px rgba(0,0,0,.4) !important; }
html.dark-mode .navbar .dropdown-menu .dropdown-item { color: var(--dm-text) !important; }
html.dark-mode .navbar .dropdown-menu .dropdown-item:hover { background: var(--dm-surface2) !important; }
html.dark-mode .navbar .dropdown-divider { border-color: var(--dm-border) !important; }

/* Global Issue Work Order panel */
html.dark-mode #globalIssuePanel > div { background: var(--dm-surface) !important; }
html.dark-mode #globalIssuePanel > div > div:first-child { background: var(--dm-surface) !important; border-bottom-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode #globalIssuePanel label { color: var(--dm-text-muted) !important; }
html.dark-mode #globalIssuePanel input[type="text"],
html.dark-mode #globalIssuePanel input[type="datetime-local"],
html.dark-mode #globalIssuePanel select,
html.dark-mode #globalIssuePanel textarea { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
html.dark-mode #globalIssuePanel > div > div:last-child { background: var(--dm-surface) !important; border-top-color: var(--dm-border) !important; }

/* ── Create Task Panel ──────────────────────────────────────────────────── */
html.dark-mode #panelCreateTask .slide-panel-footer { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }

/* Suggestion dropdowns */
html.dark-mode #taskTitleSuggestions { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; box-shadow: 0 8px 30px rgba(0,0,0,0.4) !important; }
html.dark-mode #taskTitleSuggestions .list-group-item { background: transparent !important; color: var(--dm-text) !important; border-color: var(--dm-border) !important; }
html.dark-mode #taskTitleSuggestions .list-group-item:hover { background: var(--dm-surface3) !important; }
html.dark-mode #taskTitleSuggestions .list-group-item small { color: var(--dm-text-muted) !important; }

html.dark-mode #recommendationsCreateTask { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important; }
html.dark-mode #recommendationsCreateTask ul { background: transparent !important; }
html.dark-mode #recommendationsCreateTask li { color: var(--dm-text) !important; }
html.dark-mode #recommendationsCreateTask li:hover { background: var(--dm-surface3) !important; }
html.dark-mode #recommendationsCreateTask .user-name { color: var(--dm-text) !important; }

/* Checklist task banner */
html.dark-mode #checklistTaskBanner { background: rgba(99,102,241,0.15) !important; border-left-color: #6366f1 !important; color: var(--dm-text-2) !important; }

/* Tags input */
html.dark-mode #panelCreateTask .bootstrap-tagsinput { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode #panelCreateTask .bootstrap-tagsinput input { color: var(--dm-text) !important; }
html.dark-mode #panelCreateTask .bootstrap-tagsinput input::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode #panelCreateTask .bootstrap-tagsinput .tag { background: var(--dm-surface3) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode #panelCreateTask .bootstrap-tagsinput .tag .name-text { color: var(--dm-text) !important; }
html.dark-mode #panelCreateTask .bootstrap-tagsinput .tag [data-role="remove"] { color: var(--dm-text-muted) !important; }

/* Input type dropdown button */
html.dark-mode #panelCreateTask #inputTypeDropdown { background: var(--dm-surface2) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }

/* Success state */
html.dark-mode #panelCreateTaskSuccess { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode #panelCreateTaskSuccess .text-muted { color: var(--dm-text-muted) !important; }
html.dark-mode #globalIssuePanel > div > div:last-child button:first-child { background: var(--dm-surface2) !important; color: var(--dm-text-muted) !important; }

/* ── Create Folder Panel ─────────────────────────────────────────────── */
html.dark-mode #panelCreateFolder .slide-panel-body { background: var(--dm-surface) !important; }
html.dark-mode #panelCreateFolder .slide-panel-footer { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }

/* Folder preview card */
html.dark-mode .cf-preview { background: rgba(99,102,241,0.12) !important; border-color: rgba(99,102,241,0.25) !important; }
html.dark-mode .cf-preview-name { color: #a5b4fc !important; }
html.dark-mode .cf-preview-desc { color: #818cf8 !important; }
html.dark-mode .cf-preview-placeholder { color: var(--dm-text-faint) !important; }

/* Form fields */
html.dark-mode .cf-label { color: var(--dm-text-muted) !important; }
html.dark-mode .cf-label .opt { color: var(--dm-text-faint) !important; }
html.dark-mode .cf-input,
html.dark-mode .cf-textarea { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode .cf-input::placeholder,
html.dark-mode .cf-textarea::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode .cf-input:focus,
html.dark-mode .cf-textarea:focus { border-color: #6366f1 !important; box-shadow: 0 0 0 3px rgba(99,102,241,0.2) !important; }
html.dark-mode .cf-char-count { color: var(--dm-text-faint) !important; }

/* Tips */
html.dark-mode .cf-tips { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode .cf-tips-title { color: var(--dm-text-faint) !important; }
html.dark-mode .cf-tip { color: var(--dm-text-muted) !important; }

/* Messages */
html.dark-mode .cf-msg-err { background: rgba(239,68,68,0.12) !important; color: #fca5a5 !important; border-color: rgba(239,68,68,0.25) !important; }
html.dark-mode .cf-msg-ok  { background: rgba(34,197,94,0.12) !important; color: #86efac !important; border-color: rgba(34,197,94,0.25) !important; }

/* Buttons */
html.dark-mode .cf-cancel-btn { background: var(--dm-surface3) !important; border-color: var(--dm-border2) !important; color: var(--dm-text-muted) !important; }
html.dark-mode .cf-cancel-btn:hover { background: var(--dm-surface2) !important; color: var(--dm-text) !important; }


/* ── Run Checklist Panel ─────────────────────────────────────────────── */
html.dark-mode #panelRunChecklist .slide-panel-content { background: var(--dm-surface) !important; }
html.dark-mode #panelRunChecklist .slide-panel-body { background: var(--dm-surface) !important; }
html.dark-mode #panelRunChecklist .slide-panel-footer { background: var(--dm-surface2) !important; border-top-color: var(--dm-border) !important; }

/* Form labels and inputs */
html.dark-mode #panelRunChecklist .form-label { color: var(--dm-text) !important; }
html.dark-mode #panelRunChecklist .form-control { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }
html.dark-mode #panelRunChecklist .form-control::placeholder { color: var(--dm-text-faint) !important; }
html.dark-mode #panelRunChecklist .text-muted { color: var(--dm-text-muted) !important; }

/* Single assignee block */
html.dark-mode #panelRunChecklist .form-group[style*="background:#f8fafc"] { background: var(--dm-surface2) !important; border-color: var(--dm-border) !important; }
html.dark-mode #panelRunChecklist .form-group[style*="background:#f8fafc"] label { color: var(--dm-text) !important; }
html.dark-mode #panelRunChecklist #runPanelSingleWrap > div[style*="color:#94a3b8"] { color: var(--dm-text-faint) !important; }
html.dark-mode #runPanelSingleSelect { background: var(--dm-input-bg) !important; border-color: var(--dm-border2) !important; color: var(--dm-text) !important; }

/* Success state */
html.dark-mode #panelRunChecklistSuccess { background: var(--dm-surface) !important; color: var(--dm-text) !important; }
html.dark-mode #panelRunChecklistSuccess .text-muted { color: var(--dm-text-muted) !important; }