/* ============================================================================
   Общие токены двух проектов: «Учёт товара» (uchet) и «Поставка Ozon» (ozon-web).
   Источник истины — этот файл. В ядре он лежит как app/web/static/tokens.css и
   подключается ПЕРЕД app.css; в дашборде StaticFiles не подключён, поэтому его
   содержимое вставлено в начало <style> в base.html — при правке менять оба места.

   В файле ТОЛЬКО объявления в :root. Ни одного правила на селекторы: он
   подключается в два проекта с разной вёрсткой, и любое правило здесь начало бы
   тихо перекрывать их собственные стили — ровно тот случай, который не падает
   тестом, а просто выглядит сломанным.

   Гамма — фирменная Ozon: синий #005BFF и тёмный #001A34 взяты с brandlab.ozon.ru,
   малиновый #F91155 — из брендбука (значение ещё сверить по официальному PDF).
   Все пары «текст на фоне» замерены по WCAG 2.1, цифры стоят в комментариях;
   ниже 4.5:1 для мелкого текста нет ни одной.

   Имена переменных — часть контракта дашборда: на --err завязан инлайновый JS
   в cabinet.html, на --ink, --card, --accent — инлайновые стили шаблонов.
   Переименовывать нельзя. Добавлять новые — сколько угодно.
   ========================================================================== */
:root{
  /* --------------------------------------------------------- фон и поверхности
     Белый интерфейс с холодным подмесом: --bg чуть синее белого, чтобы карточка
     читалась как лист на столе, а не сливалась с фоном без границы. */
  --bg:#f4f7fc;
  --surface:#fafcff;      /* боковое меню, тихие заливки */
  --card:#fff;

  /* ------------------------------------------------------------------- текст */
  --ink:#001a34;          /* тёмный Ozon. 17.5:1 на --card, 16.3:1 на --bg,
                             17.1:1 на --surface, 15.7:1 на --line-soft */
  --muted:#5b6b7f;        /* 5.4:1 на --card, 5.1:1 на --bg, 5.3:1 на --surface,
                             4.9:1 на --wait-soft и на --line-soft */
  --on-accent:#fff;       /* текст на синей и малиновой заливке */

  /* ------------------------------------------------------------------- линии */
  --line:#e1e8f2;         /* границы карточек и таблиц — декоративные */
  --line-soft:#eef3fa;    /* линии внутри таблицы */
  --line-input:#7f8fa6;   /* граница поля: 3.3:1 на белом — требование WCAG 1.4.11
                             к границам элементов управления. Светлее нельзя. */

  /* ------------------------------------------------- синий: главный акцент
     Кнопки, ссылки, активный пункт меню, кольцо фокуса, полоса прогресса. */
  --accent:#005bff;       /* 5.3:1 с белым текстом на заливке */
  --accent-ink:#0040c1;   /* текст и ссылки: 8.4:1 на --card, 7.8:1 на --bg,
                             7.3:1 на --accent-soft */
  --accent-soft:#e8f0ff;
  --accent-line:#c7dbff;
  --ring:rgba(0,91,255,.22);

  /* ------------------------------ малиновый: второй фирменный, БЕЗ статуса
     Правило: малиновый НИКОГДА не означает состояние. Им красим фирменный знак,
     акцентную черту у заголовков разделов, крупные денежные цифры и второй ряд
     в графиках. Плашки состояний он не трогает — иначе «розовое» и «красное»
     рядом читались бы как два разных вида ошибки.
     --pink на белом даёт 4.0:1: это допустимо для крупного (>=18.7px bold) и для
     нетекстовых элементов, для мелкого текста берём --pink-ink (6.3:1). */
  --pink:#f91155;
  --pink-ink:#c1053e;
  --pink-soft:#ffecf1;

  /* --------------------------------------------------------------- статусы */
  --ok:#0e7a45;      --ok-soft:#e1f5ea;    /* 5.4:1 на белом, 4.8:1 на своём фоне */
  --warn:#9a6400;    --warn-soft:#fff3d6;  /* 5.0:1 на белом */
  --warn-ink:#7a4f00;                       /* 6.5:1 на --warn-soft */
  --err:#cc1f1f;     --err-soft:#fdecec;   /* 5.6:1 на белом, 4.9:1 на своём фоне */
  --err-ink:#a31515;                        /* 6.9:1 на --err-soft */
  --wait-soft:#eef2f7;                      /* «ждёт»: серо-синий, без цвета-сигнала */

  /* -------------------------------------------------------------- геометрия
     Ozon скругляет заметно; 12px на карточке и 8px на контроле — его пропорция. */
  --r:12px; --r-sm:8px; --r-pill:999px;
  --sp:16px;
  --nav-w:236px;

  /* ------------------------------------------------------------------- тени
     Холодные, по --ink, а не по чёрному: тёплая тень на синеватом фоне выглядит
     грязной. Две тени вместо одной — контактная и рассеянная. */
  --shadow:0 1px 2px rgba(0,26,52,.05), 0 2px 10px rgba(0,26,52,.045);
  --shadow-lift:0 2px 6px rgba(0,26,52,.07), 0 10px 28px rgba(0,26,52,.08);

  /* ------------------------------------------------------------------ шрифт
     Фирменный шрифт Ozon лицензионный, ставить его нельзя. Системный стек плюс
     табличные цифры: в обоих проектах колонки чисел должны стоять ровно. */
  --font-ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,
            "Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* ---------------------------------------------- синонимы для ядра учёта
     В ядре свои имена; чтобы не переписывать его CSS целиком и не плодить
     второй набор значений, имена ядра объявлены синонимами канонических. */
  --panel:var(--card);
  --good:var(--ok);
  --bad:var(--err);
  --radius:var(--r-sm);
}