/* ===========================================================================
   TEMAS — escuro, rosa e vidro (28/09/2026)
   ---------------------------------------------------------------------------
   Plano: `planos/2026-09-28-temas.md`. Decisão e contrastes medidos:
   `docs/design-system/README.md` §01, "Temas".

   O tema vem do servidor em `<html data-theme="…">` (`base.html`, lido do
   perfil da conta). Sem atributo, ou com `claro`, vale o `:root` de sempre —
   `gabinete.css` (`--g-*`), `custom.css` (`--nb-*`) e `chat.css` (`--chat-*`).
   Aqui só se REDEFINEM tokens; nenhuma regra de componente mora neste arquivo,
   a não ser o que o vidro exige (fundo e desfoque), no fim.

   ⚠️ Fora do `gabinete.css` de propósito: `tests/test_paleta.py` lê aquele
   arquivo inteiro e a última ocorrência de cada token vence — um bloco de tema
   lá dentro faria o teste medir o tema errado. Os pisos de cada tema são
   conferidos por `test_paleta.py` a partir DESTE arquivo.

   ⚠️ Landing e login (`--l-*`) não entram: são outra linguagem, e o
   `base.html` não põe o atributo nelas.
   =========================================================================== */

/* ── Escuro ───────────────────────────────────────────────────────────────
   Papel grafite (não preto: #000 com texto claro vibra e cansa), tinta clara,
   e o azul da ação UM degrau mais claro para o botão se destacar do fundo — o
   rótulo continua branco (5,63:1). O link vira azul claro (8,1:1). Verde,
   vermelho e âmbar sobem de luminosidade para passar 4,5 como texto; por isso
   o texto SOBRE eles cheios passa a ser tinta escura (`--g-sobre-cor`). */
:root[data-theme="escuro"] {
    color-scheme: dark;

    --g-papel:       #16181B;
    --g-pergaminho:  #1D2024;
    --g-linha:       #2B2F35;
    --g-linha-forte: #3D4249;
    --g-controle:    #7D848C;
    --g-tinta:       #E9EAEB;
    --g-tinta-70:    #C9CCD0;
    --g-tenue:       #A3A9B0;
    --g-fraco:       #737A83;
    --g-marca:       #3563C4;
    --g-marca-texto: #FFFFFF;
    --g-marca-forte: #2A509F;
    --g-ativo:       #23304A;
    --g-link:        #94B4F5;
    --g-aviso:       #3D3416;
    --g-ok:          #4DC48B;
    --g-erro:        #F07B6F;
    --g-atencao:     #E6A657;
    --g-prio-normal: #DDAA2E;
    --g-t-minuta:    #DDAA2E;
    --g-t-despacho:  #7D9CEC;
    --g-t-decisao:   #A98AEB;
    --g-t-sentenca:  #E67CA1;
    --g-t-relatorio: #40B9C7;
    --g-cor-5:       #F07B6F;
    --g-cor-7:       #EA8B5B;
    --g-cor-8:       #93A6B8;
    --g-cor-9:       #C58E68;

    --g-tinta-rgb:   233, 234, 235;
    --g-sombra-rgb:  0, 0, 0;
    --g-sobre-cor:   #111010;
    --g-sobre-ambar: #111010;
    --g-inverso:     #FFFFFF;
    --g-erro-fundo:  #3A1E1C;
    --g-erro-fio:    #7A3A35;
    --g-ok-fundo:    #16291F;
    --g-ok-fio:      #2F6B4E;
    --g-aviso-fundo: #2F2816;
    --g-aviso-fio:   #6B5A2E;
    --g-rolagem:     #5C636B;
    --g-rolagem-forte: #9AA0A7;
    /* v3 · a mesa e a superfície (29/09/2026) */
    --g-mesa:        #101215;
    --g-borda:       #2B2F35;
    --g-borda-botao: #4A5058;

    /* As telas avulsas e a navbar (neobrutalismo do `custom.css`). */
    --nb-bg:        #1D2024;
    --nb-bg-alt:    #16181B;
    --nb-bg-grid:   #2B2F35;
    --nb-ink:       #E9EAEB;
    --nb-muted:     #A3A9B0;
    --nb-primary:       #3563C4;
    --nb-primary-texto: #FFFFFF;
    --nb-primary-d:     #94B4F5;
    --nb-primary-claro: #23304A;
    --nb-aviso:         #3D3416;
    /* Os pastéis do neobrutalismo são FUNDO com a tinta por cima (callout,
       badge, botão, cartão): no escuro viram tons fechados, e a tinta clara
       passa de 7:1 em todos. O vermelho levava texto de papel; aqui leva a
       tinta (`--nb-sobre-vermelho`). */
    --nb-blue:      #25406E;
    --nb-pink:      #5C2442;
    --nb-green:     #1F4D2E;
    --nb-red:       #6E2828;
    --nb-purple:    #3F3066;
    --nb-cyan:      #1B4C55;
    --nb-orange:    #5E3A14;
    --nb-sobre-vermelho: #E9EAEB;

    /* O que o chat tem de próprio (o resto são apelidos de `--g-*`). */
    --chat-pasta-petroleo: #4FB4AC;
    --chat-pasta-ocre:     #DBA14B;
    --chat-pasta-indigo:   #7BA8F1;
    --chat-pasta-violeta:  #B37CE1;
    --chat-pasta-musgo:    #6DCC56;
    --chat-pasta-tijolo:   #DA8171;
}

