/* ═════════════════════════════════════════════════════════════════
   Apple-grade Design Tokens — Sofcon CRM v199.303+
   Расширение существующей системы (бэйз в sofcon_crm_v199_53.html)
   Применяется к light + dark (наследуется от data-theme)
   ───────────────────────────────────────────────────────────────── */

:root {
  /* ─── Type scale (11/12/13/15/17/20/24/28px) ─── */
  --fs-xs:    11px;  /* caption, hints, metadata */
  --fs-sm:    12px;  /* секции, мелкий текст */
  --fs-base:  13px;  /* основной body text */
  --fs-md:    15px;  /* кнопки, инпуты */
  --fs-lg:    17px;  /* заголовок страницы (iOS-style) */
  --fs-xl:    20px;  /* заголовок секции крупный */
  --fs-2xl:   24px;  /* заголовок модалки */
  --fs-3xl:   28px;  /* hero-заголовок */

  /* ─── Font weights (только 3 веса) ─── */
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;

  /* ─── Line heights ─── */
  --lh-tight:    1.2;   /* заголовки */
  --lh-snug:     1.35;  /* подзаголовки */
  --lh-normal:   1.45;  /* основной текст */
  --lh-relaxed:  1.6;   /* длинный текст (паттерны, описания) */

  /* ─── Letter spacing (Apple-style для заголовков) ─── */
  --tracking-tight:  -0.02em;  /* hero-заголовки */
  --tracking-normal: -0.01em;  /* секции */
  --tracking-base:   0;        /* body */

  /* ─── Spacing scale (4-8pt grid) ─── */
  --sp-0:   0;
  --sp-1:   4px;
  --sp-2:   8px;
  --sp-3:   12px;
  --sp-4:   16px;
  --sp-5:   20px;
  --sp-6:   24px;
  --sp-8:   32px;
  --sp-10:  40px;
  --sp-12:  48px;
  --sp-16:  64px;

  /* ─── Radius scale ─── */
  --r-sm:   6px;   /* мелкие чипы, теги */
  --r-md:   10px;  /* инпуты, кнопки, карточки */
  --r-lg:   14px;  /* модалки */
  --r-xl:   20px;  /* большие карты */
  --r-full: 9999px; /* pill-кнопки, аватары */

  /* ─── Motion tokens ─── */
  --duration-instant: 0ms;
  --duration-fast:    120ms;
  --duration-base:    180ms;
  --duration-slow:    240ms;
  --duration-modal:   320ms;

  --ease-default: cubic-bezier(0.4, 0, 0.2, 1);     /* стандартный */
  --ease-out:     cubic-bezier(0.0, 0, 0.2, 1);     /* появление */
  --ease-in:      cubic-bezier(0.4, 0, 1, 1);       /* исчезновение */
  --ease-spring:  cubic-bezier(0.5, 1.8, 0.5, 1);   /* iOS bouncy */

  /* ─── Focus ring (accessibility, не оторвать!) ─── */
  --focus-ring-color: var(--accent);
  --focus-ring-width: 2px;
  --focus-ring-offset: 2px;

  /* ─── Component sizing ─── */
  --btn-h-sm:  28px;
  --btn-h-md:  32px;
  --btn-h-lg:  36px;
  --input-h:   36px;

  /* ─── Tabular numbers (для таблиц с числами) ─── */
  --font-tabular: 'SF Pro Display', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ─── Tabular nums для всех таблиц + числовых полей ─── */
table, .num, .tabular,
input[type="number"], input[inputmode="numeric"], input[inputmode="decimal"],
.deal-budget, .price, .qty, .amount {
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum' 1;
}

/* ─── Focus ring (a11y, Apple-grade) ─── */
:focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-ring-color);
  outline-offset: var(--focus-ring-offset);
  border-radius: var(--r-sm);
}

/* ─── Smooth scroll + reduced motion ─── */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* ─── Selection (Apple-style soft blue) ─── */
::selection {
  background-color: var(--accent-soft);
  color: var(--text);
}