/* Tokens do design system do Correta. Única fonte de cor, letra, espaço e canto do sistema.
   As regras de uso (quando usar cada token) estão em DESIGN_SYSTEM.md; aqui ficam só os valores.
   Tema: sem data-theme segue o aparelho; data-theme="light"|"dark" força (botão no menu).
   Base aprovada em 30/09/2026. Superfícies, campo, foco, texto secundário e temperatura reajustados
   em 03/10/2026 (superfície tonal com 5 exceções; laranja = precisa de você). */
:root{
  --font:"Noto Sans","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  /* Famílias: Noto Sans é a base de tudo; as outras três têm um papel cada (ver docs/design-system/fundamentos.md) */
  --font-display:"Manrope Variable","Noto Sans","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif; /* título e número de destaque */
  --font-serif:"Source Serif 4 Variable",Georgia,"Times New Roman",serif; /* material que o cliente final lê */
  --mono:"JetBrains Mono Variable",ui-monospace,Consolas,monospace; /* código, JSON e dado técnico */

  /* Marca (iguais nos dois temas) */
  --m900:#0a2a45; --m800:#0d3152; --m700:#123c60; --m600:#17486e; --m500:#2b5f8e;
  --lua-clara:#d8d6d2; --lua-media:#b3b1ae; --lua-borda:#8d8c8a; --lua-escura:#6a6a70; --lua-tinta:#7a6a6e; /* a lua cheia da home (cinzas neutros, com os mares um pouco arroxeados); iguais nos dois temas */
  --luz-janela:#f6c46c; /* luz acesa das janelas da cidade da home; igual nos dois temas */
  --laranja:#ec8a2c; --laranja-hover:#b25a12; /* laranja escuro: fundo do botão laranja no hover, com texto branco (4,8:1); igual nos dois temas */
  --moeda:#f5b301; --moeda-borda:#b87f00; --moeda-ink:#7a5200; /* a moeda do sistema e o que é conquistado; ouro nos dois temas */
  --art-texto:#eaf0f6; --art-suave:#c3d2df; --art-apagado:#9fb4c8; /* painel marinho da entrada (igual nos dois temas) */
  --midia-fundo:#0d1a26; /* fundo do carrossel do book e dos vídeos (igual nos dois temas) */

  /* Segmentos (domain.js do app atual) */
  --seg-mcmv:#f3cc3e; --seg-f12:#e8b62c; --seg-f3:#ee913b; --seg-f4:#d97b2b; --seg-medio:#388b59;
  --seg-alto:#cc4444; --seg-litoral:#2682d4; --seg-aluguel:#7a5cc4; --seg-repasse:#1f9e9a; --seg-nd:#8b929c;
  /* Tipos no mapa (map.js do app atual) */
  --mapa-emp:#24466e; --mapa-avulso:#e07a2e; --mapa-aluguel:#7b5cd6; --mapa-repasse:#14a098;

  /* Identidade das construtoras: iguais nos dois temas e em todo o Brasil */
  --construtora-tenda:#c0392b; --construtora-direcional:#1f6fb2; --construtora-mrv:#208348;
  --construtora-azul:#355b8c; --construtora-verde:#12756b; --construtora-roxo:#7b43ad;
  --construtora-ocre:#85631c; --construtora-rosa:#b63068; --construtora-marrom:#795548;

  /* Temperatura do cliente (proposta 03/10/2026: o quente saiu do laranja; sempre com ícone e rótulo) */
  --quente:#cf4535; --morno:#a87908; --frio:#3b82c4;

  /* Tema claro: o fundo é tingido e o cartão é o degrau branco acima dele */
  --bg:#e3eaf1; --surface:#ffffff; --surface-2:#d3e0ec; --line:#c3d1de; --line-forte:#b9c6d2;
  --ink:#16283a; --muted:#4a5a69;
  --campo-borda:#6f8296; /* contorno de campo e controle, mínimo 3:1 contra o fundo */
  --realce:#2b5f8e; /* marinho legível sobre superfície: barra de seleção, barra de progresso */
  --avatar-bg:#cfdceb; --avatar-ink:#123c60;
  --sidebar:#0d3152; --sidebar-hover:#17486e; --sidebar-text:#c3d2df; --sidebar-ativo-bg:#eaf0f6; --sidebar-ativo:#123c60;
  --primary:#123c60; --primary-hover:#0a2a45; --on-primary:#ffffff; --link:#123c60;
  --selecao:#eaf0f6; --laranja-texto:#b25a12; --laranja-suave:#fdefe2;
  --focus:#2b5f8e;
  --ok:#2e7a4b; --ok-bg:#e6f2ea; --alerta:#8a5a0c; --alerta-bg:#fbf1dc;
  --erro:#a3392b; --erro-bg:#fbe9e6; --info:#1f5f99; --info-bg:#e5eef7;
  --whats:#1f8a4c;
  --sombra-2:0 8px 28px rgba(13,49,82,.18); /* só para o que flutua */
  --sombra-pino:0 3px 8px rgba(0,0,0,.3); /* alfinete do mapa */
  --capa-a:#c9d8e6; --capa-b:#8fb0cf;
  --logo-placa:transparent; --veu:rgba(227,234,241,.94);

  /* Tipografia: tamanhos (cada passo tem um papel; ver docs/design-system/fundamentos.md) */
  --t-hero:44px; /* abertura: entrar e cadastrar */
  --t-titulo:32px; --t-numero:28px; /* número de destaque (proposta: tamanho a confirmar) */
  --t-secao:23px; --t-cabecalho:21px; --t-sub:17px; --t-destaque:16px; --t-texto:15px; --t-controle:14px;
  --t-rotulo:13px; --t-pequeno:12px; --t-sobre:11px;
  --peso-leve:400; --peso-corpo:500; --peso-forte:600; --peso-titulo:700;
  --lh-numero:1.1; --lh-titulo:1.25; --lh-compacto:1.45; --lh-texto:1.55;

  /* Ícones (Lucide): lado do ícone, nunca do botão que o carrega */
  --icone-p:14px; --icone-m:16px; --icone:18px; --icone-g:20px; --icone-xg:22px; --icone-destaque:28px;

  /* Espaço (de 4 em 4) e cantos */
  /* Escala de 4 px; o número do token é o tamanho dividido por 4 e "-5" é meio passo (--e1-5 = 6 px) */
  --e0-5:2px; --e1:4px; --e1-5:6px; --e2:8px; --e2-5:10px; --e3:12px; --e3-5:14px; --e4:16px; --e4-5:18px;
  --e5:20px; --e6:24px; --e8:32px; --e12:48px;
  /* Papéis: recuo de dentro (padding), vão entre itens (gap) e margem da página */
  --inset-compacto:var(--e3); --inset-padrao:var(--e4); --inset-amplo:var(--e5);
  --gap-apertado:var(--e2); --gap-padrao:var(--e3); --gap-grupo:var(--e4); --gap-secao:var(--e6);
  --vista-max:1440px; /* tela de vista única ([data-vista-unica], ver docs/design-system/layout.md) para de crescer aqui e centraliza: em monitor muito largo as linhas não esticam (Peri, 21/10/2026) */
  --margem-pagina:var(--e8); --gap-pagina:var(--e4); /* 16 px entre blocos no computador (Sávio, 07/10: sem vão vazio) */ /* no celular passam a --e4 e --e6 (consulta no fim deste arquivo) */
  --r-etiqueta:6px; --r-campo:9px; --r-cartao:12px; --r-grande:16px; --r-pilula:999px;

  /* Camadas (z-index): de baixo para cima. 0 a 9 são camadas locais dentro de um componente e podem ser escritas direto */
  --z-cabecalho:5; --z-lista:20; --z-barra:30; --z-ajuda:40; --z-mapa:1000; --z-corry:1050; --z-menu:1100; --z-veu:1150; --z-toast:1200;

  /* Opacidade */
  --op-desabilitado:.45; --op-apagado:.6; --op-marca-dagua:.07; /* padrão de fundo (marca d'água) */

  /* Sobre foto, vídeo e menu lateral (iguais nos dois temas) */
  --scrim:rgba(10,22,34,.45); /* fundo escuro atrás de janela */
  --sobre-midia-claro:rgba(255,255,255,.88); --sobre-midia-claro-forte:rgba(255,255,255,.9); --sobre-midia-escuro:rgba(13,49,82,.85);
  --texto-sobre-midia:rgba(255,255,255,.75); --texto-sobre-midia-suave:rgba(255,255,255,.7);
  --degrade-midia:linear-gradient(transparent,rgba(0,0,0,.55)); /* legenda sobre foto */
  --sidebar-tinta:rgba(255,255,255,.07); --sidebar-tinta-forte:rgba(255,255,255,.16); /* controles dentro do menu lateral */
  --sidebar-anel-forte:rgba(255,255,255,.28); /* barra de rolagem do menu lateral */
  --branco:#ffffff; --tinta-sobre-claro:#16283a; /* fixos nos dois temas: texto sobre foto ou marinho, e texto sobre placa clara */
  --art-linha:rgba(255,255,255,.14); /* linhas decorativas do painel marinho da entrada */
  --sombra-alfinete:drop-shadow(0 2px 3px rgba(0,0,0,.35)); /* contorno de sombra de alfinete e do Corry (filtro, não box-shadow) */
  --sombra-corry:drop-shadow(0 6px 10px rgba(13,49,82,.28));
  --sombra-corry-escuro:drop-shadow(0 0 1.5px rgba(255,255,255,.75)) drop-shadow(0 6px 12px rgba(0,0,0,.5));

  /* Movimento (os mesmos valores de static/js/movimento.js) */
  --dur-rapida:.15s; --dur-media:.3s; --dur-lenta:.5s; --dur-brilho:4s; /* ciclo do reflexo da moeda (o reflexo passa em 30% dele); Peri, 20/10/2026 */

  --toque:44px;
  --scroll-trilho:transparent; --scroll-polegar:var(--campo-borda); --scroll-polegar-hover:var(--realce); /* barra de rolagem: aliases, então já valem nos dois temas (a alça usa o contorno de controle, 3:1) */
  --mesa-linha:88px; /* altura de uma linha da Mesa (a mesa cresce para baixo e a página rola); o card de N linhas tem N x isto mais os vãos */
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --quente:#f0705f; --morno:#e0ae12; --frio:#7fb2e6;
    --bg:#0b1621; --surface:#1c3248; --surface-2:#28425e; --line:#2f4963; --line-forte:#38506a;
    --ink:#e4ebf2; --muted:#a9b8c7;
    --campo-borda:#7087a0;
    --realce:#7fb2e6;
    --avatar-bg:#2b5f8e; --avatar-ink:#e4ebf2;
    --sidebar:#08192a; --sidebar-hover:#123049; --sidebar-text:#9fb4c8; --sidebar-ativo-bg:#1d3a57; --sidebar-ativo:#ffffff;
    --primary:#2f6fae; --primary-hover:#3a7dbf; --on-primary:#ffffff; --link:#7fb2e6;
    --selecao:#234058; --laranja-texto:#f29a45; --laranja-suave:#3a2614;
    --focus:#7fb2e6;
    --ok:#6cc08c; --ok-bg:#15301f; --alerta:#e3b04b; --alerta-bg:#33280f;
    --erro:#f08a7c; --erro-bg:#3a1a16; --info:#7fb2e6; --info-bg:#132d45;
    --sombra-2:0 10px 30px rgba(0,0,0,.6);
    --capa-a:#1f3a55; --capa-b:#2d5378;
    --logo-placa:#ffffff; --veu:rgba(11,22,33,.94);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --quente:#f0705f; --morno:#e0ae12; --frio:#7fb2e6;
  --bg:#0b1621; --surface:#1c3248; --surface-2:#28425e; --line:#2f4963; --line-forte:#38506a;
  --ink:#e4ebf2; --muted:#a9b8c7;
  --campo-borda:#7087a0;
  --realce:#7fb2e6;
  --avatar-bg:#2b5f8e; --avatar-ink:#e4ebf2;
  --sidebar:#08192a; --sidebar-hover:#123049; --sidebar-text:#9fb4c8; --sidebar-ativo-bg:#1d3a57; --sidebar-ativo:#ffffff;
  --primary:#2f6fae; --primary-hover:#3a7dbf; --on-primary:#ffffff; --link:#7fb2e6;
  --selecao:#234058; --laranja-texto:#f29a45; --laranja-suave:#3a2614;
  --focus:#7fb2e6;
  --ok:#6cc08c; --ok-bg:#15301f; --alerta:#e3b04b; --alerta-bg:#33280f;
  --erro:#f08a7c; --erro-bg:#3a1a16; --info:#7fb2e6; --info-bg:#132d45;
  --sombra-2:0 10px 30px rgba(0,0,0,.6);
  --capa-a:#1f3a55; --capa-b:#2d5378;
  --logo-placa:#ffffff; --veu:rgba(11,22,33,.94);
  color-scheme:dark;
}

/* Margem e vão da página: menores no celular (até 767,98 px) */
@media (max-width:767.98px){
  :root{--margem-pagina:var(--e4);--gap-pagina:var(--e6)}
}