/* Refined dark theme — html[data-theme="dark"] */
html[data-theme="dark"]{
  --ink:#e6ebf4;
  --muted:#98a4b8;
  --line:#2c3545;
  --blue:#6b8af5;
  --blue-dark:#839ef7;
  --pale:#11151d;
  --panel:#1a2030;
  --nav:#151a24;
  --surface:#1a2030;
  --surface-2:#202838;
  --surface-3:#273142;
  --text:#e6ebf4;
  --text-soft:#b8c2d4;
  --text-faint:#8f9aaf;
  --border:#2c3545;
  --border-strong:#3d4a5f;
  --input-bg:#121722;
  --input-border:#3a465a;
  --hover:#273142;
  --nav-hover:#243250;
  --nav-active-text:#a9bfff;
  --shadow-soft:#00000055;
  --modal-scrim:#070a10d9;
  --success-bg:#1a3328;
  --success-fg:#6dce95;
  --warn-bg:#3a2e18;
  --warn-fg:#e2b15a;
  --info-bg:#1e2a48;
  --info-fg:#9bb4ff;
  --neutral-bg:#2a3344;
  --neutral-fg:#b0bacb;
  --avatar-bg:#3c342e;
  --avatar-fg:#e2c9b0;
  color-scheme:dark;
}

