/* =============================================================================
   Tokens do site de apresentacao do Crivo.

   COPIA dos tokens do produto (front/styles/tokens.css da layout-v2, secoes 1
   a 3), reduzida ao que a pagina usa. E copia de proposito: o criterio 13 do
   prompt 34 manda o site subir e cair sem tocar no Crivo, entao ele nao
   importa nada da aplicacao. Mudou token no produto, copia-se a mao.

   Decisao do Pedro em 01/11/2026: o site sai no acento AZUL do Crivo, nao no
   verde da Planning. Quem clica em Entrar encontra a mesma cara.

   Fonte: Outfit, do Google Fonts, a mesma da interface desde o prompt 38.
   O tema escuro e o padrao; o claro vale pela preferencia do sistema
   operacional, pela escolha no cabecalho e SEMPRE na impressao.
   ========================================================================== */

:root {
  --font-sans: "Outfit", system-ui, -apple-system, sans-serif;
  --font-numero: "Outfit", system-ui, sans-serif;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --space-9: 112px;

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  --coluna: 1200px;
  --gutter: 24px;
}

/* ---- Tema escuro (padrao) ------------------------------------------------ */
:root,
[data-theme="dark"] {
  color-scheme: dark;
  --bg-000: #090c10;
  --bg-100: #10151c;
  --bg-200: #161d26;
  --line: #232c38;
  --line-strong: #66727f;
  --ink: #e9eef3;
  --ink-muted: #8a97a6;
  --sinal: #5cc8ff;
  --on-sinal: #04121c;
  --sinal-soft: rgba(92, 200, 255, 0.12);
  --petroleo: #0e3a4f;
  --risco-verde: #3ddc97;
  --risco-amarelo: #f4c152;
  --risco-vermelho: #ff7a7a;
  --focus: #5cc8ff;
  --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 16px 40px rgba(0, 0, 0, 0.35);
  --shadow-raised: 0 0 0 1px rgba(255, 255, 255, 0.04), 0 20px 48px rgba(0, 0, 0, 0.55);
  --trama: rgba(92, 200, 255, 0.07);
  --selo-alfa: 14%;
}

/* ---- Tema claro ---------------------------------------------------------- */
[data-theme="light"] {
  color-scheme: light;
  --bg-000: #f4f6f8;
  --bg-100: #ffffff;
  --bg-200: #eef1f4;
  --line: #d5dbe2;
  --line-strong: #7a8796;
  --ink: #0e141b;
  --ink-muted: #4f5b68;
  --sinal: #0a6fb8;
  --on-sinal: #ffffff;
  --sinal-soft: rgba(10, 111, 184, 0.10);
  --petroleo: #cde9f7;
  --risco-verde: #0f7a4c;
  --risco-amarelo: #8a5a00;
  --risco-vermelho: #b42323;
  --focus: #0a6fb8;
  --shadow-card: 0 1px 2px rgba(14, 20, 27, 0.06), 0 8px 24px rgba(14, 20, 27, 0.06);
  --shadow-raised: 0 0 0 1px rgba(14, 20, 27, 0.04), 0 16px 40px rgba(14, 20, 27, 0.14);
  --trama: rgba(10, 111, 184, 0.06);
  /* 14% no claro punha o verde do selo em 4,42:1. */
  --selo-alfa: 10%;
}

/* Sem escolha salva, o site segue o sistema operacional. A regra fica atras
   do :root:not([data-theme]) para a escolha do usuario vencer sempre. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;
    --bg-000: #f4f6f8;
    --bg-100: #ffffff;
    --bg-200: #eef1f4;
    --line: #d5dbe2;
    --line-strong: #7a8796;
    --ink: #0e141b;
    --ink-muted: #4f5b68;
    --sinal: #0a6fb8;
    --on-sinal: #ffffff;
    --sinal-soft: rgba(10, 111, 184, 0.10);
    --petroleo: #cde9f7;
    --risco-verde: #0f7a4c;
    --risco-amarelo: #8a5a00;
    --risco-vermelho: #b42323;
    --focus: #0a6fb8;
    --shadow-card: 0 1px 2px rgba(14, 20, 27, 0.06), 0 8px 24px rgba(14, 20, 27, 0.06);
    --shadow-raised: 0 0 0 1px rgba(14, 20, 27, 0.04), 0 16px 40px rgba(14, 20, 27, 0.14);
    --trama: rgba(10, 111, 184, 0.06);
    --selo-alfa: 10%;
  }
}

/* ---- Impressao: sempre o tema claro, como no produto --------------------- */
@media print {
  :root, [data-theme="dark"], [data-theme="light"] {
    color-scheme: light;
    --bg-000: #ffffff;
    --bg-100: #ffffff;
    --bg-200: #eef1f4;
    --line: #d5dbe2;
    --line-strong: #7a8796;
    --ink: #0e141b;
    --ink-muted: #4f5b68;
    --sinal: #0a6fb8;
    --on-sinal: #ffffff;
    --sinal-soft: rgba(10, 111, 184, 0.10);
    --risco-verde: #0f7a4c;
    --risco-amarelo: #8a5a00;
    --risco-vermelho: #b42323;
    --shadow-card: none;
    --shadow-raised: none;
    --trama: transparent;
    --selo-alfa: 10%;
  }
}
