/* ═══════════════════════════════════════════════════════════════
   RevendasDB — base visual compartilhada por todas as páginas
   Fonte Inter (hospedada aqui, sem depender do Google Fonts),
   números alinhados, cores da marca e ajustes de acessibilidade.
   Para mudar a identidade visual, edite só os tokens --marca-*.
   ═══════════════════════════════════════════════════════════════ */

@font-face {
  font-family: 'Inter';
  src: url('/fonts/InterVariable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Marca */
  --marca-primaria: #0284c7;
  --marca-primaria-escura: #0369a1;
  --marca-navy: #0f2d4a;
  --marca-sucesso: #059669;
  --marca-alerta: #d97706;
  --marca-erro: #dc2626;
  --marca-roxo: #7c3aed;

  /* Etapas do funil (iguais em todas as telas) */
  --etapa-sem: #94a3b8;
  --etapa-prospect: #0284c7;
  --etapa-visitada: #7c3aed;
  --etapa-negociando: #d97706;
  --etapa-cliente: #059669;
  --etapa-perdida: #dc2626;
  --etapa-fechada: #475569;

  /* Tipografia */
  --fonte: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --fonte-mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* Texto secundário com contraste AA (antes #94a3b8 sobre branco: 2,6:1) */
  --texto-suave: #64748b;
  --raio: 12px;
  --raio-sm: 8px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --texto-suave: #94a3b8; }
}
[data-theme="dark"] { --texto-suave: #94a3b8; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body, button, input, select, textarea {
  font-family: var(--fonte);
  font-feature-settings: 'cv11', 'ss01';   /* "a" de um andar e dígitos mais legíveis */
}
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
code, pre, kbd, .mono { font-family: var(--fonte-mono); }

/* Números alinhados em KPIs, tabelas e contadores */
table, .kpi, .kpi .n, .num, [data-num], .badge, .pill, .contador {
  font-variant-numeric: tabular-nums;
}

/* Foco visível para teclado */
:focus-visible { outline: 2px solid var(--marca-primaria); outline-offset: 2px; }

/* Respeita quem prefere menos animação */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Áreas de toque mínimas no celular */
@media (pointer: coarse) {
  button, .btn, .bt, a.btn { min-height: 40px; }
}