/* ── Rosa ─────────────────────────────────────────────────────────────────
   Decisão do dono (28/09/2026): fundo rosa clarinho E a ação em rosa. A ação
   é rosa ESCURO porque o rótulo é branco (6,21:1); um rosa claro com texto
   branco não passaria de 2:1. Tinta, estados e cores de dado continuam os do
   claro — só a família do papel e da ação muda de matiz. */
:root[data-theme="rosa"] {
    --g-papel:       #FFF8FB;
    --g-pergaminho:  #FDEFF4;
    --g-linha:       #F2DAE4;
    --g-linha-forte: #E3C1CF;
    --g-controle:    #9B7C8A;
    --g-tinta:       #261019;
    --g-tinta-70:    #4A2D3A;
    --g-tenue:       #7A5264;
    --g-fraco:       #94727F;
    --g-marca:       #AD2F68;
    --g-marca-texto: #FFFFFF;
    --g-marca-forte: #8A2253;
    --g-ativo:       #FAE2EC;
    --g-link:        #A12C61;

    --g-tinta-rgb:   38, 16, 25;
    --g-sombra-rgb:  38, 16, 25;
    --g-rolagem:     #94727F;
    --g-rolagem-forte: #4A2D3A;
    /* v3 · a mesa e a superfície (29/09/2026) */
    --g-mesa:        #F8EDF2;
    --g-borda:       #EFD5E0;
    --g-borda-botao: #D9B3C3;

    --nb-bg:        #FDEFF4;
    --nb-bg-alt:    #FFF8FB;
    --nb-bg-grid:   #F2DAE4;
    --nb-ink:       #261019;
    --nb-muted:     #7A5264;
    --nb-primary:       #AD2F68;
    --nb-primary-texto: #FFFFFF;
    --nb-primary-d:     #8A2253;
    --nb-primary-claro: #F2C6D8;

    --chat-pasta-musgo: #2F8A19;
}

/* ── Vidro ────────────────────────────────────────────────────────────────
   Decisão do dono (28/09/2026): fundo em degradê suave azul/lilás e painéis
   translúcidos com desfoque. EXCEÇÃO NOMEADA da regra 5 do design system (sem
   gradiente, sem transparência) — registrada no README §01, "Temas". O canto
   continua reto, a tinta e a ação continuam as do claro.
   ⚠️ Os contrastes são medidos com o papel COMPOSTO sobre `--g-vidro-ref`, o
   ponto mais escuro do degradê (`tests/test_temas.py`): texto sobre vidro é
   texto sobre o que estiver atrás. */
