/* ═══════════════════════════════════════════════════════════════════
   Токены оформления — единственный источник цветов и размеров.
   Подключается первым, до всех остальных стилей.

   Раньше палитра жила россыпью по пятнадцати файлам: один и тот же
   «серый фон» встречался как #2a2a2a, #212121, #2c2c2c и #222, а кнопки
   были то красные, то зелёные, то бутстраповские. Здесь набор задан один
   раз, и любая правка цвета расходится по всему интерфейсу сразу.
   ═══════════════════════════════════════════════════════════════════ */

:root {
    /* ── Поверхности: от самой глубокой к самой поднятой ── */
    --bg:          #0f0f0f;   /* фон страницы */
    --surface:     #171717;   /* панели, шапки таблиц, карточки */
    --surface-2:   #1e1e1e;   /* вложенные блоки, наведение */
    --surface-3:   #262626;   /* активное состояние, кнопки на панели */
    --field:       #101010;   /* поля ввода — темнее подложки, чтобы читались */

    /* ── Границы ── */
    --line:        #282828;   /* обычная разделительная */
    --line-2:      #333;      /* заметная: рамка контрола */
    --line-hover:  #454545;   /* наведение */

    /* ── Текст ── */
    --text:        #ededed;   /* основной */
    --text-2:      #9d9d9d;   /* подписи, второстепенное */
    --text-3:      #6b6b6b;   /* плейсхолдеры, отключённое */

    /* ── Акцент ──
       Красный — это бренд: активный пункт меню, сортировка, значки
       разделов, рамка поля в фокусе. Действиями он больше не заведует. */
    --accent:       #ff3b3b;
    --accent-hover: #ff5c5c;
    --accent-dim:   #ff7b7b;
    --accent-soft:  rgba(255, 59, 59, .12);
    --accent-line:  rgba(255, 59, 59, .35);

    /* ── Действия ──
       Подтверждающее действие — «сохранить», «добавить», «применить» —
       зелёное. Красным остаётся только опасное: удалить, отвязать.
       Раньше и то и другое было красным, и кнопка «Сохранить» выглядела
       ровно как кнопка «Удалить». */
    --action:       #2ea043;
    --action-hover: #3fb950;
    --action-soft:  rgba(46, 160, 67, .14);

    /* ── Смысловые цвета: одинаковые во всех разделах ── */
    --ok:          #3fb950;
    --ok-soft:     rgba(63, 185, 80, .13);
    --warn:        #d29922;
    --warn-soft:   rgba(210, 153, 34, .13);
    --danger:      #f85149;
    --danger-soft: rgba(248, 81, 73, .13);
    --info:        #4a9eff;
    --info-soft:   rgba(74, 158, 255, .13);

    /* ── Геометрия ──
       Одна высота у всех интерактивных элементов: кнопка, поле, селект.
       Из-за разнобоя в 32/38/42 пикселя строки управления выглядели
       собранными из чужих деталей. */
    --h-ctl:    36px;
    --h-ctl-sm: 30px;

    --r-lg: 10px;  /* карточки, панели */
    --r:     8px;  /* кнопки, поля */
    --r-sm:  6px;  /* мелочь: чипы, теги */

    /* ── Типографика ── */
    --fs-lg: 15px;
    --fs:    13px;
    --fs-sm: 12px;
    --fs-xs: 11px;

    /* ── Шрифт ──
       Poppins, стоявший тут раньше, кириллицы не содержит вовсе:
       браузер молча подставлял системный, и русский текст выглядел
       чужим рядом с латиницей. У Manrope кириллица своя. */
    --font: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    /* ── Тени и переходы ── */
    --shadow:    0 4px 16px rgba(0, 0, 0, .35);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, .5);

    /* Быстро и незаметно: движение должно подсказывать, а не задерживать. */
    --t:      .16s ease;
    --t-fast: .1s ease;
    /* Для того, что двигает раскладку: меню, шапка, ширина основной
       части. Шестнадцати сотых на путь в двести точек мало — движение
       читается как рывок. */
    --t-slow: .24s;
    --ease:   cubic-bezier(.22, .61, .36, 1);

    /* ── Каркас страницы ─────────────────────────────────────────────
       Высота шапки и ширина бокового меню нужны сразу в нескольких
       файлах: сама шапка, отступы основной части, высота списка на
       весь экран. Раньше эти числа были вписаны в каждом месте своим
       и при правке разъезжались. */
    --topbar-h:    46px;   /* шапка */
    --rail:        52px;   /* меню свёрнуто */
    --rail-open:  220px;   /* меню развёрнуто */
}
