/*
 * Tokens do Seu Menor Preço — valem para o site público e para o admin (design/handoff-2026-10-21-site-inteiro/README.md).
 * Só variáveis: as peças ficam em site.css (site) e admin/admin.css (admin). Mudou uma cor? Muda aqui, nos dois.
 */
:root {
  /* Cores */
  --navy: #002E5B;            /* títulos, cabeçalho, rodapé, botões escuros, aba ativa */
  --navy-2: #01264B;
  --link: #004496;            /* links, "Ler o guia →" */
  --green: #0CD149;           /* botão para a loja, selo de desconto, sublinhado da aba ativa */
  --green-hover: #00B93C;
  --green-label: #00804F;     /* rótulos em texto pequeno ("Melhor no geral", categoria) */
  --green-chip-bg: #E1F6EA;   /* "Menor preço", "Publicado", "No ar" */
  --green-chip-text: #00703F;
  --green-big: #009B61;       /* só números grandes (desconto do cupom) */
  --bg: #F4F6F8;
  --card: #FFFFFF;
  --bg-soft: #F8FAFB;         /* cabeçalho de tabela */
  --bg-sel: #F2F6FB;
  --blue-light: #EAF1F9;      /* "Como funciona", "Como escolhemos", "Está no guia" */
  --blue-light-border: #D4E2F0;
  --tag-bg: #E8EEF6;          /* tags/abas azuis ("2 lojas") */
  --text: #2F3E50;            /* corpo */
  --text-strong: #0F1B2A;
  --text-2: #46586B;
  --text-3: #5C6B7D;
  --text-4: #8494A6;
  --text-guide: #22344A;
  --border: #E3E8EE;          /* cards */
  --border-row: #EDF1F5;      /* divisórias */
  --border-input: #C3CFDB;
  --border-rule: #D5DDE5;     /* régua das abas */
  --border-pill: #DCE4EC;
  --border-logo: #E6EBF0;
  --border-hover: #B9C7D6;
  --border-dash: #B9C7D6;
  --warn-bg: #FFF3C4;         /* pendências ("Sem textos", "Digitado à mão") */
  --warn-text: #8A5A00;
  --warn: #E8A23A;
  --bad: #C2383E;
  --bad-bg: #FDECEC;
  --on-navy: #B9D2EA;         /* texto sobre azul-marinho */
  --on-navy-2: #9FC4E8;       /* faixa de afiliado */
  --on-navy-3: #8FB0CF;       /* secundário sobre azul */
  --new-border: #BFE9D2;      /* blocos novos do admin */
  --new-bg: #F3FBF6;
  --focus: 0 0 0 3px rgba(0, 68, 150, .25);

  /* Tipografia (Google Fonts: Archivo 500–800, IBM Plex Sans 400–700, IBM Plex Mono 500–600) */
  --font: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-head: Archivo, "IBM Plex Sans", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;

  /* Raios */
  --r-chip: 5px;
  --r-btn: 9px;
  --r-field: 9px;
  --r-box: 12px;
  --r-card: 14px;
  --r-card-lg: 16px;
  --r-reco: 18px;
  --r-pill: 999px;

  /* Sombras (site: borda + sombra leve; admin: só borda) */
  --shadow-card: 0 1px 2px rgba(0, 46, 91, .04), 0 12px 32px -20px rgba(0, 46, 91, .22);
  --shadow-card-m: 0 1px 2px rgba(0, 46, 91, .04), 0 10px 24px -18px rgba(0, 46, 91, .22);
  --shadow-card-hover: 0 12px 28px -18px rgba(0, 46, 91, .3);
  --shadow-drawer: -24px 0 60px -30px rgba(0, 30, 60, .5);
}