/* Temas do painel (JSouzaNet). Carrega DEPOIS do <style> do index.html e sobrescreve cores e estilo do menu,
   botões, cartões e tabelas. O tema escolhido fica no atributo data-tema do <html> (ver tema.js).
   Cores do logo: verde #0AB451 e grafite #212123. Os 6 temas só mudam menu, botões e fundo; o conteúdo é o mesmo. */
:root{
  --bg:#F3F5F4; --bg2:#FFFFFF; --card:#FFFFFF; --card2:#F3F6F4; --border:#DCE2DF; --txt:#212123; --muted:#6B7478;
  --accent:#0AB451; --accent-text:#06733A; --accent-soft:#DCF5E5;
  --green:#12A150; --red:#DC4444; --amber:#C98A12;
  --cta-bg:#0AB451; --cta-ink:#05210F;
  --side-from:#FFFFFF; --side-to:#FFFFFF; --side-ink:#4E5457; --side-strong:#212123; --side-muted:#7C8488;
  --side-hover:#EBEFED; --side-line:#E8ECEA; --side-edge:#DCE2DF;
  --side-active-bg:#DCF5E5; --side-active-ink:#06733A; --side-active-bar:#0AB451;
  --shadow:0 1px 2px rgba(33,33,35,.05),0 6px 18px -12px rgba(33,33,35,.18);
}
:root[data-tema="menta"]{
  --bg:#F1F8F4; --card2:#EAF3EE; --border:#D5E5DB;
  --side-from:#E4F5EA; --side-to:#DAF0E2; --side-ink:#2B5A3F; --side-strong:#123A24; --side-muted:#5D8A6F; --side-hover:rgba(10,110,55,.09); --side-line:rgba(10,110,55,.14); --side-edge:#C6E2D0;
  --side-active-bg:#0AB451; --side-active-ink:#05210F; --side-active-bar:#212123;
}
:root[data-tema="papel"]{
  --bg:#F6F6F4; --card2:#F1F1EF; --border:#E2E2DE;
  --side-edge:#E2E2DE; --side-hover:#F0F0EE;
  --side-active-bg:#212123; --side-active-ink:#FFFFFF; --side-active-bar:#0AB451;
  --cta-bg:#212123; --cta-ink:#FFFFFF;
}
:root[data-tema="grafite"]{
  --side-from:#2A2B2E; --side-to:#1E1F21; --side-ink:#C9CFCC; --side-strong:#FFFFFF; --side-muted:#8E9693; --side-hover:rgba(255,255,255,.08); --side-line:rgba(255,255,255,.10); --side-edge:transparent;
  --side-active-bg:#0AB451; --side-active-ink:#05210F; --side-active-bar:#FFFFFF;
}
:root[data-tema="verde"]{
  --bg:#F2F7F4; --border:#D8E4DC;
  --side-from:#10BE58; --side-to:#08A245; --side-ink:#082F16; --side-strong:#05210F; --side-muted:rgba(5,33,15,.68); --side-hover:rgba(5,33,15,.09); --side-line:rgba(5,33,15,.16); --side-edge:transparent;
  --side-active-bg:#212123; --side-active-ink:#FFFFFF; --side-active-bar:#FFFFFF;
  --cta-bg:#212123; --cta-ink:#FFFFFF;
}
:root[data-tema="noite"]{
  color-scheme:dark;
  --bg:#0F1211; --bg2:#171B19; --card:#171B19; --card2:#1F2523; --border:#2A312E; --txt:#ECF0EE; --muted:#9AA5A0;
  --accent:#22C766; --accent-text:#6FE09A; --accent-soft:#123320;
  --green:#4ADE80; --red:#F87171; --amber:#FBBF24;
  --cta-bg:#22C766; --cta-ink:#05210F;
  --side-from:#141917; --side-to:#101412; --side-ink:#AEB7B3; --side-strong:#ECF0EE; --side-muted:#7F8A85; --side-hover:#1F2523; --side-line:#222826; --side-edge:#2A312E;
  --side-active-bg:#123320; --side-active-ink:#6FE09A; --side-active-bar:#22C766;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 28px -14px rgba(0,0,0,.6);
}

