/* Дизайн-токены нового UI. Действуют ТОЛЬКО внутри элемента с атрибутом data-theme="dark|light"
   (тема — по Telegram colorScheme, см. ui.js). Не на :root — чтобы не задеть переменные старого интерфейса
   (там свой --accent). Любой блок можно показать в другой теме: <div data-theme="light">… (так сделана витрина /ui-kit). */

[data-theme="dark"] {
  --bg-base: #0B0C10;
  --bg-surface: #15161C;
  --bg-surface-2: #1E2028;
  --border-subtle: #262833;
  --text-primary: #F3F1EC;
  --text-secondary: #8E909B;
  --accent: #FF7A45;
  --accent-on: #0B0C10;
  --positive: #3DDC97;
  --negative: #FF5C7A;
  --warning: #F5B544;
  --venue-accent: #E8D3A2;          /* цвет заведения — заменяемый */
  color-scheme: dark;
}

[data-theme="light"] {
  --bg-base: #F4F2EE;
  --bg-surface: #FFFFFF;
  --bg-surface-2: #ECE9E3;
  --border-subtle: #E2DED6;
  --text-primary: #141519;
  --text-secondary: #6B6D75;
  --accent: #F0642C;
  --accent-on: #FFFFFF;
  --positive: #12A86B;
  --negative: #E0435F;
  --warning: #C98A12;
  --venue-accent: #A8843E;
  color-scheme: light;
}

[data-theme] {
  /* Полупрозрачные: soft = 14% (плашки, иконки в кругах), фон алерта = 8% */
  --accent-soft: color-mix(in srgb, var(--accent) 14%, transparent);
  --positive-soft: color-mix(in srgb, var(--positive) 14%, transparent);
  --negative-soft: color-mix(in srgb, var(--negative) 14%, transparent);
  --warning-soft: color-mix(in srgb, var(--warning) 14%, transparent);
  --warning-alert-bg: color-mix(in srgb, var(--warning) 8%, transparent);
  --venue-soft: color-mix(in srgb, var(--venue-accent) 14%, transparent);

  /* Отступы */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;

  /* Радиусы */
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-full: 999px;

  /* Шрифты: Manrope — интерфейс, Unbounded — суммы и крупные цифры */
  --font-ui: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-num: "Unbounded", "Manrope", system-ui, sans-serif;
}