/* Campo — tokens de cor (claro / escuro / automático)
   Paleta neutra no padrão apple.com + cores de estado do iOS.
   Uso: <html data-theme="claro|escuro"> força o tema; sem o atributo, segue o sistema. */

:root {
  --bg: #F5F5F7;
  --surface: #FFFFFF;
  --fill: #E8E8ED;
  --selected: #FFFFFF;
  --separator: rgba(0, 0, 0, 0.08);
  --text: #1D1D1F;
  --text-2: #6E6E73;
  --text-3: #86868B;
  --accent: #0071E3;          /* fundo de botão primário, FAB */
  --on-accent: #FFFFFF;
  --link: #0066CC;            /* links, aba ativa, botão secundário */
  --link-hover: #0077ED;
  --tint: rgba(0, 113, 227, 0.12);
  --success: #248A3D;  --success-bg: rgba(52, 199, 89, 0.14);
  --warning: #B64400;  --warning-bg: rgba(255, 149, 0, 0.14);
  --danger:  #D70015;  --danger-bg:  rgba(215, 0, 21, 0.08);
  --nav-bg: rgba(250, 250, 252, 0.8);
  --nav-border: rgba(0, 0, 0, 0.08);
  --card-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  --scrim: rgba(0, 0, 0, 0.40);

  --font-display: 'Bitter', Georgia, serif;
  --font-body: -apple-system, BlinkMacSystemFont, 'SF Pro Text', system-ui, 'Segoe UI', sans-serif;
  --ease-out: cubic-bezier(.23, 1, .32, 1);
  --radius-card: 18px;
  --radius-control: 14px;
  color-scheme: light;
}

/* Escuro forçado pelo usuário */
:root[data-theme="escuro"] {
  --bg: #000000;
  --surface: #1D1D1F;
  --fill: #333336;
  --selected: #424245;
  --separator: rgba(255, 255, 255, 0.10);
  --text: #F5F5F7;
  --text-2: #86868B;
  --text-3: #6E6E73;
  --accent: #0071E3;
  --on-accent: #FFFFFF;
  --link: #2997FF;
  --link-hover: #4BA9FF;
  --tint: rgba(41, 151, 255, 0.16);
  --success: #30D158;  --success-bg: rgba(48, 209, 88, 0.16);
  --warning: #FF9F0A;  --warning-bg: rgba(255, 159, 10, 0.16);
  --danger:  #FF453A;  --danger-bg:  rgba(255, 69, 58, 0.16);
  --nav-bg: rgba(22, 22, 23, 0.8);
  --nav-border: rgba(255, 255, 255, 0.08);
  --card-shadow: none;
  --scrim: rgba(0, 0, 0, 0.55);
  color-scheme: dark;
}

/* Automático: sem data-theme (ou data-theme="auto") segue o sistema */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="claro"]):not([data-theme="escuro"]) {
    --bg: #000000;
    --surface: #1D1D1F;
    --fill: #333336;
    --selected: #424245;
    --separator: rgba(255, 255, 255, 0.10);
    --text: #F5F5F7;
    --text-2: #86868B;
    --text-3: #6E6E73;
    --link: #2997FF;
    --link-hover: #4BA9FF;
    --tint: rgba(41, 151, 255, 0.16);
    --success: #30D158;  --success-bg: rgba(48, 209, 88, 0.16);
    --warning: #FF9F0A;  --warning-bg: rgba(255, 159, 10, 0.16);
    --danger:  #FF453A;  --danger-bg:  rgba(255, 69, 58, 0.16);
    --nav-bg: rgba(22, 22, 23, 0.8);
    --nav-border: rgba(255, 255, 255, 0.08);
    --card-shadow: none;
    --scrim: rgba(0, 0, 0, 0.55);
    color-scheme: dark;
  }
}

/* Translucidez reduzida: barra sólida */
@media (prefers-reduced-transparency: reduce) {
  :root { --nav-bg: var(--surface); }
}