/* Aki · material limpo compartilhado pela PWA e pelas WebViews.
   Uma tintura escura de 40%; o brilho pertence exclusivamente à moldura.
   Nenhum filtro amostra ou deforma o conteúdo atrás das superfícies. */
html:root[data-tema] {
  --lente-luz: 255 240 205;
  --lente-brilho: rgb(var(--lente-luz) / .17);
  --lente-aresta: rgb(var(--lente-luz) / .38);
  --material-limpo: rgb(12 10 7 / .40);
  --lente-base: var(--material-limpo);
  --lente-controle: var(--material-limpo);
  --lente-janela: var(--material-limpo);
  --janela-sombra-texto: 0 1px 2px #000e, 1px 0 #000d, -1px 0 #000d, 0 -1px #000d;
  --lente-sombra: 0 12px 28px -18px #000c;
  --lente-relevo: inset 0 1px 1px var(--lente-aresta), inset 1px 0 0 rgb(var(--lente-luz) / .08), inset 0 -1px 1px #0005;
  --lente-reflexo: linear-gradient(transparent, transparent);
  --vidro-grad: var(--lente-base);
  --imperial-painel: var(--vidro-grad);
  --vidro-sombra: var(--lente-relevo), var(--lente-sombra);
  --barra-cristal: var(--material-limpo);
  --barra-material: none;
  --menu-cristal: var(--vidro-grad);
  --janela-fundo: var(--lente-janela);
  --janela-cristal-legivel: var(--janela-fundo);
  --janela-barra: transparent;
  --janela-material: none;
  --janela-material-legivel: none;
  --controle-fundo: var(--material-limpo);
}
html:root[data-tema="claro"] {
  /* O ouro do texto precisa de mais contraste sobre a tintura escura.
     O metal espelhado da borda mantém sua paleta bronze/champanhe. */
  --metal-texto: #2a1c08;
  --controle-tinta: #241c12;
  --tinta-2: #241c12;
  --tinta-mudo: #241c12;
  --lente-luz: 255 255 250;
  --lente-brilho: rgb(var(--lente-luz) / .65);
  --lente-aresta: #fffff4;
  --janela-sombra-texto: 0 1px 1px #fff9;
  --lente-sombra: 0 12px 28px -18px #72532266;
  --lente-relevo: inset 0 1px 1px var(--lente-aresta), inset 1px 0 0 #fff8, inset 0 -1px 1px #86652b33;
}
/* Relevo e Pérola conservam o metal mais espesso dos temas originais. */
html:root:is([data-acabamento="relevo"], [data-acabamento="perola"]) { --lente-aresta: rgb(var(--lente-luz) / .7); }
/* Mantém o contrato dos controles sem lançar luz sobre o seu interior. */
html:root[data-tema] :is(.botao, .botao-icone, .pilula, .bento-bloco, .cartao-clique,
  .nav-item, .nav-mais-destino, .iamac-ia) {
  --lente-reflexo: linear-gradient(transparent, transparent);
  --vidro-grad: var(--lente-base);
}

