/* Дизайн-токены geek.md — единственное место, где задаются цвета сайта.
   Решения — в docs/design-system.md. В остальных стилях писать только var(--…);
   литералами можно только #fff, #000, transparent, currentColor. */
:root {
  /* Главный цвет: кнопки, ссылки, активные элементы */
  --color-primary: #4f46e5;
  --color-primary-hover: #4338ca;

  /* Акцент: бейджи, «нет в наличии», избранное */
  --color-accent: #f2623a;
  --color-accent-hover: #e0542e;

  /* Цены со скидкой, бейджи скидок, ошибки */
  --color-sale: #fc3a3a;

  /* Статусы */
  --color-success: #2dbe60;
  --color-warning: #f5a524;

  /* Нейтральные серые: 900 — почти чёрный … 50 — почти белый */
  --gray-900: #1c1c1c;
  --gray-800: #333333; /* основной текст */
  --gray-600: #6a6a6a; /* второстепенный текст */
  --gray-400: #9b9b9b; /* подписи, плейсхолдеры */
  --gray-300: #d5d5d5; /* заметные границы */
  --gray-200: #e2e2e2; /* границы */
  --gray-100: #f1f1f1; /* фон блоков */
  --gray-50: #f9f9f9;  /* фон страницы/секций */

  /* Шрифт: Fira Sans Condensed (fonts/fira-sans-condensed), только 2 толщины */
  --font-sans: 'Fira Sans Condensed', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --fw-regular: 400; /* текст */
  --fw-bold: 600;    /* заголовки, цены, кнопки */

  /* Размеры текста — только эти 9 */
  --text-xs: 12px;   /* мелкие подписи: «Код: …», сноски */
  --text-sm: 14px;   /* характеристики, кнопки, меню */
  --text-md: 16px;   /* основной текст */
  --text-lg: 18px;   /* название товара, подзаголовки */
  --text-xl: 20px;
  --text-2xl: 24px;  /* цена, заголовок блока */
  --text-3xl: 28px;
  --text-4xl: 32px;  /* заголовок страницы */
  --text-5xl: 40px;  /* главный экран */
}