/* ---------- menu lateral ---------- */
aside{background:linear-gradient(to bottom,var(--side-from),var(--side-to));color:var(--side-ink);border-right:1px solid var(--side-edge);display:flex;flex-direction:column;scrollbar-width:thin}
.brand{display:block;padding:2px 8px 16px;border-bottom:1px solid var(--side-line);margin-bottom:4px}
.brand .brand-logo{display:block;height:26px;width:auto;max-width:100%}
.brand small{display:block;margin-top:9px;font-size:11.5px;font-weight:600;color:var(--side-muted);letter-spacing:.02em}
.menu-section{color:var(--side-muted);letter-spacing:.14em}
.menu-item{color:var(--side-ink);font-weight:550;position:relative}
.menu-item:hover{background:var(--side-hover);color:var(--side-strong);transform:none}
.menu-item.active{background:var(--side-active-bg);color:var(--side-active-ink);border-color:transparent;box-shadow:none;font-weight:650}
.menu-item.active::before{content:"";position:absolute;left:-16px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--side-active-bar)}
.menu-item .ico{background:transparent;width:22px;height:22px;border-radius:0;color:currentColor}
.menu-item:hover .ico{background:transparent}
.menu-item.active .ico{background:transparent;box-shadow:none}
.menu-item .ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
.menu-subitem{color:var(--side-ink);margin-left:12px;border-left:1px solid var(--side-line);border-radius:0 8px 8px 0}
.menu-subitem:hover{background:var(--side-hover);color:var(--side-strong)}
.menu-subitem.active{background:var(--side-active-bg);color:var(--side-active-ink);border-color:var(--side-line)}
.menu-note{color:var(--side-muted)}
.who-btn{margin-top:auto;display:flex;align-items:center;gap:10px;width:100%;border:0;background:var(--side-hover);color:var(--side-strong);border-radius:12px;padding:11px 12px;cursor:pointer;text-align:left;font:inherit}
.who-btn .av{width:32px;height:32px;border-radius:50%;background:var(--accent);color:#05210F;font-weight:800;font-size:12.5px;display:grid;place-items:center;flex-shrink:0}
.who-btn b{display:block;font-size:13px}.who-btn span.l{font-size:11.5px;color:var(--side-muted)}
.who-btn svg{margin-left:auto;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;opacity:.7;stroke-linecap:round;stroke-linejoin:round}
aside .brand+.menu-section{margin-top:14px}

/* ---------- botões, selos, abas ---------- */
.sync-btn{background:var(--cta-bg);color:var(--cta-ink);box-shadow:none;border-radius:10px;padding:9px 15px;font-weight:650}
.sync-btn:hover{filter:brightness(1.07)}
.sync-btn.toggle-off{background:var(--card);color:var(--txt);border:1px solid var(--border)}
.badge{background:var(--accent-soft);color:var(--accent-text);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent)}
.badge.is-readonly::before{background:var(--accent);box-shadow:none}
.tab.active{background:var(--accent-soft);color:var(--accent-text);border-color:color-mix(in srgb,var(--accent) 40%,transparent)}
.tipos-tab-btn.active{background:var(--accent);color:#05210F;border-color:var(--accent)}
.num-badge{background:var(--accent);color:#05210F;box-shadow:none}
.num-badge.mini{background:var(--accent);box-shadow:none}
.filial-chart .falta-line .val-highlight{background:var(--accent);color:#05210F}
.sync-toast{background:var(--accent);color:#05210F}
.accent,.kpi .accent{color:var(--accent-text)}

/* ---------- cartões, tabelas, janelas ---------- */
.kpi,.card{box-shadow:var(--shadow)}
.page-head h2{letter-spacing:-.02em}
.table-wrap{border-radius:12px}
.emp-row td{background:var(--card2)}
.modal-close:hover{background:var(--card2);filter:brightness(.97)}
.modal{box-shadow:0 30px 80px -20px rgba(0,0,0,.5)}
.resumo-block{color:var(--txt)}
.val-empty{color:var(--muted)}
::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--muted) 45%,transparent)}
:root[data-tema="noite"] .tip{background:#2A312E;color:#ECF0EE;border-color:#ECF0EE}
:root[data-tema="noite"] .tip::before{border-top-color:#2A312E}
:root[data-tema="noite"] .tip::after{border-top-color:#ECF0EE}
:root[data-tema="noite"] input,:root[data-tema="noite"] select,:root[data-tema="noite"] textarea{background:var(--card2);color:var(--txt);border-color:var(--border)}

/* ---------- janela "Aparência do painel" ---------- */
.tema-ov{position:fixed;inset:0;z-index:200;background:rgba(5,12,6,.55);display:none;align-items:center;justify-content:center;padding:16px}
.tema-ov.open{display:flex}
.tema-win{background:var(--card);color:var(--txt);border:1px solid var(--border);border-radius:18px;box-shadow:0 30px 80px -20px rgba(0,0,0,.5);width:min(720px,100%);max-height:calc(100vh - 32px);display:flex;flex-direction:column}
.tema-win header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 20px 10px}
.tema-win header h3{margin:0;font-size:18px;font-weight:800}.tema-win header p{margin:3px 0 0;color:var(--muted);font-size:13px}
.tema-x{border:0;background:var(--card2);color:var(--txt);width:34px;height:34px;border-radius:10px;cursor:pointer;font-size:16px;flex-shrink:0}
.tema-corpo{padding:6px 20px 8px;overflow:auto}
.tema-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;padding-bottom:12px}
.tema-op{text-align:left;border:2px solid var(--border);background:var(--card);border-radius:14px;padding:10px 10px 12px;cursor:pointer;display:grid;gap:8px;color:var(--txt);font:inherit}
.tema-op:hover{border-color:var(--muted)}
.tema-op[aria-pressed="true"]{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.tema-op .mini{height:74px;border-radius:9px;display:grid;grid-template-columns:34% 1fr;overflow:hidden;border:1px solid var(--border)}
.tema-op .mini i{display:block}
.tema-op .mini .c{padding:8px;display:grid;gap:5px;align-content:start}
.tema-op .mini .c b{display:block;height:6px;border-radius:3px}
.tema-op .nm{display:flex;align-items:center;justify-content:space-between;font-weight:700}
.tema-op .ds{font-size:12px;color:var(--muted);margin-top:-4px}
.tema-op .sw{display:flex;gap:5px}.tema-op .sw u{width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.14);display:block}
.tema-win footer{display:flex;justify-content:flex-end;padding:12px 20px 16px;border-top:1px solid var(--border)}
@media (max-width:900px){.menu-item.active::before{left:-10px}}