/* Responde Bem · cores dos canais (WhatsApp e Instagram). Arquivo ÚNICO, servido estático a partir de
   painel/public e linkado no HTML do painel (/painel/), da área interna (/admin/) e do site (/).
   Decisão de 30/10/2026 (docs/cores-canais.md):
   - a cor da marca entra só no DETALHE (filete de 3 px no topo do card, filete de 2 px sob a aba
     ativa, fundo de selo); o fundo do card continua neutro;
   - texto nunca usa a cor da marca: #25D366 sobre branco dá 1,98:1. Texto usa --wa / --ig, que
     passam WCAG AA (≥ 4,5:1) sobre --wa-soft / --ig-soft e sobre a superfície dos dois temas
     (evals/cores-canais.ts calcula);
   - os glifos em /marcas/ são os arquivos oficiais do Brand Resource Center da Meta, sem recolorir e
     sem editar: a classe .marca só escala (background-size: contain). A versão mono é o glifo preto
     ou branco oficial, escolhido pelo tema ou pelo fundo do contexto; nunca máscara nem filtro.
   O site é só claro: usa apenas --wa-marca, --ig-marca e os glifos coloridos. */
:root {
  --wa-marca: #25D366;
  --wa: #12784a;
  --wa-soft: #e2f5ea;
  --ig-marca: linear-gradient(45deg, #F58529 0%, #DD2A7B 45%, #8134AF 80%, #515BD4 100%);
  --ig: #b4237a;
  --ig-soft: #fbe6f1;
  --marca-wa-cor: url('/marcas/Digital_Glyph_Green_RGB_2026.svg');
  --marca-wa-preto: url('/marcas/Digital_Glyph_Black_RGB_2026.svg');
  --marca-wa-branco: url('/marcas/Digital_Glyph_White_RGB_2026.svg');
  --marca-ig-cor: url('/marcas/Instagram_Glyph_Gradient-256.png');
  --marca-ig-preto: url('/marcas/Instagram_Glyph_Black.svg');
  --marca-ig-branco: url('/marcas/Instagram_Glyph_White.svg');
  --marca-wa-mono: var(--marca-wa-preto);
  --marca-ig-mono: var(--marca-ig-preto);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --wa: #5ed69a;
    --wa-soft: #10331f;
    --ig: #f48cc8;
    --ig-soft: #3a1630;
    --marca-wa-mono: var(--marca-wa-branco);
    --marca-ig-mono: var(--marca-ig-branco);
  }
}
:root[data-theme='dark'] {
  --wa: #5ed69a;
  --wa-soft: #10331f;
  --ig: #f48cc8;
  --ig-soft: #3a1630;
  --marca-wa-mono: var(--marca-wa-branco);
  --marca-ig-mono: var(--marca-ig-branco);
}

/* Glifo oficial como imagem de fundo: escala sem deformar e nunca é recolorido.
   Só com .wa/.ig: o bloco do logo do painel também se chama .marca e era espremido a 1em × 1em. */
.marca.wa, .marca.ig { display: inline-block; width: 1em; height: 1em; flex: none; vertical-align: -0.125em; background: center / contain no-repeat; }
.marca.wa { background-image: var(--marca-wa-cor); }
.marca.ig { background-image: var(--marca-ig-cor); }
.marca.wa.mono { background-image: var(--marca-wa-mono); }
.marca.ig.mono { background-image: var(--marca-ig-mono); }
/* Fundo escuro fixo, que não muda com o tema (barra verde do celular, herói azul-marinho): mono branco. */
.marca-fundo-escuro { --marca-wa-mono: var(--marca-wa-branco); --marca-ig-mono: var(--marca-ig-branco); }