/* ============================================================
   ARENDA DESIGN SYSTEM · TOKENS  v2.0
   Направление: «Clean light» — тёплый кремовый фон, белые
   карточки, чёрные кнопки-пилюли, шалфейно-зелёный акцент.
   (Референс: fintech light, 05.07.2026. Blue-hybrid v1 — в git.)
   Подключать ПЕРВЫМ, до components.css.

   ВАЖНО: имена переменных сохранены от v1 (--ar-on-blue и т.п.),
   чтобы не трогать все шаблоны. «on-blue» теперь читается как
   «текст на фоне экрана».
   ============================================================ */

:root {
  /* ---------- BRAND / ACCENT ---------- */
  --ar-black:    #1a1917;   /* основной акцент: кнопки, активная вкладка */
  --ar-accent:   #1a1917;
  --ar-green:      #cfe6ae; /* шалфейный — выделение, актив. чипы */
  --ar-green-soft: #e3f0cf; /* светлее — фоны плиток */
  --ar-green-ink:  #4a7030; /* тёмно-зелёный текст на зелёном */

  /* Legacy blue steps — оставлены для совместимости, приглушены */
  --ar-blue-900: #1a1917;
  --ar-blue-700: #2a2823;
  --ar-blue-600: #1a1917;
  --ar-blue-500: #1a1917;
  --ar-blue-400: #3a3833;
  --ar-blue-300: #6b675e;
  --ar-blue-200: #98938a;

  /* ---------- STATUS ---------- */
  --ar-success:      #55a05e;
  --ar-success-text: #2f7a3d;  /* на светлых карточках */
  --ar-success-glow: #2f7a3d;  /* тоже тёмный — фон теперь светлый */
  --ar-warning:      #d0982a;
  --ar-warning-text: #9a7118;
  --ar-warning-glow: #9a7118;
  --ar-danger:       #d9534a;
  --ar-danger-text:  #bf3f36;
  --ar-danger-glow:  #bf3f36;

  /* ---------- NEUTRALS ---------- */
  --ar-ink:      #1a1917;  /* основной текст */
  --ar-ink-2:    #5d5850;  /* вторичный */
  --ar-ink-3:    #938d80;  /* подписи, muted */
  --ar-line:     #e6dfd2;  /* бордеры */
  --ar-track:    #e9e2d5;  /* фон прогресс-баров */

  /* ---------- BACKGROUND ----------
     Тёплый кремовый, плоский. Никаких градиентов и свечений —
     цвет остаётся только у статусов и акцентов. */
  --ar-screen-bg: linear-gradient(180deg, #f1ece3 0%, #efe9df 100%);
  --ar-screen-solid: #f1ece3;
  --ar-glow-top: none;
  --ar-scrim: rgba(30, 26, 18, .38); /* затемнение под sheet */

  /* ---------- SURFACES ---------- */
  /* «Glass» — теперь спокойная кремово-белая панель (статы, hero-блоки) */
  --ar-glass-bg:     #faf7f0;
  --ar-glass-border: #e9e2d3;
  /* «Frosted» — основная белая карточка */
  --ar-frost-bg:        #ffffff;
  --ar-frost-bg-muted:  #fbf9f4;
  /* Текст на фоне экрана (имя историческое) */
  --ar-on-blue:    #1a1917;
  --ar-on-blue-2:  #5d5850;
  --ar-on-blue-3:  #938d80;

  /* ---------- ELEVATION (мягкие тёплые тени) ---------- */
  --ar-shadow-card:  0 6px 20px rgba(70, 58, 34, .07);
  --ar-shadow-card2: 0 4px 14px rgba(70, 58, 34, .05);
  --ar-shadow-nav:   0 10px 30px rgba(70, 58, 34, .16);
  --ar-shadow-btn:   0 6px 16px rgba(26, 25, 23, .22);
  --ar-shadow-sheet: 0 -12px 40px rgba(70, 58, 34, .18);
  --ar-blur-glass:  0px;
  --ar-blur-frost:  0px;
  --ar-blur-nav:    18px;
  --ar-blur-sheet:  18px;

  /* ---------- RADII (мягче, ближе к референсу) ---------- */
  --ar-r-card:  20px;
  --ar-r-tile:  16px;
  --ar-r-btn:   999px;  /* кнопки — пилюли */
  --ar-r-icon:  12px;   /* квадраты иконок */
  --ar-r-pill:  999px;
  --ar-r-sheet: 28px;   /* верх bottom-sheet */

  /* ---------- SPACING (4px base) ---------- */
  --ar-s-1: 4px;  --ar-s-2: 8px;  --ar-s-3: 12px;
  --ar-s-4: 16px; --ar-s-5: 20px; --ar-s-6: 24px;
  --ar-screen-pad: 16px;         /* боковые поля экрана */
  --ar-nav-clearance: 96px;      /* нижний отступ контента под nav */

  /* ---------- TYPOGRAPHY ---------- */
  --ar-font: -apple-system, "SF Pro Text", system-ui, "Segoe UI", Roboto, sans-serif;
  --ar-fs-hero:  44px;  /* дашборд hero */
  --ar-fs-hero2: 38px;  /* hero второго уровня */
  --ar-fs-num:   21px;  /* сумма в карточке */
  --ar-fs-title: 20px;  /* заголовок экрана */
  --ar-fs-body:  13px;
  --ar-fs-sub:   12px;
  --ar-fs-cap:   11px;
  --ar-fs-badge: 10px;
  --ar-lh-tight: 1;
  --ar-ls-hero: -0.02em;

  /* ---------- TAP TARGETS ---------- */
  --ar-tap-min: 44px;   /* минимум для интерактива */
  --ar-btn-h:   40px;   /* inline-кнопки в карточках */
  --ar-btn-h-lg: 48px;
}

/* Safe area (iOS) */
@supports (padding: env(safe-area-inset-bottom)) {
  :root { --ar-safe-bottom: env(safe-area-inset-bottom); }
}