/* =============================================================
   TELMIN & ENEIDA PRIVATE COLLECTION
   styles_tokens.css — Tokens de design (fonte única de verdade)
   NÃO editar componentes aqui. Apenas valores de design.
   ============================================================= */

/* ── Fallback global: dark como padrão antes de qualquer script ── */
:root {
  --bg-primary:        #0a0a0a;
  --bg-secondary:      #1a1a1a;
  --bg-tertiary:       #0f0f0f;
  --bg-card:           linear-gradient(135deg, #1a1a1a 0%, #0f0f0f 100%);
  --bg-hero:           linear-gradient(135deg, #1a1a1a 0%, #000000 100%);
  --bg-image:          linear-gradient(135deg, #2a2a2a 0%, #1a1a1a 100%);

  --text-primary:      #ffffff;
  --text-secondary:    #c5975f;
  --text-muted:        rgba(255, 255, 255, 0.70);

  --border-primary:    rgba(197, 151, 95, 0.20);
  --border-hover:      #c5975f;
  --border-soft:       rgba(197, 151, 95, 0.12);

  --shadow-color:      rgba(197, 151, 95, 0.20);

  --gold-primary:      #c5975f;
  --gold-light:        #d4af77;
  --gold-soft:         rgba(197, 151, 95, 0.08);

  --danger:            #dc3545;

  --input-bg:          rgba(255, 255, 255, 0.05);
  --input-border:      rgba(197, 151, 95, 0.30);

  --overlay:           rgba(0, 0, 0, 0.70);
  --submenu-bg:        rgba(0, 0, 0, 0.90);
  --submenu-border:    rgba(255, 255, 255, 0.13);
  --submenu-hover:     rgba(255, 255, 255, 0.08);

  /* ── Constantes de layout ─── */
  --header-height:        60px; /* botões de 42px + 9px de respiro acima e abaixo */
  --max-width-content:    1400px;
  --radius-card:          12px;
  --radius-modal:         16px;
  --radius-pill:          999px;
  --transition-base:      0.3s ease;

  /* z-index hierarchy */
  --z-header:    120;
  --z-controls:  100;
  --z-modal:     200;
  --z-lightbox:  300;
}

/* ── Tema claro ───────────────────────────────────────────── */
[data-theme="light"] {
  --bg-primary:        #f5f5f0;
  --bg-secondary:      #ffffff;
  --bg-tertiary:       #fafaf8;
  --bg-card:           linear-gradient(135deg, #ffffff 0%, #fafaf8 100%);
  --bg-hero:           linear-gradient(135deg, #ffffff 0%, #f5f5f0 100%);
  --bg-image:          linear-gradient(135deg, #e8e8e3 0%, #d8d8d3 100%);

  --text-primary:      #1a1a1a;
  --text-secondary:    #8b6f47;
  --text-muted:        rgba(26, 26, 26, 0.70);

  --border-primary:    rgba(139, 111, 71, 0.30);
  --border-hover:      #8b6f47;
  --border-soft:       rgba(139, 111, 71, 0.15);

  --shadow-color:      rgba(139, 111, 71, 0.15);

  --gold-primary:      #8b6f47;
  --gold-light:        #a68a5f;
  --gold-soft:         rgba(139, 111, 71, 0.08);

  --danger:            #c0392b;

  --input-bg:          rgba(139, 111, 71, 0.05);
  --input-border:      rgba(139, 111, 71, 0.30);

  --overlay:           rgba(255, 255, 255, 0.85);
  --submenu-bg:        #ffffff;
  --submenu-border:    rgba(0, 0, 0, 0.13);
  --submenu-hover:     rgba(0, 0, 0, 0.06);
}