/* ═══════════════════════════════════════════════════════════════════════════
 * СЛОЙ СОВМЕСТИМОСТИ: старые токены темы → шкала «Кадра»
 * ───────────────────────────────────────────────────────────────────────────
 * Временный файл на время миграции. Подключается ПОСЛЕ kadr.css.
 *
 * Зачем. theme.css и kadr.css объявляют разные наборы токенов --cdb-*.
 * Пока шаблон не переписан, его классы берут СТАРЫЕ токены, и экран остаётся
 * в старой палитре, хотя «Кадр» уже подключён. Здесь старые имена
 * переопределяются через новую шкалу — и весь непереписанный сайт
 * перекрашивается, не теряя ни одного правила и ни одной строки разметки.
 *
 * Значения — только ссылки на токены «Кадра». Литералы оставлены лишь там,
 * где в новой системе аналога нет (золото трофеев, тени, накладки).
 *
 * Блок для тёмной темы повторяет тот же список: theme.css объявляет свои
 * тёмные значения на [data-bs-theme="dark"], и это селектор той же
 * специфичности, что :root, — перебить его можно только порядком.
 *
 * Удаляется целиком, когда не останется шаблонов на старых классах.
 * ═══════════════════════════════════════════════════════════════════════════ */

:root,
[data-bs-theme="dark"] {
  /* Нейтрали. Сопоставлены по светлоте, а не по номеру: старая шкала
     неравномерная, 200 и 300 в ней почти совпадали */
  --cdb-gray-100: var(--cdb-ink-50);
  --cdb-gray-150: var(--cdb-ink-100);
  --cdb-gray-200: var(--cdb-ink-200);
  --cdb-gray-300: var(--cdb-ink-200);
  --cdb-gray-400: var(--cdb-ink-300);
  --cdb-gray-500: var(--cdb-ink-400);
  --cdb-gray-600: var(--cdb-ink-600);
  --cdb-gray-700: var(--cdb-ink-700);
  --cdb-gray-800: var(--cdb-ink-800);
  --cdb-gray-900: var(--cdb-ink-900);

  /* Бренд — только светлая тема. Фиолетовые вынесены из общего блока:
     старая шкала в тёмной теме НЕ переворачивалась (purple-800 оставался
     тёмным фоном #6b3178), а шкала «Кадра» переворачивается целиком —
     violet-800 в тёмной это светлый #ecd6f4. Одним псевдонимом обе темы
     не покрыть: белый текст меню лёг бы на светлую подложку */
  --cdb-purple-100: var(--cdb-violet-100);
  --cdb-purple-300: var(--cdb-violet-400);
  --cdb-purple-400: var(--cdb-violet-500);
  --cdb-purple-500: var(--cdb-violet-600);
  --cdb-purple-600: var(--cdb-violet-700);
  --cdb-purple-700: var(--cdb-violet-700);
  --cdb-purple-800: var(--cdb-violet-800);

  --cdb-primary:       var(--cdb-brand);
  --cdb-primary-light: var(--cdb-violet-400);
  --cdb-primary-text:  var(--cdb-brand-text);
  --cdb-deep:          var(--cdb-violet-800);
  --cdb-magenta:       var(--cdb-violet-500);

  /* Поверхности */
  --cdb-white:   var(--cdb-surface);
  --cdb-bg-dark: var(--cdb-bg-sunken);

  /* Семантика */
  --cdb-danger:         var(--cdb-alert);
  --cdb-danger-bg:      var(--cdb-alert-bg);
  --cdb-danger-text:    var(--cdb-alert);
  --cdb-danger-border:  color-mix(in srgb, var(--cdb-alert) 35%, transparent);
  --cdb-success:        var(--cdb-ok);
  --cdb-success-bg:     var(--cdb-ok-bg);
  --cdb-success-text:   var(--cdb-ok);
  --cdb-success-border: color-mix(in srgb, var(--cdb-ok) 35%, transparent);
  --cdb-warning:        var(--cdb-warn);
  --cdb-warning-bg:     var(--cdb-warn-bg);
  --cdb-warning-text:   var(--cdb-warn);
  --cdb-warning-border: color-mix(in srgb, var(--cdb-warn) 35%, transparent);
  --cdb-info-text:      var(--cdb-info);
  --cdb-info-border:    color-mix(in srgb, var(--cdb-info) 35%, transparent);

  /* Сигнальный жёлтый: у «Кадра» это ровно тот же цвет с баннера сообщества */
  --cdb-accent:     var(--cdb-signal);
  --cdb-accent-600: color-mix(in srgb, var(--cdb-signal) 88%, #000);
  --cdb-on-accent:  var(--cdb-signal-ink);

  /* Текст на цветной подложке. on-brand у «Кадра» белый в обеих темах —
     ровно то, что делал старый on-color */
  --cdb-on-color: var(--cdb-on-brand);

  /* Геометрия */
  --cdb-radius-sm:   var(--cdb-r-xs);
  --cdb-radius:      var(--cdb-r-sm);
  --cdb-radius-lg:   var(--cdb-r-md);
  --cdb-radius-pill: var(--cdb-r-pill);
  --cdb-nav-height:  var(--cdb-nav-h);
}

/* ── Без аналога в «Кадре» — оставлены как были ────────────────────────────
 * gold          — золото кубка победителя, отдельный смысловой цвет
 * shadow*       — «Кадр» задаёт тени целиком (--cdb-e1..e3), а тема
 *                 использует только цвет внутри своих rgba()
 * overlay-dark  — затемнение подложки
 * on-dark*      — текст поверх тёмных панелей, не зависит от темы
 * highlight     — в theme.css объявлен сам через себя, то есть сломан;
 *                 не трогаем, чтобы не менять поведение вместе с цветом
 * ────────────────────────────────────────────────────────────────────────── */

/* ── Фиолетовые в тёмной теме ──────────────────────────────────────────────
 * Сопоставлены по РОЛИ, а не по номеру. У старой темы шкала в тёмном режиме
 * шла тем же порядком, что в светлом (500 — бренд, 800 — тёмный фон),
 * у «Кадра» она инвертируется: чем выше номер, тем светлее.
 * Поэтому здесь номера намеренно «перекрещены».
 * ────────────────────────────────────────────────────────────────────────── */
[data-bs-theme="dark"] {
  --cdb-purple-100: var(--cdb-violet-100);   /* тёмная подложка  #2a1e33 ≈ #2e2436 */
  --cdb-purple-300: var(--cdb-violet-600);   /* светлый акцент   #c68fd9 ≈ #c07fd0 */
  --cdb-purple-400: var(--cdb-violet-500);   /* #b478c9 ≈ #a95bbd */
  --cdb-purple-500: var(--cdb-brand);        /* #9b4fb0 — совпадает точно */
  --cdb-purple-600: var(--cdb-violet-400);   /* #8b5da0 ≈ #8b45a0 */
  --cdb-purple-700: var(--cdb-violet-700);   /* светлый текст    #dcb4e9 ≈ #d3a8e0 */
  --cdb-purple-800: var(--cdb-violet-300);   /* тёмный фон       #5b3f6c ≈ #6b3178 */

  --cdb-primary-light: var(--cdb-violet-600);
  --cdb-deep:          var(--cdb-violet-100);
  --cdb-magenta:       var(--cdb-violet-500);
}

/* ── Точечные развязки конфликтов, пока theme.css жив ──────────────────────
 * Не токены, а правила: их ровно столько, сколько нашлось при миграции экранов.
 * Удаляются вместе с соответствующим блоком theme.css.
 * ────────────────────────────────────────────────────────────────────────── */

/* Счётчик в пилюлях раздела. «Кадр» даёт ему фон --cdb-bg-sunken, а тёмное
   правило темы .badge:not([class*="bg-"]) продолжает красить текст в gray-150 —
   тёмное на тёмном, контраст 1.16. Специфичность равна, решает порядок файлов */
[data-bs-theme="dark"] .cdb-pills .badge { color: var(--cdb-text-soft); }
[data-bs-theme="dark"] .cdb-pills > .is-active .badge { color: #fff; }

/* Контейнер shell. «Кадр» вешает его на .cdb-shell — свою обёртку контента.
   На живом сайте контент лежит в .container.site-content, поэтому 21 правило
   @container shell из 23 не срабатывало вовсе: на узком экране раскладка
   «обложка слева» не схлопывалась, таблицы не перестраивались, а панель
   уезжала за край экрана.
   Объявляем контекст на существующей обёртке, не трогая её геометрию:
   .cdb-shell задаёт ещё max-width и padding, а они конфликтуют с .container.
   Когда шаблоны переедут на .cdb-shell, эта строка уйдёт. */
.site-content { container-type: inline-size; container-name: shell; }

/* Форма поиска переехала из .utility-bar в .cdb-topbar. Правило темы
   .site-search { order: -1 } ставило её первой — в утилитарной строке это было
   верно, а в топбаре выбрасывает поиск левее логотипа.
   Класс .site-search снять нельзя: по нему modules/bottom_nav.js переносит
   форму в мобильную шторку поиска. */
.cdb-topbar .site-search { order: 0; }

/* Текущий раздел в фасетах — <span>, а не ссылка: кликать по странице, на которой
   уже стоишь, незачем. «Кадр» же стилизует только прямого ребёнка-ссылку
   (.cdb-facet > a), поэтому повторяем для span активное состояние.
   Уйдёт, если в дизайн-систему добавят .cdb-facet > [aria-current]. */
.cdb-facet > span[aria-current="page"] {
  display: flex; align-items: center; gap: var(--cdb-s3);
  padding: 8px 10px; min-height: 48px; border-radius: var(--cdb-r-sm);
  background: var(--cdb-brand-soft); border: 1px solid var(--cdb-brand);
  color: var(--cdb-brand-text); font-weight: 600;
}

/* Подвал. Старый .site-footer был тёмно-фиолетовым, поэтому тема красила ссылки
   в белый (--cdb-on-color). У .cdb-footer фон светлый — белые ссылки стали
   невидимыми, контраст 1.0. Класс .site-footer оставлен: он в APBlackList.
   Специфичность совпадает, решает порядок файлов. */
.cdb-footer a, .cdb-footer a:visited { color: var(--cdb-link); }
.cdb-footer a:hover { color: var(--cdb-link-hover); }

/* Подвал прижимается к низу через body{display:flex;column} + .site-content{flex:1 0 auto}.
   Обёртка .cdb-page встала между ними и разорвала цепочку: margin-top:auto у подвала
   считался внутри неё, и на коротких страницах (/abc) подвал вставал посреди экрана.
   Возвращаем обёртке те же свойства — тогда рост передаётся дальше в .site-content. */
.cdb-page { display: flex; flex-direction: column; flex: 1 0 auto; }

/* Выпадающее меню. Пункты скруглены (6px), но при нулевом боковом padding меню
   они идут от края до края и радиус срезается рамкой самого меню — подсветка
   выглядит квадратной. Даём меню боковой отступ, чтобы пункты сидели с втяжкой.
   Переменные Bootstrap, а не свои правила: разметка остаётся бутстраповской. */
.dropdown-menu {
  --bs-dropdown-padding-x: 6px;
  --bs-dropdown-item-padding-x: 10px;
  --bs-dropdown-font-size: var(--cdb-size-sm);
}

/* Решётка букв. .cdb-letters--grid задаёт колонки, но растягивается только сам
   grid-элемент — у нас это <li> из createFacetList, а ссылка внутри остаётся
   inline-flex шириной 46px. В артборде буквы идут во flex-варианте, где это
   не проявляется. Дотягиваем ссылку до ячейки. */
.cdb-letters--grid > li { display: flex; }
.cdb-letters--grid > li > a { width: 100%; }

/* ── Посещённые ссылки ────────────────────────────────────────────────────
 * Заплаток здесь больше нет: глобальные a:visited убраны из самой theme.css.
 * Они красили посещённые ссылки поверх любого компонента, потому что a:visited
 * это (0,1,1), а .cdb-btn или .dropdown-item — (0,1,0). Лечить это правилами
 * :visited оказалось тупиком: браузер сильно ограничивает такие стили ради
 * приватности, var() в них ненадёжен, а getComputedStyle вообще отдаёт
 * непосещённый цвет — то есть дефект не виден ни замером, ни в панели,
 * где ссылки ещё не посещали.
 *
 * «Кадр» посещённые ссылки не различает вовсе, так что снятие правила —
 * это и есть поведение по дизайну. Точечные :visited у заголовков строк
 * (issue-row__title и родня) в теме остались: они относятся к старым
 * компонентам и уйдут вместе с ними.
 * ────────────────────────────────────────────────────────────────────────── */

/* Активный пункт меню под курсором. У Bootstrap .dropdown-item:hover и
   .dropdown-item.active имеют одну специфичность (0,2,0), а :hover объявлен
   позже — поэтому наведение снимало брендовую заливку с текущего раздела,
   и он переставал читаться как текущий. Держим заливку, на наведении делаем
   её на тон темнее. */
.dropdown-item.active:hover,
.dropdown-item.active:focus {
  background-color: var(--cdb-brand-hover);
  color: var(--bs-dropdown-link-active-color);
}

/* ───────────────────────────────────────────────────────────────────────────
 * Осиротевшие токены theme.css
 * ─────────────────────────────────────────────────────────────────────────── */

:root,
[data-bs-theme="light"] {
  /* Токены без пары в «Кадре»: тени, накладки и текст на цветной подложке.
     Переехали из :root theme.css, когда тот лишился блока токенов.
     --cdb-highlight в theme.css ссылался сам на себя и потому не работал
     с самого появления шкалы — верхняя подсветка градиентных кнопок BS3
     не рисовалась; здесь он получает настоящее значение */
  --cdb-shadow: rgba(0, 0, 0, .2);
  --cdb-shadow-soft: rgba(0, 0, 0, .075);
  --cdb-overlay-dark: rgba(0, 0, 0, .28);
  --cdb-on-dark: rgba(255, 255, 255, .85);
  --cdb-on-dark-strong: #f6eff8;
  --cdb-highlight: rgba(255, 255, 255, .15);
}

[data-bs-theme="dark"] {
  /* Тени в тёмной теме глубже: на тёмном фоне слабая тень не читается */
  --cdb-shadow: rgba(0, 0, 0, .5);
  --cdb-shadow-soft: rgba(0, 0, 0, .3);
  --cdb-overlay-dark: rgba(0, 0, 0, .5);
  --cdb-on-dark: rgba(255, 255, 255, .85);
  --cdb-on-dark-strong: #f6eff8;
  --cdb-highlight: rgba(255, 255, 255, .08);
}
