/* Yatai Yoru · Tokens visuais (27/10/2026)
   Cores, fontes e medidas aprovadas, num só lugar. Os componentes de yy-componentes.css
   usam somente estas variáveis; para mudar o visual de todos os botões, mude aqui.
   O tema escuro do sistema (body.theme-dark) redefine só as cores. */
:root {
  /* superfícies e texto */
  --yy-papel: #fffaf2;
  --yy-cartao: #fffdf8;
  --yy-tinta: #2a211c;
  --yy-tinta-suave: #75695d;
  --yy-linha: #e3d5c1;

  /* botão principal (vermelho aprovado, o mesmo da Ficha Técnica) */
  --yy-principal-topo: #c31c1c;
  --yy-principal-base: #9d0808;
  --yy-principal-borda: #a71111;
  --yy-principal-texto: #ffffff;

  /* botão secundário (creme) */
  --yy-secundario-topo: #fffaf1;
  --yy-secundario-base: #f8efe0;
  --yy-secundario-borda: #e3cdb3;
  --yy-secundario-texto: #583b27;

  /* perigo e foco */
  --yy-perigo: #a51d20;
  --yy-foco: #c99e57;

  /* rótulos e caixas */
  --yy-rotulo-texto: #5b5044;
  --yy-caixa-fundo: #ffffff;
  --yy-caixa-borda: #d7cbbc;
  --yy-caixa-texto: #322d27;
  --yy-caixa-leitura: #eeece8;

  /* menus */
  --yy-menu-atual: #ac191a;
  --yy-menu-atual-texto: #ffffff;
  /* abas: o desenho já usado em Cadastro, Estoque, Produção, Vendas... (stk-nav) */
  --yy-aba-fundo: #fffaf3;
  --yy-aba-borda: #e4d4bc;
  --yy-aba-texto: #723b26;
  --yy-aba-atual-topo: #a61515;
  --yy-aba-atual-base: #a61515;
  --yy-aba-atual-texto: #ffffff;

  /* grades de resultado (modelo: Consulta Ficha técnica) */
  --yy-grade-cabecalho: #f6ecdf;
  --yy-grade-cabecalho-texto: #524432;
  --yy-grade-texto: #463b31;
  --yy-grade-linha-impar: #fffdf8;
  --yy-grade-linha-par: #f6eddf;
  --yy-grade-linha-foco: #f0ddbd;
  --yy-grade-linha-selecionada: #efe0c8;
  --yy-grade-borda: #e8dfd3;
  --yy-grade-pagina-atual: #a51d20;

  /* fontes */
  --yy-fonte-ui: Arial, Helvetica, sans-serif;
  --yy-fonte-titulo: "Libre Caslon Text", Georgia, "Times New Roman", serif;
  --yy-fonte-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;

  /* medidas (tamanho único aprovado em 27/10/2026) */
  --yy-botao-altura: 38px;
  --yy-botao-altura-pequeno: 30px;
  --yy-botao-fonte: 13px;
  --yy-botao-fonte-pequeno: 12px;
  --yy-raio: 6px;
  --yy-caixa-altura: 40px;
}

body.theme-dark {
  --yy-papel: #1a1511;
  --yy-cartao: #241d17;
  --yy-tinta: #f1e6d6;
  --yy-tinta-suave: #b5a28d;
  --yy-linha: #3a3028;
  --yy-secundario-topo: #2c241c;
  --yy-secundario-base: #261f18;
  --yy-secundario-borda: #4a3b2c;
  --yy-secundario-texto: #f1d9bd;
  --yy-perigo: #ef9c8c;
  --yy-rotulo-texto: #cdbb9f;
  --yy-caixa-fundo: #241d17;
  --yy-caixa-borda: #4a3b2c;
  --yy-caixa-texto: #f1e6d6;
  --yy-caixa-leitura: #2c241c;
  --yy-grade-cabecalho: #2c241c;
  --yy-grade-cabecalho-texto: #e7d3b6;
  --yy-grade-texto: #f1e6d6;
  --yy-grade-linha-impar: #241d17;
  --yy-grade-linha-par: #2a221b;
  --yy-grade-linha-foco: #3a2e22;
  --yy-grade-linha-selecionada: #3f3022;
  --yy-grade-borda: #3a3028;
  --yy-aba-fundo: #2c241c;
  --yy-aba-borda: #4a3b2c;
  --yy-aba-texto: #f1d9bd;
}