/* СГЕНЕРИРОВАНО bin/build-tokens из workbench.css. Руками не править.
 *
 * Только переменные, ни одного правила оформления. Для страниц, у которых
 * уже есть свои компоненты: палитра становится общей, а вёрстка остаётся
 * нетронутой. Полный пакет там подключать нельзя — его правила для голых
 * button/input/label перебивают то, чего страница про себя не сказала. */

:root {
  /* Нативные контролы — календарь в input[type=date], выпадающий список
     select, полосы прокрутки — красятся браузером, а не нашим CSS. Без этой
     строки в тёмной теме они остаются светлыми и выбиваются из страницы. */
  color-scheme: light dark;

  --bg: #f6f7f9;
  --card: #ffffff;
  --ink: #1d2430;
  --muted: #626c7c;
  --line: #dfe3e9;

  --accent: #2f5d9e;
  --on-accent: #ffffff;

  /* Смысловые цвета. --tight отдельно от --warn: у подбора это разные вещи —
     «впритык, но проходит» и «предупреждение». Совпадение оттенков случайно,
     разводить их по разным переменным нужно, чтобы можно было развести цвета.
     Значения подобраны под контраст ≥4.5 на своих подложках: исходный
     #b8860b давал на --warn-bg всего 2.97, а метки набраны 12-м кеглем. */
  --ok: #2b752f;
  --tight: #8a6100;
  --warn: #8a6100;
  --bad: #b3261e;
  /* Отдельно от --warn: у позиции с устаревшим результатом (входные данные
     поменялись после последнего расчёта) смысл другой, чем у предупреждения
     — не "проверь", а "пересчитай". Тот же класс проблемы, что развела
     --tight и --warn выше: два похожих по цвету, но разных по действию
     состояния под одной переменной сливаются на письме и в разметке. */
  --stale: #9a3412;

  --ok-bg: #e8f3e9;
  --warn-bg: #fdf4dd;
  --bad-bg: #fbe7e6;
  --grey-bg: #eef0f3;
  --stale-bg: #ffedd5;

  /* Подложка шапки таблицы. Отдельный токен, а не --grey-bg: в тёмной теме
     они расходятся — строка заголовка должна остаться отличимой от строк. */
  --th-bg: #eef1f5;

  --radius: 6px;
  --radius-lg: 10px;
  --shadow: 0 12px 40px rgba(0, 0, 0, .25);

  --space: 14px;
  --space-lg: 20px;

  --font: 15px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --wrap: 1180px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #14171c;
    --card: #1b1f26;
    --ink: #e6e9ee;
    --muted: #98a1ad;
    --line: #2c323b;

    --accent: #5b8ede;
    /* Тёмный текст на светлой кнопке, а не белый. Акцент в тёмной теме
       обязан быть светлым, иначе ссылки на карточке не читаются, — но белым
       по нему выходит контраст 3.30. Разводится это только сменой цвета
       текста на кнопке, поэтому --accent и --on-accent разные переменные. */
    --on-accent: #0f1319;

    /* Светлые смысловые цвета на тёмном фоне нечитаемы — осветляем и текст,
       и подложки. В исходных копиях это было сделано только для бейджей,
       из-за чего таблицы и плашки в тёмной теме теряли смысл. */
    --ok: #7cc47f;
    --tight: #e0b64a;
    --warn: #e0b64a;
    --bad: #f08b85;
    --stale: #f0975a;

    --ok-bg: #1e3a20;
    --warn-bg: #3b3016;
    --bad-bg: #3d1f1d;
    --grey-bg: #252a32;
    --stale-bg: #3d2411;
    --th-bg: #222731;
  }
}