/* ═══════════════════════════════════════════════
   S-VITIUM PRO v2 — Design System
   Fonte: Plus Jakarta Sans + DM Mono
   Tema: Escuro / Petróleo profissional
═══════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=DM+Mono:wght@400;500&display=swap');

:root, html[data-theme="dark"] {
  /* Superfícies */
  --bg:       #0c1220;
  --sb:       #0f172a;
  --s1:       #131e30;
  --s2:       #182338;
  --s3:       #1e2d44;
  --s4:       #253550;
  /* Bordas */
  --b0: rgba(255,255,255,.04);
  --b1: rgba(255,255,255,.07);
  --b2: rgba(255,255,255,.12);
  --b3: rgba(255,255,255,.18);
  /* Texto */
  --t1: #f1f5f9;
  --t2: #cbd5e1;
  --t3: #64748b;
  --t4: #334155;
  /* Acento laranja construção */
  --acc:   #f97316;
  --acc-d: #ea6c05;
  --acc-l: #fb923c;
  /* Azul */
  --blu:   #3b82f6;
  --blu-d: #2563eb;
  --blu-l: #60a5fa;
  /* Semânticos */
  --ok:    #10b981;
  --ok-l:  #34d399;
  --ok-bg: rgba(16,185,129,.1);
  --err:   #ef4444;
  --err-l: #f87171;
  --err-bg:rgba(239,68,68,.1);
  --war:   #f59e0b;
  --war-l: #fbbf24;
  --war-bg:rgba(245,158,11,.1);
  /* Layout */
  --sb-w: 252px;
  --tb-h: 60px;
  --r:    10px;
  --r-sm:  7px;
  --r-lg: 14px;
  --sh: 0 4px 20px rgba(0,0,0,.4);
  --sh-sm: 0 2px 8px rgba(0,0,0,.3);
  --sh-lg: 0 16px 48px rgba(0,0,0,.55);
}

/* ═══════════════════════════════════════════════
   LIGHT THEME
═══════════════════════════════════════════ */
html[data-theme="light"] {
  --bg:  #f1f5f9;
  --sb:  #ffffff;
  --s1:  #ffffff;
  --s2:  #f8fafc;
  --s3:  #f1f5f9;
  --s4:  #e2e8f0;
  --b0:  rgba(0,0,0,.06);
  --b1:  rgba(0,0,0,.1);
  --b2:  rgba(0,0,0,.14);
  --b3:  rgba(0,0,0,.2);
  --t1:  #0f172a;
  --t2:  #334155;
  --t3:  #64748b;
  --t4:  #94a3b8;
}

/* ── Reset ─────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin:0; padding:0; }
html { font-size:16px; scroll-behavior:smooth; }
body { font-family:'Plus Jakarta Sans',system-ui,sans-serif; font-size:.875rem; color:var(--t2); background:var(--bg); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { cursor:pointer; font-family:inherit; }

/* Scrollbar */
::-webkit-scrollbar { width:4px; height:4px; }
::-webkit-scrollbar-track { background:var(--sb); }
::-webkit-scrollbar-thumb { background:var(--s4); border-radius:99px; }
::-webkit-scrollbar-thumb:hover { background:var(--blu); }

/* ── Sidebar ─────────────────────────────────── */
#sidebar {
  width:var(--sb-w); background:var(--sb); min-height:100vh;
  position:fixed; left:0; top:0; z-index:100;
  display:flex; flex-direction:column;
  border-right:1px solid var(--b0);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
  overflow-y:auto; overflow-x:hidden;
}
/* Alterado: de min-height para height fixa e layout flex */
#sidebar { 
    width: var(--sidebar-w); 
    background: var(--sidebar-bg); 
    height: 100vh; /* Altura total da tela */
    position: fixed; 
    left: 0; 
    top: 0; 
    z-index: 50; 
    transition: transform .3s; 
    display: flex; 
    flex-direction: column; /* Alinha logo e nav verticalmente */
    overflow: hidden; /* Impede scroll no container pai */
}

/* Novo: Define que o nav é a área que rola */
#sidebar nav { 
    flex: 1; /* Ocupa todo o espaço restante */
    overflow-y: auto; /* Ativa o scroll vertical apenas aqui */
    scrollbar-width: thin; /* Firefox: scroll fino */
    scrollbar-color: rgba(255,255,255,0.1) transparent;
}

