/* Pandoor: tokens de marca para tema claro e escuro.
   Regra de ouro (contraste medido): âmbar NUNCA é cor de texto sobre fundo claro (2,0:1 no âmbar e
   2,6:1 no âmbar escuro). No claro, texto é azul-marinho; âmbar é fundo, com texto azul-marinho (8,2:1).
   No escuro, âmbar como texto passa (7,3:1). Use sempre os nomes semânticos (--bg, --ink...), nunca
   as cores cruas, nos componentes. */

@font-face { font-family: "Nunito"; font-weight: 400; font-style: normal; font-display: swap; src: url("./fonts/nunito-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Nunito"; font-weight: 700; font-style: normal; font-display: swap; src: url("./fonts/nunito-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Nunito"; font-weight: 800; font-style: normal; font-display: swap; src: url("./fonts/nunito-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "Nunito"; font-weight: 900; font-style: normal; font-display: swap; src: url("./fonts/nunito-latin-900-normal.woff2") format("woff2"); }

:root {
  /* Cores da marca (fixas nos dois temas) */
  --pandoor-navy: #0B1F3A;
  --pandoor-amber: #F5A623;
  --pandoor-amber-dark: #E08E0B;
  --pandoor-white: #FFFFFF;

  /* Tema claro (padrão) */
  color-scheme: light;
  --bg: #F6F7F9;
  --surface: #FFFFFF;
  --surface-2: #EEF1F6;
  --ink: #0B1F3A;
  --ink-2: #4A5A73;
  --line: #D9DEE7;
  --line-strong: #B8C1D1;
  --primary: #0B1F3A;        /* botão principal: fundo */
  --on-primary: #FFFFFF;     /* texto sobre o botão principal */
  --accent: #F5A623;         /* destaque: sempre FUNDO, com --on-accent por cima */
  --accent-hover: #E08E0B;
  --on-accent: #0B1F3A;
  --link: #1F4FA3;
  --ok: #0F7A52;
  --bad: #B42318;
  --warn: #8A5A00;
  --focus: #0B1F3A;
  --shadow: 0 1px 2px rgba(11, 31, 58, .06), 0 8px 24px rgba(11, 31, 58, .08);
  --logo-light: block;       /* logo azul visível no claro */
  --logo-dark: none;

  --font: "Nunito", ui-rounded, "SF Pro Rounded", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --radius: 14px;
  --radius-sm: 10px;
}

/* Tema escuro automático (sistema), a menos que o usuário tenha escolhido o claro */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #08172D;
    --surface: #0F2847;
    --surface-2: #153258;
    --ink: #EEF2F8;
    --ink-2: #A9B6CB;
    --line: #23395C;
    --line-strong: #365178;
    --primary: #F5A623;
    --on-primary: #0B1F3A;
    --accent: #F5A623;
    --accent-hover: #FFB84A;
    --on-accent: #0B1F3A;
    --link: #8FB4FF;
    --ok: #3DD598;
    --bad: #FF7A70;
    --warn: #FFC14D;
    --focus: #F5A623;
    --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .35);
    --logo-light: none;
    --logo-dark: block;
  }
}

/* Tema escuro escolhido pelo usuário */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #08172D;
  --surface: #0F2847;
  --surface-2: #153258;
  --ink: #EEF2F8;
  --ink-2: #A9B6CB;
  --line: #23395C;
  --line-strong: #365178;
  --primary: #F5A623;
  --on-primary: #0B1F3A;
  --accent: #F5A623;
  --accent-hover: #FFB84A;
  --on-accent: #0B1F3A;
  --link: #8FB4FF;
  --ok: #3DD598;
  --bad: #FF7A70;
  --warn: #FFC14D;
  --focus: #F5A623;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .35);
  --logo-light: none;
  --logo-dark: block;
}

/* Base tipográfica da marca */
html { font-family: var(--font); }
body { background: var(--bg); color: var(--ink); line-height: 1.5; }
h1, h2, h3 { font-weight: 800; letter-spacing: -.01em; line-height: 1.15; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.logo-claro { display: var(--logo-light); }
.logo-escuro { display: var(--logo-dark); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }