/* ==========================================================================
   RAP NOTATION — единый визуальный словарь нотации
   ==========================================================================
   ЗАЧЕМ. Единственное место, где объявлен цвет понятий RAP-нотации: RACI и
   фаз процесса. До apps_devpod-119 цвета жили независимо в трёх местах —
   шаблоне витрины, хелперах боковых панелей и editor-matrices.css — и
   разъехались: красный означал одновременно R, A и I, в зависимости от того,
   на какую поверхность смотришь.

   КАК ПОЛЬЗОВАТЬСЯ. Поверхности берут готовые классы (.rap-raci-r,
   .rap-phase-input, …), а не токены напрямую и тем более не свои цвета.
   Имена классов и токенов продублированы в словаре bff/notation/notation.go
   и bff/editor/src/lib/notation.ts; Go-тест разбирает этот файл и проверяет,
   что каждый класс объявлен и построен на заявленном токене — расхождение
   ломает тест, а не проявляется багом на проде.

   ПАЛИТРА RACI не содержит красного. --destructive и --chart-5 зарезервированы
   за ошибками и удалением: красная заливка ячейки читается как «здесь
   проблема», а не «здесь исполнитель». Значения идут градиентом вовлечённости:
   зелёный (делает) → янтарный (отвечает) → синий (консультирует) →
   серый (уведомлён).

   ПАЛИТРА ФАЗ кодирует поток работы: вход синий → обработка янтарная →
   выход зелёный → проверка фиолетовая.

   ТЕМЫ. Токены собраны из переменных design2.css, поэтому светлая и тёмная
   темы поддерживаются автоматически: переопределять цвета под .dark не нужно
   и не следует — иначе появится второе место объявления.

   СВЯЗИ: bff/notation/notation.go, bff/editor/src/lib/notation.ts,
   bff/static/css/design2.css (источник --chart-*, --primary, --muted-*).
   ========================================================================== */

:root {
  /* RACI — связь роли с артефактом */
  --rap-raci-r: var(--primary);
  --rap-raci-a: var(--chart-4);
  --rap-raci-c: var(--chart-2);
  --rap-raci-i: var(--muted-foreground);

  /* Фазы процесса — связь процесса с артефактом */
  --rap-phase-input: var(--chart-2);
  --rap-phase-processing: var(--chart-4);
  --rap-phase-output: var(--primary);
  --rap-phase-review: var(--chart-3);

  /* ЦВЕТ ТЕКСТА НА ЗАЛИВКЕ понятия — для мест, где знак нарисован сплошным
     цветом, а не полупрозрачной подложкой (активные токены матриц редактора).

     Выбран по ЗАМЕРЕННОМУ контрасту с конкретным цветом понятия, а не по
     теме вокруг: знак 10px жирный, то есть мелкий текст, порог AA — 4.5:1.
     Замеры в браузере (тёмная / светлая тема):

       R и фаза Выход, зелёный   — тёмный текст  8.80 / 5.03
       A и Обработка, янтарный   — тёмный текст  9.61 / 8.90
       C и Вход, синий           — белый текст   4.57 / 4.57
       I, серый                  — var(--card)   4.68 / 4.96
       фаза Проверка, фиолетовый — тёмный текст  4.39 / 4.39

     Особый случай — серый I: он единственный, кто сам меняется между темами
     (--muted-foreground светлее в тёмной), поэтому фиксированный текст
     проваливает одну из них — белый даёт 3.51 в тёмной, тёмный 3.60 в
     светлой. Для него берётся --card, который меняется вместе с темой.

     ИЗВЕСТНОЕ ОГРАНИЧЕНИЕ: фиолетовый (--chart-3) не даёт 4.5:1 ни с тёмным
     текстом (4.39), ни с белым (4.03) — упирается сам оттенок. Взят лучший из
     двух; это всё равно выше прежних 4.03. Чинится только пересмотром
     --chart-3, а он общий для темы и служит ещё и цветом ТЕКСТА чипа фазы на
     публичной странице, где затемнение сделало бы хуже. Вынесено отдельной
     задачей, здесь осознанно не трогается.

     Отсюда правило: не «светлая заливка — тёмный текст», а «замерить и
     записать здесь». Заливка одного цвета встречается на двух поверхностях,
     и подбор на месте вернул бы расхождение, ради устранения которого
     затевалась apps_devpod-119. */
  --rap-ink-on-light: 240 6% 10%;
  --rap-ink-on-dark: 0 0% 100%;

  --rap-raci-r-ink: var(--rap-ink-on-light);
  --rap-raci-a-ink: var(--rap-ink-on-light);
  --rap-raci-c-ink: var(--rap-ink-on-dark);
  --rap-raci-i-ink: var(--card);

  --rap-phase-input-ink: var(--rap-ink-on-dark);
  --rap-phase-processing-ink: var(--rap-ink-on-light);
  --rap-phase-output-ink: var(--rap-ink-on-light);
  --rap-phase-review-ink: var(--rap-ink-on-light);
}

/* ==========================================================================
   ЗНАКИ RACI
   ==========================================================================
   .rap-raci — форма знака (квадратный токен с буквой), общая для витрины,
   боковых панелей и легенд. Цвет добавляет модификатор .rap-raci-{r,a,c,i}.
   Матрица редактора использует те же модификаторы поверх своей формы
   (круглый toggle) — см. editor-matrices.css.
   ========================================================================== */

.rap-raci {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.25rem;
  font-weight: 600;
  line-height: 1;
}

.rap-raci-r {
  background-color: hsl(var(--rap-raci-r) / 0.15);
  color: hsl(var(--rap-raci-r));
}

.rap-raci-a {
  background-color: hsl(var(--rap-raci-a) / 0.15);
  color: hsl(var(--rap-raci-a));
}

.rap-raci-c {
  background-color: hsl(var(--rap-raci-c) / 0.15);
  color: hsl(var(--rap-raci-c));
}

.rap-raci-i {
  background-color: hsl(var(--rap-raci-i) / 0.15);
  color: hsl(var(--rap-raci-i));
}

/* Связь есть, но её тип — только взаимодействие (Creates, Approves, …), без
   буквы RACI. Знака у взаимодействия нет намеренно: витрина раньше печатала
   первую букву его кода, и Creates давал «C», Approves — «A», Reviews — «R» —
   омонимы букв RACI в той же таблице. Вместо буквы нейтральный маркер,
   смысл — в подсказке title. */
.rap-raci-none {
  background-color: hsl(var(--secondary));
  color: hsl(var(--muted-foreground));
}

/* ==========================================================================
   ЗНАКИ ФАЗ
   ==========================================================================
   Знак фазы — слово, а не буква: буквы I/P/O/R коллидировали с буквами RACI
   на одной вкладке «Связи» редактора (I = Input и Informed, R = Review и
   Responsible), то есть один знак означал разное в соседних таблицах.
   ========================================================================== */

.rap-phase {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.25rem;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
}

.rap-phase-input {
  background-color: hsl(var(--rap-phase-input) / 0.15);
  color: hsl(var(--rap-phase-input));
}

.rap-phase-processing {
  background-color: hsl(var(--rap-phase-processing) / 0.15);
  color: hsl(var(--rap-phase-processing));
}

.rap-phase-output {
  background-color: hsl(var(--rap-phase-output) / 0.15);
  color: hsl(var(--rap-phase-output));
}

.rap-phase-review {
  background-color: hsl(var(--rap-phase-review) / 0.15);
  color: hsl(var(--rap-phase-review));
}