/*
  Дизайн-токены. Подключается после main.css и переопределяет его палитру.
  Ребрендинг: меняем значения в блоке примитивов, семантику и main.css не трогаем.
*/

:root {
  /* Примитивы: сырая палитра проекта */
  --c-red-500: #fe0c0b;
  --c-red-600: #d50201;
  --c-blue-500: #0daefd;
  --c-blue-600: #0095ff;
  --c-ink-900: #232121;
  --c-ink-800: #2b2a28;
  --c-ink-500: #848687;
  --c-gray-300: #d9d9d9;
  --c-gray-350: #ccc;
  --c-gray-400: #ddd;
  --c-surface-blue-50: #f3f9fc;
  --c-surface-blue-100: #f1f7fa;

  /* Семантика: имена, которыми оперирует main.css */
  --accent-red: var(--c-red-500);
  --accent-red-hover: var(--c-red-600);
  --accent-blue: var(--c-blue-500);
  --accent-blue-hover: var(--c-blue-600);
  --text-primary: var(--c-ink-900);
  --text-headings: var(--c-ink-800);
  --text-secondary: var(--c-ink-500);
  --border-light: var(--c-gray-300);
  --border-medium: var(--c-gray-350);
  --border-dark: var(--c-gray-400);
  --background-light-blue: var(--c-surface-blue-50);
  --background-catalog-nav: var(--c-surface-blue-100);

  /* Алиасы, которые используются в шаблонах, но отсутствовали в main.css */
  --color-red: var(--accent-red);
  --color-blue: var(--accent-blue);
}