:root[data-theme="vidro"] {
    --g-vidro-ref:   #D3DAEE;
    --g-papel:       rgba(255, 255, 255, 0.62);
    --g-pergaminho:  rgba(255, 255, 255, 0.48);
    --g-ok:          #08703C;   /* um degrau abaixo: sobre o vidro o #0A7C43 cai a 4,3 */
    --g-atencao:     #985300;   /* idem: o #A65B00 cai a 4,3 (4,97 aqui) */
    --g-linha:       rgba(38, 74, 151, 0.14);
    --g-linha-forte: rgba(38, 74, 151, 0.26);
    --g-ativo:       rgba(38, 74, 151, 0.10);
    --g-fraco:       #6E7176;   /* o #85878A cai abaixo de 3:1 no ativo translúcido */
    --g-controle:    #6E7176;
    --g-aviso-fundo: rgba(253, 248, 239, 0.85);
    --g-erro-fundo:  rgba(253, 241, 241, 0.85);
    --g-ok-fundo:    rgba(240, 247, 244, 0.85);
    /* v3: a mesa é o próprio degradê; a superfície é o papel translúcido */
    --g-mesa:        transparent;
    --g-borda:       rgba(38, 74, 151, 0.18);
    --g-borda-botao: rgba(38, 74, 151, 0.34);

    --nb-bg:        transparent;
    --nb-bg-alt:    rgba(255, 255, 255, 0.62);
    --nb-bg-grid:   rgba(38, 74, 151, 0.10);

    background:
        radial-gradient(55vw 55vw at 8% 0%, rgba(38, 74, 151, 0.30), transparent 62%),
        radial-gradient(48vw 48vw at 96% 12%, rgba(141, 110, 214, 0.28), transparent 62%),
        radial-gradient(60vw 60vw at 55% 105%, rgba(64, 185, 199, 0.22), transparent 62%),
        linear-gradient(135deg, #E7ECF8 0%, #EFE9F8 55%, #E6F1F4 100%);
    background-attachment: fixed;
    min-height: 100%;
}
/* O corpo deixa o degradê aparecer: as três famílias pintavam o body opaco. */
:root[data-theme="vidro"] body,
:root[data-theme="vidro"] body.is-gabinete,
:root[data-theme="vidro"] body.is-chat {
    background: transparent;
    background-image: none;
}
/* Os painéis que ficam por cima do que rola: é aqui que o desfoque se vê. */
:root[data-theme="vidro"] :is(.navbar-docsmart, .gab-lateral, .chat-lateral,
        .chat-topo, .chat-composer__caixa) {
    -webkit-backdrop-filter: blur(18px) saturate(1.4);
    backdrop-filter: blur(18px) saturate(1.4);
}
/* Camadas flutuantes: quase opacas. Um menu a 62% sobre um parágrafo deixaria
   as duas escritas uma sobre a outra — o desfoque apaga a de trás. */
:root[data-theme="vidro"] :is(dialog, .dropdown-menu, .modal-content,
        .chat-nova__menu, .chat-mover, .chat-modelo-pop, .chat-paleta,
        .chat-doc__erro, .tar-menu__corpo, .tar-etq__pop, .tar-previa,
        .tar-janela, .minuta-pop, .tri-visor, .t4-janela, .t4-menu__lista, .ws-jan) {
    --g-papel: rgba(255, 255, 255, 0.90);
    --chat-papel: rgba(255, 255, 255, 0.90);
    --g-pergaminho: rgba(255, 255, 255, 0.80);
    --chat-pergaminho: rgba(255, 255, 255, 0.80);
    -webkit-backdrop-filter: blur(22px) saturate(1.3);
    backdrop-filter: blur(22px) saturate(1.3);
}

/* ── A marca do cabeçalho ─────────────────────────────────────────────────
   A horizontal tem as letras PRETAS e some no escuro (`_marca.html`). O macro
   põe as duas versões; fora do escuro a de letras claras nem aparece. */
.marca__img--escuro { display: none; }
:root[data-theme="escuro"] .marca__img--claro  { display: none; }
:root[data-theme="escuro"] .marca__img--escuro { display: inline-block; }