/* ════════════════════════════════════════════════════════════ MODO ESCURO — tema CLÁSSICO (o padrão) O clássico usa main.css (tudo claro/hardcoded) e não tinha escuro. Este arquivo dá um escuro completo e consistente quando E NÃO está num tema skin (moderno/android/ corporativo, que já têm suas próprias paletas em temas.css). Usa !important para vencer as cores fixas do main.css e os estilos inline claros espalhados pelo HTML. ════════════════════════════════════════════════════════════ */ /* Deixa controles nativos (scrollbar, date picker, caret) escuros */ html[data-modo="escuro"] { color-scheme: dark; } html[data-modo="escuro"]:not(.tema-skin) { --dk-bg:#0e0f12; /* fundo do app */ --dk-chrome:#15171b; /* menus/barras/sidebars */ --dk-panel:#121317; /* conteúdo/telas/modais */ --dk-card:#1d1f25; /* caixas/campos elevados */ --dk-soft:#23262d; /* inputs */ --dk-line:#2f343d; /* borda padrão */ --dk-line2:#414954; /* borda forte */ --dk-txt:#e6e8ec; /* texto principal */ --dk-txt2:#a6aeb9; /* texto secundário */ --dk-accent:#ff9d3d; /* laranja CENTERTEC (claro)*/ --dk-blue:#3b8bff; /* azul de destaque/seleção */ --dk-red:#ff6b6b; /* vermelho de perigo */ /* Redefine as variáveis que o main.css usa como var(--x, fallbackClaro): assim tudo que depende delas (notas, fiscal, cards) já fica escuro. */ --line:#373d46; --accent:#ff9d3d; --panel:#1e2127; --panel-txt:#e6e8ec; --soft:#2b3038; --soft-txt:#a6aeb9; --btn-bg:#272b32; --btn-txt:#e6e8ec; --btn-line:#49515c; --input-bg:#2b3038; --input-txt:#e6e8ec; } /* ── Base ─────────────────────────────────────────────────── */ html[data-modo="escuro"]:not(.tema-skin) body { background: var(--dk-bg) !important; color: var(--dk-txt) !important; } /* ── Barras de topo/rodapé ────────────────────────────────── */ html[data-modo="escuro"]:not(.tema-skin) :is(#top-menu, #tab-bar, #bottom-bar) { background: var(--dk-chrome) !important; border-color: var(--dk-line) !important; color: var(--dk-txt) !important; } html[data-modo="escuro"]:not(.tema-skin) #top-menu .menu-item { color: var(--dk-txt) !important; } html[data-modo="escuro"]:not(.tema-skin) :is(#top-menu .menu-item:hover) { background: var(--dk-blue) !important; color: #fff !important; } html[data-modo="escuro"]:not(.tema-skin) .tab-btn { background: var(--dk-chrome) !important; color: var(--dk-txt2) !important; border-color: transparent !important; } html[data-modo="escuro"]:not(.tema-skin) .tab-btn.active { background: var(--dk-panel) !important; color: var(--dk-accent) !important; border-color: var(--dk-line) var(--dk-line) var(--dk-panel) var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) #bottom-bar .reg-info { color: var(--dk-blue) !important; } html[data-modo="escuro"]:not(.tema-skin) .code-info { color: var(--dk-txt2) !important; } html[data-modo="escuro"]:not(.tema-skin) #bottom-search { background: var(--dk-soft) !important; color: var(--dk-txt) !important; border-color: var(--dk-line2) !important; } html[data-modo="escuro"]:not(.tema-skin) #tema-toggle:hover { background: rgba(255,255,255,.10) !important; } /* ── Sidebars ─────────────────────────────────────────────── */ html[data-modo="escuro"]:not(.tema-skin) :is(#left-sidebar, #right-sidebar) { background: var(--dk-chrome) !important; border-color: var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) .sidebar-btn { color: var(--dk-txt) !important; } html[data-modo="escuro"]:not(.tema-skin) :is(.sidebar-btn:hover, .sidebar-btn.active) { background: var(--dk-blue) !important; color: #fff !important; border-color: var(--dk-blue) !important; } html[data-modo="escuro"]:not(.tema-skin) .sidebar-subitem { background: var(--dk-card) !important; color: var(--dk-txt) !important; } html[data-modo="escuro"]:not(.tema-skin) .sidebar-section { color: var(--dk-txt2) !important; border-top-color: var(--dk-line) !important; } /* ── Conteúdo / telas de módulo ───────────────────────────── */ html[data-modo="escuro"]:not(.tema-skin) :is(#main-content, .tela-modulo, .tela-body) { background: var(--dk-panel) !important; color: var(--dk-txt) !important; } html[data-modo="escuro"]:not(.tema-skin) .tela-header { background: #20242b !important; color: var(--dk-accent) !important; border-bottom-color: var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) .logo-sub { color: var(--dk-txt) !important; } /* ── Modais ───────────────────────────────────────────────── */ html[data-modo="escuro"]:not(.tema-skin) .modal-window { background: var(--dk-panel) !important; color: var(--dk-txt) !important; border: 1px solid var(--dk-line2) !important; box-shadow: 0 12px 38px rgba(0,0,0,.6) !important; } html[data-modo="escuro"]:not(.tema-skin) .modal-titlebar { background: linear-gradient(to right, #1b2a45, #2a4a7a) !important; color: #fff !important; } html[data-modo="escuro"]:not(.tema-skin) .win-ctrl { background: var(--dk-card) !important; color: var(--dk-txt) !important; border-color: var(--dk-line2) var(--dk-line) var(--dk-line) var(--dk-line2) !important; } html[data-modo="escuro"]:not(.tema-skin) .win-ctrl.cls:hover { background: #cc0000 !important; color: #fff !important; } /* ── Botões ───────────────────────────────────────────────── */ html[data-modo="escuro"]:not(.tema-skin) :is(.win-btn, .btn-padrao, .btn-mini, .enc-pg-btn) { background: var(--dk-card) !important; color: var(--dk-txt) !important; border: 1px solid var(--dk-line2) !important; } html[data-modo="escuro"]:not(.tema-skin) :is(.win-btn:hover, .btn-padrao:hover, .btn-mini:hover, .enc-pg-btn:hover) { background: var(--dk-soft) !important; } html[data-modo="escuro"]:not(.tema-skin) :is(.win-btn.primary, .enc-pg-btn.active) { background: var(--dk-blue) !important; color: #fff !important; border-color: var(--dk-blue) !important; } html[data-modo="escuro"]:not(.tema-skin) :is(.win-btn.danger, .btn-mini-danger) { color: var(--dk-red) !important; border-color: var(--dk-red) !important; background: var(--dk-card) !important; } html[data-modo="escuro"]:not(.tema-skin) .enc-pg-display { background: var(--dk-soft) !important; color: var(--dk-txt) !important; } /* ── Inputs (inclui os com estilo inline) ─────────────────── */ html[data-modo="escuro"]:not(.tema-skin) :is( .win-input, .win-select, input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]), select, textarea ) { background: var(--dk-soft) !important; color: var(--dk-txt) !important; border-color: var(--dk-line2) !important; } html[data-modo="escuro"]:not(.tema-skin) :is(.win-input:focus, .win-select:focus, input:focus, select:focus, textarea:focus) { border-color: var(--dk-blue) !important; outline: none !important; box-shadow: 0 0 0 2px rgba(59,139,255,.35) !important; } html[data-modo="escuro"]:not(.tema-skin) ::placeholder { color: var(--dk-txt2) !important; opacity: 1; } html[data-modo="escuro"]:not(.tema-skin) :is(input[type=checkbox], input[type=radio]) { accent-color: var(--dk-blue); } /* ── Tabelas ──────────────────────────────────────────────── */ html[data-modo="escuro"]:not(.tema-skin) .win-table th { background: var(--dk-card) !important; color: var(--dk-txt2) !important; border-color: var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) .win-table td { background: var(--dk-panel) !important; color: var(--dk-txt) !important; border-color: var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) .win-table tr:nth-child(even) td { background: var(--dk-card) !important; } html[data-modo="escuro"]:not(.tema-skin) .win-table tr:hover td { background: var(--dk-blue) !important; color: #fff !important; } html[data-modo="escuro"]:not(.tema-skin) .contas-row-sel td { background: var(--dk-blue) !important; color: #fff !important; } /* ── OS form ──────────────────────────────────────────────── */ html[data-modo="escuro"]:not(.tema-skin) :is(.os-client-block, .os-footer) { background: var(--dk-card) !important; color: var(--dk-txt) !important; border-color: var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) .os-values-block { background: var(--dk-card) !important; border-color: var(--dk-line) !important; color: var(--dk-txt) !important; } html[data-modo="escuro"]:not(.tema-skin) :is(.os-client-label, .os-client-addr, .os-val-amount, .os-val-total, .os-footer label, .field-label, .os-dates-block table td:first-child) { color: #8ab4ff !important; } html[data-modo="escuro"]:not(.tema-skin) .os-client-val { color: var(--dk-red) !important; } html[data-modo="escuro"]:not(.tema-skin) .os-val-label { color: var(--dk-txt) !important; } html[data-modo="escuro"]:not(.tema-skin) .os-mid-row { border-bottom-color: var(--dk-line) !important; } /* ── Abas internas (OS / contas) ──────────────────────────── */ html[data-modo="escuro"]:not(.tema-skin) .os-tabs { background: var(--dk-chrome) !important; border-color: var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) .os-tab { background: var(--dk-card) !important; color: var(--dk-txt2) !important; border-color: var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) .os-tab.active { background: var(--dk-panel) !important; color: var(--dk-accent) !important; } html[data-modo="escuro"]:not(.tema-skin) .contas-aba { background: var(--dk-card) !important; color: var(--dk-txt2) !important; border-color: var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) .contas-aba.aba-ativa { background: var(--dk-panel) !important; color: var(--dk-accent) !important; border-bottom-color: var(--dk-panel) !important; } html[data-modo="escuro"]:not(.tema-skin) .contas-aba:hover:not(.aba-ativa) { background: var(--dk-soft) !important; } /* ── Painéis / caixas ─────────────────────────────────────── */ html[data-modo="escuro"] :is(.win-panel-box, .search-form-right) { background: var(--dk-card, var(--soft, #26282c)) !important; border-color: var(--dk-line, var(--line, #394049)) !important; color: var(--dk-txt, var(--panel-txt, #e6e8ec)) !important; } html[data-modo="escuro"]:not(.tema-skin) :is(.serie-section, .serie-note) { background: #3a361d !important; color: var(--dk-txt) !important; border-color: var(--dk-line) !important; } html[data-modo="escuro"]:not(.tema-skin) .results-table-wrap { border-color: var(--dk-line2) !important; } /* ── Linhas de status do Financeiro (contas-financeiro.js pinta inline): pago = #f0fff0 (verde claro) · vencida = #fff5f5 (rosa claro). No escuro viram tons ESCUROS equivalentes (verde-escuro / vinho), e as células (td) ficam transparentes pra faixa aparecer inteira. ── */ html[data-modo="escuro"] tr[style*="background:#f0fff0"] { background: #0f2618 !important; } html[data-modo="escuro"] tr[style*="background:#fff5f5"] { background: #2b1114 !important; } html[data-modo="escuro"] :is(tr[style*="background:#f0fff0"], tr[style*="background:#fff5f5"]) td { background: transparent !important; } /* Login cobrindo a tela: fundo escuro conforme o tema */ html[data-modo="escuro"] #login-overlay { background: var(--dk-bg, var(--bg, #0e0f12)) !important; } /* Os dropdowns de usuários do login e do modal de senha admin foram removidos na segurança v1.0 (vinham do /auth/logins público), e com eles as regras de dark mode que existiam só para eles. */ /* ── Modal Localizar OS (tem