/* ============================================================================
   temas.css — Sistema de Temas Visuais · Sarti e Izidio
   ----------------------------------------------------------------------------
   FUNDAÇÃO (Fase 1) — 100% ADITIVO. O visual atual NÃO muda enquanto o
   usuário não escolher outro tema (ou o modo noite).

   ARQUITETURA
   - Design tokens com prefixo --t- definidos em :root (tema padrão =
     azul-imperial DIA = exatamente as cores atuais do sistema).
   - Cada tema:  html[data-tema="<id>"]                → versão DIA
                 html[data-tema="<id>"][data-modo="noite"] → versão NOITE
   - TODO tema possui versão dia e noite (10 temas × 2 modos = 20 paletas).
   - O bloco de OVERRIDES no final só se aplica sob a GUARDA:
         html:is([data-tema]:not([data-tema="azul-imperial"]),
                 [data-tema][data-modo="noite"])
     ou seja: tema diferente do padrão OU modo noite. Sem atributo (ou
     azul-imperial dia) nada deste arquivo altera o visual.
   - tema.js aplica/remove os atributos e persiste a escolha
     (localStorage + api_preferencias.php, chave tema_visual).

   TOKENS
   --t-top-grad        gradiente do menu/topo
   --t-on-top          texto sobre o topo
   --t-top-menu        fundo dos dropdowns do menu de topo (cor sólida)
   --t-primary         cor institucional (links/realces estruturais)
   --t-accent          cor de ação (botões primários, foco)
   --t-on-accent       texto sobre o acento
   --t-bg              fundo geral da página
   --t-surface         cartões / painéis
   --t-surface-2       superfície secundária (linhas zebradas, hover)
   --t-text            texto principal
   --t-muted           texto secundário
   --t-border          bordas e divisórias sólidas
   --t-divider-dotted  cor da divisória pontilhada
   --t-success / --t-warning / --t-danger
   --t-shadow          cor de sombra (com alpha)
   ========================================================================== */

/* ============================ TEMA PADRÃO =================================
   1. AZUL IMPERIAL — DIA (cores atuais do sistema, intocadas) */