/* Customização da barra de rolagem (Chrome, Safari, Edge) */
#sidebar nav::-webkit-scrollbar {
    width: 5px;
}
#sidebar nav::-webkit-scrollbar-track {
    background: transparent;
}
#sidebar nav::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.1);
    border-radius: 10px;
}
#sidebar nav::-webkit-scrollbar-thumb:hover {
    background: rgba(255,255,255,0.2);
}

/* Ajuste opcional: Mantém o logo sempre visível no topo */
.sidebar-logo { 
    padding: 20px 16px 16px; 
    border-bottom: 1px solid rgba(255,255,255,0.06); 
    margin-bottom: 8px; 
    flex-shrink: 0; /* Impede o logo de "encolher" */
}

.sb-brand { padding:18px 16px 14px; border-bottom:1px solid var(--b0); display:flex; align-items:center; gap:10px; flex-shrink:0; }
.sb-brand-ico { width:36px; height:36px; border-radius:9px; background:linear-gradient(135deg,var(--acc),var(--acc-d)); display:flex; align-items:center; justify-content:center; flex-shrink:0; box-shadow:0 4px 12px rgba(249,115,22,.3); }
.sb-brand-ico i { color:#fff; font-size:.85rem; }
.sb-brand-name { font-size:.86rem; font-weight:800; color:var(--t1); letter-spacing:-.01em; }
.sb-brand-sub  { font-size:.62rem; color:var(--t3); }

/* Company switcher na sidebar */
.sb-company-btn { margin:10px 12px 4px; background:var(--s2); border:1px solid var(--b1); border-radius:var(--r-sm); padding:8px 12px; cursor:pointer; display:flex; align-items:center; gap:8px; transition:all .15s; position:relative; }
.sb-company-btn:hover { background:var(--s3); border-color:var(--b2); }
.sb-company-dot { width:7px; height:7px; border-radius:50%; background:var(--ok); flex-shrink:0; box-shadow:0 0 5px var(--ok); animation:blink 2s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.4} }
.sb-company-name { font-size:.75rem; font-weight:600; color:var(--t1); flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-company-chev { color:var(--t3); font-size:.6rem; transition:transform .2s; }
.sb-company-chev.open { transform:rotate(180deg); }

/* Company dropdown */
.company-dd { display:none; position:absolute; top:calc(100% + 6px); left:0; right:0; background:var(--s2); border:1px solid var(--b2); border-radius:var(--r-lg); box-shadow:var(--sh-lg); z-index:200; overflow:hidden; }
.company-dd.open { display:block; animation:slideDown .18s ease; }
@keyframes slideDown { from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:none} }
.co-item { padding:9px 14px; display:flex; align-items:center; gap:10px; cursor:pointer; transition:background .1s; border-bottom:1px solid var(--b0); }
.co-item:last-of-type { border-bottom:none; }
.co-item:hover { background:var(--s3); }
.co-item.sel { background:rgba(249,115,22,.06); }
.co-logo { width:32px; height:32px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:.7rem; font-weight:800; color:#fff; flex-shrink:0; }
.co-n  { font-size:.78rem; font-weight:600; color:var(--t1); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.co-cnpj { font-size:.66rem; color:var(--t3); }
.co-check { color:var(--ok); font-size:.8rem; margin-left:auto; }

.sb-nav { padding:6px 10px 20px; flex:1; overflow-y:auto; overflow-x:hidden; }
.sb-sec { font-size:.58rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--t4); padding:12px 8px 4px; }
.nav-item { display:flex; align-items:center; gap:9px; padding:7px 10px; border-radius:var(--r-sm); color:var(--t3); font-size:.79rem; font-weight:500; margin-bottom:1px; transition:all .15s; cursor:pointer; position:relative; }
.nav-item:hover { background:var(--s2); color:var(--t2); }
.nav-item.active { background:rgba(249,115,22,.12); color:var(--acc-l); font-weight:600; }
.nav-item.active::before { content:''; position:absolute; left:0; top:20%; bottom:20%; width:3px; background:var(--acc); border-radius:0 3px 3px 0; }
.nav-item i { width:15px; text-align:center; font-size:.77rem; flex-shrink:0; }
.nav-badge { margin-left:auto; background:var(--acc); color:#fff; font-size:.58rem; font-weight:800; padding:1px 6px; border-radius:99px; min-width:16px; text-align:center; }
.nav-badge.blue  { background:var(--blu); }
.nav-badge.green { background:var(--ok); }

/* ── Main ─────────────────────────────────────── */
#main { margin-left:var(--sb-w); min-height:100vh; display:flex; flex-direction:column; }

/* Topbar */
.topbar { background:var(--s1); border-bottom:1px solid var(--b0); height:var(--tb-h); padding:0 24px; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:50; }
.tb-left  { display:flex; align-items:center; gap:14px; }
.tb-right { display:flex; align-items:center; gap:10px; }
.tb-toggle { width:34px; height:34px; background:var(--s3); border:1px solid var(--b1); border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; color:var(--t3); cursor:pointer; transition:all .15s; }
.tb-toggle:hover { background:var(--s4); color:var(--t1); }
.tb-title { font-size:.9rem; font-weight:800; color:var(--t1); letter-spacing:-.01em; }

/* Search */
.tb-search { position:relative; }
.tb-search input { width:200px; background:var(--s3); border:1px solid var(--b1); border-radius:var(--r-sm); padding:7px 12px 7px 32px; color:var(--t1); font-size:.78rem; font-family:inherit; outline:none; transition:all .15s; }
.tb-search input:focus { border-color:var(--acc); width:240px; background:var(--s4); }
.tb-search input::placeholder { color:var(--t4); }
.tb-search-ico { position:absolute; left:9px; top:50%; transform:translateY(-50%); color:var(--t4); font-size:.75rem; pointer-events:none; }

/* Notif bell */
.notif-wrap { position:relative; }
.notif-btn { width:34px; height:34px; background:var(--s3); border:1px solid var(--b1); border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; color:var(--t3); cursor:pointer; transition:all .15s; position:relative; }
.notif-btn:hover { background:var(--s4); color:var(--t1); }
.notif-dot { position:absolute; top:6px; right:6px; width:7px; height:7px; background:var(--acc); border-radius:50%; border:1.5px solid var(--s1); animation:blink 2s infinite; }

/* Notif panel */
.notif-panel { display:none; position:absolute; top:calc(100% + 8px); right:0; width:320px; background:var(--s2); border:1px solid var(--b2); border-radius:var(--r-lg); box-shadow:var(--sh-lg); z-index:300; overflow:hidden; }
.notif-panel.open { display:block; animation:slideDown .18s ease; }
.notif-head { padding:13px 16px; border-bottom:1px solid var(--b0); display:flex; align-items:center; justify-content:space-between; }
.notif-head-title { font-size:.82rem; font-weight:700; color:var(--t1); }
.notif-item { padding:11px 16px; border-bottom:1px solid var(--b0); display:flex; gap:10px; cursor:pointer; transition:background .1s; }
.notif-item:hover { background:var(--s3); }
.notif-item.unread { background:rgba(249,115,22,.04); }
.notif-nd { width:7px; height:7px; border-radius:50%; background:var(--acc); flex-shrink:0; margin-top:5px; }
.notif-nd.read { background:transparent; border:1.5px solid var(--t4); }
.notif-text { font-size:.76rem; color:var(--t2); line-height:1.5; flex:1; }
.notif-time { font-size:.66rem; color:var(--t4); margin-top:2px; }

/* User pill */
.user-pill { display:flex; align-items:center; gap:8px; padding:4px 10px 4px 4px; background:var(--s3); border:1px solid var(--b1); border-radius:99px; cursor:pointer; transition:all .15s; position:relative; }
.user-pill:hover { background:var(--s4); border-color:var(--b2); }
.user-av { width:27px; height:27px; border-radius:50%; background:linear-gradient(135deg,var(--blu-d),#7c3aed); display:flex; align-items:center; justify-content:center; color:#fff; font-size:.68rem; font-weight:700; flex-shrink:0; }
.user-name { font-size:.77rem; font-weight:600; color:var(--t1); max-width:80px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ── Dropdown genérico ────────────────────────── */
.dd { position:relative; }
.dd-menu { display:none; position:absolute; top:calc(100% + 6px); right:0; min-width:175px; background:var(--s2); border:1px solid var(--b2); border-radius:var(--r); box-shadow:var(--sh-lg); z-index:300; overflow:hidden; }
.dd-menu.open { display:block; animation:slideDown .15s ease; }
.dd-item { display:flex; align-items:center; gap:9px; padding:9px 16px; font-size:.79rem; color:var(--t2); cursor:pointer; transition:background .1s; }
.dd-item:hover { background:var(--s3); color:var(--t1); }
.dd-item.danger { color:var(--err-l); }
.dd-item.danger:hover { background:var(--err-bg); }
.dd-item i { width:14px; color:var(--t3); }
.dd-item.danger i { color:var(--err-l); }
.dd-div { height:1px; background:var(--b0); margin:3px 0; }
.dd-head { padding:8px 16px 4px; font-size:.62rem; font-weight:700; color:var(--t4); text-transform:uppercase; letter-spacing:.07em; }

/* ── Page ─────────────────────────────────────── */
.page { padding:24px; flex:1; }
.page-header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:24px; gap:14px; flex-wrap:wrap; }
.page-title { font-size:1.15rem; font-weight:800; color:var(--t1); letter-spacing:-.02em; }
.page-sub { font-size:.76rem; color:var(--t3); margin-top:2px; }

/* ── Cards ────────────────────────────────────── */
.card { background:var(--s1); border:1px solid var(--b0); border-radius:var(--r); transition:border-color .15s; }
.card:hover { border-color:var(--b1); }
.card-p { padding:18px 20px; }
.card-header { padding:14px 20px; border-bottom:1px solid var(--b0); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.card-title { font-size:.83rem; font-weight:700; color:var(--t1); }

/* KPI */
.kpi { background:var(--s1); border:1px solid var(--b0); border-radius:var(--r); padding:16px 18px; position:relative; overflow:hidden; transition:all .15s; }
.kpi::after { content:''; position:absolute; bottom:0; left:0; right:0; height:2px; background:var(--kc,var(--acc)); opacity:.4; }
.kpi:hover { border-color:var(--b1); transform:translateY(-1px); }
.kpi-label { font-size:.65rem; font-weight:700; color:var(--t3); text-transform:uppercase; letter-spacing:.07em; margin-bottom:7px; }
.kpi-value { font-size:1.5rem; font-weight:800; color:var(--t1); line-height:1; }
.kpi-sub { font-size:.69rem; color:var(--t3); margin-top:4px; display:flex; align-items:center; gap:4px; }
.kpi-trend { display:inline-flex; align-items:center; gap:3px; font-size:.67rem; font-weight:700; padding:1px 6px; border-radius:99px; }
.kpi-trend.up   { color:var(--ok-l); background:var(--ok-bg); }
.kpi-trend.down { color:var(--err-l); background:var(--err-bg); }
.kpi-ico { position:absolute; top:14px; right:14px; width:36px; height:36px; border-radius:9px; background:var(--kc,var(--acc)); opacity:.12; }
.kpi-ico2 { position:absolute; top:14px; right:14px; width:36px; height:36px; border-radius:9px; display:flex; align-items:center; justify-content:center; color:var(--kc,var(--acc)); font-size:.9rem; }

/* ── Buttons ──────────────────────────────────── */
.btn { display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border-radius:var(--r-sm); font-size:.79rem; font-weight:600; font-family:inherit; border:1px solid transparent; cursor:pointer; transition:all .15s; white-space:nowrap; }
.btn:active { transform:scale(.98); }
.btn-primary { background:linear-gradient(135deg,var(--acc),var(--acc-d)); color:#fff; box-shadow:0 4px 12px rgba(249,115,22,.22); }
.btn-primary:hover { box-shadow:0 6px 18px rgba(249,115,22,.36); transform:translateY(-1px); }
.btn-secondary { background:var(--s3); color:var(--t2); border-color:var(--b1); }
.btn-secondary:hover { background:var(--s4); color:var(--t1); }
.btn-blue { background:linear-gradient(135deg,var(--blu),var(--blu-d)); color:#fff; box-shadow:0 4px 12px rgba(59,130,246,.22); }
.btn-blue:hover { box-shadow:0 6px 18px rgba(59,130,246,.36); transform:translateY(-1px); }
.btn-ok { background:rgba(16,185,129,.15); color:var(--ok-l); border-color:rgba(16,185,129,.2); }
.btn-ok:hover { background:rgba(16,185,129,.25); }
.btn-danger { background:rgba(239,68,68,.12); color:var(--err-l); border-color:rgba(239,68,68,.2); }
.btn-danger:hover { background:rgba(239,68,68,.22); }
.btn-ghost { background:transparent; color:var(--t3); }
.btn-ghost:hover { background:var(--s3); color:var(--t2); }
.btn-sm { padding:5px 12px; font-size:.74rem; border-radius:6px; }
.btn-xs { padding:3px 8px; font-size:.7rem; border-radius:5px; }
.btn-icon { width:32px; height:32px; padding:0; justify-content:center; }

/* Action group */
.act-group { display:inline-flex; background:var(--s3); border:1px solid var(--b1); border-radius:var(--r-sm); overflow:hidden; }
.act-group .btn { border-radius:0; border:none; background:transparent; border-right:1px solid var(--b1); }
.act-group .btn:last-child { border-right:none; }
.act-group .btn:hover { background:var(--s4); }

/* ── Forms ────────────────────────────────────── */
.form-label { display:block; font-size:.7rem; font-weight:700; color:var(--t3); margin-bottom:5px; text-transform:uppercase; letter-spacing:.04em; }
.form-input,
input[type=text],input[type=email],input[type=password],input[type=number],
input[type=date],input[type=month],input[type=tel],input[type=search],
input[type=file],select,textarea {
  display:block; width:100%; padding:9px 13px;
  font-family:inherit; font-size:.82rem;
  color:var(--t1)!important; background:var(--s3)!important;
  border:1px solid var(--b1); border-radius:var(--r-sm);
  outline:none; transition:all .15s; -webkit-appearance:none;
}
select {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M19 9l-7 7-7-7'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important; background-position:right 10px center!important; background-size:13px!important; padding-right:30px!important;
}
input::placeholder,textarea::placeholder { color:var(--t4)!important; opacity:1; }
input:focus,select:focus,textarea:focus { border-color:var(--acc)!important; box-shadow:0 0 0 3px rgba(249,115,22,.1)!important; background:var(--s4)!important; }
textarea { min-height:80px; resize:vertical; }
input[type=checkbox],input[type=radio] { width:15px!important; height:15px!important; padding:0!important; accent-color:var(--acc); }
input[type=file] { padding:7px 12px; background:var(--s3)!important; color:var(--t2)!important; cursor:pointer; font-size:.76rem; }
input[type=color] { height:40px; padding:4px 6px; }
.form-group { margin-bottom:14px; }
.g2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.g3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px; }

/* ── Table ────────────────────────────────────── */
.tbl { width:100%; border-collapse:collapse; }
.tbl thead tr { border-bottom:1px solid var(--b1); }
.tbl thead th { padding:9px 16px; font-size:.66rem; font-weight:700; color:var(--t3); text-transform:uppercase; letter-spacing:.06em; text-align:left; white-space:nowrap; }
.tbl tbody tr { border-bottom:1px solid var(--b0); transition:background .1s; }
.tbl tbody tr:hover { background:rgba(255,255,255,.02); }
.tbl tbody td { padding:11px 16px; font-size:.81rem; color:var(--t2); vertical-align:middle; }
.tbl tbody td:first-child { color:var(--t1); font-weight:500; }

/* ── Badges ───────────────────────────────────── */
.badge { display:inline-flex; align-items:center; padding:2px 10px; border-radius:99px; font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; gap:4px; }
.badge::before { content:''; width:5px; height:5px; border-radius:50%; background:currentColor; }
.badge-gray   { background:rgba(100,116,139,.15); color:#94a3b8; }
.badge-blue   { background:rgba(59,130,246,.15);  color:var(--blu-l); }
.badge-green  { background:rgba(16,185,129,.15);  color:var(--ok-l); }
.badge-red    { background:rgba(239,68,68,.15);   color:var(--err-l); }
.badge-yellow { background:rgba(245,158,11,.15);  color:var(--war-l); }
.badge-orange { background:rgba(249,115,22,.15);  color:var(--acc-l); }
.badge-purple { background:rgba(139,92,246,.15);  color:#a78bfa; }
.badge-teal   { background:rgba(20,184,166,.15);  color:#2dd4bf; }

/* ── Modal ────────────────────────────────────── */
.modal-bd { display:none; position:fixed; inset:0; background:rgba(0,0,0,.72); backdrop-filter:blur(4px); z-index:500; align-items:center; justify-content:center; padding:20px; }
.modal-bd.open { display:flex; animation:fadeIn .2s ease; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.modal { background:var(--s2); border:1px solid var(--b2); border-radius:var(--r-lg); width:100%; max-height:90vh; overflow-y:auto; box-shadow:var(--sh-lg); animation:slideUp .22s cubic-bezier(.4,0,.2,1); }
@keyframes slideUp { from{opacity:0;transform:translateY(14px) scale(.98)} to{opacity:1;transform:none} }
.modal-sm { max-width:440px; }
.modal-md { max-width:580px; }
.modal-lg { max-width:760px; }
.modal-xl { max-width:980px; }
.modal-h { padding:18px 22px 14px; border-bottom:1px solid var(--b0); display:flex; align-items:center; justify-content:space-between; }
.modal-title { font-size:.92rem; font-weight:800; color:var(--t1); }
.modal-close { width:28px; height:28px; background:var(--s3); border:1px solid var(--b1); border-radius:6px; display:flex; align-items:center; justify-content:center; color:var(--t3); cursor:pointer; font-size:.72rem; transition:all .15s; }
.modal-close:hover { background:var(--s4); color:var(--t1); }
.modal-b { padding:20px 22px; }
.modal-f { padding:14px 22px; border-top:1px solid var(--b0); display:flex; justify-content:flex-end; gap:10px; }

/* ── Toast ────────────────────────────────────── */
#toastWrap { position:fixed; top:70px; right:18px; z-index:1000; display:flex; flex-direction:column; gap:8px; pointer-events:none; }
.toast { background:var(--s2); border:1px solid var(--b2); border-radius:var(--r); padding:11px 14px; display:flex; align-items:flex-start; gap:10px; min-width:280px; max-width:380px; box-shadow:var(--sh-lg); pointer-events:all; animation:toastIn .25s cubic-bezier(.4,0,.2,1); position:relative; overflow:hidden; }
@keyframes toastIn { from{opacity:0;transform:translateX(18px)} to{opacity:1;transform:none} }
.toast::before { content:''; position:absolute; top:0; left:0; width:3px; height:100%; background:var(--tc,var(--acc)); }
.toast-ico { width:30px; height:30px; border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:.82rem; color:#fff; background:var(--tc,var(--acc)); opacity:.9; }
.toast-body { flex:1; }
.toast-title { font-weight:700; font-size:.8rem; color:var(--t1); margin-bottom:1px; }
.toast-msg { font-size:.73rem; color:var(--t3); line-height:1.4; }
.toast-x { color:var(--t4); cursor:pointer; font-size:.68rem; padding:2px; margin-top:1px; }
.toast-x:hover { color:var(--t2); }
.toast-bar { position:absolute; bottom:0; left:0; height:2px; background:var(--tc,var(--acc)); animation:tbProg 4s linear forwards; }
@keyframes tbProg { from{width:100%} to{width:0} }

/* ── Progress ─────────────────────────────────── */
.progress { background:var(--s4); border-radius:99px; overflow:hidden; }
.progress-fill { height:100%; border-radius:99px; transition:width .4s; }
.pf-acc { background:linear-gradient(90deg,var(--acc-d),var(--acc-l)); }
.pf-ok  { background:linear-gradient(90deg,#059669,var(--ok-l)); }
.pf-blu { background:linear-gradient(90deg,var(--blu-d),var(--blu-l)); }
.pf-err { background:linear-gradient(90deg,#b91c1c,var(--err-l)); }

/* ── Toggle ───────────────────────────────────── */
.toggle { display:inline-flex; align-items:center; gap:8px; cursor:pointer; }
.toggle input { display:none; }
.tog-track { width:34px; height:18px; background:var(--s4); border-radius:99px; border:1px solid var(--b2); position:relative; transition:all .2s; flex-shrink:0; }
.tog-thumb { position:absolute; top:2px; left:2px; width:12px; height:12px; border-radius:50%; background:#fff; transition:transform .2s cubic-bezier(.4,0,.2,1); box-shadow:0 1px 3px rgba(0,0,0,.3); }
.toggle input:checked + .tog-track { background:var(--ok); border-color:var(--ok); }
.toggle input:checked + .tog-track .tog-thumb { transform:translateX(16px); }
.tog-label { font-size:.77rem; color:var(--t2); font-weight:500; }

/* ── Overlay (mobile) ─────────────────────────── */
.sb-ov { display:none; position:fixed; inset:0; background:rgba(0,0,0,.55); backdrop-filter:blur(2px); z-index:99; }
.sb-ov.open { display:block; }

/* ── Utilities ────────────────────────────────── */
.flex  { display:flex; }
.grid  { display:grid; }
.items-center { align-items:center; }
.items-start  { align-items:flex-start; }
.justify-between { justify-content:space-between; }
.justify-end  { justify-content:flex-end; }
.flex-1  { flex:1; }
.flex-wrap { flex-wrap:wrap; }
.min-w-0 { min-width:0; }
.gap-1{gap:4px} .gap-2{gap:8px} .gap-3{gap:12px} .gap-4{gap:16px} .gap-5{gap:20px}
.mt-2{margin-top:8px} .mt-3{margin-top:12px} .mt-4{margin-top:16px} .mt-5{margin-top:20px} .mt-6{margin-top:24px}
.mb-2{margin-bottom:8px} .mb-3{margin-bottom:12px} .mb-4{margin-bottom:16px} .mb-5{margin-bottom:20px}
.p-4{padding:16px} .p-5{padding:20px}
.text-sm{font-size:.79rem} .text-xs{font-size:.69rem}
.text-right{text-align:right} .text-center{text-align:center}
.font-bold{font-weight:700} .font-semi{font-weight:600} .font-mono{font-family:'DM Mono',monospace}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-ok{color:var(--ok-l)} .c-err{color:var(--err-l)} .c-warn{color:var(--war-l)} .c-acc{color:var(--acc-l)} .c-blu{color:var(--blu-l)} .c-muted{color:var(--t3)}
.w-full{width:100%} .rounded{border-radius:var(--r)} .overflow-h{overflow:hidden} .overflow-x{overflow-x:auto}
.border-t{border-top:1px solid var(--b0)}
.hidden{display:none!important} .block{display:block}
.kpi-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }

@media(max-width:1100px){ .kpi-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:800px){
  #sidebar{transform:translateX(-100%)}
  #sidebar.open{transform:none;box-shadow:var(--sh-lg)}
  #main{margin-left:0}
  .page{padding:16px}
  .topbar{padding:0 16px}
  .kpi-grid{grid-template-columns:1fr 1fr}
  .g2,.g3{grid-template-columns:1fr}
}
@media print{
  #sidebar,.topbar,.btn,.no-print,.act-group{display:none!important}
  #main{margin-left:0}
  .card{box-shadow:none;border:1px solid #e2e8f0}
  body{background:#fff;color:#1a1a1a}
}

/* ── TEMA TOGGLE ───────────────────────────────────────────── */
.theme-btn{width:34px;height:34px;background:var(--s3);border:1px solid var(--b1);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;color:var(--t3);cursor:pointer;transition:all .15s;}
.theme-btn:hover{background:var(--s4);color:var(--t1);}

/* ── OBRAS DETALHE — hero imagem ───────────────────────────── */
.obra-hero{height:200px;position:relative;overflow:hidden;border-radius:var(--r) var(--r) 0 0;}
.obra-hero img{width:100%;height:100%;object-fit:cover;object-position:center;}
.obra-hero-overlay{position:absolute;inset:0;background:linear-gradient(to right,rgba(0,0,0,.72),rgba(0,0,0,.2) 55%,transparent);}
.obra-hero-content{position:absolute;bottom:0;left:0;right:0;padding:20px 24px;display:flex;align-items:flex-end;justify-content:space-between;}

/* ── SIDEBAR SCROLL refinement ─────────────────────────────── */
.sb-nav{overflow-y:auto;overflow-x:hidden;}
.sb-nav::-webkit-scrollbar{width:3px;}
.sb-nav::-webkit-scrollbar-track{background:transparent;}
.sb-nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:99px;}

/* ── LANDING ───────────────────────────────────────────────── */
.lp-nav{position:fixed;top:0;left:0;right:0;z-index:100;backdrop-filter:blur(12px);background:rgba(12,18,32,.88);border-bottom:1px solid var(--b1);}