/* ============================================================
   Hot & Cold — tokens de marca (fonte única).
   Portado verbatim do Manual de Identidade Visual.
   Aliases no fim fazem os vocabulários legados beberem daqui.
   ============================================================ */
:root {
  /* Ramp vermelho (600 = base #C90200), OKLCH */
  --red-50:  color-mix(in oklch, white 95%, #C90200 5%);
  --red-100: color-mix(in oklch, white 88%, #C90200 12%);
  --red-200: color-mix(in oklch, white 75%, #C90200 25%);
  --red-300: color-mix(in oklch, white 58%, #C90200 42%);
  --red-400: color-mix(in oklch, white 35%, #C90200 65%);
  --red-500: color-mix(in oklch, white 15%, #C90200 85%);
  --red-600: #C90200;
  --red-700: color-mix(in oklch, black 15%, #C90200 85%);
  --red-800: color-mix(in oklch, black 32%, #C90200 68%);
  --red-900: color-mix(in oklch, black 50%, #C90200 50%);

  --gold-100: color-mix(in oklch, white 88%, #C98A1E 12%);
  --gold-300: color-mix(in oklch, white 55%, #C98A1E 45%);
  --gold-500: #C98A1E;
  --gold-700: color-mix(in oklch, black 25%, #C98A1E 75%);

  /* Ink opaco: near-black quente clareado com branco.
     Corrige o color-mix do manual que somava <100% (viraria semitransparente / falha WCAG). */
  --ink-900: color-mix(in oklch, black 94%, #C90200 6%);
  --ink-700: color-mix(in oklch, var(--ink-900) 73%, white 27%);
  --ink-500: color-mix(in oklch, var(--ink-900) 46%, white 54%);
  --ink-300: color-mix(in oklch, var(--ink-900) 19%, white 81%);
  --ink-100: color-mix(in oklch, var(--ink-900) 8%,  white 92%);

  --amber-500: #F5A623;  --amber-600: #D6871A;
  --green-500: #16A34A;  --green-600: #0F7A38;
  --slate-500: #64748B;  --slate-600: #4E5C71;

  --color-bg:             color-mix(in oklch, white 97%, #C90200 3%);
  --color-surface:        color-mix(in oklch, white 99%, #C90200 1%);
  --color-surface-raised: #ffffff;

  --color-primary:        var(--red-600);
  --color-primary-hover:  var(--red-700);
  --color-primary-press:  var(--red-800);
  --color-primary-tint:   var(--red-100);
  --color-accent:         var(--gold-500);
  --color-text:           var(--ink-900);
  --color-text-muted:     var(--ink-500);
  --color-border:         var(--ink-100);
  --color-border-strong:  var(--ink-300);

  --font-heading: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body:    'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --text-display: 700 3.25rem/1.05 var(--font-heading);
  --text-h1:      700 2.5rem/1.1  var(--font-heading);
  --text-h2:      600 1.75rem/1.2 var(--font-heading);
  --text-h3:      600 1.25rem/1.3 var(--font-body);
  --text-body-lg: 400 1.125rem/1.6 var(--font-body);
  --text-body:    400 1rem/1.6    var(--font-body);
  --text-small:   400 0.875rem/1.5 var(--font-body);
  --text-caption: 500 0.75rem/1.4 var(--font-body);

  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px;

  --radius-sm: 8px; --radius-md: 14px; --radius-lg: 24px; --radius-pill: 999px;

  --shadow-sm: 0 1px 2px  rgba(60, 18, 10, 0.08);
  --shadow-md: 0 4px 14px rgba(60, 18, 10, 0.10);
  --shadow-lg: 0 16px 40px rgba(60, 18, 10, 0.16);
}

/* ---- Aliases: os vocabulários legados agora bebem da marca ---- */
:root {
  /* sistema por-empresa (o HUE destes é sobrescrito pelo :root inline do master) */
  --btn-primary:     var(--color-primary);
  --btn-primary-ink: #ffffff;
  --btn-success:     #198754;   /* semântico, mantido */
  --btn-danger:      #dc3545;   /* semântico, mantido */
  --g-primary-soft:  var(--red-100);
  --sidebar-bg:      var(--color-surface-raised);
  --sidebar-hover:   var(--red-50);
  --sidebar-active:  var(--red-100);

  /* Material (--g-*) */
  --g-primary: var(--color-primary);
  --g-bg:      var(--color-bg);
  --g-surface: var(--color-surface);
  --g-ink:     var(--color-text);
  --g-radius:  var(--radius-md);

  /* componentes (--afx-*) */
  --afx-blue:      var(--color-primary);
  --afx-blue-tint: var(--red-100);
  --afx-teal:      var(--gold-500);   /* acento DECORATIVO (barra/avatar) vira gold */
  --afx-ink:       var(--color-text);
  --afx-muted:     var(--color-text-muted);
  --afx-line:      var(--color-border);

  /* refino (--ff-*) */
  --ff-shadow-sm: var(--shadow-sm);
  --ff-shadow-md: var(--shadow-md);
  --ff-shadow-lg: var(--shadow-lg);
  --ff-ink:       var(--color-text);
  --ff-muted:     var(--color-text-muted);
  --ff-border:    var(--color-border);
}

/* Base: Poppins como fonte do corpo em todas as telas que carregam brand.css.
   Bootstrap define a fonte do body; brand.css carrega depois, então vence. */
body { font-family: var(--font-body); }
