/* ═══════════════════════════════════════════════
   REALTRAC PROTOTYPE — TOKENS
   Копия realtrac_public/css/tokens.css 1.2.0 (realtrac-website) без изменений значений.
   При обновлении токенов сайта — копировать файл заново и сверить разницу.
   Состав: шрифты (@font-face), светлая тема (:root), тёмная тема ([data-theme="dark"] — переопределяет
   только цвета и тени), отключение анимаций для prefers-reduced-motion. Значения, добавленные прототипом,
   лежат не здесь, а в base.css (--color-warning, --color-offline) и map.css (--zone-notice).
═══════════════════════════════════════════════ */
/* ── FONTS (локальные файлы шаблона; пути относительно css/) ── */
/* Bebas Neue — акцидентный шрифт заголовков и названий разделов (--font-display), один начертание */
@font-face {
  font-family: 'Bebas Neue';
  src: url('../fonts/BebasRegular/BebasRegular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
/* Inter 4.001 (1.2.0, как в кабинете — template_styles.css 1.4.0, R12-F1): один вариативный файл на набор
   символов, все веса 100–900. Браузер загружает только наборы, символы которых есть на странице
   (unicode-range — как в @fontsource-variable/inter 5.2.8). Лицензия — fonts/Inter/OFL.txt.
   Segoe UI с сайта не раздаётся (лицензия Microsoft), остаётся только системным запасным. */
@font-face {
  font-family: 'Inter';
  src: url('../fonts/Inter/inter-cyrillic-ext-wght-normal.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Inter';
  src: url('../fonts/Inter/inter-cyrillic-wght-normal.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Inter';
  src: url('../fonts/Inter/inter-latin-ext-wght-normal.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308,
    U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
    U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  src: url('../fonts/Inter/inter-latin-wght-normal.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── СВЕТЛАЯ ТЕМА (по умолчанию) ── */
:root {
  /* Фирменные цвета RealTrac; --rt-red в прототипе — ещё и цвет опасной тревоги и красной зоны */
  --rt-blue: #0070B8;
  --rt-red:  #D01F27;

  /* Поверхности: фон страницы, карточка, второй уровень (закрытые плитки), подложка бейджей и полей */
  --color-bg:             #F4F6F9;
  --color-surface:        #FFFFFF;
  --color-surface-2:      #F8F9FB;
  --color-surface-offset: #EDF0F4;

  /* Рамки карточек и разделители внутри них — полупрозрачные, чтобы работать на любой поверхности */
  --color-border:  rgba(0,0,0,.09);
  --color-divider: rgba(0,0,0,.07);

  /* Текст: основной, второстепенный (подписи), едва заметный (подсказки, оси графиков) */
  --color-text:       #1A1D23;
  --color-text-muted: #5A6070;
  --color-text-faint: #9AA0AE;

  /* Акцент (кнопки, ссылки, активные элементы) и его состояния; highlight — светлая подложка выделения */
  --color-primary:           #0070B8;
  --color-primary-hover:     #005A96;
  --color-primary-active:    #004A7A;
  --color-primary-highlight: #DCE9F5;

  /* Статусы: успех («в сети», точка сбора) и ошибка (совпадает с --rt-red) с фоном для плашек */
  --color-success:    #2E7D32;
  --color-success-bg: #E8F5E9;
  --color-error:      #D01F27;
  --color-error-bg:   #FDECEA;

  /* Тёмные поверхности hero и футера одинаковы в обеих темах */
  --color-hero-from: #0B1220;
  --color-hero-to:   #101828;
  --color-footer-bg: #0F1623;
  --color-footer-text: rgba(255,255,255,.78);
  --color-footer-muted: rgba(255,255,255,.5);
  --color-footer-divider: rgba(255,255,255,.1);

  /* Размеры текста — плавные (clamp) от узкого экрана к широкому, как на сайте */
  --text-xs:   clamp(0.75rem,  0.7rem  + 0.25vw, 0.875rem);
  --text-sm:   clamp(0.875rem, 0.8rem  + 0.35vw, 1rem);
  --text-base: clamp(1rem,     0.95rem + 0.25vw, 1.125rem);
  --text-lg:   clamp(1.125rem, 1rem    + 0.75vw, 1.5rem);
  --text-xl:   clamp(1.5rem,   1.3rem  + 1.2vw,  2.25rem);
  --text-2xl:  clamp(2rem,     1.6rem  + 2vw,    3.25rem);

  /* Шкала отступов с шагом 4 px */
  --space-1:  .25rem;
  --space-2:  .5rem;
  --space-3:  .75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* Тени карточек (sm) и всплывающих панелей (md) — с синеватым оттенком, как на сайте */
  --shadow-sm: 0 1px 3px rgba(0,30,80,.06), 0 1px 2px rgba(0,30,80,.04);
  --shadow-md: 0 4px 12px rgba(0,30,80,.08);

  /* Единая анимация наведений; скругления — 0 по правилу кабинета партнёра */
  --transition: 160ms cubic-bezier(0.16, 1, 0.3, 1);
  --radius: 0;

  /* Размеры каркаса: боковая панель кабинета (в прототипе не используется), высота шапки, ширина контента */
  --sidebar-w-collapsed: 64px;
  --sidebar-w-expanded:  240px;
  --topbar-h:            72px;   /* на 10 % ниже кабинета (80px); логотип 40px + защитная область 16px */
  --content-max:         1440px;

  /* Шрифты: заголовки — Bebas Neue, текст — Inter с системными запасными */
  --font-display: 'Bebas Neue', 'Arial Narrow', sans-serif;
  --font-body:    'Inter', 'Segoe UI', system-ui, sans-serif;
}

/* ── DARK MODE ── */
/* Атрибут data-theme ставит app.js (сохранённый выбор или prefers-color-scheme) ещё до первой отрисовки.
   Переопределяются только цвета и тени: размеры, отступы и шрифты общие для обеих тем */
[data-theme="dark"] {
  --color-bg:             #0E1117;
  --color-surface:        #161B24;
  --color-surface-2:      #1A2030;
  --color-surface-offset: #1E2535;
  --color-border:         rgba(255,255,255,.08);
  --color-divider:        rgba(255,255,255,.06);
  --color-text:           #E2E6ED;
  --color-text-muted:     #7B8499;
  --color-text-faint:     #4A5263;
  --color-primary:           #4DA3E0;
  --color-primary-hover:     #3390D0;
  --color-primary-active:    #2278B8;
  --color-primary-highlight: #1A2C3D;
  --color-success:    #66BB6A;
  --color-success-bg: #1B2E1C;
  --color-error:      #F2706A;
  --color-error-bg:   #2E1A1A;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.25);
  --shadow-md: 0 4px 12px rgba(0,0,0,.35);
}

/* Пользователь попросил меньше движения — все переходы мгновенные (отдельные анимации отключают свои файлы) */
@media (prefers-reduced-motion: reduce) {
  :root { --transition: 0ms; }
}