/* ══════════════════════════════════════════════════════════════
   venez-theme.css — CSS Custom Properties para Light e Dark Mode
   Incluir em TODAS as páginas, ANTES de qualquer outro stylesheet.
   ══════════════════════════════════════════════════════════════ */

/* ── Botão primário — design padrão compartilhado ───────────── */
.btn-primary {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 18px; border-radius: 8px;
  font-size: 14px; font-weight: 600; cursor: pointer;
  background: var(--accent); border: none; color: #fff;
  transition: background .15s, box-shadow .15s;
  font-family: 'Inter', sans-serif;
}
.btn-primary:hover:not(:disabled) { background: var(--accent-hover); }
.btn-primary:disabled { opacity: .5; cursor: not-allowed; }

/* Dark mode: design minimalista — superfície tintada, sem efeitos de luz */
[data-theme="dark"] .btn-primary {
  background: var(--accent-bg);
  border: none;
  color: var(--accent);
  box-shadow: none;
}
[data-theme="dark"] .btn-primary:hover:not(:disabled) {
  background: #252748;
  box-shadow: none;
}
/* Sidebar: um tom mais claro para se destacar do fundo */
[data-theme="dark"] #btn-nova {
  background: #252748;
}
[data-theme="dark"] #btn-nova:hover {
  background: #2d2f5a;
}

/* ── Tema Claro (padrão) ────────────────────────────────────── */
:root {
  /* Backgrounds */
  --bg-page:      #f8fafc;
  --bg-surface:   #ffffff;
  --bg-surface-2: #f1f5f9;   /* hover, estados elevados        */
  --bg-surface-3: #f8fafc;   /* inputs, info rows              */

  /* Bordas */
  --border:       #e2e8f0;
  --border-sub:   #f1f5f9;   /* divisórias sutis (tx-row etc.) */

  /* Textos */
  --text-primary:      #1e293b;
  --text-secondary:    #475569;
  --text-muted:        #64748b;
  --text-placeholder:  #94a3b8;
  --text-dim:          #cbd5e1;  /* rodapé, rótulos muito sutis   */

  /* Accent — Indigo */
  --accent:        #6366f1;
  --accent-hover:  #4f46e5;
  --accent-bg:     #eef2ff;
  --accent-border: #c7d2fe;

  /* Semânticas */
  --positive:      #22c55e;
  --positive-bg:   #f0fdf4;
  --negative:      #ef4444;
  --negative-bg:   #fef2f2;
  --warning:       #d97706;
  --warning-bg:    #fef3c7;

  /* Componentes pontuais */
  --tooltip-bg:    #1e293b;
  --tooltip-text:  #ffffff;
  --overlay:       rgba(0, 0, 0, .35);
  --shadow-card:   0 1px 3px rgba(0, 0, 0, .06);
  --shadow-modal:  0 20px 60px rgba(0, 0, 0, .18);
  --scrollbar:     #e2e8f0;
}

/* ── Tema Escuro ────────────────────────────────────────────── */
[data-theme="dark"] {
  color-scheme: dark;
  /* Backgrounds */
  --bg-page:      #0f1117;
  --bg-surface:   #1a1d27;
  --bg-surface-2: #222535;
  --bg-surface-3: #2a2e42;

  /* Bordas */
  --border:       #2e3248;
  --border-sub:   #1e2235;

  /* Textos */
  --text-primary:      #e2e8f0;
  --text-secondary:    #94a3b8;
  --text-muted:        #64748b;
  --text-placeholder:  #94a3b8;
  --text-dim:          #3e4a6e;

  /* Accent — Indigo (clareado para fundo escuro) */
  --accent:        #818cf8;
  --accent-hover:  #6366f1;
  --accent-bg:     #1e1f3a;
  --accent-border: #3730a3;

  /* Semânticas (versão pastel para fundos escuros) */
  --positive:      #4ade80;
  --positive-bg:   #052e16;
  --negative:      #f87171;
  --negative-bg:   #2d0f0f;
  --warning:       #fbbf24;
  --warning-bg:    #2d2008;

  /* Componentes pontuais */
  --tooltip-bg:    #f1f5f9;
  --tooltip-text:  #1e293b;
  --overlay:       rgba(0, 0, 0, .6);
  --shadow-card:   0 1px 3px rgba(0, 0, 0, .3);
  --shadow-modal:  0 20px 60px rgba(0, 0, 0, .5);
  --scrollbar:     #2e3248;
}
