/*
 * Общие переменные темы для всех страниц (атрибут ставит /static/js/theme.js).
 * Страница пишет свои правила через html[data-theme="dark"] / html[data-theme="black"]
 * и эти переменные — так тёмная и чёрная темы остаются согласованными.
 *
 * Чёрная (AMOLED): фон строго #000, поверхности почти чёрные, контраст текста
 * не ниже 7:1 к фону; акцент и цвета статусов те же, что в тёмной.
 *
 * Светлая: приглушённый текст (--t-muted, --t-faint) — не ниже 4.5:1 к белому
 * и к светлым поверхностям (#f8fafc, #fafafa). --t-faint был #9ca3af — 2.54:1
 * («Нет звонков…», «Нет данных…», пустые состояния); теперь он равен --t-muted.
 * На серой подложке (чипы #e5e7eb, заголовки #f3f4f6) и #6b7280 мало — там
 * страницы берут свой токен потемнее (сторож — test_frontend_muted_contrast.js).
 */
:root, html[data-theme="light"] {
    --t-bg: #f5f5f5; --t-surface: #ffffff; --t-surface-2: #f8fafc; --t-surface-3: #eef2f7;
    --t-border: #e5e7eb; --t-border-strong: #cbd5e1;
    --t-text: #1f2937; --t-muted: #6b7280; --t-faint: #6b7280;
    --t-accent: #2563eb; --t-accent-soft: #eff6ff; --t-accent-text: #1d4ed8;
    --t-input: #ffffff; --t-input-border: #d1d5db;
    --t-hover: #f1f5f9; --t-selected: #eff6ff;
    --t-ok: #047857; --t-ok-soft: #d1fae5; --t-warn: #92400e; --t-warn-soft: #fef3c7;
    --t-err: #b91c1c; --t-err-soft: #fee2e2;
    --t-shadow: 0 4px 16px rgba(15, 23, 42, .08); --t-overlay: rgba(15, 23, 42, .45);
    --t-code: #f3f4f6; --t-scroll: #cbd5e1;
}
html[data-theme="dark"] {
    color-scheme: dark;
    --t-bg: #12151f; --t-surface: #1b2030; --t-surface-2: #232a3d; --t-surface-3: #2a3248;
    --t-border: #2f3852; --t-border-strong: #455070;
    --t-text: #e6e9f2; --t-muted: #a7afc6; --t-faint: #7f89a6;
    --t-accent: #60a5fa; --t-accent-soft: rgba(96, 165, 250, .14); --t-accent-text: #93c5fd;
    --t-input: #151a28; --t-input-border: #3a4563;
    --t-hover: #252d42; --t-selected: rgba(96, 165, 250, .16);
    --t-ok: #6ee7b7; --t-ok-soft: rgba(16, 185, 129, .16); --t-warn: #fcd34d; --t-warn-soft: rgba(245, 158, 11, .16);
    --t-err: #fca5a5; --t-err-soft: rgba(239, 68, 68, .18);
    --t-shadow: 0 8px 28px rgba(0, 0, 0, .45); --t-overlay: rgba(0, 0, 0, .6);
    --t-code: #232a3d; --t-scroll: #3a4563;
}
html[data-theme="black"] {
    color-scheme: dark;
    --t-bg: #000000; --t-surface: #0b0b0b; --t-surface-2: #121212; --t-surface-3: #1a1a1a;
    --t-border: #262626; --t-border-strong: #3a3a3a;
    --t-text: #ededed; --t-muted: #a8a8a8; --t-faint: #7a7a7a;
    --t-accent: #5aa9ff; --t-accent-soft: rgba(90, 169, 255, .14); --t-accent-text: #8cc4ff;
    --t-input: #0b0b0b; --t-input-border: #333333;
    --t-hover: #161616; --t-selected: rgba(90, 169, 255, .16);
    --t-ok: #6ee7b7; --t-ok-soft: rgba(16, 185, 129, .14); --t-warn: #fcd34d; --t-warn-soft: rgba(245, 158, 11, .14);
    --t-err: #fca5a5; --t-err-soft: rgba(239, 68, 68, .16);
    --t-shadow: 0 8px 28px rgba(0, 0, 0, .8); --t-overlay: rgba(0, 0, 0, .75);
    --t-code: #151515; --t-scroll: #333333;
}
/* Полосы прокрутки и системные элементы — в тон теме */
html[data-theme="dark"] ::-webkit-scrollbar, html[data-theme="black"] ::-webkit-scrollbar { width: 10px; height: 10px; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb, html[data-theme="black"] ::-webkit-scrollbar-thumb {
    background: var(--t-scroll); border-radius: 6px; border: 2px solid var(--t-bg);
}
html[data-theme="dark"] ::-webkit-scrollbar-track, html[data-theme="black"] ::-webkit-scrollbar-track { background: var(--t-bg); }
html[data-theme="dark"] ::selection, html[data-theme="black"] ::selection { background: rgba(96, 165, 250, .35); }