:root {
    --t-top-grad: linear-gradient(90deg, #172554 0%, #1e40af 100%);
    --t-on-top: #ffffff;
    --t-top-menu: #1e3a8a;
    --t-primary: #1e40af;
    --t-accent: #4f46e5;
    --t-on-accent: #ffffff;
    --t-bg: #f8f9fa;
    --t-surface: #ffffff;
    --t-surface-2: #f1f5f9;
    --t-text: #212529;
    --t-muted: #6c757d;
    --t-border: #dee2e6;
    --t-divider-dotted: #94a3b8;
    --t-success: #16a34a;
    --t-warning: #f59e0b;
    --t-danger: #dc2626;
    --t-shadow: rgba(15, 23, 42, .10);
}

/* ===== 1. AZUL IMPERIAL ===== */
html[data-tema="azul-imperial"] {
    --t-top-grad: linear-gradient(90deg, #172554 0%, #1e40af 100%);
    --t-on-top: #ffffff;
    --t-top-menu: #1e3a8a;
    --t-primary: #1e40af;
    --t-accent: #4f46e5;
    --t-on-accent: #ffffff;
    --t-bg: #f8f9fa;
    --t-surface: #ffffff;
    --t-surface-2: #f1f5f9;
    --t-text: #212529;
    --t-muted: #6c757d;
    --t-border: #dee2e6;
    --t-divider-dotted: #94a3b8;
    --t-success: #16a34a;
    --t-warning: #f59e0b;
    --t-danger: #dc2626;
    --t-shadow: rgba(15, 23, 42, .10);
}
html[data-tema="azul-imperial"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #0b1228 0%, #16275c 100%);
    --t-on-top: #e2e8f0;
    --t-top-menu: #16224a;
    --t-primary: #8fb0f5;
    --t-accent: #818cf8;
    --t-on-accent: #0b1228;
    --t-bg: #0f172a;
    --t-surface: #1e293b;
    --t-surface-2: #273548;
    --t-text: #e2e8f0;
    --t-muted: #94a3b8;
    --t-border: #334155;
    --t-divider-dotted: #64748b;
    --t-success: #34d399;
    --t-warning: #fbbf24;
    --t-danger: #f87171;
    --t-shadow: rgba(0, 0, 0, .45);
}

/* ===== 2. GRAFITE & OURO =====
   Acento dourado recebe texto ESCURO (--t-on-accent) por contraste AA:
   #b08d2f com branco dá ~3.1:1 (reprova); com #231d10 dá >5:1. */
html[data-tema="grafite-ouro"] {
    --t-top-grad: linear-gradient(90deg, #0f1115 0%, #1f2430 100%);
    --t-on-top: #f5f0e6;
    --t-top-menu: #1c212c;
    --t-primary: #1f2430;
    --t-accent: #b08d2f;
    --t-on-accent: #231d10;
    --t-bg: #faf9f6;
    --t-surface: #ffffff;
    --t-surface-2: #f3f1ea;
    --t-text: #1c1917;
    --t-muted: #78716c;
    --t-border: #e7e2d8;
    --t-divider-dotted: #b08d2f;
    --t-success: #3f6212;
    --t-warning: #b45309;
    --t-danger: #b91c1c;
    --t-shadow: rgba(28, 25, 23, .10);
}
html[data-tema="grafite-ouro"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #08090c 0%, #13161d 100%);
    --t-on-top: #f0e9d8;
    --t-top-menu: #14171f;
    --t-primary: #d2ab4a;
    --t-accent: #d2ab4a;
    --t-on-accent: #14120a;
    --t-bg: #111317;
    --t-surface: #191c22;
    --t-surface-2: #21252d;
    --t-text: #e9e4d8;
    --t-muted: #a09a8c;
    --t-border: #2d313a;
    --t-divider-dotted: #b08d2f;
    --t-success: #a3c054;
    --t-warning: #e3b34d;
    --t-danger: #ef8e8e;
    --t-shadow: rgba(0, 0, 0, .50);
}

/* ===== 3. VERDE JURISTA ===== */
html[data-tema="verde-jurista"] {
    --t-top-grad: linear-gradient(90deg, #052e21 0%, #065f46 100%);
    --t-on-top: #ecfdf5;
    --t-top-menu: #075940;
    --t-primary: #065f46;
    --t-accent: #0a7d57;
    --t-on-accent: #ffffff;
    --t-bg: #f5faf8;
    --t-surface: #ffffff;
    --t-surface-2: #ebf4f0;
    --t-text: #0f1f1a;
    --t-muted: #5f7a70;
    --t-border: #dbe9e3;
    --t-divider-dotted: #34d399;
    --t-success: #0a7d57;
    --t-warning: #d97706;
    --t-danger: #b91c1c;
    --t-shadow: rgba(6, 38, 28, .10);
}
html[data-tema="verde-jurista"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #021712 0%, #053829 100%);
    --t-on-top: #d8f5e8;
    --t-top-menu: #06382b;
    --t-primary: #34d399;
    --t-accent: #2fc08c;
    --t-on-accent: #04261c;
    --t-bg: #0b1512;
    --t-surface: #122019;
    --t-surface-2: #1a2b22;
    --t-text: #d9efe5;
    --t-muted: #8fb0a3;
    --t-border: #28433a;
    --t-divider-dotted: #34d399;
    --t-success: #34d399;
    --t-warning: #fbbf24;
    --t-danger: #f87171;
    --t-shadow: rgba(0, 0, 0, .50);
}

/* ===== 4. BORDÔ TRADIÇÃO ===== */
html[data-tema="bordo-tradicao"] {
    --t-top-grad: linear-gradient(90deg, #3b0d18 0%, #6d1a36 100%);
    --t-on-top: #fdf2f4;
    --t-top-menu: #5c1830;
    --t-primary: #6d1a36;
    --t-accent: #b3593a;
    --t-on-accent: #ffffff;
    --t-bg: #faf7f5;
    --t-surface: #ffffff;
    --t-surface-2: #f4ecea;
    --t-text: #27141a;
    --t-muted: #8a6b70;
    --t-border: #ecdfdb;
    --t-divider-dotted: #c08457;
    --t-success: #4d7c0f;
    --t-warning: #b45309;
    --t-danger: #b91c1c;
    --t-shadow: rgba(60, 13, 24, .10);
}
html[data-tema="bordo-tradicao"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #1c060c 0%, #42101f 100%);
    --t-on-top: #f7dfe3;
    --t-top-menu: #3a0f1d;
    --t-primary: #d98a66;
    --t-accent: #d98a66;
    --t-on-accent: #2a0d12;
    --t-bg: #181014;
    --t-surface: #23161b;
    --t-surface-2: #2d1e23;
    --t-text: #f0dfe1;
    --t-muted: #b39299;
    --t-border: #422f35;
    --t-divider-dotted: #c08457;
    --t-success: #a3c463;
    --t-warning: #e0a93f;
    --t-danger: #f48b8b;
    --t-shadow: rgba(0, 0, 0, .50);
}

/* ===== 5. PETRÓLEO MODERNO ===== */
html[data-tema="petroleo-moderno"] {
    --t-top-grad: linear-gradient(90deg, #062a30 0%, #0f5e5a 100%);
    --t-on-top: #e6fffb;
    --t-top-menu: #0b4a47;
    --t-primary: #0f5e5a;
    --t-accent: #0d7a72;
    --t-on-accent: #ffffff;
    --t-bg: #f4fafa;
    --t-surface: #ffffff;
    --t-surface-2: #e9f3f2;
    --t-text: #042f2e;
    --t-muted: #5d7a78;
    --t-border: #d6e7e6;
    --t-divider-dotted: #2dd4bf;
    --t-success: #0d7a72;
    --t-warning: #d97706;
    --t-danger: #b91c1c;
    --t-shadow: rgba(4, 47, 46, .10);
}
html[data-tema="petroleo-moderno"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #03161a 0%, #093a38 100%);
    --t-on-top: #ccf7f0;
    --t-top-menu: #0a3a38;
    --t-primary: #2dd4bf;
    --t-accent: #2dd4bf;
    --t-on-accent: #04201f;
    --t-bg: #0a1517;
    --t-surface: #101f21;
    --t-surface-2: #17292b;
    --t-text: #d7eeec;
    --t-muted: #87a7a4;
    --t-border: #24403f;
    --t-divider-dotted: #2dd4bf;
    --t-success: #34d399;
    --t-warning: #fbbf24;
    --t-danger: #f87171;
    --t-shadow: rgba(0, 0, 0, .50);
}

/* ===== 6. EXECUTIVO PRATA ===== */
html[data-tema="executivo-prata"] {
    --t-top-grad: linear-gradient(90deg, #0f172a 0%, #1e293b 100%);
    --t-on-top: #f1f5f9;
    --t-top-menu: #1b2535;
    --t-primary: #1e293b;
    --t-accent: #475569;
    --t-on-accent: #ffffff;
    --t-bg: #f8fafc;
    --t-surface: #ffffff;
    --t-surface-2: #eef2f6;
    --t-text: #0f172a;
    --t-muted: #64748b;
    --t-border: #e2e8f0;
    --t-divider-dotted: #94a3b8;
    --t-success: #15803d;
    --t-warning: #b45309;
    --t-danger: #b91c1c;
    --t-shadow: rgba(15, 23, 42, .08);
}
html[data-tema="executivo-prata"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #080c14 0%, #111827 100%);
    --t-on-top: #e5e9f0;
    --t-top-menu: #111827;
    --t-primary: #94a3b8;
    --t-accent: #94a3b8;
    --t-on-accent: #0f172a;
    --t-bg: #0e131a;
    --t-surface: #161c25;
    --t-surface-2: #1f2630;
    --t-text: #e2e8f0;
    --t-muted: #8b97a8;
    --t-border: #2b3441;
    --t-divider-dotted: #64748b;
    --t-success: #34d399;
    --t-warning: #fbbf24;
    --t-danger: #f87171;
    --t-shadow: rgba(0, 0, 0, .50);
}

/* ===== 7. COURO & PERGAMINHO ===== */
html[data-tema="couro-pergaminho"] {
    --t-top-grad: linear-gradient(90deg, #3e2723 0%, #5d4037 100%);
    --t-on-top: #f8f1e7;
    --t-top-menu: #4e352d;
    --t-primary: #5d4037;
    --t-accent: #8d6e63;
    --t-on-accent: #ffffff;
    --t-bg: #faf6ef;
    --t-surface: #fffdf9;
    --t-surface-2: #f4ede1;
    --t-text: #2d211c;
    --t-muted: #8a7468;
    --t-border: #eadfd2;
    --t-divider-dotted: #a1887f;
    --t-success: #558b2f;
    --t-warning: #c77700;
    --t-danger: #b3402e;
    --t-shadow: rgba(62, 39, 35, .10);
}
html[data-tema="couro-pergaminho"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #1b110d 0%, #33231d 100%);
    --t-on-top: #f3e7d3;
    --t-top-menu: #30201a;
    --t-primary: #bc9a83;
    --t-accent: #bc9a83;
    --t-on-accent: #241712;
    --t-bg: #16100d;
    --t-surface: #201813;
    --t-surface-2: #2a2019;
    --t-text: #ecdfcd;
    --t-muted: #ab9583;
    --t-border: #3b2f26;
    --t-divider-dotted: #a1887f;
    --t-success: #a0c46a;
    --t-warning: #e8a93e;
    --t-danger: #ef8e7d;
    --t-shadow: rgba(0, 0, 0, .55);
}

/* ===== 8. VIOLETA PREMIUM ===== */
html[data-tema="violeta-premium"] {
    --t-top-grad: linear-gradient(90deg, #311b6b 0%, #5b21b6 100%);
    --t-on-top: #f5f3ff;
    --t-top-menu: #4a1d96;
    --t-primary: #5b21b6;
    --t-accent: #7c3aed;
    --t-on-accent: #ffffff;
    --t-bg: #faf9ff;
    --t-surface: #ffffff;
    --t-surface-2: #f1eefb;
    --t-text: #1e1b2e;
    --t-muted: #6f6a85;
    --t-border: #e6e2f3;
    --t-divider-dotted: #a78bfa;
    --t-success: #16a34a;
    --t-warning: #d97706;
    --t-danger: #dc2626;
    --t-shadow: rgba(49, 27, 107, .10);
}
html[data-tema="violeta-premium"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #170d33 0%, #321569 100%);
    --t-on-top: #e9e4fb;
    --t-top-menu: #2c1360;
    --t-primary: #a78bfa;
    --t-accent: #a78bfa;
    --t-on-accent: #1b1038;
    --t-bg: #110d1f;
    --t-surface: #1a142e;
    --t-surface-2: #241c3d;
    --t-text: #e6e1f5;
    --t-muted: #9b93b8;
    --t-border: #352b55;
    --t-divider-dotted: #a78bfa;
    --t-success: #34d399;
    --t-warning: #fbbf24;
    --t-danger: #f87171;
    --t-shadow: rgba(0, 0, 0, .50);
}

/* ===== 9. CLARO MINIMAL =====
   Topo BRANCO: itens do menu usam texto escuro (--t-on-top) e o hover
   escurece via color-mix sobre --t-on-top (regras no bloco de overrides,
   que já são todas relativas a --t-on-top — sem gambiarra). */
html[data-tema="claro-minimal"] {
    --t-top-grad: linear-gradient(90deg, #ffffff 0%, #f8fafc 100%);
    --t-on-top: #0f172a;
    --t-top-menu: #ffffff;
    --t-primary: #2563eb;
    --t-accent: #2563eb;
    --t-on-accent: #ffffff;
    --t-bg: #f9fafb;
    --t-surface: #ffffff;
    --t-surface-2: #f3f4f6;
    --t-text: #111827;
    --t-muted: #6b7280;
    --t-border: #e5e7eb;
    --t-divider-dotted: #9ca3af;
    --t-success: #16a34a;
    --t-warning: #d97706;
    --t-danger: #dc2626;
    --t-shadow: rgba(17, 24, 39, .07);
}
html[data-tema="claro-minimal"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #0b0f14 0%, #11161d 100%);
    --t-on-top: #e6edf3;
    --t-top-menu: #11161d;
    --t-primary: #60a5fa;
    --t-accent: #60a5fa;
    --t-on-accent: #0b1220;
    --t-bg: #0d1117;
    --t-surface: #161b22;
    --t-surface-2: #1f2630;
    --t-text: #e6edf3;
    --t-muted: #8b949e;
    --t-border: #30363d;
    --t-divider-dotted: #6e7681;
    --t-success: #3fb950;
    --t-warning: #d29922;
    --t-danger: #f85149;
    --t-shadow: rgba(0, 0, 0, .50);
}

/* ===== 10. NOTURNO TOTAL =====
   A identidade deste tema é a NOITE (paleta aprovada na prévia).
   A versão DIA é a contraparte clara slate-índigo. tema.js usa noite
   como modo padrão deste tema. */
html[data-tema="noturno-total"] {
    --t-top-grad: linear-gradient(90deg, #27304a 0%, #3c4a6e 100%);
    --t-on-top: #eef1f8;
    --t-top-menu: #313c5c;
    --t-primary: #3c4a6e;
    --t-accent: #5558e3;
    --t-on-accent: #ffffff;
    --t-bg: #f3f5f9;
    --t-surface: #ffffff;
    --t-surface-2: #e9edf4;
    --t-text: #1b2233;
    --t-muted: #67718a;
    --t-border: #dde3ee;
    --t-divider-dotted: #8b93a7;
    --t-success: #16a34a;
    --t-warning: #d97706;
    --t-danger: #dc2626;
    --t-shadow: rgba(27, 34, 51, .10);
}
html[data-tema="noturno-total"][data-modo="noite"] {
    --t-top-grad: linear-gradient(90deg, #0b1220 0%, #172036 100%);
    --t-on-top: #e5e7eb;
    --t-top-menu: #172036;
    --t-primary: #818cf8;
    --t-accent: #818cf8;
    --t-on-accent: #0b1220;
    --t-bg: #0e1422;
    --t-surface: #161d2e;
    --t-surface-2: #1e2740;
    --t-text: #e5e7eb;
    --t-muted: #8b93a7;
    --t-border: #26304a;
    --t-divider-dotted: #64748b;
    --t-success: #34d399;
    --t-warning: #fbbf24;
    --t-danger: #f87171;
    --t-shadow: rgba(0, 0, 0, .50);
}

/* ============================================================================
   OVERRIDES DE ALTO NÍVEL (prova de conceito — Fase 1)
   ----------------------------------------------------------------------------
   GUARDA: só atuam com tema ≠ azul-imperial OU modo noite. O padrão
   (sem atributo, ou azul-imperial dia) permanece byte a byte intocado.
   tema.js, por segurança extra, nem aplica os atributos no caso padrão.
   ========================================================================== */

/* --- Variáveis Bootstrap 5.3 (modals, dropdowns, tabelas, inputs herdam) --- */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) {
    --bs-body-bg: var(--t-bg);
    --bs-body-color: var(--t-text);
    --bs-secondary-color: var(--t-muted);
    --bs-secondary-bg: var(--t-surface-2);
    --bs-tertiary-bg: var(--t-surface-2);
    --bs-tertiary-color: var(--t-muted);
    --bs-border-color: var(--t-border);
    --bs-border-color-translucent: var(--t-border);
    --bs-emphasis-color: var(--t-text);
    --bs-heading-color: var(--t-text);
    --bs-link-color: var(--t-accent);
    --bs-link-hover-color: color-mix(in srgb, var(--t-accent) 80%, var(--t-text));
}

/* --- Fundo geral e texto --- */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) body {
    background-color: var(--t-bg) !important;
    color: var(--t-text);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .main-content {
    color: inherit;
}

/* --- Menu/topo (.sidebar nas páginas do app: barra superior via sidebar.php) --- */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar {
    background: var(--t-top-grad) !important;
    color: var(--t-on-top) !important;
    box-shadow: 0 1px 6px var(--t-shadow) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar .nav-link {
    color: color-mix(in srgb, var(--t-on-top) 85%, transparent) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar .nav-link:hover,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar .nav-group:hover > .nav-group-toggle {
    background: color-mix(in srgb, var(--t-on-top) 13%, transparent) !important;
    color: var(--t-on-top) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar .nav-link.active {
    background: color-mix(in srgb, var(--t-on-top) 10%, transparent) !important;
    color: var(--t-on-top) !important;
    border-bottom-color: var(--t-on-top) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) body:has(.main-content) .sidebar > .sidebar-header {
    border-right-color: color-mix(in srgb, var(--t-on-top) 16%, transparent) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) body:has(.main-content) .sidebar > .account-block {
    border-left-color: color-mix(in srgb, var(--t-on-top) 16%, transparent) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar .nav-group > .nav-group-menu {
    background: var(--t-top-menu) !important;
    border-color: color-mix(in srgb, var(--t-on-top) 18%, transparent) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar .text-white-50 {
    color: color-mix(in srgb, var(--t-on-top) 55%, transparent) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar .menu-drag-handle {
    color: color-mix(in srgb, var(--t-on-top) 55%, transparent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar .menu-drag-handle:hover {
    color: var(--t-on-top);
    background: color-mix(in srgb, var(--t-on-top) 14%, transparent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .sidebar .dropdown-toggle:hover {
    background: color-mix(in srgb, var(--t-on-top) 13%, transparent) !important;
}
/* Topo claro (claro-minimal dia): linha sutil separa o topo do conteúdo */
html[data-tema="claro-minimal"]:not([data-modo="noite"]) body:has(.main-content) .sidebar {
    border-bottom: 1px solid var(--t-border) !important;
}

/* --- Botões primários → acento do tema --- */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-primary {
    background: var(--t-accent) !important;
    border-color: var(--t-accent) !important;
    color: var(--t-on-accent) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-primary:hover,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-primary:focus,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-primary:active {
    background: color-mix(in srgb, var(--t-accent) 85%, #000) !important;
    border-color: color-mix(in srgb, var(--t-accent) 85%, #000) !important;
    color: var(--t-on-accent) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-primary {
    color: var(--t-accent) !important;
    border-color: var(--t-accent) !important;
    background: transparent !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-primary:hover,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-primary:active {
    background: var(--t-accent) !important;
    color: var(--t-on-accent) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .text-primary {
    color: var(--t-primary) !important;
}

/* --- Cartões / superfícies --- */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .card,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .stat-card,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .modal-content,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .dropdown-menu,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .list-group-item,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .accordion-item,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .offcanvas,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .toast {
    background-color: var(--t-surface);
    color: var(--t-text);
    border-color: var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .card,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .stat-card {
    box-shadow: 0 2px 10px var(--t-shadow);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .modal-header,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .modal-footer {
    border-color: var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .dropdown-item {
    color: var(--t-text);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .dropdown-item:hover,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .dropdown-item:focus {
    background-color: var(--t-surface-2);
    color: var(--t-text);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .dropdown-divider {
    border-color: var(--t-border);
}

/* --- Inputs / selects --- */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .form-control,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .form-select,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .input-group-text {
    background-color: var(--t-surface);
    color: var(--t-text);
    border-color: var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .form-control:focus,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .form-select:focus {
    background-color: var(--t-surface);
    color: var(--t-text);
    border-color: var(--t-accent);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--t-accent) 25%, transparent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .form-control::placeholder {
    color: var(--t-muted);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .form-check-input:checked {
    background-color: var(--t-accent);
    border-color: var(--t-accent);
}

/* --- Tabelas --- */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .table {
    --bs-table-bg: var(--t-surface);
    --bs-table-color: var(--t-text);
    --bs-table-border-color: var(--t-border);
    --bs-table-striped-bg: var(--t-surface-2);
    --bs-table-striped-color: var(--t-text);
    --bs-table-hover-bg: var(--t-surface-2);
    --bs-table-hover-color: var(--t-text);
    color: var(--t-text);
    border-color: var(--t-border);
}

/* --- Utilitários e divisórias --- */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .text-muted,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .form-text {
    color: var(--t-muted) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .bg-white {
    background-color: var(--t-surface) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .bg-light {
    background-color: var(--t-surface-2) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) hr {
    border-color: var(--t-border);
}
/* Divisórias pontilhadas (classe utilitária + casos comuns) */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .t-divider-dotted,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) [class*="divider-dotted"] {
    border-color: var(--t-divider-dotted) !important;
}

/* --- Prova de conceito no perfil: header do perfil acompanha o tema --- */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .profile-header {
    background: var(--t-top-grad) !important;
    color: var(--t-on-top) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .profile-avatar {
    background: var(--t-surface) !important;
    color: var(--t-accent) !important;
}

/* ============================================================================
   AJUSTES ESPECÍFICOS DO MODO NOITE (todas as variantes noite são escuras)
   ========================================================================== */
html[data-tema][data-modo="noite"] {
    color-scheme: dark;
}
html[data-tema][data-modo="noite"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(1.4);
}
/* Seta do select legível no escuro */
html[data-tema][data-modo="noite"] .form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23aab4c4' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
/* Scrollbars discretos */
html[data-tema][data-modo="noite"] ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
html[data-tema][data-modo="noite"] ::-webkit-scrollbar-track {
    background: var(--t-bg);
}
html[data-tema][data-modo="noite"] ::-webkit-scrollbar-thumb {
    background: var(--t-border);
    border-radius: 6px;
}
/* Badges/alertas claros ganham contraste no escuro */
html[data-tema][data-modo="noite"] .badge.bg-light,
html[data-tema][data-modo="noite"] .badge.text-dark {
    background-color: var(--t-surface-2) !important;
    color: var(--t-text) !important;
}
html[data-tema][data-modo="noite"] .alert-light {
    background-color: var(--t-surface-2);
    color: var(--t-text);
    border-color: var(--t-border);
}

/* ============================================================================
   TRANSIÇÃO SUAVE AO TROCAR DE TEMA (só quando há tema aplicado)
   ========================================================================== */
html[data-tema] body,
html[data-tema] .sidebar,
html[data-tema] .main-content,
html[data-tema] .card,
html[data-tema] .stat-card {
    transition: background-color .25s ease, color .25s ease;
}

/* ============================================================================
   FASE 2A — DETALHAMENTO TOTAL DOS TEMAS
   ----------------------------------------------------------------------------
   Tudo abaixo permanece sob a MESMA GUARDA da fundação:
       html:is([data-tema]:not([data-tema="azul-imperial"]),
               [data-tema][data-modo="noite"])
   → tema padrão (azul-imperial dia, ou nenhum atributo) segue intocado.
   ========================================================================== */

/* ─────────────────────────────────────────────────────────────────────────
   A. REMAPEAMENTO DAS PALETAS LOCAIS DAS TELAS
   As telas grandes (Executor, DJEN, OABs, Caçador, Analisador, Skills,
   Financeiro e Tarefas do SPA) definem variáveis próprias em :root.
   A guarda (especificidade 0,2,1) vence o :root (0,1,0) e re-ancora cada
   paleta local nos tokens do tema — a tela inteira acompanha o tema sem
   tocar no toggle interno dela (que continua funcionando; o tema do
   usuário simplesmente vence).
   ───────────────────────────────────────────────────────────────────────── */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) {
    /* Executor / Skills Manager / Bench / Chat do processo */
    --bg-body: var(--t-bg);
    --bg-card: var(--t-surface);
    --bg-card2: var(--t-surface-2);
    --border: var(--t-border);
    --text: var(--t-text);
    --text-muted: var(--t-muted);
    --text-dim: color-mix(in srgb, var(--t-muted) 72%, var(--t-bg));
    --accent: var(--t-accent);
    --accent2: var(--t-primary);

    /* DJEN / OABs do escritório */
    --bg: var(--t-bg);
    --bg-soft: var(--t-surface);
    --panel: var(--t-surface);
    --panel-2: var(--t-surface-2);
    --border-soft: color-mix(in srgb, var(--t-border) 55%, var(--t-bg));
    --txt: var(--t-text);
    --txt-soft: color-mix(in srgb, var(--t-text) 70%, var(--t-muted));
    --muted: var(--t-muted);
    --accent-soft: color-mix(in srgb, var(--t-accent) 12%, transparent);
    --accent-strong: color-mix(in srgb, var(--t-accent) 78%, var(--t-text));

    /* Caçador de Bens / Analisador de Processos */
    --bg-dark: var(--t-bg);
    --bg-darker: color-mix(in srgb, var(--t-bg) 90%, #000);
    --bg-card-hover: var(--t-surface-2);
    --bg-input: var(--t-surface);
    --bg-glass: color-mix(in srgb, var(--t-surface) 78%, transparent);
    --text-primary: var(--t-text);
    --text-secondary: color-mix(in srgb, var(--t-text) 72%, var(--t-muted));
    --border-color: var(--t-border);
    --border-light: color-mix(in srgb, var(--t-border) 70%, var(--t-muted));
    --primary: var(--t-accent);
    --primary-dark: color-mix(in srgb, var(--t-accent) 82%, #000);
    --primary-light: color-mix(in srgb, var(--t-accent) 70%, #fff);
    --bg-primary: var(--t-bg);
    --bg-secondary: var(--t-surface);
    --bg-tertiary: var(--t-surface-2);
    --border-primary: var(--t-border);

    /* Sombras locais das telas → sombra do tema */
    --shadow-sm: 0 1px 2px var(--t-shadow);
    --shadow-md: 0 4px 14px var(--t-shadow);
    --shadow-lg: 0 10px 40px var(--t-shadow);

    /* Financeiro (CSS injetado pelo app.js) */
    --fin-accent: var(--t-accent);
    --fin-accent-soft: color-mix(in srgb, var(--t-accent) 12%, transparent);
    --fin-bg-card: var(--t-surface);
    --fin-border: var(--t-border);
    --fin-shadow: 0 4px 24px var(--t-shadow);
    --fin-shadow-hover: 0 8px 32px var(--t-shadow);
    --fin-receita: var(--t-success);
    --fin-receita-soft: color-mix(in srgb, var(--t-success) 14%, transparent);
    --fin-despesa: var(--t-danger);
    --fin-despesa-soft: color-mix(in srgb, var(--t-danger) 12%, transparent);
    --fin-pendente: var(--t-warning);
    --fin-pendente-soft: color-mix(in srgb, var(--t-warning) 14%, transparent);
    --fin-futuro: var(--t-accent);
    --fin-futuro-soft: color-mix(in srgb, var(--t-accent) 9%, transparent);

    /* Tarefas (página do SPA — CSS injetado pelo app.js) */
    --tar-bg: var(--t-bg);
    --tar-gray-100: var(--t-surface-2);
    --tar-gray-200: var(--t-border);
    --tar-gray-300: color-mix(in srgb, var(--t-border) 60%, var(--t-muted));
    --tar-gray-500: var(--t-muted);
    --tar-gray-600: color-mix(in srgb, var(--t-muted) 70%, var(--t-text));
    --tar-gray-700: color-mix(in srgb, var(--t-text) 78%, var(--t-muted));
    --tar-gray-900: var(--t-text);
    --tar-navy-900: color-mix(in srgb, var(--t-primary) 52%, #06080f);
    --tar-navy-800: color-mix(in srgb, var(--t-primary) 62%, #0a1226);
    --tar-navy-700: color-mix(in srgb, var(--t-primary) 76%, #14203c);
    --tar-blue-100: color-mix(in srgb, var(--t-accent) 18%, var(--t-surface));
    --tar-blue-50: color-mix(in srgb, var(--t-accent) 9%, var(--t-surface));
    --tar-shadow-sm: 0 1px 2px var(--t-shadow);
    --tar-shadow-md: 0 4px 12px var(--t-shadow);
    --tar-shadow-lg: 0 10px 32px var(--t-shadow);

    /* Widget do Consultor Jurídico (consultor_widget.css usa --cj-*) */
    --cj-accent: var(--t-accent);
    --cj-accent-2: color-mix(in srgb, var(--t-accent) 65%, var(--t-primary));
    --cj-on-accent: var(--t-on-accent);
    --cj-surface: var(--t-surface);
    --cj-bg: var(--t-surface-2);
    --cj-border: var(--t-border);
    --cj-text: var(--t-text);
    --cj-muted: var(--t-muted);
    --cj-muted-2: color-mix(in srgb, var(--t-muted) 70%, var(--t-bg));
    --cj-success: var(--t-success);
    --cj-danger: var(--t-danger);
    --cj-shadow: var(--t-shadow);
}

/* ─────────────────────────────────────────────────────────────────────────
   B. ORNAMENTOS GLOBAIS — seleção, scrollbars, foco, hairlines
   ───────────────────────────────────────────────────────────────────────── */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) ::selection {
    background: color-mix(in srgb, var(--t-accent) 28%, transparent);
    color: inherit;
}
/* Scrollbars nas cores do tema (dia e noite) */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) {
    scrollbar-color: color-mix(in srgb, var(--t-muted) 55%, var(--t-bg)) var(--t-bg);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) ::-webkit-scrollbar-track {
    background: var(--t-bg);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) ::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--t-muted) 55%, var(--t-bg));
    border-radius: 6px;
    border: 2px solid var(--t-bg);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) ::-webkit-scrollbar-thumb:hover {
    background: color-mix(in srgb, var(--t-muted) 80%, var(--t-bg));
}
/* Anel de foco para navegação por teclado */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) :is(a, button, [role="button"], [tabindex]):focus-visible {
    outline: 2px solid color-mix(in srgb, var(--t-accent) 70%, transparent);
    outline-offset: 2px;
}
/* Hairlines utilitárias do Bootstrap */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) :is(.border, .border-top, .border-bottom, .border-start, .border-end) {
    border-color: var(--t-border) !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   C. BOOTSTRAP — COBERTURA COMPLETA DE COMPONENTES
   ───────────────────────────────────────────────────────────────────────── */
/* Modais: sombra elegante + cabeçalho com hairline */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .modal-content {
    box-shadow: 0 18px 60px var(--t-shadow);
    border: 1px solid var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .modal-title {
    color: var(--t-text);
}

/* Tooltips e popovers */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .tooltip {
    --bs-tooltip-bg: color-mix(in srgb, var(--t-text) 92%, var(--t-bg));
    --bs-tooltip-color: var(--t-bg);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .popover {
    --bs-popover-bg: var(--t-surface);
    --bs-popover-body-color: var(--t-text);
    --bs-popover-header-bg: var(--t-surface-2);
    --bs-popover-header-color: var(--t-text);
    --bs-popover-border-color: var(--t-border);
    box-shadow: 0 8px 30px var(--t-shadow);
}

/* Toasts */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .toast-header {
    background-color: var(--t-surface-2);
    color: var(--t-text);
    border-bottom-color: var(--t-border);
}

/* Alerts semânticos: fundo suave + texto legível derivados dos tokens */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) :is(.alert-primary, .alert-info) {
    background-color: color-mix(in srgb, var(--t-accent) 13%, var(--t-surface));
    color: color-mix(in srgb, var(--t-accent) 55%, var(--t-text));
    border-color: color-mix(in srgb, var(--t-accent) 32%, var(--t-surface));
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .alert-success {
    background-color: color-mix(in srgb, var(--t-success) 14%, var(--t-surface));
    color: color-mix(in srgb, var(--t-success) 52%, var(--t-text));
    border-color: color-mix(in srgb, var(--t-success) 32%, var(--t-surface));
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .alert-warning {
    background-color: color-mix(in srgb, var(--t-warning) 15%, var(--t-surface));
    color: color-mix(in srgb, var(--t-warning) 48%, var(--t-text));
    border-color: color-mix(in srgb, var(--t-warning) 35%, var(--t-surface));
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .alert-danger {
    background-color: color-mix(in srgb, var(--t-danger) 13%, var(--t-surface));
    color: color-mix(in srgb, var(--t-danger) 55%, var(--t-text));
    border-color: color-mix(in srgb, var(--t-danger) 32%, var(--t-surface));
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .alert-secondary {
    background-color: var(--t-surface-2);
    color: var(--t-text);
    border-color: var(--t-border);
}

/* List group */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .list-group-item-action:hover,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .list-group-item-action:focus {
    background-color: var(--t-surface-2);
    color: var(--t-text);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .list-group-item.active {
    background-color: var(--t-accent);
    border-color: var(--t-accent);
    color: var(--t-on-accent);
}

/* Nav-tabs / pills */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .nav-tabs {
    --bs-nav-tabs-border-color: var(--t-border);
    --bs-nav-tabs-link-active-bg: var(--t-surface);
    --bs-nav-tabs-link-active-color: var(--t-text);
    --bs-nav-tabs-link-active-border-color: var(--t-border) var(--t-border) var(--t-surface);
    --bs-nav-tabs-link-hover-border-color: var(--t-surface-2) var(--t-surface-2) var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) :is(.nav-tabs, .nav-pills) {
    --bs-nav-link-color: var(--t-accent);
    --bs-nav-link-hover-color: color-mix(in srgb, var(--t-accent) 80%, var(--t-text));
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .nav-pills {
    --bs-nav-pills-link-active-bg: var(--t-accent);
    --bs-nav-pills-link-active-color: var(--t-on-accent);
}

/* Pagination */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .pagination {
    --bs-pagination-bg: var(--t-surface);
    --bs-pagination-color: var(--t-accent);
    --bs-pagination-border-color: var(--t-border);
    --bs-pagination-hover-bg: var(--t-surface-2);
    --bs-pagination-hover-color: color-mix(in srgb, var(--t-accent) 80%, var(--t-text));
    --bs-pagination-hover-border-color: var(--t-border);
    --bs-pagination-focus-bg: var(--t-surface-2);
    --bs-pagination-focus-color: var(--t-accent);
    --bs-pagination-focus-box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--t-accent) 25%, transparent);
    --bs-pagination-active-bg: var(--t-accent);
    --bs-pagination-active-border-color: var(--t-accent);
    --bs-pagination-active-color: var(--t-on-accent);
    --bs-pagination-disabled-bg: var(--t-surface);
    --bs-pagination-disabled-color: var(--t-muted);
    --bs-pagination-disabled-border-color: var(--t-border);
}

/* Progress */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .progress {
    background-color: var(--t-surface-2);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .progress-bar:not(.bg-success):not(.bg-warning):not(.bg-danger):not(.bg-info) {
    background-color: var(--t-accent);
    color: var(--t-on-accent);
}

/* Badges semânticos → tokens do tema */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .badge.bg-primary {
    background-color: var(--t-accent) !important;
    color: var(--t-on-accent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .badge.bg-success {
    background-color: var(--t-success) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .badge.bg-warning {
    background-color: var(--t-warning) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .badge.bg-danger {
    background-color: var(--t-danger) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .badge.bg-secondary {
    background-color: color-mix(in srgb, var(--t-muted) 85%, var(--t-bg)) !important;
}
/* No noite os tokens semânticos são pastéis → texto escuro garante AA */
html[data-tema][data-modo="noite"] .badge:is(.bg-success, .bg-warning, .bg-danger, .bg-info) {
    color: #10141c !important;
}

/* Tabelas: thead destacado e harmonia geral */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .table > thead th {
    background-color: var(--t-surface-2);
    color: var(--t-text);
    border-color: var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .table-light,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .table > thead.table-light th {
    --bs-table-bg: var(--t-surface-2);
    --bs-table-color: var(--t-text);
    background-color: var(--t-surface-2);
    color: var(--t-text);
}

/* Botões secundários e outlines restantes */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-secondary {
    background-color: var(--t-surface-2);
    border-color: var(--t-border);
    color: var(--t-text);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-secondary:hover {
    background-color: color-mix(in srgb, var(--t-surface-2) 80%, var(--t-muted));
    border-color: var(--t-border);
    color: var(--t-text);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-secondary {
    color: color-mix(in srgb, var(--t-muted) 70%, var(--t-text));
    border-color: var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-secondary:hover {
    background-color: var(--t-surface-2);
    border-color: var(--t-border);
    color: var(--t-text);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-success {
    color: var(--t-success);
    border-color: var(--t-success);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-success:hover {
    background-color: var(--t-success);
    border-color: var(--t-success);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-danger {
    color: var(--t-danger);
    border-color: var(--t-danger);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-danger:hover {
    background-color: var(--t-danger);
    border-color: var(--t-danger);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-warning {
    color: color-mix(in srgb, var(--t-warning) 75%, var(--t-text));
    border-color: var(--t-warning);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-outline-warning:hover {
    background-color: var(--t-warning);
    border-color: var(--t-warning);
}
html[data-tema][data-modo="noite"] :is(.btn-outline-dark, .btn-dark) {
    color: var(--t-text);
    border-color: var(--t-border);
    background-color: transparent;
}
html[data-tema][data-modo="noite"] :is(.btn-outline-dark, .btn-dark):hover {
    background-color: var(--t-surface-2);
    color: var(--t-text);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .btn-light {
    background-color: var(--t-surface-2);
    border-color: var(--t-border);
    color: var(--t-text);
}

/* Accordion */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .accordion-button {
    background-color: var(--t-surface);
    color: var(--t-text);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .accordion-button:not(.collapsed) {
    background-color: color-mix(in srgb, var(--t-accent) 10%, var(--t-surface));
    color: color-mix(in srgb, var(--t-accent) 60%, var(--t-text));
    box-shadow: inset 0 -1px 0 var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .accordion-button:focus {
    border-color: var(--t-accent);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--t-accent) 25%, transparent);
}
html[data-tema][data-modo="noite"] .accordion-button::after {
    filter: invert(1) grayscale(100%) brightness(1.4);
}

/* Breadcrumb */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .breadcrumb-item.active {
    color: var(--t-muted);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .breadcrumb-item + .breadcrumb-item::before {
    color: var(--t-muted);
}

/* Spinner herda o acento */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .spinner-border.text-primary,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .spinner-grow.text-primary {
    color: var(--t-accent) !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   D. INDEX (SPA) — cards de estatística, tarefas, financeiro
   ───────────────────────────────────────────────────────────────────────── */
/* Cards de estatística do dashboard: gradiente sutil derivado dos tokens.
   No DIA: cor cheia (texto branco mantém AA — tokens dia são profundos).
   Na NOITE: tinta suave sobre a superfície + texto do tema (pastéis claros
   não comportam texto branco). */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .stat-card.bg-primary {
    background: linear-gradient(135deg, var(--t-accent) 0%, color-mix(in srgb, var(--t-accent) 78%, #000) 100%) !important;
    color: var(--t-on-accent) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .stat-card.bg-success {
    background: linear-gradient(135deg, var(--t-success) 0%, color-mix(in srgb, var(--t-success) 76%, #000) 100%) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .stat-card.bg-warning {
    background: linear-gradient(135deg, var(--t-warning) 0%, color-mix(in srgb, var(--t-warning) 76%, #000) 100%) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .stat-card.bg-danger {
    background: linear-gradient(135deg, var(--t-danger) 0%, color-mix(in srgb, var(--t-danger) 76%, #000) 100%) !important;
}
html[data-tema][data-modo="noite"] .stat-card:is(.bg-primary, .bg-success, .bg-warning, .bg-danger) {
    background: linear-gradient(160deg, color-mix(in srgb, var(--t-surface) 100%, transparent) 0%, var(--t-surface) 100%) !important;
    color: var(--t-text) !important;
    border: 1px solid var(--t-border);
}
html[data-tema][data-modo="noite"] .stat-card.bg-primary {
    background: linear-gradient(160deg, color-mix(in srgb, var(--t-accent) 22%, var(--t-surface)) 0%, var(--t-surface) 90%) !important;
    border-color: color-mix(in srgb, var(--t-accent) 35%, var(--t-border));
}
html[data-tema][data-modo="noite"] .stat-card.bg-success {
    background: linear-gradient(160deg, color-mix(in srgb, var(--t-success) 20%, var(--t-surface)) 0%, var(--t-surface) 90%) !important;
    border-color: color-mix(in srgb, var(--t-success) 32%, var(--t-border));
}
html[data-tema][data-modo="noite"] .stat-card.bg-warning {
    background: linear-gradient(160deg, color-mix(in srgb, var(--t-warning) 20%, var(--t-surface)) 0%, var(--t-surface) 90%) !important;
    border-color: color-mix(in srgb, var(--t-warning) 32%, var(--t-border));
}
html[data-tema][data-modo="noite"] .stat-card.bg-danger {
    background: linear-gradient(160deg, color-mix(in srgb, var(--t-danger) 20%, var(--t-surface)) 0%, var(--t-surface) 90%) !important;
    border-color: color-mix(in srgb, var(--t-danger) 32%, var(--t-border));
}

/* Cartões de tarefa: prioridades mantêm a semântica, nos tokens do tema */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .tarefa-card:hover {
    box-shadow: 0 4px 14px var(--t-shadow);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .prioridade-alta {
    border-left-color: var(--t-danger);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .prioridade-media {
    border-left-color: var(--t-warning);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .prioridade-baixa {
    border-left-color: color-mix(in srgb, var(--t-accent) 75%, var(--t-primary));
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .badge-vencido {
    background: var(--t-danger) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .badge-proximo {
    background: var(--t-warning) !important;
}
html[data-tema][data-modo="noite"] :is(.badge-vencido, .badge-proximo) {
    color: #10141c !important;
}

/* Página de Tarefas (.tar-page): fundos e cabeçalhos com literais !important */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .tar-page {
    background: var(--t-bg) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .tar-hero {
    background: linear-gradient(180deg, color-mix(in srgb, var(--t-accent) 8%, var(--t-surface)) 0%, var(--t-surface) 70%) !important;
    border-color: var(--t-border) !important;
    box-shadow: 0 2px 8px var(--t-shadow);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .tar-tbl thead th {
    background: linear-gradient(180deg, var(--t-surface) 0%, var(--t-surface-2) 100%) !important;
    color: var(--t-text) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .tar-btn-outline {
    background: var(--t-surface) !important;
    color: var(--t-text) !important;
    border-color: color-mix(in srgb, var(--t-text) 50%, var(--t-border)) !important;
}
html[data-tema][data-modo="noite"] .tar-page,
html[data-tema][data-modo="noite"] .tar-page * {
    color-scheme: dark;
}

/* ─────────────────────────────────────────────────────────────────────────
   E. LOGIN — elegante em qualquer tema
   ───────────────────────────────────────────────────────────────────────── */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .animated-bg {
    background: var(--t-top-grad) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .animated-bg::before {
    background: radial-gradient(circle, color-mix(in srgb, var(--t-accent) 12%, transparent) 0%, transparent 50%);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .animated-bg::after {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--t-on-top) 4%, transparent) 1px, transparent 1px),
        linear-gradient(color-mix(in srgb, var(--t-on-top) 4%, transparent) 1px, transparent 1px);
    background-size: 50px 50px;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .particle {
    background: color-mix(in srgb, var(--t-accent) 55%, transparent);
    box-shadow: 0 0 10px color-mix(in srgb, var(--t-accent) 70%, transparent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .login-card {
    background: color-mix(in srgb, var(--t-surface) 90%, transparent);
    border: 1px solid color-mix(in srgb, var(--t-accent) 28%, transparent);
    box-shadow:
        0 20px 60px var(--t-shadow),
        0 0 100px color-mix(in srgb, var(--t-accent) 10%, transparent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .logo-icon {
    background: linear-gradient(135deg, var(--t-accent) 0%, color-mix(in srgb, var(--t-accent) 60%, var(--t-primary)) 100%);
    color: var(--t-on-accent);
    box-shadow:
        0 10px 30px color-mix(in srgb, var(--t-accent) 40%, transparent),
        0 0 50px color-mix(in srgb, var(--t-accent) 20%, transparent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .logo-container h1 {
    color: var(--t-text);
    text-shadow: none;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .logo-container p,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .form-check-label,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .login-footer p {
    color: var(--t-muted);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .login-card .form-label {
    color: color-mix(in srgb, var(--t-text) 85%, var(--t-muted));
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .login-card .input-icon {
    color: var(--t-muted);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .login-card .input-icon:hover {
    color: var(--t-accent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) :is(.btn-login, .btn-certificado) {
    background: linear-gradient(135deg, var(--t-accent) 0%, color-mix(in srgb, var(--t-accent) 60%, var(--t-primary)) 100%);
    color: var(--t-on-accent);
    box-shadow: 0 10px 30px color-mix(in srgb, var(--t-accent) 35%, transparent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) :is(.btn-login, .btn-certificado):hover {
    box-shadow: 0 15px 40px color-mix(in srgb, var(--t-accent) 50%, transparent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .divider-text::before,
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .divider-text::after {
    background: var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .divider-text span {
    background: transparent;
    color: var(--t-muted);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .login-footer {
    border-top-color: var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .login-footer a {
    color: var(--t-accent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .login-card .form-check-input:checked {
    background: var(--t-accent);
    border-color: var(--t-accent);
}

/* ─────────────────────────────────────────────────────────────────────────
   F. TELAS UTILITÁRIAS — usage, atualizar sistema, eproc, DOD, bench
   ───────────────────────────────────────────────────────────────────────── */
/* Uso da assinatura Claude */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .hint {
    color: var(--t-muted);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .therm {
    background: var(--t-surface-2);
    border-color: var(--t-border);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .lim {
    background: var(--t-surface-2);
}

/* Atualizar sistema / Integração eproc: fundo gradiente roxo → topo do tema */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) body:is(:has(.container-update), :has(.container-main)) {
    background: var(--t-top-grad) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .container-main {
    background: var(--t-surface);
    color: var(--t-text);
    box-shadow: 0 10px 30px var(--t-shadow);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .cert-card {
    background: var(--t-top-grad);
    color: var(--t-on-top);
}

/* DOD (Dizer o Direito) */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .doc-section .body {
    color: var(--t-text);
}

/* Bench do executor (literais escuros) */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .bench-body {
    background: var(--t-bg) !important;
    color: var(--t-text) !important;
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .bench-topbar {
    background: var(--t-top-grad) !important;
    color: var(--t-on-top);
}

/* ─────────────────────────────────────────────────────────────────────────
   G. WIDGET DO CONSULTOR — acompanha o tema (tokens --cj-* remapeados na
   seção A; aqui só os retoques que dependem do contraste do acento)
   ───────────────────────────────────────────────────────────────────────── */
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .cj-msg.user {
    color: var(--t-on-accent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .cj-header {
    color: var(--t-on-accent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) #consultorFab {
    color: var(--t-on-accent);
}
html:is([data-tema]:not([data-tema="azul-imperial"]), [data-tema][data-modo="noite"]) .cj-send-btn {
    color: var(--t-on-accent);
}
html[data-tema][data-modo="noite"] .cj-msg.sys {
    background: color-mix(in srgb, var(--t-warning) 18%, var(--t-surface));
    color: color-mix(in srgb, var(--t-warning) 55%, var(--t-text));
}

/* ─────────────────────────────────────────────────────────────────────────
   H. TRANSIÇÕES DISCRETAS (complemento da fundação)
   ───────────────────────────────────────────────────────────────────────── */
html[data-tema] :is(.modal-content, .dropdown-menu, .form-control, .form-select, .btn, .list-group-item, .table) {
    transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}