/* ╔═══════════════════════════════════════════════════════════════════════╗
   ║  MedVida — Tokens v3 (OVERRIDE de COR)  ·  harmonização SITE ↔ APP     ║
   ║                                                                       ║
   ║  Carregar SEMPRE depois de tokens.css e tokens-v2.css:                ║
   ║    tokens.css → tokens-v2.css → tokens-v3.css                         ║
   ║                                                                       ║
   ║  Alinha o site à paleta do app (medvida-app.msdcastro.workers.dev):   ║
   ║  azul-royal #2563EB sobre gelo #F5F8FF + navy #0D1F3A, tinta fria     ║
   ║  #0F172A. Âmbar continua o acento de calor (FAB do app). Tipografia   ║
   ║  (Fraunces + DM Sans) e espaçamento seguem dos tokens anteriores.     ║
   ╚═══════════════════════════════════════════════════════════════════════╝ */

:root {
  /* ── Marca — azul-royal (o mesmo do app do paciente/médico) ── */
  --nv-primary:        #2563EB;
  --nv-primary-dark:   #1D4ED8;   /* hover + itálico de destaque (AA sobre branco) */
  --nv-primary-soft:   #EAF1FE;   /* fundo suave (pills, selos) */

  /* ── Acento — âmbar vitalidade (inalterado; casa com o FAB do app) ── */
  --nv-accent:         #F59E0B;
  --nv-accent-dark:    #B45309;   /* escurecido p/ AA sobre gelo */
  --nv-accent-soft:    #FEF3DC;

  /* ── Texto — tinta fria (a mesma do app) ── */
  --nv-ink:            #0F172A;
  --nv-muted:          #475569;

  /* ── Estrutura — fundos GELO azulados (não creme) ── */
  --nv-line:           #DFE7F3;
  --nv-bg:             #F5F8FF;   /* gelo azulado — fundo da página (= app claro) */
  --nv-surface:        #EAF1FA;   /* gelo mais profundo — seções alternadas */
  --nv-bg-pure:        #FFFFFF;

  /* ── Fundos translúcidos / overlays ── */
  --nv-bg-translucent: rgba(245, 248, 255, 0.85);
  --nv-overlay:        rgba(13, 31, 58, 0.45);

  /* ── Texto sobre escuro ── */
  --nv-on-dark:        #F5F8FF;
  --nv-on-dark-muted:  rgba(245, 248, 255, 0.74);
  --nv-dark-section:   #0D1F3A;   /* navy do header do app */

  /* ── Sombras — tinta navy ── */
  --nv-shadow-xs:   0 1px 2px rgba(13, 31, 58, 0.05);
  --nv-shadow-sm:   0 2px 8px rgba(13, 31, 58, 0.06);
  --nv-shadow-md:   0 8px 24px rgba(13, 31, 58, 0.08);
  --nv-shadow-lg:   0 16px 48px rgba(13, 31, 58, 0.10);
  --nv-shadow-xl:   0 28px 70px rgba(13, 31, 58, 0.14);
  --nv-shadow-btn:  0 6px 18px rgba(37, 99, 235, 0.30);
  --nv-shadow-btn-hover: 0 10px 26px rgba(37, 99, 235, 0.40);

  /* Anel de foco azul (WCAG 2.4.7) */
  --nv-focus-ring:  0 0 0 3px rgba(37, 99, 235, 0.40);
}