/* ==========================================================================
   buycg_me — проектные токены.

   Основа — токены montenegro4_life: сайты коллектива одного вида. Палитра —
   из логотипа заказчика (BuyCG): графит, красный, золото — цвета флага
   Черногории. До гида по стилю.

   Сайт СВЕТЛЫЙ всегда. Ядерный дефолт forge — тёмная тема, поэтому
   ядерные токены переопределены светлыми значениями прямо в :root.
   ========================================================================== */

:root {
  /* ── Палитра проекта ─────────────────────────────────────────────────── */
  --color-primary:        #5B1428;   /* бордо логотипа — кнопки, акценты заголовков */
  --color-primary-dark:   #3F0D1B;   /* тёмное бордо — текст, футер */
  --color-primary-light:  #F4E8EB;   /* светлый бордо — фоны */
  --color-accent:         #B08D50;   /* золото логотипа — акцент, CTA */
  --color-background:     #FAF7F2;   /* фон страницы */
  --color-surface:        #F3EDE3;   /* карточки, секции */

  --color-text:           #1A1A1A;
  --color-text-secondary: #5C5C5C;
  --color-text-muted:     #6E6E6E;
  --color-border:         #E7DFD3;
  --color-white:          #FFFFFF;

  /* Песок на светлом — только заливка, текст на нём тёмный. */
  --color-accent-text:    #7A5A22;   /* текст, иконка, бордюр на белом */
  --color-accent-hover:   #9E7D43;   /* заливка под курсором */
  --color-accent-active:  #8C6D38;   /* нажатое */
  --color-accent-fg:      #1A1A1A;   /* текст НА золоте */

  /* под курсором и нажатием уходим в глубину — контраст растёт */
  --color-primary-hover:  #470F1F;
  --color-primary-active: #3A0C19;

  /* ссылка на цветной подложке (surface / primary-light) */
  --color-link-on-tint:   #5B1428;

  /* выключенное — должно читаться как выключенное, а не как «сломалось» */
  --color-disabled-bg:    #EEEEEE;
  --color-disabled-text:  #9E9E9E;
  --color-disabled-line:  #E0E0E0;

  /* фокус */
  --focus-color:  var(--color-primary);
  --focus-width:  2px;
  --focus-offset: 2px;
  --focus-ring:   0 0 0 3px rgba(184,18,27,.30);

  /* подложки под сообщения */
  --tint-success: rgba(46,125,50,.10);
  --tint-error:   rgba(192,57,43,.10);
  --tint-warn:    rgba(140,112,2,.12);
  --tint-info:    rgba(184,18,27,.08);

  /* ── Градиенты ───────────────────────────────────────────────────────── */
  --gradient-hero:    linear-gradient(135deg, #3F0D1B 0%, #5B1428 60%, #7A2A3E 100%);
  --gradient-soft:    linear-gradient(180deg, rgba(184,18,27,.03) 0%, rgba(184,18,27,.08) 100%);
  --gradient-button:  linear-gradient(135deg, #5B1428 0%, #7A1E37 100%);
  --gradient-overlay: linear-gradient(90deg, rgba(20,21,23,.78) 0%, rgba(20,21,23,.35) 60%, rgba(20,21,23,.05) 100%);

  /* ── Типографика ─────────────────────────────────────────────────────── */
  /* Nunito Sans — осознанное отступление от Mulish (шрифта коллектива):
     дизайн утверждён НКО, переносим один в один. Канон это допускает —
     forge/docs/design_system/00_overview.md §Шрифт коллектива. */
  --font-heading: 'Nunito Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body:    'Nunito Sans', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Шкала Major Third (1.25) */
  --text-display:  clamp(2.5rem, 5vw + 1rem, 4rem);
  --text-h1:       clamp(2rem, 4vw + 1rem, 3rem);
  --text-h2:       clamp(1.5rem, 2vw + 1rem, 2.25rem);
  --text-h3:       clamp(1.25rem, 1.5vw + .75rem, 1.75rem);
  --text-h4:       1.25rem;
  --text-body-lg:  1.125rem;
  --text-body:     1rem;
  --text-sm:       .875rem;
  --text-caption:  .75rem;

  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;

  --leading-tight:   1.15;
  --leading-snug:    1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.6;

  /* ── Спейсинг (8px base) ─────────────────────────────────────────────── */
  --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;   --space-20: 5rem;   --space-24: 6rem;

  /* ── Радиусы ─────────────────────────────────────────────────────────── */
  --radius-sm: 4px;   --radius-md: 8px;   --radius-lg: 12px;
  --radius-xl: 16px;  --radius-2xl: 24px; --radius-full: 9999px;

  /* ── Тени ────────────────────────────────────────────────────────────── */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
  --shadow-md: 0 4px 8px rgba(0,0,0,.08), 0 2px 4px rgba(0,0,0,.04);
  --shadow-lg: 0 8px 24px rgba(0,0,0,.1), 0 4px 8px rgba(0,0,0,.05);
  --shadow-xl: 0 16px 48px rgba(0,0,0,.12), 0 8px 16px rgba(0,0,0,.06);
  --shadow-glow: 0 4px 12px rgba(184,18,27,.25);

  /* ── Layout ──────────────────────────────────────────────────────────── */
  --container-max: 1200px;
  --header-height: 72px;
  --content-max-width: 70ch;

  /* ── Переходы ────────────────────────────────────────────────────────── */
  --transition-fast: .15s ease;
  --transition-base: .2s ease;
  --transition-slow: .3s ease;

  /* ══════════════════════════════════════════════════════════════════════
     Ядерные токены forge. Ядро использует ДВЕ группы имён — короткие
     (--bg/--fg/--line/--muted/--accent/--font/--radius/--gutter/--ink)
     и --ds-*. Задаём обе, иначе ядерные компоненты (поля, кнопки, toast,
     dialog, admin-списки) поедут на тёмном дефолте.
     ══════════════════════════════════════════════════════════════════════ */

  /* короткие */
  --bg:        var(--color-white);
  --fg:        var(--color-text);
  --muted:     var(--color-text-muted);
  --line:      var(--color-border);
  --accent:    var(--color-primary);
  --accent-fg: var(--color-white);
  --ink:       var(--color-text);
  --font:      var(--font-body);
  --serif:     var(--font-heading);
  --radius:    var(--radius-md);
  --gutter:    var(--space-6);
  --max-w:     var(--container-max);

  /* ds-* */
  --ds-bg:      var(--color-white);
  --ds-ink:     var(--color-text);
  --ds-line:    var(--color-border);
  --ds-dim:     var(--color-text-muted);
  --ds-info:    var(--color-primary);
  --ds-accent:  var(--color-primary);
  --ds-success: #2E7D32;
  /* warn НЕ золотом: #EFBF04 текстом даёт 1.73:1. Тон тот же, читается. */
  --ds-warn:    var(--color-accent-text);
  --color-warn: var(--color-accent-text);
  --ds-error:   #C0392B;
  --ds-radius:  var(--radius-md);
  --ds-control-height: 48px;
  --ds-font:    var(--font-body);
  --ds-switch-on: var(--color-primary);
  --switch-on:    var(--color-primary);
}

/* Сайт светлый всегда — html.light не должен ничего менять обратно. */
html, html.light {
  color-scheme: light;
}

/* Фокус — одно правило на весь сайт, чтобы не забыть ни один элемент. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: var(--focus-width) solid var(--focus-color);
  outline-offset: var(--focus-offset);
  border-radius: var(--radius-sm);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: .01ms;
    --transition-base: .01ms;
    --transition-slow: .01ms;
  }
}