/* ============================================================================
   tokens.css — единый источник дизайн-токенов pokupaesh.
   Подключается ПЕРВЫМ во всех HTML (index, landing, login, blog, privacy),
   до основного CSS страницы. Единственное место правды для палитры,
   радиусов, отступов, теней и транзишенов.
   ВНИМАНИЕ: --accent дублируется в frontend/app.js как C_ACCENT
   (canvas lightweight-charts не видит CSS-переменные) — менять синхронно.
   ============================================================================ */

:root {
  /* --- Цвета базы --- */
  --bg: #0f1117;
  --surface: #1a1d27;
  --surface-2: #151823;
  --surface-hover: #232636;
  --text: #e1e4ed;
  --text-dim: #8b8fa3;
  --green: #22c55e;       /* рост/buy — НЕ трогаем */
  --danger: #ef4444;      /* падение/ошибка — НЕ трогаем */

  /* --- Акцент: уточнённый индиго (был #6366f1) --- */
  --accent: #5b5bd6;            /* глубже и сдержаннее дефолтного Tailwind-индиго */
  --accent-hover: #7373e0;      /* тот же оттенок светлее (вместо сиреневого #818cf8) */
  --accent-soft: rgba(91, 91, 214, 0.14);         /* тинт: toggle-active, бейджи, watchlist.active */
  --accent-soft-strong: rgba(91, 91, 214, 0.22);  /* нажатые / saved-тинты */
  --accent-border: rgba(91, 91, 214, 0.30);       /* полупрозрачные границы акцента */
  --focus-ring: 0 0 0 3px rgba(91, 91, 214, 0.25);/* единое фокус-кольцо для всех инпутов */

  /* --- Границы --- */
  --border: #262936;                       /* чуть мягче прежнего #2a2d3a */
  --border-soft: rgba(255, 255, 255, 0.06);/* ТОЛЬКО внутренние разделители на стабильном фоне */
  --border-strong: #333748;                /* акцентные / активные границы */

  /* --- Радиусы (шкала вместо 4/6/8/10/12/14) --- */
  --radius-sm: 6px;     /* мелкие тулбар-кнопки, чипы, иконки-кнопки */
  --radius: 8px;        /* кнопки, инпуты, селекты, бейджи */
  --radius-lg: 12px;    /* карточки, модалки, крупные панели */
  --radius-pill: 9999px;/* пилюли-счётчики, теги */

  /* --- Отступы (применять точечно) --- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;

  /* --- Тени (лёгкая глубина) --- */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.02); /* панели/сайдбар/карточки */
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);   /* дропдауны/поповеры */
  --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.5);  /* модалки */

  /* --- Транзишены --- */
  --t-fast: 0.12s ease; /* hover/active мелких контролов */
  --t: 0.16s ease;      /* основное */

  /* --- Бренд: одна точка правды для размеров --- */
  --brand-name-size: 1.25rem;
  --brand-slogan-size: 0.72rem;
}