/* ============================================================================ Book de Vendas BR Spices — TEMA "NAVY" (inspirado no Radar Scanntech) Ativado por . O tema Clássico (teal) permanece intacto no app.css — o botão 🎨 do rodapé alterna entre os dois. Paleta: navy profundo #0A1A38 · azul #2F6BB0/#4E93DE · verde #1D9E50 Tipografia: Montserrat (Google Fonts, carregada no ) ============================================================================ */ /* ---------- 1. PALETA (as variáveis regem ~90% do visual) ---------- */ html[data-theme="navy"]{ /* casca navy profunda (sidebar, rodapé, login, linha TOTAL) */ --ink:#0A1A38; --ink2:#13294F; --ink-b:#22407312; --ink-b:#1F3A69; --ink-t:#D9E4F7; --ink-m:#8CA3CC; /* conteúdo claro com temperatura fria */ --bg:#EDF1F8; --card:#ffffff; --line:#E1E8F3; --line2:#EDF1F6; --bd:#D5DEEC; --txt:#13233F; --mut:#5A6B87; --soft:#8291AC; /* marca em azul */ --teal:#2F6BB0; --teal-d:#1D4E8F; --aqua:#4E93DE; --aqua-l:#CFE0F5; --creme:#A9CBF4; --acafrao:#E0A339; --paprica:#C96643; /* status */ --ok:#1D9E50; --ok-bg:#E4F5EB; --warn:#D9A23A; --warn-bg:#FBF3E2; --val:#E07B39; --val-bg:#FDEFE3; --bad:#D8453A; --bad-bg:#FBE9E7; --shadow:0 1px 2px rgba(13,27,62,.06),0 10px 28px -14px rgba(13,27,62,.18); } /* ---------- 2. TIPOGRAFIA — Montserrat em todo o app ---------- */ html[data-theme="navy"] body{ font-family:"Montserrat","Segoe UI",system-ui,-apple-system,sans-serif; font-size:13px; } html[data-theme="navy"] h2.pg{font-weight:800;letter-spacing:-.015em} html[data-theme="navy"] .card h3{font-weight:800;letter-spacing:.1em;color:#26375B} html[data-theme="navy"] .kpi .t{font-weight:700;letter-spacing:.09em} html[data-theme="navy"] .kpi .v{font-weight:800;font-feature-settings:"tnum" 1,"lnum" 1} html[data-theme="navy"] .fat-tab td,html[data-theme="navy"] .fat-tab th{font-feature-settings:"tnum" 1,"lnum" 1} html[data-theme="navy"] .nav-i{font-weight:600} html[data-theme="navy"] .nsec,html[data-theme="navy"] .navgrp-h{font-weight:700;letter-spacing:.2em} /* ---------- 3. CASCA — barra do topo, sidebar, rodapé ---------- */ html[data-theme="navy"] header.top{background:linear-gradient(90deg,#0A1A38 0%,#1D4E8F 55%,#4E93DE 100%)} html[data-theme="navy"] aside{background:linear-gradient(180deg,#0A1A38 0%,#0D2044 100%)} html[data-theme="navy"] .foot{background:linear-gradient(90deg,#0A1A38,#0F2450)} html[data-theme="navy"] .nav-i.act{background:linear-gradient(90deg,rgba(78,147,222,.38),rgba(78,147,222,.12))} html[data-theme="navy"] .nav-i.act::before{background:#4E93DE} /* ---------- 4. CARDS & KPIs — mais respiro, sombra azulada ---------- */ html[data-theme="navy"] .card{border-radius:16px} html[data-theme="navy"] .kpi{border-radius:16px} html[data-theme="navy"] .kpi .ic svg{stroke:#2F6BB0} /* ícones unificados no azul (estilo Scanntech) */ /* ---------- 5. FUNDOS/HOVERS teal-claros → azul-claros ---------- */ html[data-theme="navy"] .foot-menu button:hover, html[data-theme="navy"] .dd-item:hover, html[data-theme="navy"] .perquick button, html[data-theme="navy"] .permes-limpar, html[data-theme="navy"] label.permes:hover, html[data-theme="navy"] .fchip, html[data-theme="navy"] .more{background:#F0F4FA} html[data-theme="navy"] .f select,html[data-theme="navy"] .perbtn, html[data-theme="navy"] .tctl input{background:#F4F7FC} html[data-theme="navy"] .dd-item.on{background:#DEEAFA;color:var(--teal-d)} html[data-theme="navy"] .fat-tab tr.mat-fam td, html[data-theme="navy"] table.bsk-mtx tr.bsk-cov td, html[data-theme="navy"] tr.cart-ped.on td, html[data-theme="navy"] tr.nf-row.on td, html[data-theme="navy"] .anot-grp, html[data-theme="navy"] .nfcard{background:#EAF0F9} html[data-theme="navy"] .card-dlmenu button:hover{background:#EAF0F9;color:var(--teal-d)} html[data-theme="navy"] tr.cart-det>td, html[data-theme="navy"] tr.nf-det>td{background:#F7FAFE} /* hover padronizado (um tom mais escuro que a zebra) */ html[data-theme="navy"] tbody tr:hover td, html[data-theme="navy"] tr.cart-ped:hover td, html[data-theme="navy"] tr.nf-row:hover td, html[data-theme="navy"] .dash-tab tr.dlin:hover td, html[data-theme="navy"] .fat-tab tr.fat-cli:hover td{background:#E0EBFA} html[data-theme="navy"] #fat-conteudo .fat-tab tr.fat-cli:hover td:nth-child(1), html[data-theme="navy"] #fat-conteudo .fat-tab tr.fat-cli:hover td:nth-child(2){background:#E0EBFA} /* zebra azul-claro (linha sim/linha não) */ html[data-theme="navy"] .fat-tab:not(.so-evtab) tbody :where(tr:nth-child(odd):not(.fat-total):not(.nf-det):not(.cart-det):not(.ent-crit):not(.ent-aten):not(.mat-fam):not(.bsk-cov))>td, html[data-theme="navy"] .dash-tab tbody :where(tr:nth-child(odd):not(.on))>td{background:#F2F6FC} html[data-theme="navy"] #fat-conteudo .fat-tab tr:nth-child(odd):not(.fat-total) td:nth-child(1), html[data-theme="navy"] #fat-conteudo .fat-tab tr:nth-child(odd):not(.fat-total) td:nth-child(2){background:#F2F6FC} html[data-theme="navy"] .dash-tab tr.dlin.on td{background:#DEEAFA;border-bottom-color:var(--teal)} html[data-theme="navy"] #v-sellout td.so-focoable:hover, html[data-theme="navy"] #v-sellout .so-evtab td.so-ufclick:hover{background:#E3EDFB;color:var(--teal-d)} html[data-theme="navy"] #v-entregas .ent-scard.on{background:#E3EDFB;border-color:var(--teal-d)} html[data-theme="navy"] #v-entregas .ent-tab thead tr.ent-qrow th{background:#F2F5FB} html[data-theme="navy"] #nf-lista tr.nf-qrow th{background:#F2F5FB} /* ---------- 6. CABEÇALHOS INTERNOS de tabelas escuras ---------- */ html[data-theme="navy"] tr.cart-det th{background:#27437E} html[data-theme="navy"] .vol-tab tr.vol-sumh th, html[data-theme="navy"] .vol-tab tr.vol-sumh th.vslf{background:#1B355F;color:#DCE6F7} html[data-theme="navy"] #v-sellout .so-evtab tr.so-grow.so-ufrow>td{border-top:2px solid #2F6BB0} /* ---------- 7. LOGIN — navy com acentos azuis-claros ---------- */ html[data-theme="navy"] .lbox{background:linear-gradient(160deg,#0A1A38 0%,#12284F 100%); box-shadow:0 30px 70px -22px rgba(6,16,40,.65),0 4px 14px rgba(6,16,40,.28)} html[data-theme="navy"] .lbox button{background:linear-gradient(135deg,#3F7FD1,#1D4E8F); box-shadow:0 10px 24px -10px rgba(6,20,50,.65)} html[data-theme="navy"] svg.brush *{stroke:#8FB7E8} /* ---------- 8. DETALHES ---------- */ html[data-theme="navy"] .exp{border-color:rgba(47,107,176,.45)} html[data-theme="navy"] .evo-modo button.on{background:var(--teal)} html[data-theme="navy"] .badge-adm{color:#8a6d1d} html[data-theme="navy"] ::-webkit-scrollbar-thumb{background:#B9C7E0} html[data-theme="navy"] .so-ufbanner{background:#E3EDFB;color:#1D4E8F} html[data-theme="navy"] #hscroll::-webkit-scrollbar-thumb{background:#AFC2E2} html[data-theme="navy"] #hscroll::-webkit-scrollbar-thumb:hover{background:#8FA9D6} /* topbar de filtros (ANO/MÊS/…): fundo branco padrão, igual às janelas de filtro (pedido do Fernando) */ html[data-theme="navy"] .topbar{background:var(--card);border:1px solid var(--line)} html[data-theme="navy"] .topbar .f label{color:var(--teal-d);font-weight:700} html[data-theme="navy"] .topbar .reset{color:var(--teal-d)} /* chip de filtro SELECIONADO legível: azul dos cabeçalhos (o override claro do .fchip escondia o texto branco) */ html[data-theme="navy"] .fchip.on{background:linear-gradient(180deg,var(--aqua),var(--teal-d));border-color:var(--teal-d);color:#fff} /* (teste do cabeçalho navy do rodapé foi revertido a pedido do Fernando — 11/07/2026; os cabeçalhos voltaram ao gradiente azul padrão via variáveis --aqua/--teal-d) */