/* Conteúdo: espessura e luz sem uma superfície de desfoque por item da lista. */
html:root[data-tema] :is(.cartao, .vidro, .bento-bloco, .entrada-cartao, .aj-grupo,
  .notebook-fontes, .ia-lab-chat, .resultado-painel, .anamnese-secao, .admin-bloco) {
  background: var(--vidro-grad);
  box-shadow: var(--vidro-sombra);
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
html:root[data-tema] .bento-destaque { background: var(--material-limpo); color: var(--metal-texto); }
html:root[data-tema] .bento-destaque :is(.bento-mini, .bento-sub, p) { color: var(--metal-texto); }
/* Substitui a varredura automática por um reflexo que responde à interação. */
html:root[data-tema] .bento-destaque::before { display: none; }
html:root[data-tema] :is(.bento-bloco, .nav-inferior, .topo-monograma)::after { animation: none; }

/* Navegação e ferramentas usam a mesma tintura dos cartões. */
html:root[data-tema] :is(.nav-inferior, .chat-entrada, .voz-doca, .voz-barra,
  .grav-pilula, .grav-player, .leitor-topo, .leitor-ferramentas, .leitor-barra-extra,
  .leitor-lateral, .leitor-texto-barra, .leitor-selbar, .trabalho-grupos,
  .trabalho-contexto > summary, .pdf-edit-status, .apr-status, .pagina-abas:not(.materiais-abas),
  .esc-topo, .esc-barra, .esc-dock, .esc-flutuante, .pdf-edit-topo, .pdf-edit-ferramentas,
  .pdf-edit-navegacao, .apr-topo, .apr-ferramentas, .cartao.midia) {
  background: var(--barra-cristal);
  box-shadow: var(--lente-relevo), var(--lente-sombra);
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
html:root[data-tema] .topo.topo-compacto {
  background: var(--vidro-grad);
  box-shadow: inset 0 -1px 0 var(--borda);
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
html:root[data-tema] .nav-marcador { background: var(--lente-reflexo), var(--acento-tinto); box-shadow: var(--lente-relevo); }

/* Contrôles: luz por dentro do vidro. Estados semânticos (gravar, erro,
   seleção e destruição) mantêm suas próprias cores e não recebem este fundo. */
html:root[data-tema] :is(.botao-fantasma:not(.botao-perigo),
  .botao-icone:not(.ouvindo):not(.ligado):not(.ativo):not(.chat-enviar):not(.chat-voz),
  .pilula:not(.ativa), .nav-mais-destino, .iamac-ia, .iamac-sel,
  .pdf-edit-dialog .botao:not(.pdf-edit-primario):not(.botao-perigo):not([aria-pressed="true"]),
  .leitor-opt:not(.ativa), .leitor-extra-btn:not(.ligado)) {
  background: var(--lente-controle);
  color: var(--controle-tinta);
  box-shadow: var(--lente-relevo), 0 4px 10px -8px #0008;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
html:root[data-tema] .botao:not(.botao-fantasma):not(.botao-perigo) {
  background: var(--lente-controle); color: var(--metal-texto);
  box-shadow: var(--lente-relevo), 0 6px 16px -10px #9b743b80;
}
html:root[data-tema] :is(.pilula.ativa, .leitor-opt.ativa) { box-shadow: var(--lente-relevo), inset 0 0 0 1px var(--metal-texto); }
html:root[data-tema] :is(input, textarea, select):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]) {
  box-shadow: inset 0 1px 3px #0002, inset 0 -1px 0 rgb(var(--lente-luz) / .13);
}
html:root[data-tema] :is(input, textarea, select):focus-visible { outline: 2px solid var(--foco); outline-offset: 3px; }
html:root[data-tema] :is(.botao, .botao-icone, .pilula, .nav-mais-destino):disabled { box-shadow: none; }

/* Janelas limpas: apenas tintura leve. Conteúdo atrás permanece nítido e
   geometricamente intacto; o metal delimita o primeiro plano. */
html:root[data-tema] #camada-modal:not(:empty) {
  background: #0000000a; -webkit-backdrop-filter: none; backdrop-filter: none; animation: none;
}
html:root[data-tema="claro"] #camada-modal:not(:empty) { background: #00000005; }
html:root[data-tema] :is(.modal.modal, .menu-ctx, .apr-folha, .esc-menu, .toast,
  .pdf-edit-form-dialog, .apr-form-dialog, .iamac-permissoes-globais .iamac-permissao) {
  background: var(--janela-fundo);
  box-shadow: var(--lente-relevo), 0 24px 60px -20px #0009;
  -webkit-backdrop-filter: none; backdrop-filter: none;
  text-shadow: var(--janela-sombra-texto);
}
html:root[data-tema] .modal > :is(.modal-cab, .modal-acoes) {
  background: var(--janela-barra);
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
html:root[data-tema] .modal :is(.cartao, .vidro, .aj-grupo, .aj-nav,
  .menu-acoes-lista, .aj-sobre, .notebook-fontes, .add-formato) {
  background: transparent; box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
html:root[data-tema] .menu-ctx-camada { background: #0000000a; -webkit-backdrop-filter: none; backdrop-filter: none; }
html:root[data-tema] :is(.pdf-edit-form-dialog, .apr-form-dialog, .apr-folha)::backdrop {
  background: #0000000a; -webkit-backdrop-filter: none; backdrop-filter: none;
}
/* O título usa o material da janela, sem uma placa separada atrás das letras. */
html:root[data-tema] .modal.modal :is(h2, .mudo, .traco-titulo, .traco-perfil-atual) { background: none; box-shadow: none; }
html:root[data-tema] .modal.modal .modal-cab h2 { color: var(--metal-texto); padding: 0; }
html:root[data-tema] .modal.modal p:not(.mudo) { font-weight: 550; line-height: 1.6; }

/* Contrato global do acabamento: inclui pseudo-elementos e backdrops de
   diálogos. !important impede que variantes legadas reativem blur/refração. */
html:root[data-tema] body,
html:root[data-tema] body *,
html:root[data-tema] body *::before,
html:root[data-tema] body *::after,
html:root[data-tema] dialog::backdrop {
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
/* Painéis secundários também participam do material; papéis de documentos,
   páginas do editor, canvas, imagens e vídeo conservam suas cores de conteúdo. */
html:root[data-tema] :is(.aj-nav, .aj-sobre, .menu-acoes-lista, .ia-perguntar,
  .gravacao-flutuante, .leitor-sair-modo, .leitor-mostrar-interface,
  .grav-cartao, .grav-detalhes, .voz-conversa-motor, .apr-ensaio-cartao,
  .iamac-quadro, .iamac-permissao, .iamac-contexto, .sim-painel, .entrada-secao) {
  background: var(--lente-base);
}
/* A hierarquia da ação passa pelo ouro do rótulo e da borda; o interior
   continua transparente. Estados de erro/gravação/seleção ficam identificáveis. */
html:root[data-tema] :is(.menu-acao, .menu-ctx-item, .esc-btn, .leitor-btn,
  .pagina-abas .pilula, .nav-item .nav-icone, .trabalho-grupos button,
  .grav-pilula-btn, .grav-pular, .grav-play, .voz-barra button,
  .chat-enviar, .chat-voz, .ia-perguntar-enviar, .sim-botao, .sim-aba, .icn-item, .icn-seg button,
  .controle-trilho .trilho-seta, .leitor-pdf-abrir) {
  background: var(--lente-controle);
  color: var(--controle-tinta);
}
html:root[data-tema] :is(.botao, .pilula, .menu-acao, .menu-ctx-item,
  .esc-btn, .leitor-btn, .sim-botao, .icn-item, .trabalho-grupos button):is(
  .ativa, .ativo, .ligado, [aria-pressed="true"], [aria-selected="true"]) {
  color: var(--metal-texto); border-color: var(--metal-texto);
  box-shadow: inset 0 0 0 1px var(--metal-texto);
}
html:root[data-tema] :is(.botao-perigo, .menu-acao.perigo, .menu-ctx-item.perigo) { color: var(--erro-tinta); }
html:root[data-tema] :is(.chat-voz.ouvindo, .voz-campo-mic.ativo, .grav-pilula-parar,
  .voz-barra-parar) { background: var(--critico); color: #fff; }
html:root[data-tema] :is(.cartao, .vidro, .bento-bloco, .aj-grupo, .aj-nav,
  .entrada-cartao, .notebook-fontes, .ia-lab-chat, .resultado-painel,
  .anamnese-secao, .admin-bloco, .nav-inferior, .chat-entrada, .voz-doca,
  .leitor-topo, .leitor-ferramentas, .leitor-lateral, button, input, textarea, select) {
  text-shadow: var(--janela-sombra-texto);
}
/* Uma janela já é uma superfície; seus agrupadores permanecem vazados. */
html:root[data-tema] .modal :is(.aj-nav, .aj-sobre, .menu-acoes-lista) { background: transparent; }

@media (hover: hover) and (pointer: fine) {
  html:root[data-tema] :is(.botao-fantasma:not(.botao-perigo), .botao-icone, .pilula:not(.ativa), .cartao-clique):not(:disabled):hover { --lente-brilho: rgb(var(--lente-luz) / .26); }
  html:root[data-tema="claro"] :is(.botao-fantasma, .botao-icone, .pilula, .cartao-clique):hover { --lente-brilho: rgb(var(--lente-luz) / .8); }
}
/* Sem movimentos perpétuos de metal ou luz. Resposta curta ao pressionar;
   não altera transform (usado no posicionamento dos controles flutuantes). */
@media (prefers-reduced-motion: no-preference) {
  html:root[data-tema] :is(.botao, .botao-icone, .pilula, .nav-mais-destino):not(:disabled):active { filter: brightness(1.1); }
}
html:root[data-tema] body::before { animation: none; }

/* Preferências explícitas de acessibilidade mantêm a alternativa sólida. */
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more), (forced-colors: active) {
  html:root[data-tema] {
    --material-limpo: var(--superficie);
    --lente-base: var(--superficie); --lente-controle: var(--superficie-2);
    --lente-janela: var(--superficie); --lente-reflexo: linear-gradient(transparent, transparent);
    --barra-cristal: var(--superficie); --controle-fundo: var(--superficie);
  }
  html:root[data-tema] :is(.botao, .botao-icone, .pilula, .bento-bloco, .cartao-clique,
    .nav-item, .nav-mais-destino, .iamac-ia) { --lente-reflexo: linear-gradient(transparent, transparent); }
  html:root[data-tema] :is(.nav-inferior, .chat-entrada, .voz-doca, .voz-barra, .grav-pilula,
    .grav-player, .leitor-topo, .leitor-ferramentas, .leitor-barra-extra, .leitor-lateral,
    .leitor-texto-barra, .leitor-selbar, .trabalho-grupos, .trabalho-contexto > summary,
    .pdf-edit-status, .apr-status, .pagina-abas, .esc-topo, .esc-barra, .esc-dock, .esc-flutuante,
    .pdf-edit-topo, .pdf-edit-ferramentas, .pdf-edit-navegacao, .apr-topo, .apr-ferramentas,
    .cartao.midia, .topo.topo-compacto, .modal.modal, .menu-ctx, .apr-folha, .esc-menu, .toast) {
    -webkit-backdrop-filter: none; backdrop-filter: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  html:root[data-tema] :is(.bento-bloco, .botao, .botao-icone, .pilula, .nav-marcador, .modal, .topo) { transition: none; animation: none; }
}
@media (forced-colors: active) {
  html:root[data-tema] :is(.cartao, .bento-bloco, .botao, .botao-icone, .pilula, .modal, .nav-inferior) { border: 1px solid ButtonText; }
  html:root[data-tema] .nav-inferior::before { display: none; }
}
