/* Bella V2 — Design tokens.
 * Direção visual: Scrapbook Analógico (Lovable, 12/05/2026).
 * Papel craft envelhecido, post-its, fitas washi, polaroids.
 * Cores em oklch (suportadas em iOS Safari 15.4+ e Chrome 111+).
 */

:root {
  /* ─── Paleta scrapbook ─── */
  --background:        oklch(0.96 0.022 78);    /* papel craft envelhecido */
  --foreground:        oklch(0.24 0.03 35);     /* tinta marrom-escuro */
  --card:              oklch(0.99 0.012 90);    /* sulfite levemente amarelado */
  --card-foreground:   oklch(0.27 0.025 35);
  --muted:             oklch(0.95 0.012 70);
  --muted-foreground:  oklch(0.5 0.02 35);      /* ink-muted */
  --border:            oklch(0.27 0.025 35 / 0.08);
  --input:             oklch(0.27 0.025 35 / 0.12);

  /* Cores temáticas (uma por porta) */
  --terracotta:   oklch(0.55 0.14 35);    /* HOJE — terracota */
  --sage:         oklch(0.7 0.05 165);    /* SAÚDE — verde sálvia */
  --peach:        oklch(0.78 0.12 50);    /* EVOLUÇÃO — pêssego */
  --wine:         oklch(0.42 0.11 15);    /* MAIS — vinho profundo */

  --terracotta-foreground: oklch(0.985 0.012 70);
  --sage-foreground:       oklch(0.27 0.025 35);
  --peach-foreground:      oklch(0.27 0.025 35);
  --wine-foreground:       oklch(0.985 0.012 70);

  /* Semantic */
  --primary:               var(--terracotta);
  --primary-foreground:    var(--terracotta-foreground);
  --accent:                var(--peach);
  --accent-foreground:     var(--peach-foreground);
  --destructive:           oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.985 0.012 70);
  --ring:                  oklch(0.55 0.14 35 / 0.4);

  /* ─── Tipografia (design guide §3) ─── */
  --font-serif:    'Lora', ui-serif, Georgia, serif;
  --font-hand:     'Caveat', cursive;
  --font-scribble: 'Reenie Beanie', cursive;
  --font-ui:       'Inter', ui-sans-serif, system-ui, sans-serif;

  /* Aliases legacy pra não quebrar código existente */
  --font-sans:    var(--font-serif);   /* compat — equivalente histórico */
  --font-display: var(--font-serif);   /* compat — Fraunces antigo */
  --font-script:  var(--font-hand);

  /* ─── Sombras de papel colado ─── */
  --shadow-paper: 0 1px 2px oklch(0.24 0.03 35 / 0.06), 0 6px 14px oklch(0.24 0.03 35 / 0.08);
  --shadow-note:  1px 2px 0 oklch(0.24 0.03 35 / 0.06), 4px 8px 18px oklch(0.24 0.03 35 / 0.12);
  --shadow-fab:   0 10px 28px oklch(0.55 0.14 35 / 0.35), 0 3px 8px oklch(0.55 0.14 35 / 0.2);
  /* Sombra única de "papel" para todos os cards (handoff T1) */
  --bella-shadow-card: 0 2px 8px rgba(122, 80, 48, 0.10);
  --bella-shadow-polaroid: 0 3px 12px rgba(122, 80, 48, 0.16);

  /* ─── Raios ─── */
  --radius:        0.5rem;
  --radius-sm:     calc(var(--radius) - 4px);
  --radius-md:     calc(var(--radius) - 2px);
  --radius-lg:     var(--radius);
  --radius-xl:     calc(var(--radius) + 4px);
  --radius-pill:   100px;
  --radius-card:   14px;

  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --tab-h: 60px;

  /* ─── Aliases legados pra compat (cards/telas antigas) ─── */
  --cream:    #FAF4E6;
  --paper:    #F5EFE0;
  --ink:      #2A1A0E;
  --ink-deep: #0F0C09;

  /* ─── Aliases semânticos do design system v2.1 (handoff 24/06/2026) ───
   * Nomes descritivos do cargo, não do matiz. Mapeia 1-para-1 os tokens
   * existentes — sem novos valores, sem quebrar código existente.        */
  --bella-cream-bg:    var(--background);
  --bella-cream-card:  var(--card);
  --bella-border:      var(--border);
  --bella-terra:       var(--terracotta);
  --bella-terra-deep:  var(--c-hoje-deep);
  --bella-sage:        var(--sage);
  --bella-sage-deep:   var(--c-saude-deep);
  --bella-wine:        var(--wine);
  --bella-ink:         var(--foreground);
  --bella-ink-soft:    var(--muted-foreground);
  --bella-ink-muted:   var(--muted-foreground);

  /* Cor de marca por porta (bella-design-system v2.0, 16/05/2026 §2.2):
   *   HOJE     = terracotta (também a --primary global — ações primárias em qualquer porta)
   *   SAÚDE    = sage
   *   EVOLUÇÃO = peach
   *   MAIS     = wine
   */
  --c-hoje:        var(--terracotta);
  --c-saude:       var(--sage);
  --c-evolucao:    var(--peach);
  --c-mais:        var(--wine);
  --c-hoje-deep:   oklch(0.45 0.13 35);
  --c-saude-deep:  oklch(0.5 0.05 165);
  --c-evolucao-deep: oklch(0.55 0.12 50);
  --c-mais-deep:   oklch(0.32 0.1 15);
  --c-hoje-soft:   color-mix(in oklab, var(--terracotta) 18%, var(--card));
  --c-saude-soft:  color-mix(in oklab, var(--sage) 22%, var(--card));
  --c-evolucao-soft: color-mix(in oklab, var(--peach) 22%, var(--card));
  --c-mais-soft:   color-mix(in oklab, var(--wine) 14%, var(--card));
  --c-marcos:      var(--c-evolucao);
  --c-familia:     var(--c-mais);

  /* Defaults — sobrescritos por data-porta */
  --porta-color:      var(--terracotta);
  --porta-foreground: var(--terracotta-foreground);
  --accent-deep:      var(--c-hoje-deep);
  --accent-soft:      var(--c-hoje-soft);
}

/* ─── Bind por porta (bella-design-system v2.0) ─── */
body[data-porta="hoje"] {
  --porta-color:      var(--terracotta);
  --porta-foreground: var(--terracotta-foreground);
  --accent-deep:      var(--c-hoje-deep);
  --accent-soft:      var(--c-hoje-soft);
}
body[data-porta="saude"] {
  --porta-color:      var(--sage);
  --porta-foreground: var(--sage-foreground);
  --accent-deep:      var(--c-saude-deep);
  --accent-soft:      var(--c-saude-soft);
}
body[data-porta="evolucao"] {
  --porta-color:      var(--peach);
  --porta-foreground: var(--peach-foreground);
  --accent-deep:      var(--c-evolucao-deep);
  --accent-soft:      var(--c-evolucao-soft);
}
body[data-porta="mais"] {
  --porta-color:      var(--wine);
  --porta-foreground: var(--wine-foreground);
  --accent-deep:      var(--c-mais-deep);
  --accent-soft:      var(--c-mais-soft);
}