/* Base shell */
html[data-theme="dark"] body{background:var(--pale);color:var(--ink)}
html[data-theme="dark"] .sidebar-scroll::-webkit-scrollbar-thumb{background:#3a4558}
html[data-theme="dark"] .brand{color:var(--ink)}
html[data-theme="dark"] .brand .brand-logo,
html[data-theme="dark"] .login-brand .brand-logo,
html[data-theme="dark"] .branding-preview .brand-logo{
  background:var(--surface-2)!important;
  border-color:var(--line)!important;
}
html[data-theme="dark"] .workspace-label,
html[data-theme="dark"] .manage-label{color:#7f8ba0}
html[data-theme="dark"] .nav-link{color:#a0abbe}
html[data-theme="dark"] .nav-link i{color:#8b96ab}
html[data-theme="dark"] .nav-link:hover,
html[data-theme="dark"] .nav-link.active{
  background:var(--nav-hover);
  color:var(--nav-active-text);
}
html[data-theme="dark"] .nav-link.active i{color:var(--nav-active-text)}
html[data-theme="dark"] .nav-count{background:#2a3344;color:#b0bacb}

html[data-theme="dark"] .topbar,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .table-panel,
html[data-theme="dark"] .form-card,
html[data-theme="dark"] .report-card,
html[data-theme="dark"] .settings-nav,
html[data-theme="dark"] .settings-grid .form-card,
html[data-theme="dark"] .settings-grid>form.form-card,
html[data-theme="dark"] .settings-grid .settings-card,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .profile-dropdown,
html[data-theme="dark"] .row-actions-menu,
html[data-theme="dark"] .qr-preview,
html[data-theme="dark"] .dash-alert .overdue-card{
  background:var(--panel)!important;
  border-color:var(--line)!important;
  color:var(--ink);
  box-shadow:0 1px 0 #ffffff06,0 8px 24px #00000033;
}
html[data-theme="dark"] .topbar{border-bottom-color:var(--line);box-shadow:none}
html[data-theme="dark"] .location small,
html[data-theme="dark"] .profile small,
html[data-theme="dark"] .eyebrow{color:#8f9aaf}
html[data-theme="dark"] .location strong,
html[data-theme="dark"] .profile strong,
html[data-theme="dark"] .page-heading h1,
html[data-theme="dark"] .settings-panel-head h3,
html[data-theme="dark"] .settings-grid h2,
html[data-theme="dark"] .settings-subtitle,
html[data-theme="dark"] .panel-heading h2,
html[data-theme="dark"] .modal h2{color:var(--ink)}
html[data-theme="dark"] .subtle,
html[data-theme="dark"] .panel-heading p,
html[data-theme="dark"] .settings-panel-head p,
html[data-theme="dark"] .field-hint,
html[data-theme="dark"] .settings-grid .field-hint,
html[data-theme="dark"] .file-name,
html[data-theme="dark"] .settings-status-line{color:var(--muted)!important}
html[data-theme="dark"] .icon-button{color:#a0abbe}
html[data-theme="dark"] .header-rule{border-left-color:var(--line)}
html[data-theme="dark"] .profile-dropdown button{background:transparent;color:var(--text-soft)}
html[data-theme="dark"] .profile-dropdown button:hover{background:var(--hover)}
html[data-theme="dark"] .office-switcher{color:var(--ink)}

/* Buttons */
html[data-theme="dark"] .primary-button{
  background:var(--blue);
  border-color:var(--blue);
  color:#fff;
  box-shadow:0 2px 10px #4268e833;
}
html[data-theme="dark"] .primary-button:hover{background:var(--blue-dark)}
html[data-theme="dark"] .secondary-button,
html[data-theme="dark"] .select-button,
html[data-theme="dark"] .filter,
html[data-theme="dark"] .table-action,
html[data-theme="dark"] .file-label,
html[data-theme="dark"] .visitor-filters .filter-action-row .secondary-button{
  background:var(--surface-2)!important;
  border-color:var(--border-strong)!important;
  color:var(--text-soft)!important;
}
html[data-theme="dark"] .secondary-button:hover,
html[data-theme="dark"] .select-button:hover,
html[data-theme="dark"] .filter:hover,
html[data-theme="dark"] .table-action:hover,
html[data-theme="dark"] .file-label:hover{
  background:var(--hover)!important;
  border-color:#52627c!important;
  color:var(--nav-active-text)!important;
}
html[data-theme="dark"] .text-button{color:var(--nav-active-text)}

/* Tables — kill sticky light headers */
html[data-theme="dark"] th,
html[data-theme="dark"] .settings-grid .settings-table th,
html[data-theme="dark"] .recent-visitors-table th,
html[data-theme="dark"] .dash-primary .recent-visitors-table th,
html[data-theme="dark"] .offices-table th{
  background:var(--surface-2)!important;
  color:#9aa6ba!important;
  border-bottom-color:var(--line)!important;
}
html[data-theme="dark"] td,
html[data-theme="dark"] .offices-table td,
html[data-theme="dark"] .recent-visitors-table td{
  color:var(--text-soft)!important;
  border-bottom-color:#243041!important;
  border-top-color:#243041!important;
}
html[data-theme="dark"] td:first-child,
html[data-theme="dark"] .arrival strong,
html[data-theme="dark"] .overdue-item strong,
html[data-theme="dark"] .stat-card strong{color:var(--ink)!important}
html[data-theme="dark"] tbody tr:hover td{background:#202838!important}
html[data-theme="dark"] .table-tools,
html[data-theme="dark"] .form-footer,
html[data-theme="dark"] .settings-panel-head,
html[data-theme="dark"] .audit-pager,
html[data-theme="dark"] #addOfficeForm{border-color:var(--line)!important}

html[data-theme="dark"] .stat-card p,
html[data-theme="dark"] .stat-card small,
html[data-theme="dark"] .arrival small,
html[data-theme="dark"] .overdue-item small{color:var(--muted)}

/* Forms / inputs */
html[data-theme="dark"] .search,
html[data-theme="dark"] .modal-search{
  background:var(--input-bg)!important;
  border-color:var(--input-border)!important;
  color:var(--muted);
}
html[data-theme="dark"] .search:hover,
html[data-theme="dark"] .search:focus-within,
html[data-theme="dark"] .modal-search:focus-within{
  background:var(--surface-2)!important;
  border-color:#6b8af5!important;
}
html[data-theme="dark"] .search input,
html[data-theme="dark"] .modal-search input{color:var(--ink)!important}
html[data-theme="dark"] label,
html[data-theme="dark"] .settings-grid .form-grid>label,
html[data-theme="dark"] .modal-form label,
html[data-theme="dark"] .toggle-row,
html[data-theme="dark"] .settings-grid label.toggle-row{color:var(--text-soft)!important}
html[data-theme="dark"] label>input,
html[data-theme="dark"] label>select,
html[data-theme="dark"] label>textarea,
html[data-theme="dark"] .form-card input,
html[data-theme="dark"] .form-card select,
html[data-theme="dark"] .form-card textarea,
html[data-theme="dark"] .modal-form input,
html[data-theme="dark"] .modal-form select,
html[data-theme="dark"] .modal-form textarea,
html[data-theme="dark"] .login-card input,
html[data-theme="dark"] .settings-grid .form-grid>label>input,
html[data-theme="dark"] .settings-grid .form-grid>label>select,
html[data-theme="dark"] .settings-grid .form-grid>label>textarea,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .visitor-filters .filter-field>input,
html[data-theme="dark"] .visitor-filters .filter-field>select,
html[data-theme="dark"] .audit-tools select,
html[data-theme="dark"] .audit-tools input[type="date"],
html[data-theme="dark"] .report-date,
html[data-theme="dark"] .approver-search-label input,
html[data-theme="dark"] .invite-actions input{
  background:var(--input-bg)!important;
  border-color:var(--input-border)!important;
  color:var(--ink)!important;
}
html[data-theme="dark"] label>input:focus,
html[data-theme="dark"] label>select:focus,
html[data-theme="dark"] .form-card input:focus,
html[data-theme="dark"] .form-card select:focus,
html[data-theme="dark"] .modal-form input:focus,
html[data-theme="dark"] .modal-form select:focus{
  border-color:#6b8af5!important;
  box-shadow:0 0 0 3px #4268e828!important;
}

/* Tabs / settings nav */
html[data-theme="dark"] .tab{color:#8f9aaf}
html[data-theme="dark"] .tab:hover{color:var(--text-soft)}
html[data-theme="dark"] .tab.active{color:var(--nav-active-text);border-bottom-color:var(--blue)}
html[data-theme="dark"] .settings-nav-btn{color:#a0abbe}
html[data-theme="dark"] .settings-nav-btn:hover{background:var(--hover);color:var(--ink)}
html[data-theme="dark"] .settings-nav-btn.active{
  background:var(--nav-hover);
  color:var(--nav-active-text);
  box-shadow:inset 0 0 0 1px #3a4f78;
}

/* Status chips */
html[data-theme="dark"] .inside{background:var(--success-bg);color:var(--success-fg)}
html[data-theme="dark"] .expected{background:var(--info-bg);color:var(--info-fg)}
html[data-theme="dark"] .pending{background:var(--warn-bg);color:var(--warn-fg)}
html[data-theme="dark"] .done{background:var(--neutral-bg);color:var(--neutral-fg)}
html[data-theme="dark"] .avatar{background:var(--avatar-bg);color:var(--avatar-fg)}
html[data-theme="dark"] .blue,
html[data-theme="dark"] .sky{background:#1e2a48;color:#9bb4ff}
html[data-theme="dark"] .orange,
html[data-theme="dark"] .peach{background:#3a2e18;color:#e2b15a}
html[data-theme="dark"] .violet{background:#2c2440;color:#b8a4ff}
html[data-theme="dark"] .green,
html[data-theme="dark"] .mint{background:#1a3328;color:#6dce95}
html[data-theme="dark"] .dash-alert .overdue-badge,
html[data-theme="dark"] .overdue-badge{
  background:var(--info-bg)!important;
  color:var(--info-fg)!important;
}

/* Lists / cards */
html[data-theme="dark"] .arrival,
html[data-theme="dark"] .overdue-item,
html[data-theme="dark"] .quick-actions button{
  border-color:#243041!important;
  background:transparent!important;
  color:var(--text-soft);
}
html[data-theme="dark"] .quick-actions strong{color:var(--ink)}
html[data-theme="dark"] .quick-actions small{color:var(--muted)}
html[data-theme="dark"] .chart{
  border-bottom-color:#2c3545;
  background:repeating-linear-gradient(to bottom,transparent 0,transparent 44px,#1e2533 45px);
}
html[data-theme="dark"] .chart span{background:#3a4f78}
html[data-theme="dark"] .chart .today-bar{background:var(--blue)}
html[data-theme="dark"] .chart small{color:var(--muted)}
html[data-theme="dark"] .stat-card.is-clickable:hover{
  border-color:#4a5f88!important;
  box-shadow:0 8px 22px #00000040;
}

/* Modals / pickers */
html[data-theme="dark"] .modal-backdrop{background:var(--modal-scrim)}
html[data-theme="dark"] .modal-close{background:var(--surface-3);color:var(--muted)}
html[data-theme="dark"] .visitor-pick,
html[data-theme="dark"] .checkout-summary,
html[data-theme="dark"] .settings-toggle-panel,
html[data-theme="dark"] .backup-upload-row,
html[data-theme="dark"] .branding-preview,
html[data-theme="dark"] .photo-box,
html[data-theme="dark"] .visitor-badge-card,
html[data-theme="dark"] .history-item,
html[data-theme="dark"] .checkin-result,
html[data-theme="dark"] .visitor-lookup-item,
html[data-theme="dark"] .checkout-picker-item,
html[data-theme="dark"] .approver-search-item{
  background:var(--surface-2)!important;
  border-color:var(--line)!important;
  color:var(--ink)!important;
}
html[data-theme="dark"] .backup-upload-row{border-style:dashed}
html[data-theme="dark"] .visitor-pick-copy strong,
html[data-theme="dark"] .approver-search-item strong{color:var(--ink)}
html[data-theme="dark"] .media-capture{border-top-color:var(--line)}
html[data-theme="dark"] .menu-item{background:transparent;color:var(--nav-active-text)}
html[data-theme="dark"] .menu-item:hover{background:var(--hover)}
html[data-theme="dark"] .menu-item.danger{color:#f07178}
html[data-theme="dark"] .checkin-result:hover,
html[data-theme="dark"] .visitor-lookup-item:hover,
html[data-theme="dark"] .checkout-picker-item:hover,
html[data-theme="dark"] .approver-search-item:hover{
  background:var(--hover)!important;
  border-color:#52627c!important;
}
html[data-theme="dark"] .approver-chip{
  background:var(--info-bg);
  border-color:#3a4f78;
  color:var(--text-soft);
}
html[data-theme="dark"] .approver-chip-copy strong{color:var(--ink)}
html[data-theme="dark"] .approver-chip-remove{background:#2a3344;color:#b0bacb}
html[data-theme="dark"] .success-message{background:#1a3328;color:#6dce95}
html[data-theme="dark"] .toast{background:#243250;border-color:#3a4f78;color:#fff}

/* Sidebar collapse controls */
html[data-theme="dark"] .sidebar-toggle,
html[data-theme="dark"] .sidebar-reopen,
html[data-theme="dark"] .sidebar-top-toggle{
  background:var(--surface-2)!important;
  border-color:var(--line)!important;
  color:var(--text-soft)!important;
}
html[data-theme="dark"] .sidebar-toggle:hover,
html[data-theme="dark"] .sidebar-reopen:hover,
html[data-theme="dark"] .sidebar-top-toggle:hover{
  background:var(--hover)!important;
  color:var(--ink)!important;
}

/* Login */
html[data-theme="dark"] .login-screen{background:var(--pale)}
html[data-theme="dark"] .login-panel{background:var(--pale)}
html[data-theme="dark"] .login-card{
  background:var(--panel)!important;
  border:1px solid var(--line);
  box-shadow:0 18px 50px #00000066;
  color:var(--ink);
}
html[data-theme="dark"] .login-brand-text strong{color:var(--ink)}
html[data-theme="dark"] .login-brand-text small,
html[data-theme="dark"] .login-lead,
html[data-theme="dark"] .login-hint{color:var(--muted)}
html[data-theme="dark"] .login-divider span{background:var(--panel);color:var(--muted)}
html[data-theme="dark"] .sso-button{
  background:var(--surface-2)!important;
  border-color:var(--border-strong)!important;
  color:var(--ink)!important;
}
html[data-theme="dark"] .sso-button:hover{background:var(--hover)!important}

/* Theme toggle */
.theme-toggle{
  width:36px;height:36px;border-radius:8px;border:1px solid #dfe5ef;
  background:#fff;color:#5b6b82;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  font:700 15px "DM Sans";padding:0;line-height:1;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.theme-toggle:hover{background:#f3f6fb;color:#263247;border-color:#c5cede}
.theme-toggle .theme-icon-dark{display:none}
html[data-theme="dark"] .theme-toggle{
  border-color:var(--border-strong);
  background:var(--surface-2);
  color:var(--text-soft);
}
html[data-theme="dark"] .theme-toggle:hover{
  background:var(--hover);
  color:var(--ink);
  border-color:#52627c;
}
html[data-theme="dark"] .theme-toggle .theme-icon-light{display:none}
html[data-theme="dark"] .theme-toggle .theme-icon-dark{display:inline}

html[data-theme="dark"] .pii-access-card{background:#1a2230;border-color:#2a3548}html[data-theme="dark"] .pii-reason-label textarea,html[data-theme="dark"] .pii-otp-label input{background:#121821;border-color:#2a3548;color:#e8eef8}html[data-theme="dark"] .pii-reason-cell{color:#9aa8bd}
