/* Shared appearance settings. The application keeps its existing light palette. */
:root {
  color-scheme: light;
  --theme-control-bg:#fff;
  --theme-control-text:#4d5766;
  --theme-control-border:#cdd4de;
  --chart-green:#4f6a4b;
  --chart-sage:#6b7a58;
  --chart-red:#8c5b4b;
  --chart-neutral:#8b8374;
  --chart-slate:#5f6f63;
  --chart-amber:#9a7345;
  --chart-brown:#7b6a58;
  --chart-warm:#7f6a56;
}
[data-theme-control] { flex-shrink:0; }
.theme-control { display:flex; align-items:center; gap:6px; color:var(--theme-control-text); }
.theme-control svg { flex-shrink:0; }
.theme-switch-icons { display:grid; width:18px; height:18px; }
.theme-switch-icons svg { grid-area:1 / 1; opacity:1; transform:rotate(0) scale(1); }
.theme-switch[aria-checked="false"] [data-theme-moon] { opacity:0; transform:rotate(-35deg) scale(.75); }
.theme-switch[aria-checked="true"] [data-theme-sun] { opacity:0; transform:rotate(35deg) scale(.75); }
body .theme-control .theme-switch {
  display:inline-flex; align-items:center; gap:8px; min-height:32px; padding:4px;
  border:0; border-radius:5px; background:transparent; color:var(--theme-control-text);
  box-shadow:none; cursor:pointer;
}
body .theme-control .theme-switch:hover { background:transparent; }
body .theme-control .theme-switch:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }
.theme-switch-track { position:relative; display:block; width:36px; height:20px; background:#818b98; border-radius:10px; }
.theme-switch-thumb { position:absolute; top:3px; left:3px; transform:translateX(0); width:14px; height:14px; border-radius:50%; background:#fff; }
.theme-switch[aria-checked="true"] .theme-switch-track { background:#397fc1; }
.theme-switch[aria-checked="true"] .theme-switch-thumb { transform:translateX(16px); }
.login-page .login-brand { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.integration-docs .docs-header nav { flex-wrap:wrap; }
@media(max-width:760px) {
  .workspace .workspace-side { flex-wrap:wrap; justify-content:flex-end; }
  .workspace .workspace-topbar { gap:10px; }
  .integration-docs .docs-header { flex-wrap:wrap; gap:12px; }
}
@media(max-width:480px) {
  .login-page .login-brand-logo { width:120px; }
  .login-page .login-brand { gap:8px; }
  .login-page .theme-control { gap:4px; }
}
@media print { [data-theme-control] { display:none !important; } }

@media screen {
  html[data-theme="dark"] {
    color-scheme:dark;
    --theme-control-bg:#21262d;
    --theme-control-text:#c9d1d9;
    --theme-control-border:#454d58;
    --surface:#161b22;
    --surface-raised:#21262d;
    --surface-hover:#292f38;
    --surface-input:#0d1117;
    --accent-soft:#1b3047;
    --positive-bg:#162d23;
    --positive-border:#315743;
    --positive-text:#85d5a6;
    --negative-bg:#352024;
    --negative-border:#6c3941;
    --negative-text:#f49da4;
    --caution-bg:#332b1d;
    --caution-border:#665332;
    --caution-text:#e6c17a;
    --chart-green:#88b184;
    --chart-sage:#a2b78d;
    --chart-red:#ce9786;
    --chart-neutral:#ada79b;
    --chart-slate:#91b2a1;
    --chart-amber:#c9a270;
    --chart-brown:#baa58f;
    --chart-warm:#baa38c;
  }
  html[data-theme="dark"] body {
    --bg:#0d1117; --card:var(--surface); --ink:#e6edf3; --muted:#a6b0bd;
    --line:#303740; --primary:#82b4f1; --primary-strong:#b1d2fb;
    --secondary:var(--surface-raised); --ok:var(--positive-text);
    --warn:var(--negative-text); --dirty:var(--caution-text); --shadow:none;
    background:var(--bg); color:var(--ink);
  }
  html[data-theme="dark"] body :is(.card,.workspace-sidebar,.modal-panel,.profile-dropdown,.table-wrap,.kpi-grid,.dashboard-alert,.docs-header) {
    background:var(--surface); border-color:var(--line); box-shadow:none;
  }
  html[data-theme="dark"] body .theme-control .theme-switch,
  html[data-theme="dark"] body .theme-control .theme-switch:hover { background:transparent; color:var(--theme-control-text); }
  html[data-theme="dark"] body :is(.sidebar-brand img,.login-brand-logo,.docs-header > a img) { filter:brightness(1.5); }
  html[data-theme="dark"] .workspace .workspace-header.card { background:var(--bg); }
  html[data-theme="dark"] body:is(.workspace,.login-page,.integration-docs) :is(input[type],input,select,textarea),
  html[data-theme="dark"] .login-page .login-field input {
    color:var(--ink); background-color:var(--surface-input); border-color:var(--theme-control-border);
    accent-color:#82b4f1;
  }
  html[data-theme="dark"] body :is(input,textarea)::placeholder { color:#8793a2; opacity:1; }
  html[data-theme="dark"] body:is(.workspace,.login-page,.integration-docs) :is(input[type],input,select,textarea):disabled { color:var(--muted); background-color:var(--surface-raised); }
  html[data-theme="dark"] body:is(.workspace,.login-page,.integration-docs) :is(input[type],input,select,textarea):focus { border-color:var(--primary); }
  html[data-theme="dark"] body :is(button,.btn) { color:var(--ink); background-color:var(--surface-raised); border-color:var(--theme-control-border); }
  html[data-theme="dark"] body :is(button,.btn):hover { background-color:var(--surface-hover); }
  html[data-theme="dark"] body :is(.btn-primary,button.ok,.login-submit) { background:#2467a8; color:#fff; border-color:#397fc1; }
  html[data-theme="dark"] body :is(.btn-primary,button.ok,.login-submit):hover { background:#2f78bc; }
  html[data-theme="dark"] body :is(.btn-danger,button.warn,.profile-dropdown-item.danger) { color:var(--negative-text); border-color:var(--negative-border); }
  html[data-theme="dark"] body :is(.btn-danger,button.warn,.profile-dropdown-item.danger):hover { background:var(--negative-bg); }
  html[data-theme="dark"] body :is(.btn-ghost,.profile-trigger,.profile-dropdown-item,.room-number-link,.dashboard-alert-review,.integration-cell-action,.debug-tabs button,.alert-read-tabs button,.login-password-toggle) { background:transparent; }
  html[data-theme="dark"] body :is(.btn-ghost,.profile-trigger,.profile-dropdown-item,.room-number-link,.integration-cell-action,.login-password-toggle):hover { background:var(--surface-hover); }
  html[data-theme="dark"] body :is(.room-number-link,.login-password-toggle,.debug-tabs button[aria-selected=true],.alert-read-tabs button[aria-pressed=true]) { color:var(--primary); }
  html[data-theme="dark"] body :is(.debug-tabs button,.alert-read-tabs button) { border-color:transparent; border-bottom-color:transparent; color:var(--muted); }
  html[data-theme="dark"] body :is(.debug-tabs button[aria-selected=true],.alert-read-tabs button[aria-pressed=true]) { border-bottom-color:var(--primary); color:var(--primary); }
  html[data-theme="dark"] body :is(.debug-tabs button,.alert-read-tabs button,.dashboard-alert-review):hover { background:transparent; }
  html[data-theme="dark"] body .dashboard-alert-review { color:var(--ink); }
  html[data-theme="dark"] body :is(.workspace-nav a,.login-field label) { color:#c9d1d9; }
  html[data-theme="dark"] body :is(.workspace-nav a:hover,.quick-links a:hover,.debug-record summary:hover,.dashboard-alert:hover) { background:var(--surface-raised); }
  html[data-theme="dark"] body :is(.workspace-nav a[aria-current="page"],.profile-avatar,.docs-toc a:hover,.docs-toc a[aria-current=true]) { background:var(--accent-soft); color:var(--primary); }
  html[data-theme="dark"] body :is(.login-text,.login-footer,.login-footer a,.docs-toc a,.docs-hero .subtitle,.docs-updated,.chart-list-label,.cell-meta) { color:var(--muted); }
  html[data-theme="dark"] body :is(.quick-links a,.dashboard-row) { color:var(--ink); }
  html[data-theme="dark"] body :is(.dashboard-row,.drawer-actions,.section-head,.debug-results,.debug-record,.debug-tabs,.alert-read-tabs,.auto-checkout-settings) { border-color:var(--line); }
  html[data-theme="dark"] body :is(.modal-backdrop,.room-drawer .modal-backdrop) { background:rgb(0 0 0 / 60%); }
  html[data-theme="dark"] body :is(.occupancy-track,.chart-track,.weekly-column,.pill,.filter-chip) { background:var(--surface-raised); color:var(--muted); border-color:var(--line); }
  html[data-theme="dark"] body .weekly-column i { background:#588bc0; }
  html[data-theme="dark"] body :is(th,.docs-table th,.rooms-table th:first-child,.admin-table th:first-child) { background:var(--surface-raised); color:var(--muted); border-color:var(--line); }
  html[data-theme="dark"] body :is(.history-item,.history-call-row,.tenant-assign-list,.bulk-table-actions) { background:var(--surface-raised); border-color:var(--line); }
  html[data-theme="dark"] body .history-call-meta span { color:var(--muted); }
  html[data-theme="dark"] body .history-calls { border-color:var(--line); }
  html[data-theme="dark"] body .docs-table td { background:var(--surface); }
  html[data-theme="dark"] body tbody tr,
  html[data-theme="dark"] body.workspace tbody tr { --row-bg:var(--surface); background:var(--surface); }
  html[data-theme="dark"] body.workspace tbody tr:hover { --row-bg:var(--surface-raised); background:var(--surface-raised); }
  html[data-theme="dark"] body .login-progress { background:var(--surface-raised); }
  html[data-theme="dark"] body .login-progress-bar { background:var(--primary); }
  html[data-theme="dark"] body td { color:var(--ink); border-color:var(--line); }
  html[data-theme="dark"] body table tbody tr td { --row-bg:var(--surface); background:var(--row-bg); }
  html[data-theme="dark"] body table tbody tr:hover td { --row-bg:var(--surface-raised); }
  html[data-theme="dark"] body :is(.rooms-table,.admin-table) tbody td:first-child { background:var(--row-bg,var(--surface)); }
  html[data-theme="dark"] body .integration-summary tbody th { background:var(--surface); color:var(--ink); }
  html[data-theme="dark"] body .integration-summary tr:hover th { background:var(--surface-raised); }
  html[data-theme="dark"] body :is(.docs-table th,.docs-table td,.integration-summary th,.integration-summary td) { border-color:var(--line); }
  html[data-theme="dark"] body :is(th.sortable.sorted,th.sortable.sorted::after) { color:var(--primary); }
  html[data-theme="dark"] body .badge { box-shadow:none; }
  html[data-theme="dark"] body :is(.badge.free,.badge.clean,.badge.connected) { background:var(--positive-bg); border-color:var(--positive-border); color:var(--positive-text); }
  html[data-theme="dark"] body .badge.occupied { background:var(--accent-soft); border-color:#355374; color:#a7cbf4; }
  html[data-theme="dark"] body .badge.pending { background:var(--caution-bg); border-color:var(--caution-border); color:var(--caution-text); }
  html[data-theme="dark"] body .badge.disconnected { background:var(--negative-bg); border-color:var(--negative-border); color:var(--negative-text); }
  html[data-theme="dark"] body :is(.badge.disabled,.badge:not(.free,.clean,.connected,.occupied,.pending,.disconnected)) { background:var(--surface-raised); border-color:var(--line); color:var(--muted); }
  html[data-theme="dark"] body :is(.integration-summary .is-ok,.status-bar:not(.status-error)) { color:var(--positive-text); }
  html[data-theme="dark"] body :is(.integration-summary .is-error,.sync-error,.health-error) { color:var(--negative-text); }
  html[data-theme="dark"] body .status-bar { background:var(--positive-bg); border-color:var(--positive-border); }
  html[data-theme="dark"] body .status-bar.status-error { background:var(--negative-bg); border-color:var(--negative-border); color:var(--negative-text); }
  html[data-theme="dark"] body .dashboard-load-state { background:var(--caution-bg); border-color:var(--caution-border); color:var(--caution-text); }
  html[data-theme="dark"] body .has-error input { border-color:var(--negative-text); }
  html[data-theme="dark"] body :is(.debug-record-content,.docs-code,.docs-notice) { background:var(--surface-raised); color:var(--ink); border-color:var(--line); }
  html[data-theme="dark"] body :is(.debug-record-content pre,.admin-table td pre,pre) { background:var(--surface-input); color:var(--ink); border-color:var(--line); }
  html[data-theme="dark"] body .docs-code { background:var(--surface-input); color:#c9d1d9; }
  html[data-theme="dark"] body code { color:#a7cbf4; }
  html[data-theme="dark"] body .docs-copy { color:var(--primary); }
  html[data-theme="dark"] body .docs-mini-card { background:transparent; }
  html[data-theme="dark"] .login-page .login-status { background:var(--positive-bg); color:var(--positive-text); }
  html[data-theme="dark"] .login-page .login-status.status-error { background:var(--negative-bg); color:var(--negative-text); }
}

/* Animate explicit changes, keeping the saved theme instant on page load. */
@media screen and (prefers-reduced-motion: no-preference) {
  html.theme-changing body,
  html.theme-changing body *:not(.theme-switch-thumb):not(.theme-switch-track):not(svg):not(svg *) {
    transition:background-color 280ms ease, color 280ms ease, border-color 280ms ease, box-shadow 280ms ease, filter 280ms ease !important;
  }
  html.theme-changing .theme-switch-thumb { transition:transform 240ms cubic-bezier(.2,.7,.3,1); }
  html.theme-changing .theme-switch-track { transition:background-color 240ms ease; }
  html.theme-changing .theme-switch-icons svg { transition:opacity 180ms ease, transform 240ms ease; }
}
@media (prefers-reduced-motion: reduce) {
  .theme-switch-thumb, .theme-switch-track, .theme-switch-icons svg { transition:none; }
}
