/* BLOCO UNICO DE TOKENS DE COR — identidade Grupo Ademar Cunha.
   A marca e vermelho + preto. NAO existe azul em lugar nenhum: verde e ambar
   sao apenas status semantico (positivo / atencao).

   Mesmos nomes e mesmos valores do Painel Operacional, de proposito: os dois
   sistemas tem de parecer o mesmo produto. Literal de cor so vive AQUI.

   As fontes vem do proprio servidor, nunca da Google. No painel a CSP
   `style-src 'self'` bloqueia fonts.googleapis.com e a tela abre em
   Georgia/system-ui SEM RECLAMAR EM LUGAR NENHUM. As Entregas ainda nao tem
   CSP estrita, mas vendorizar agora custa nada e evita a armadilha no dia em
   que tiver. */
@import url('./vendor/fontes.css');

:root {
  /* --- Marca --- */
  --ac-red: #C8102E;
  --ac-red-dark: #8B0B1F;
  --ac-red-soft: #FEF2F2;
  --ac-red-line: #F5DADE;
  --ac-black: #1A1A1A;

  /* --- Estado --- */
  --color-ok: #1A7A4A;
  --color-attention: #D4870A;
  --color-failure: #C8102E;
  --color-inert: #8A8A8A;
  /* Dois estados que a tela do dia trouxe do design system, porque a coluna
     "onde esta" precisa separar TERMINOU de ACABOU DE SAIR, e ESPERANDO de
     ANDANDO. Sem eles as duas metades do dia teriam a mesma cor.
       onpace   verde oliva — andou o que tinha de andar, e nao terminou
                (viagem liberada, entrega concluida sem prova)  4,90:1 no branco
       progress preto — fato neutro, ninguem espera decisao
                (viagem na rua)                                17,4:1 no branco
     Valores do design system, e nao escolhidos aqui. */
  --color-onpace: #437F17;
  --color-progress: #1A1A1A;

  /* --- Texto e superficie --- */
  --color-ink: #1A1A1A;
  --color-ink-muted: #6B6B6B;
  --color-ink-faint: #8A8A8A;
  /* Dois degraus a mais de texto, ambos exigidos pelo chassi de navegacao:
     `secondary` e o item de menu em repouso (AAA sobre branco), `fainter` e o
     rotulo de grupo e o nome da fase — texto que so precisa ser lido quando
     alguem procura por ele. */
  --color-ink-secondary: #3D3D3D;
  --color-ink-fainter: #A8A8A8;
  --color-surface: #FFFFFF;
  --color-surface-soft: #FAFAFA;
  --color-surface-zebra: #F5F5F5;
  --color-line: #E5E5E5;
  --color-line-soft: #EEEEEE;
  --color-focus: #C8102E;
  --color-on-strong: #FFFFFF;
  /* Os tres nomes que `fotos.css` usa. A folha e COPIA da do Painel (ver
     fotos_referencias.py) e la estes tokens existem; aqui faltavam, e token
     que falta nao reclama — a miniatura so sairia sem fundo e sem filete.
     Mesmos valores do Painel. */
  --ac-surface: #F5F5F5;
  --ac-border: #E5E5E5;
  --bw-hairline: 1px;

  /* --- Tints de estado --- */
  --color-ok-soft: #EAF4EE;
  --color-ok-line: #CDE5D8;
  --color-attention-soft: #FDF3E2;
  /* O ambar de TEXTO e mais escuro que o de glifo: #D4870A sobre #FDF3E2 da
     2,6:1 e reprova em 11px. Este escuro da 4,9:1 e passa em AA. Um token para
     cada trabalho — trocar `--color-attention` quebraria os glifos. */
  --color-attention-ink: #96590A;
  --color-attention-line: #EDE0C7;
  --color-inert-soft: #F5F5F5;
  /* O mesmo par -soft/-line que ok e attention ja tinham. Ate 27/08/2026 a
     falha era a unica sem eles, e o vermelho da tela saia de `--ac-red-soft`
     — o tint da MARCA emprestado para dizer ESTADO. Enquanto os dois hex
     coincidem ninguem ve; no dia em que a marca mudar de tom, todo bloco de
     falha muda junto, calado. Um token para cada trabalho. */
  --color-failure-soft: #FEF2F2;
  --color-failure-line: #F5DADE;
  /* O terceiro `-ink`, pelo mesmo motivo do ambar: #8A8A8A da 3,0:1 no branco
     e reprova em AA no rotulo de 11px em versalete. Este da 5,02:1. Trocar
     `--color-inert` quebraria o cinza dos glifos, que e outro trabalho. */
  --color-inert-ink: #6F6F6F;
  /* O veu atras da folha modal, no desktop. E cor com alfa de proposito: ele
     escurece o que esta atras em vez de tapar, e o motorista continua vendo em
     que parada da lista ele estava. */
  --color-veu: rgba(26, 26, 26, .5);
  /* Neutro de PROCESSO — "esta em andamento", nem bom nem ruim. O painel usa
     o mesmo cinza; ele existe para nao pintar de verde ou ambar um estado que
     so quer dizer "acontecendo". */
  --color-progress-soft: #F0F0F0;
  /* O tracejado do vazio e mais escuro que `--color-line`: filete de 1px
     continuo some, tracejado de 2px na mesma cor tambem. Duas telas chegaram a
     ele no mesmo dia, com o mesmo valor — a rota e a agenda, uma para a folha
     vazia e a outra para o "nada devendo". */
  --color-line-dashed: #C9C9C9;
  /* O verde de FUNDO de botao grande, sob texto branco. `--color-ok` e o verde
     de TEXTO; usado como fundo com branco por cima ele fica claro demais para
     o dedo achar no sol. */
  --color-ok-strong: #0E5F36;
  --color-ok-strong-hover: #0A4A29;
  /* O terceiro `-ink`, irmao de `--color-attention-ink` e `--color-inert-ink`.
     `--color-ok` (#1A7A4A) da 3,97:1 no branco: passa em numero grande e
     REPROVA em AA no rotulo de 11px em versalete — que e onde o placar do
     piloto escreve "ok" zona a zona. Este da 7,75:1. Trocar `--color-ok`
     consertaria isto e mudaria o verde das doze telas de uma vez; um token
     para cada trabalho. */
  --color-ok-ink: #0E5F36;
  /* Os dois cinzas de SERIE do design system (`--ac-chart-gray` e `-gray-2`).
     Cinza de grafico nao e cinza de texto: `--color-inert` e medido para
     contraste de LEITURA, e numa barra de 22px ele fica mais escuro que o
     preto do numero ao lado — a base pesaria mais que o piloto. */
  --color-chart-gray: #B0B0B0;
  --color-chart-gray-2: #CFCFCF;

  /* --- Tipografia --- */
  --font-display: 'Zilla Slab', Georgia, serif;
  --font-body: 'Source Sans 3', system-ui, -apple-system, sans-serif;

  /* --- Forma --- */
  /* Material impresso: a estrutura vem de filete e zebra, nao de elevacao. */
  --radius-sm: 2px;
  --radius-md: 3px;
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.08);
}