/* Единая цветовая схема CRM (кабинет и админка): День / Ночь / Как в системе.
   Тема хранится в localStorage["theme"] = auto | light | dark (тот же ключ, что у админки Django и видеосервера),
   <html data-theme="..."> выставляет /static/fleet/theme.js. Ночная палитра — как на видеосервере. */
:root {
  color-scheme: light;
  --bg: #f4f8ff;          /* фон страницы */
  --panel: #ffffff;       /* карточки, панели, шапка */
  --panel2: #f4f8ff;      /* шапки таблиц, подложки, наведение */
  --line: #dbe7f6;        /* границы */
  --text: #1e293b;
  --muted: #64748b;
  --heading: #0b2d6b;     /* заголовки */
  --bar: #020c24;         /* тёмные плашки (заголовки панелей, «Меню») */
  --on-bar: #ffffff;
  --primary: #0066cc;     /* кнопки, акценты */
  --primary-dark: #0052a8;
  --on-primary: #ffffff;
  --link: #0066cc;
  --sel: #e3f0ff; --brand-cyan: #00c6ff; --brand-sky: #7fd6ff;         /* выбранный пункт, подсветка */
  --input-bg: #ffffff;
  --soft: #cbd5e1;        /* неактивное */
  --ok: #2e7d32;  --ok-bg: #e8f5ec;
  --warn: #e68a00; --warn-bg: #fff3dc; --warn-text: #a55f00;
  --bad: #c62828; --bad-bg: #fdecec;
  --dot-ok: #33c481; --dot-ok-ring: rgba(51,196,129,.18);
  --dot-bad: #ff6b5b; --dot-bad-ring: rgba(255,107,91,.18);
  --sh-sm: 0 4px 6px -1px rgba(0,0,0,.05);
  --sh-md: 0 10px 15px -3px rgba(0,0,0,.08);
  --zebra: #fafcfe; --hover-row: #f0f6fd;
  --track: #e8eef5;       /* фон полосок */
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { 
    color-scheme: dark;
    --bg: #020c24; --panel: #08183a; --panel2: #0d2349; --line: #17325e;
    --text: #e8ecf4; --muted: #8a94a9; --heading: #e8ecf4;
    --bar: #020c24; --on-bar: #e8ecf4;
    --primary: #2a7bff; --primary-dark: #1d63d8; --on-primary: #ffffff;
    --link: #00e5ff; --sel: rgba(0,229,255,.14); --brand-cyan: #00e5ff; --brand-violet: #8a2bff; --input-bg: #0d2038; --soft: #3a5272;
    --ok: #33c481; --ok-bg: rgba(51,196,129,.16);
    --warn: #f0a93b; --warn-bg: rgba(240,169,59,.16); --warn-text: #f0a93b;
    --bad: #ff6b5b; --bad-bg: rgba(255,107,91,.16);
    --sh-sm: 0 4px 6px -1px rgba(0,0,0,.35); --sh-md: 0 10px 15px -3px rgba(0,0,0,.45);
    --zebra: #0a1d42; --hover-row: #102a57; --track: #17325e;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #020c24; --panel: #08183a; --panel2: #0d2349; --line: #17325e;
  --text: #e8ecf4; --muted: #8a94a9; --heading: #e8ecf4;
  --bar: #020c24; --on-bar: #e8ecf4;
  --primary: #2a7bff; --primary-dark: #1d63d8; --on-primary: #ffffff;
  --link: #00e5ff; --sel: rgba(0,229,255,.14); --brand-cyan: #00e5ff; --brand-violet: #8a2bff; --input-bg: #0d2038; --soft: #3a5272;
  --ok: #33c481; --ok-bg: rgba(51,196,129,.16);
  --warn: #f0a93b; --warn-bg: rgba(240,169,59,.16); --warn-text: #f0a93b;
  --bad: #ff6b5b; --bad-bg: rgba(255,107,91,.16);
  --sh-sm: 0 4px 6px -1px rgba(0,0,0,.35); --sh-md: 0 10px 15px -3px rgba(0,0,0,.45);
  --zebra: #0a1d42; --hover-row: #102a57; --track: #17325e;
}

/* Переключатель темы в шапке */
.theme-switch{display:inline-flex;align-items:center;margin-right:6px}
.theme-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;transition:all .2s}
.theme-btn:hover{color:var(--primary);border-color:var(--primary)}
.theme-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.theme-btn svg{display:none}
:root[data-theme="light"] .theme-btn .i-light,:root[data-theme="dark"] .theme-btn .i-dark{display:block}
:root:not([data-theme="light"]):not([data-theme="dark"]) .theme-btn .i-auto{display:block}
