@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
  /* Primitivos ADNOTARE */
  --navy-950: #010b18;
  --navy-900: #001c2f;
  --navy-800: #002d4a;
  --navy-700: #003d63;
  --navy-600: #00527e;
  --navy-300: #6aacd1;
  --navy-50: #eaf4fb;
  --gold-400: #c9a244;
  --gold-300: #deb655;
  --red-erro: #b91c1c;
  --preto: #0d0d0d;
  --cinza-100: #f3f3f4;
  --cinza-200: #e6e7e9;
  --pure-white: #ffffff;

  /* Semanticos consumidos pela estrutura */
  --acento: var(--navy-900);
  --acento-claro: var(--navy-800);
  --acento-escuro: var(--navy-900);
  --nota-fundo: var(--navy-50);
  --erro-texto: var(--red-erro);
  --erro-fundo: rgba(185, 28, 28, 0.08);
  --tinta: var(--navy-900);
  --texto: var(--navy-800);
  --texto-suave: rgba(0, 28, 47, 0.74);
  --texto-fraco: rgba(0, 28, 47, 0.55);
  --texto-tenue: rgba(0, 28, 47, 0.40);
  --fundo: var(--cinza-100);
  --superficie: var(--pure-white);
  --borda: rgba(0, 28, 47, 0.20);
  --borda-sutil: rgba(0, 28, 47, 0.09);
  --campo-fundo: rgba(0, 28, 47, 0.045);
  /* Recuo: a pergunta esta viva, so nao e a forma de pagamento marcada.
     Precisa afastar sem tomar emprestado o cinza de :disabled. */
  --recuo-fundo: rgba(0, 28, 47, 0.03);
  --campo-fundo-hover: rgba(0, 28, 47, 0.075);
  --borda-forte: rgba(0, 28, 47, 0.45);
  --transparente: transparent;

  /* Estados e efeitos */
  --borda-instrucoes: rgba(0, 28, 47, 0.18);
  --acao-suave-hover: var(--cinza-200);
  --botao-texto: var(--pure-white);
  --anel-foco: rgba(0, 28, 47, 0.13);
  --anel-erro: rgba(185, 28, 28, 0.28);
  --borda-erro: rgba(185, 28, 28, 0.30);
  --sombra-rodape: rgba(0, 28, 47, 0.10);
  --sombra-botao: rgba(0, 28, 47, 0.22);
  --sombra-botao-hover: rgba(0, 28, 47, 0.28);

  /* O contorno e' um fio de cabelo; a sombra so' descola o cartao do fundo.
     Sombra forte em cartao branco sobre cinza claro envelhece a tela. */
  --sombra-cartao: 0 1px 2px rgba(0, 28, 47, 0.04), 0 12px 28px -18px rgba(0, 28, 47, 0.28);
  --sombra-cartao-foco: 0 1px 2px rgba(0, 28, 47, 0.06), 0 18px 36px -20px rgba(0, 28, 47, 0.35);

  /* Painel escuro — o modo nativo da marca. A paleta e' fechada em navy, dourado,
     preto e branco: o dourado so' aparece como preenchimento sobre navy, nunca
     como texto ou fio sobre fundo claro (1,76:1, reprova). */
  --painel-fundo: var(--navy-900);
  --painel-texto: var(--pure-white);
  --painel-texto-suave: rgba(255, 255, 255, 0.74);
  --painel-texto-fraco: rgba(255, 255, 255, 0.60);
  --painel-realce: var(--gold-300);
  --painel-borda: rgba(222, 182, 85, 0.22);
  --painel-acao-fundo: var(--gold-300);
  --painel-acao-texto: var(--navy-900);
  --painel-acao-hover: var(--gold-400);
  --painel-caixa: rgba(255, 255, 255, 0.07);

  /* Realce e assistente */
  --realce: var(--texto-tenue);
  --foco-fundo: rgba(0, 28, 47, 0.035);
  --ia-selo-fundo: var(--gold-300);
  --ia-selo-texto: var(--navy-900);
  --ia-realce: var(--gold-300);

  /* Cabecalho e marca */
  --cabecalho-fundo: var(--navy-900);
  --cabecalho-titulo: var(--pure-white);
  --cabecalho-texto: rgba(255, 255, 255, 0.78);
  --marca: url('/assets/tema/adnotare-logo.png');
  --marca-ratio: 356 / 54;

  /* Tipografia e movimento */
  --titulo: 'Gotham', 'Plus Jakarta Sans', 'Century Gothic', sans-serif;
  --corpo: 'Gotham', 'Plus Jakarta Sans', 'Century Gothic', sans-serif;
  --ease: cubic-bezier(.2, .6, .2, 1);
  --btn-active-scale: scale(0.97);
  --medida: 44rem;
}
