/*
 * Tokens do brandbook Almeida Carneiro V 1.0.
 *
 * Fonte de verdade: arquivo-hub no Figma
 * https://www.figma.com/design/qCdf3xNVI8qQtihZzr1mb6
 *
 * A paleta e fechada em 5 cores. Nao acrescentar cor sem passar pelo Figma.
 * Cinza #828282 e proibido em texto pequeno sobre branco — use navy75.
 */
:root {
  /* Paleta fechada — brandbook p23 */
  --ac-navy: #091a35;
  --ac-blue: #7aa8d4;
  --ac-gray: #828282;
  --ac-black: #1d1d1f;
  --ac-white: #ffffff;

  /*
   * Navy com transparencia. Sao cores proprias, nao opacidade aplicada ao
   * elemento: o brandbook proibe hierarquia por opacidade, e opacidade em
   * elemento apaga tambem o que esta dentro dele. Os valores vem medidos do
   * hub Figma.
   */
  --ac-navy-75: #465368;
  --ac-navy-70: rgba(9, 26, 53, 0.7);
  --ac-navy-55: rgba(9, 26, 53, 0.55);
  --ac-navy-40: #9aa2ae;

  /*
   * Cor de controle desabilitado. A WCAG isenta controle desabilitado de
   * contraste, mas aqui desabilitado nao e estado passageiro: e o estado
   * PERMANENTE de "Fechar o dia", "Aceitar", "Divergir", "Conferir" e
   * "Classificar" enquanto nao ha autorizacao de escrita — sao as unicas
   * chamadas para acao das telas, e algumas em 9px. navy40 da 2,58:1 sobre
   * branco e fica ilegivel nesse tamanho.
   *
   * #6d7788 e o ponto mais claro da reta navy75 -> navy40 que ainda entrega
   * 4,52:1. Continua nitidamente recuado em relacao ao navy cheio (17,34:1)
   * das acoes vivas, entao nao passa a impressao de estar habilitado.
   */
  --color-text-disabled: #6d7788;

  /*
   * Os quatro degraus claros vem lidos da colecao `AC Brand` do hub, nao
   * medidos de tela. Antes daqui saiam #e3e6ea e rgba(9,26,53,0.14), que
   * nao existem em lugar nenhum do arquivo — eram aproximacao minha.
   */
  --ac-navy-16: #d8dadf;
  --ac-navy-09: #e9eaed;
  --ac-navy-04: #f5f6f7;
  --ac-blue-16: #eaf1f8;

  --ac-navy-14: rgba(9, 26, 53, 0.14);
  --ac-navy-05: rgba(9, 26, 53, 0.05);

  /*
   * Semanticos — espelham a colecao `Color` do hub, que e toda alias das
   * primitivas acima.
   *
   * `bg/page` existe na colecao `Color` do hub e vale navy-04, mas ESTE
   * sistema nao o usa: as 12 telas desenhadas para ele na pagina
   * `01 · Agente Financeiro` sao brancas de ponta a ponta, sem cartao sobre
   * fundo tingido. Os paineis irmaos (Patrimonio, Fundo Fixo) usam o fundo
   * tingido, e importar aquele padrao por cima do unico desenho que existe
   * para este seria decisao minha, nao do arquivo. Fica declarado e sem uso,
   * de proposito, para o dia em que as telas forem redesenhadas.
   */
  --color-bg-page: var(--ac-navy-04);
  --color-bg-subtle: var(--ac-navy-04);
  --color-bg-selected: var(--ac-blue-16);
  --color-bg-surface: var(--ac-white);
  --color-bg-inverse: var(--ac-navy);
  --color-text-primary: var(--ac-navy);
  /*
   * Texto secundario usa navy75, nao o cinza da paleta. Medido: #828282
   * sobre branco da 3.84:1 e reprova no minimo de 4.5:1 para texto pequeno;
   * #465368 da 7.78:1. O proprio brandbook ja dizia isso, e o token estava
   * contrariando o comentario logo acima dele.
   */
  --color-text-muted: var(--ac-navy-75);
  --color-text-on-inverse: var(--ac-white);
  --color-text-accent: var(--ac-blue);
  --color-line: var(--ac-navy);
  --color-line-soft: var(--ac-navy-09);
  --color-line-strong: var(--ac-navy-16);

  /* Tipografia — Instrument Sans, do brandbook */
  --fonte: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, Helvetica, Arial, sans-serif;
  --peso-regular: 400;
  --peso-medium: 500;
  /* Acrescentado para o nome da marca na sidebar (Figma 11:3, Instrument Sans SemiBold). */
  --peso-semibold: 600;

  /* Escala vinda do Figma. Termina em 46px; nao inventar tamanho fora dela. */
  --texto-rotulo: 8.5px;
  --texto-meta: 9px;
  --texto-acao: 10px;
  --texto-apoio: 10.5px;
  --texto-secundario: 11px;
  --texto-corpo: 13.5px;
  --texto-valor: 14px;
  --texto-numero: 26px;
  --texto-status: 12.5px;
  --texto-celula: 13px;
  --texto-titulo: 40px;
  --texto-destaque: 46px;
  --texto-contagem: 48px;

  /*
   * Espacamento entre letras. O Figma guarda em porcentagem do tamanho da
   * fonte; aqui vai em px, ja convertido — e a conversao e o que estava
   * errado em dois deles:
   *
   *   rotulo  8,5px x 22% = 1,87px (estava 1,7 = 20%)
   *   meta      9px x 22% = 1,98px
   *   acao     10px x 18% = 1,80px (estava 1,6 = 16%; o component set
   *                                 `Botão` mede 18%)
   *   nivel  10,5px x 13% = 1,40px
   */
  --tracking-rotulo: 1.87px;
  --tracking-meta: 1.98px;
  --tracking-acao: 1.8px;
  --tracking-nivel: 1.4px;

  /* Espacamento — escala 4/8/16/24/32 */
  --esp-1: 4px;
  --esp-2: 8px;
  --esp-3: 12px;
  --esp-4: 16px;
  --esp-5: 24px;
  --esp-6: 32px;
  --esp-7: 40px;
  --esp-8: 56px;

  /*
   * Colecao `Layout` do hub: 8 · 10 · 14 · 999. Campo usa 8, botao 8 (e o
   * que o componente compartilhado Botao mede, apesar de a colecao chamar
   * o 10 de "raio/botao"), cartao 14 e chip 999.
   */
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-full: 999px;

  /* Larguras da tabela de conciliacao, do Figma */
  --col-extrato: 500px;
  --col-casamento: 160px;
  --col-valor: 126px;

  /* Larguras da tabela de fechamentos, do Figma */
  --col-dia: 130px;
  --col-conta: 220px;
  --col-padrao: 180px;

  /*
   * Largura da coluna "Banco · Agencia" da tabela de contas bancarias
   * (Figma 86:33). As colunas "Conta" e "Empresa vinculada" reaproveitam
   * --col-conta (220px, ja usada em Fechamentos) e "Status" reaproveita
   * --col-padrao (180px) porque o Figma repete exatamente essas larguras.
   */
  --col-banco: 240px;

  /*
   * Largura fixa da navegacao lateral (Figma 11:3). Acrescentada aqui, nao
   * em componentes/Navegacao.module.css, porque e um numero de layout de
   * pagina inteira, do mesmo jeito que as colunas de tabela acima.
   */
  --largura-nav: 248px;

  /*
   * Movimento — secao 06 do DESIGN-SYSTEM.md (extensao do brandbook V 1.0,
   * aprovada em 09/09/2026). Quatro duracoes e tres curvas, nao mais.
   * Saida roda a 75% da entrada: saida lenta e a causa mais comum de
   * interface que "parece pesada".
   */
  --mov-rapido: 120ms;
  --mov-base: 200ms;
  --mov-medio: 280ms;
  --mov-lento: 400ms;

  --ease-entra: cubic-bezier(0, 0, 0.2, 1);
  --ease-sai: cubic-bezier(0.4, 0, 1, 1);
  --ease-move: cubic-bezier(0.4, 0, 0.2, 1);

  /*
   * Anel de foco. Medido: o outline azul que estava aqui da 2.51:1 sobre
   * branco e reprova o minimo de 3:1 da WCAG 1.4.11 para indicador de foco.
   * Sobre branco o anel e navy (17.34:1); o azul fica reservado para
   * superficie navy, onde da 6.92:1 e e o unico que se ve.
   */
  --anel-foco: rgba(9, 26, 53, 0.12);
  --anel-foco-inverso: rgba(122, 168, 212, 0.45);
}

/*
 * Sem tema escuro. O brandbook nao define paleta escura, e inventar uma
 * seria alterar o Design System fora do Figma.
 */