/* ============================================================
   Хочу-Мотор · Design tokens
   Источник: Дизайн/Хочу-Мотор UI Kit.dc.html, Type & Adaptive.dc.html
   Тёмная тема — по умолчанию, светлая — [data-theme="light"]
   ============================================================ */

:root,
[data-theme="dark"] {
  /* Поверхности */
  --bg: #0f1013;
  --card: #17181c;
  --card2: #131418;
  --bar: #121317;
  --foot: #0c0d0f;

  /* Плейсхолдеры изображений */
  --ph-a: #1b1d21;
  --ph-b: #202329;

  /* Текст (от самого яркого к самому тусклому) */
  --t1: #e9eaec;
  --t2: #9ba0a8;
  --t3: #8b8f96;
  --t4: #8a8f97;
  --t5: #81868e;
  --t6: #7c8189;

  /* Логотип-градиент */
  --logo-a: #f4f5f7;
  --logo-b: #9ba0a8;

  /* Прочие поверхности */
  --chip: #2a2c31;
  --bnr: #1c1214; /* красноватая подложка баннеров */

  /* Бордеры (прозрачность по шкале) */
  --brd06: rgba(255, 255, 255, .06);
  --brd07: rgba(255, 255, 255, .07);
  --brd08: rgba(255, 255, 255, .08);
  --brd09: rgba(255, 255, 255, .09);
  --brd10: rgba(255, 255, 255, .1);
  --brd12: rgba(255, 255, 255, .12);
  --brd18: rgba(255, 255, 255, .18);
  --brd20: rgba(255, 255, 255, .2);
}

[data-theme="light"] {
  --bg: #eef0f3;
  --card: #ffffff;
  --card2: #f5f6f8;
  --bar: #ffffff;
  --foot: #e7e9ec;

  --ph-a: #dde1e6;
  --ph-b: #e8ebef;

  --t1: #16181b;
  --t2: #565b62;
  --t3: #6b7077;
  --t4: #5f656d;
  --t5: #646a72;
  --t6: #686e76;

  --logo-a: #2a2c31;
  --logo-b: #5a5f66;

  --chip: #dce0e5;
  --bnr: #fdecec;

  --brd06: rgba(0, 0, 0, .07);
  --brd07: rgba(0, 0, 0, .08);
  --brd08: rgba(0, 0, 0, .09);
  --brd09: rgba(0, 0, 0, .1);
  --brd10: rgba(0, 0, 0, .11);
  --brd12: rgba(0, 0, 0, .13);
  --brd18: rgba(0, 0, 0, .16);
  --brd20: rgba(0, 0, 0, .18);
}

:root {
  /* Акцент (одинаков в обеих темах) */
  --red: #d92b2f;
  --red-hover: #c2262a;
  --red-light: #ff5257;
  --red-soft: #ff6b6e;
  --red-bg: rgba(217, 43, 47, .14);
  --red-brd: rgba(217, 43, 47, .55);
  --red-shadow: 0 4px 14px rgba(217, 43, 47, .28);
  --accent-text: #ff6b6e;

  /* Семантика статусов (ТЗ §9.4, §15.1) */
  --ok: #4fc47f;            /* успех / в наличии */
  --ok-bg: rgba(79, 196, 127, .12);
  --ok-brd: rgba(79, 196, 127, .35);
  --warn: #e8a13f;          /* внимание / под заказ */
  --warn-bg: rgba(232, 161, 63, .12);
  --warn-brd: rgba(232, 161, 63, .35);
  --info: #8b9dc4;          /* инфо / в пути */
  --info-bg: rgba(139, 157, 196, .13);
  --info-brd: rgba(139, 157, 196, .35);

  /* Гарнитуры */
  --font-body: Manrope, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-head: Oswald, sans-serif;
  --font-logo: Georgia, "Times New Roman", serif;
  --font-mono: ui-monospace, Menlo, Consolas, monospace;

  /* Радиусы */
  --r-chip: 7px;
  --r-input: 10px;
  --r-btn: 11px;
  --r-card: 13px;
  --r-panel: 16px;
  --r-pill: 99px;

  /* Контейнер */
  --container: 1360px;
  --pad-x: 40px;

  /* Тень модалок */
  --modal-shadow: 0 30px 80px rgba(0, 0, 0, .5);
}

[data-theme="light"] {
  /* Text variants meet WCAG AA on the light page/card surfaces. */
  --red: #c2262a;
  --red-hover: #a91f23;
  --red-light: #971b1f;
  --red-soft: #b22226;
  --accent-text: #b22226;
  --ok: #1f7145;
  --warn: #825117;
  --info: #455d8e;
}

@media (max-width: 1023px) {
  :root { --pad-x: 28px; }
}

@media (max-width: 767px) {
  :root { --pad-x: 16px; }
}