/* =========================================================
   MISSÃO 2026 — Dashboard da Campanha
   Design moderno · Dark premium · Responsivo
   ========================================================= */

/* ===== TEMA DARK (padrão) ===== */
:root,
[data-theme="dark"]{
  --bg-primary:#0a0e1a;
  --bg-secondary:#111827;
  --bg-tertiary:#1a2332;
  --bg-card:#151c2e;
  --bg-card-hover:#1d2540;
  --border:#243147;
  --border-strong:#334155;
  --text-primary:#f1f5f9;
  --text-secondary:#94a3b8;
  --text-muted:#64748b;
  --accent:#3b82f6;
  --accent-hover:#2563eb;
  --gold:#f59e0b;
  --gold-hover:#d97706;
  --green:#10b981;
  --red:#ef4444;
  --purple:#8b5cf6;
  --cyan:#06b6d4;
  --map-tile-url:"dark_all";
  --gradient-primary:linear-gradient(135deg,#1e3a8a 0%,#3b82f6 100%);
  --gradient-gold:linear-gradient(135deg,#d97706 0%,#f59e0b 100%);
  --gradient-card:linear-gradient(135deg,rgba(59,130,246,.08) 0%,rgba(139,92,246,.08) 100%);
  --shadow-sm:0 2px 8px rgba(0,0,0,.2);
  --shadow-md:0 4px 16px rgba(0,0,0,.3);
  --shadow-lg:0 8px 32px rgba(0,0,0,.4);
  --shadow-glow:0 0 24px rgba(59,130,246,.25);
  --sidebar-bg:linear-gradient(180deg,#0f172a 0%,#0a0e1a 100%);
  --kpi-pill-bg-1:rgba(16,185,129,.15);
  --kpi-pill-bg-2:rgba(239,68,68,.15);
  --kpi-pill-bg-3:rgba(245,158,11,.15);
}

/* ===== TEMA CLARO ===== */
[data-theme="light"]{
  --bg-primary:#f6f8fc;
  --bg-secondary:#ffffff;
  --bg-tertiary:#eef2f7;
  --bg-card:#ffffff;
  --bg-card-hover:#f1f5f9;
  --border:#e2e8f0;
  --border-strong:#cbd5e1;
  --text-primary:#0f172a;
  --text-secondary:#475569;
  --text-muted:#64748b;
  --accent:#2563eb;
  --accent-hover:#1d4ed8;
  --gold:#d97706;
  --gold-hover:#b45309;
  --green:#059669;
  --red:#dc2626;
  --purple:#7c3aed;
  --cyan:#0891b2;
  --map-tile-url:"light_all";
  --gradient-primary:linear-gradient(135deg,#1e40af 0%,#2563eb 100%);
  --gradient-gold:linear-gradient(135deg,#b45309 0%,#d97706 100%);
  --gradient-card:linear-gradient(135deg,rgba(37,99,235,.06) 0%,rgba(124,58,237,.06) 100%);
  --shadow-sm:0 1px 3px rgba(15,23,42,.06);
  --shadow-md:0 4px 12px rgba(15,23,42,.08);
  --shadow-lg:0 12px 32px rgba(15,23,42,.12);
  --shadow-glow:0 0 18px rgba(37,99,235,.2);
  --sidebar-bg:linear-gradient(180deg,#ffffff 0%,#f6f8fc 100%);
  --kpi-pill-bg-1:rgba(5,150,105,.12);
  --kpi-pill-bg-2:rgba(220,38,38,.12);
  --kpi-pill-bg-3:rgba(217,119,6,.12);
}

html{transition:background .25s}

/* ===== TELA DE LOGIN ===== */
.auth-bg{
  position:fixed;inset:0;
  background:linear-gradient(135deg,#0a0e1a 0%,#1e1b4b 50%,#1e3a8a 100%);
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  overflow-y:auto;
  font-family:'Inter','Segoe UI',system-ui,sans-serif;
}
.auth-bg::before{
  content:"";
  position:absolute;inset:0;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(59,130,246,.15) 0%, transparent 50%),
    radial-gradient(circle at 80% 80%, rgba(245,158,11,.12) 0%, transparent 50%),
    radial-gradient(circle at 50% 50%, rgba(139,92,246,.08) 0%, transparent 60%);
  pointer-events:none;
}
.auth-card{
  position:relative;
  background:rgba(21,28,46,.95);
  border:1px solid rgba(59,130,246,.3);
  border-radius:20px;
  padding:44px 40px;
  max-width:440px;
  width:100%;
  box-shadow:0 24px 64px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.05);
  backdrop-filter:blur(20px);
  animation:authIn .5s cubic-bezier(.16,1,.3,1);
}
@keyframes authIn{from{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}

.auth-header{text-align:center;margin-bottom:32px}
.auth-logo{
  width:72px;height:72px;
  margin:0 auto 16px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#3b82f6,#8b5cf6);
  border-radius:20px;
  color:#fff;
  box-shadow:0 8px 32px rgba(59,130,246,.4);
}
.auth-logo svg{width:36px;height:36px}
.auth-title{
  font-size:28px;
  font-weight:800;
  letter-spacing:-.03em;
  background:linear-gradient(135deg,#f1f5f9,#94a3b8);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  margin-bottom:4px;
}
.auth-subtitle{
  font-size:12px;
  color:#f59e0b;
  text-transform:uppercase;
  letter-spacing:.15em;
  font-weight:700;
  margin-bottom:16px;
}
.auth-cand{
  font-size:14px;
  color:#cbd5e1;
  font-weight:500;
  line-height:1.5;
}
.auth-cand small{color:#64748b;font-size:11px}

.auth-error{
  padding:12px 14px;
  background:rgba(239,68,68,.12);
  border:1px solid rgba(239,68,68,.3);
  color:#fca5a5;
  border-radius:10px;
  font-size:13px;
  margin-bottom:20px;
  animation:shake .4s ease;
}
@keyframes shake{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-6px)}
  75%{transform:translateX(6px)}
}

.auth-form{display:flex;flex-direction:column;gap:14px}
.auth-form label{display:flex;flex-direction:column;gap:6px}
.auth-form label span{
  font-size:11px;
  color:#94a3b8;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.auth-form input{
  padding:13px 16px;
  background:rgba(15,23,42,.8);
  border:1px solid rgba(59,130,246,.2);
  border-radius:10px;
  color:#f1f5f9;
  font-size:15px;
  font-family:inherit;
  transition:all .15s;
}
.auth-form input::placeholder{color:#475569}
.auth-form input:focus{
  outline:none;
  border-color:#3b82f6;
  box-shadow:0 0 0 3px rgba(59,130,246,.2);
  background:rgba(15,23,42,.95);
}
.auth-form input:-webkit-autofill{
  -webkit-text-fill-color:#f1f5f9 !important;
  -webkit-box-shadow:0 0 0 40px rgba(15,23,42,.95) inset !important;
}

.auth-btn{
  margin-top:8px;
  padding:14px 20px;
  background:linear-gradient(135deg,#3b82f6,#2563eb);
  border:0;
  border-radius:10px;
  color:#fff;
  font-size:15px;
  font-weight:700;
  font-family:inherit;
  cursor:pointer;
  transition:all .2s;
  box-shadow:0 8px 24px rgba(59,130,246,.3);
}
.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 12px 32px rgba(59,130,246,.4)}
.auth-btn:active:not(:disabled){transform:translateY(0)}
.auth-btn:disabled{opacity:.7;cursor:wait}

.auth-footer{
  margin-top:28px;
  padding-top:20px;
  border-top:1px solid rgba(59,130,246,.1);
  text-align:center;
}
.auth-security{
  font-size:11px;
  color:#10b981;
  margin-bottom:6px;
  font-weight:600;
}
.auth-copy{font-size:11px;color:#475569}

/* ===== USER BADGE NA TOPBAR ===== */
.user-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:5px 12px 5px 5px;
  background:var(--bg-tertiary);
  border:1px solid var(--border);
  border-radius:999px;
  font-size:12px;
  cursor:pointer;
  transition:all .15s;
}
.user-badge:hover{background:var(--bg-card-hover);border-color:var(--accent)}
.user-avatar{
  width:32px;height:32px;
  border-radius:50%;
  background:linear-gradient(135deg,#3b82f6,#8b5cf6);
  display:flex;align-items:center;justify-content:center;
  color:#fff;
  font-size:11px;
  font-weight:800;
  flex-shrink:0;
  overflow:hidden;
  border:2px solid var(--gold);
}
.user-name{font-weight:600;color:var(--text-primary)}
.user-role{
  font-size:10px;
  color:var(--text-muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:700;
}

*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden}
body{
  font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  background:var(--bg-primary);
  color:var(--text-primary);
  font-size:14px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

/* ===== LAYOUT ===== */
.app{
  display:grid;
  grid-template-columns:260px 1fr;
  grid-template-rows:100vh;
  height:100vh;
  overflow:hidden;
}

/* ===== SIDEBAR ===== */
.sidebar{
  background:var(--sidebar-bg);
  border-right:1px solid var(--border);
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  overflow-x:hidden;
  min-width:0;
  width:260px;
  position:relative;
  z-index:10;
}
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-track{background:transparent}
.sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}

/* Overlay do menu lateral (somente mobile). Oculto por padrão no desktop. */
.sidebar-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(2,6,23,.6);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
  z-index:40;
  opacity:0;
  transition:opacity .25s ease;
}
.sidebar-overlay[hidden]{display:none}

.brand{
  min-height:230px;
  padding:24px 20px 32px !important;
  border-bottom:1px solid var(--border);
  position:relative;
  overflow:visible !important;
  text-align:center;
  z-index:2;
}
.brand-photo-wrap{
  width:80px;height:80px;
  margin:0 auto 24px !important;
  border-radius:50%;
  overflow:hidden;
  border:3px solid var(--gold);
  box-shadow:0 4px 12px rgba(245,158,11,.3);
  background:var(--gradient-gold);
  position:relative;
  z-index:3;
  flex-shrink:0;
}
.brand-photo{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
.brand-cand{margin-top:8px}
.brand::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;height:3px;
  background:var(--gradient-gold);
}
.brand-title{
  font-size:18px;
  font-weight:800;
  letter-spacing:-.02em;
  background:linear-gradient(135deg,var(--text-primary),var(--text-secondary));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.brand-subtitle{
  font-size:11px;
  color:var(--gold);
  margin-top:4px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.brand-cand{
  font-size:13px;
  color:var(--text-secondary);
  margin-top:8px;
}

.nav{padding:12px 0;flex:1;position:relative;z-index:1;margin-top:12px}
.nav-section{
  position:relative;
  z-index:1;
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--text-muted);
  padding:16px 20px 8px;
}
.nav-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 20px;
  color:var(--text-secondary);
  cursor:pointer;
  transition:all .15s;
  border-left:3px solid transparent;
  font-size:13.5px;
  font-weight:500;
  user-select:none;
}
.nav-item:hover{
  background:var(--bg-tertiary);
  color:var(--text-primary);
}
.nav-item.active{
  background:linear-gradient(90deg,rgba(59,130,246,.15),transparent);
  color:#fff;
  border-left-color:var(--accent);
}
.nav-item .icon{
  width:18px;
  height:18px;
  stroke-width:2;
  flex-shrink:0;
}

.sidebar-footer{
  padding:16px 20px;
  border-top:1px solid var(--border);
  font-size:11px;
  color:var(--text-muted);
}
.sidebar-footer .badge{
  display:inline-block;
  padding:3px 8px;
  background:var(--kpi-pill-bg-1);
  color:var(--green);
  border-radius:4px;
  font-weight:600;
  font-size:10px;
  margin-top:6px;
}

/* ===== MAIN ===== */
.main{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  min-width:0;
  width:100%;
}
.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 28px;
  border-bottom:1px solid var(--border);
  background:var(--bg-secondary);
  gap:20px;
}
.topbar-left{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
/* Botão hambúrguer: oculto no desktop, visível no mobile via media query */
.menu-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  flex-shrink:0;
  border:1px solid var(--border-strong);
  border-radius:10px;
  background:var(--bg-tertiary);
  color:var(--text-primary);
  cursor:pointer;
  padding:0;
  -webkit-tap-highlight-color:transparent;
  transition:background .15s,border-color .15s;
}
.menu-toggle:hover{background:var(--bg-card-hover);border-color:var(--accent)}
.menu-toggle:active{transform:scale(.96)}
.menu-toggle svg{width:22px;height:22px;display:block}
.topbar-title{
  font-size:20px;
  font-weight:700;
  letter-spacing:-.02em;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.topbar-title small{
  color:var(--text-muted);
  font-weight:500;
  font-size:13px;
  margin-left:8px;
}
.topbar-actions{
  display:flex;
  align-items:center;
  gap:10px;
}

.btn{
  padding:8px 14px;
  border-radius:8px;
  border:1px solid var(--border-strong);
  background:var(--bg-tertiary);
  color:var(--text-primary);
  font-size:13px;
  font-weight:500;
  cursor:pointer;
  transition:all .15s;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.btn:hover{background:var(--bg-card-hover);border-color:var(--accent)}
.btn-primary{
  background:var(--gradient-primary);
  border-color:transparent;
  color:#fff;
}
.btn-primary:hover{filter:brightness(1.1)}

.content{
  flex:1;
  overflow-y:auto;
  overflow-x:hidden;
  padding:24px 28px;
  background:var(--bg-primary);
  min-width:0;
  min-height:0;
}
.content::-webkit-scrollbar{width:8px}
.content::-webkit-scrollbar-track{background:var(--bg-primary)}
.content::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}

/* ===== PAGE ===== */
.page{display:none;animation:fadeIn .25s ease}
.page.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* ===== CARDS ===== */
.card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:12px;
  padding:20px;
  transition:all .15s;
  box-shadow:var(--shadow-sm);
}
.card:hover{border-color:var(--border-strong)}
.card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:16px;
}
.card-title{
  font-size:14px;
  font-weight:600;
  color:var(--text-primary);
  letter-spacing:-.01em;
}
.card-subtitle{
  font-size:12px;
  color:var(--text-muted);
}

/* ===== KPI GRID ===== */
.kpi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
  margin-bottom:24px;
}
.kpi{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:12px;
  padding:20px;
  position:relative;
  overflow:hidden;
}
.kpi::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;height:2px;
  background:var(--accent);
}
.kpi.gold::before{background:var(--gold)}
.kpi.green::before{background:var(--green)}
.kpi.red::before{background:var(--red)}
.kpi.purple::before{background:var(--purple)}
.kpi-label{
  font-size:11px;
  color:var(--text-muted);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:600;
  margin-bottom:8px;
}
.kpi-value{
  font-size:30px;
  font-weight:800;
  letter-spacing:-.03em;
  line-height:1.1;
  color:var(--text-primary);
}
.kpi-value.small{font-size:22px}
.kpi-sub{
  font-size:12px;
  color:var(--text-secondary);
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:6px;
}
.kpi-delta{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:2px 6px;
  border-radius:4px;
  font-size:11px;
  font-weight:600;
}
.kpi-delta.up{background:rgba(16,185,129,.15);color:var(--green)}
.kpi-delta.down{background:rgba(239,68,68,.15);color:var(--red)}
.kpi-delta.warn{background:rgba(245,158,11,.15);color:var(--gold)}

/* ===== GRID LAYOUTS ===== */
.row{display:grid;gap:16px;margin-bottom:16px}
.row.cols-2{grid-template-columns:1fr 1fr}
.row.cols-3{grid-template-columns:repeat(3,1fr)}
.row.cols-4{grid-template-columns:repeat(4,1fr)}
.row.cols-12-8{grid-template-columns:1.5fr 1fr}
.row.cols-8-12{grid-template-columns:1fr 1.5fr}
@media (max-width:1100px){
  .row.cols-2,.row.cols-3,.row.cols-4,.row.cols-12-8,.row.cols-8-12{grid-template-columns:1fr}
}

/* ===== PROGRESS ===== */
.progress{
  background:var(--bg-tertiary);
  border-radius:999px;
  height:10px;
  overflow:hidden;
  position:relative;
}
.progress-bar{
  height:100%;
  background:var(--gradient-primary);
  border-radius:999px;
  transition:width .4s ease;
  position:relative;
}
.progress-bar.gold{background:var(--gradient-gold)}
.progress-bar::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);
  animation:shimmer 2.4s infinite;
}
@keyframes shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}

.progress-meta{
  display:flex;
  justify-content:space-between;
  font-size:12px;
  color:var(--text-secondary);
  margin-top:8px;
}

/* ===== TABLES ===== */
.table-wrap{
  overflow-x:auto;
  border-radius:8px;
  border:1px solid var(--border);
}
.table-wrap::-webkit-scrollbar{height:8px}
.table-wrap::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}

table{width:100%;border-collapse:collapse;font-size:13px}
thead{
  background:var(--bg-tertiary);
  position:sticky;top:0;z-index:1;
}
th{
  text-align:left;
  padding:10px 14px;
  font-weight:600;
  font-size:11.5px;
  color:var(--text-muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  border-bottom:1px solid var(--border);
  white-space:nowrap;
  cursor:pointer;
  user-select:none;
}
th:hover{color:var(--text-primary)}
th.sorted::after{content:" ▾";color:var(--accent)}
th.sorted-asc::after{content:" ▴";color:var(--accent)}
td{
  padding:10px 14px;
  border-bottom:1px solid var(--border);
  color:var(--text-primary);
}
tbody tr{transition:background .1s}
tbody tr:hover{background:var(--bg-card-hover)}
tbody tr:last-child td{border-bottom:0}

.pill{
  display:inline-block;
  padding:3px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:600;
}
.pill-blue{background:rgba(59,130,246,.18);color:#60a5fa}
.pill-gold{background:rgba(245,158,11,.18);color:var(--gold)}
.pill-green{background:rgba(16,185,129,.18);color:var(--green)}
.pill-red{background:rgba(239,68,68,.18);color:#f87171}
.pill-purple{background:rgba(139,92,246,.18);color:#a78bfa}
.pill-gray{background:rgba(100,116,139,.2);color:var(--text-secondary)}

[data-theme="light"] .pill-blue{background:rgba(37,99,235,.14);color:#1d4ed8}
[data-theme="light"] .pill-gold{background:rgba(217,119,6,.15);color:#b45309}
[data-theme="light"] .pill-green{background:rgba(5,150,105,.14);color:#047857}
[data-theme="light"] .pill-red{background:rgba(220,38,38,.14);color:#b91c1c}
[data-theme="light"] .pill-purple{background:rgba(124,58,237,.14);color:#6d28d9}
[data-theme="light"] .pill-gray{background:rgba(100,116,139,.15);color:#475569}

[data-theme="light"] .kpi-delta.up{background:rgba(5,150,105,.14);color:#047857}
[data-theme="light"] .kpi-delta.down{background:rgba(220,38,38,.14);color:#b91c1c}
[data-theme="light"] .kpi-delta.warn{background:rgba(217,119,6,.15);color:#b45309}

[data-theme="light"] .alert-info{
  background:rgba(37,99,235,.06);
  border-color:rgba(37,99,235,.25);
  color:#1d4ed8;
}
[data-theme="light"] .alert-warn{
  background:rgba(217,119,6,.08);
  border-color:rgba(217,119,6,.25);
  color:#b45309;
}

/* ===== FILTERS ===== */
.filters{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:16px;
  align-items:center;
}
.search-box{
  position:relative;
  flex:1;
  min-width:260px;
  max-width:420px;
}
.search-box input{
  width:100%;
  padding:10px 14px 10px 38px;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--bg-card);
  color:var(--text-primary);
  font-size:13px;
  transition:all .15s;
}
.search-box input:focus{
  outline:none;
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(59,130,246,.15);
}
.search-box::before{
  content:"🔍";
  position:absolute;
  left:12px;top:50%;
  transform:translateY(-50%);
  font-size:13px;
  opacity:.6;
}
select{
  padding:10px 14px;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--bg-card);
  color:var(--text-primary);
  font-size:13px;
  cursor:pointer;
  transition:all .15s;
}
select:focus{outline:none;border-color:var(--accent)}

.counter{
  margin-left:auto;
  font-size:12px;
  color:var(--text-muted);
}
.counter strong{color:var(--accent);font-weight:700}

/* ===== MAP ===== */
#map,#heatmap{
  height:620px;
  border-radius:12px;
  overflow:hidden;
  border:1px solid var(--border);
}
.leaflet-container{
  background:var(--bg-primary) !important;
  font-family:inherit !important;
}
.leaflet-popup-content-wrapper{
  background:var(--bg-card) !important;
  color:var(--text-primary) !important;
  border-radius:10px !important;
  border:1px solid var(--border) !important;
  box-shadow:var(--shadow-md) !important;
}
.leaflet-popup-tip{background:var(--bg-card) !important;border:1px solid var(--border) !important}
.leaflet-popup-content{margin:12px 16px !important;font-size:13px !important}
.leaflet-control-zoom a{
  background:var(--bg-card) !important;
  color:var(--text-primary) !important;
  border:1px solid var(--border) !important;
}
.leaflet-control-zoom a:hover{background:var(--bg-card-hover) !important}
.leaflet-control-attribution{
  background:var(--bg-card) !important;
  color:var(--text-muted) !important;
  font-size:10px !important;
  opacity:.9;
}
.leaflet-control-attribution a{color:var(--text-secondary) !important}
.popup-title{
  font-weight:700;
  font-size:14px;
  margin-bottom:6px;
  color:var(--accent);
}
.popup-row{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:2px 0;
  font-size:12px;
}
.popup-row span:first-child{color:var(--text-muted)}
.popup-row span:last-child{color:var(--text-primary);font-weight:600}

/* Mapa coropletico - loading spinner */
.mapa-loading{
  position:absolute;
  top:0;left:0;right:0;bottom:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:var(--bg-card);
  z-index:600;
  border-radius:12px;
}
.mapa-spinner{
  width:40px;height:40px;
  border:4px solid var(--border);
  border-top-color:var(--accent);
  border-radius:50%;
  animation:mapa-spin 0.8s linear infinite;
}
@keyframes mapa-spin{
  to{transform:rotate(360deg)}
}

/* Painel de drill-down lateral */
.mapa-drilldown{
  position:absolute;
  top:0;right:0;bottom:0;
  width:340px;
  max-width:90vw;
  background:var(--bg-card);
  border-left:1px solid var(--border);
  border-radius:0 12px 12px 0;
  z-index:700;
  overflow-y:auto;
  box-shadow:-4px 0 24px rgba(0,0,0,.3);
  padding:16px;
  animation:mapa-slide-in .25s ease-out;
}
@keyframes mapa-slide-in{
  from{transform:translateX(100%);opacity:0}
  to{transform:translateX(0);opacity:1}
}
.mapa-drilldown-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:12px;
  padding-bottom:10px;
  border-bottom:1px solid var(--border);
}
.mapa-drilldown-header h3{
  font-size:15px;
  font-weight:700;
  color:var(--text-primary);
  margin:0;
}
.mapa-drilldown-close{
  background:none;
  border:1px solid var(--border);
  color:var(--text-secondary);
  width:28px;height:28px;
  border-radius:6px;
  cursor:pointer;
  font-size:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all .15s;
}
.mapa-drilldown-close:hover{
  background:var(--red);
  color:#fff;
  border-color:var(--red);
}
.mapa-drilldown-item{
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:8px;
  margin-bottom:8px;
  background:var(--bg-tertiary);
  transition:border-color .15s;
}
.mapa-drilldown-item:hover{
  border-color:var(--accent);
}
.mapa-drilldown-item .dd-nome{
  font-weight:700;
  font-size:13px;
  color:var(--text-primary);
  margin-bottom:4px;
}
.mapa-drilldown-item .dd-meta{
  font-size:11px;
  color:var(--text-muted);
  display:flex;
  flex-wrap:wrap;
  gap:6px 12px;
}
.mapa-drilldown-item .dd-meta span{
  display:inline-flex;
  align-items:center;
  gap:3px;
}
.mapa-drilldown-empty{
  text-align:center;
  padding:32px 16px;
  color:var(--text-muted);
  font-size:13px;
}
.mapa-drilldown-loading{
  text-align:center;
  padding:32px 16px;
  color:var(--text-secondary);
  font-size:13px;
}

/* Pill de status para drill-down */
.dd-status{
  display:inline-block;
  padding:2px 8px;
  border-radius:4px;
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.dd-status-consolidado{background:rgba(16,185,129,.15);color:#10b981}
.dd-status-negociando{background:rgba(245,158,11,.15);color:#f59e0b}
.dd-status-sem_apoio{background:rgba(239,68,68,.15);color:#ef4444}

.map-legend{
  position:absolute;
  bottom:20px;left:20px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px 16px;
  font-size:12px;
  box-shadow:var(--shadow-md);
  z-index:500;
  min-width:200px;
}
.map-legend h4{
  font-size:11px;
  color:var(--text-muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:10px;
  font-weight:700;
}
.legend-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:3px 0;
  color:var(--text-secondary);
}
.legend-dot{
  width:12px;height:12px;
  border-radius:50%;
  flex-shrink:0;
  border:2px solid rgba(255,255,255,.3);
}

/* ===== CHART CONTAINERS ===== */
.chart-box{
  position:relative;
  height:300px;
  width:100%;
}
.chart-box.tall{height:360px}
.chart-box.short{height:240px}

/* ===== RISK / ALERT ===== */
.alert{
  padding:12px 14px;
  border-radius:8px;
  font-size:13px;
  border:1px solid;
  margin-bottom:16px;
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.alert-warn{
  background:rgba(245,158,11,.08);
  border-color:rgba(245,158,11,.3);
  color:#fcd34d;
}
.alert-info{
  background:rgba(59,130,246,.08);
  border-color:rgba(59,130,246,.3);
  color:#93c5fd;
}
.alert-icon{font-size:16px;flex-shrink:0;line-height:1.2}

/* ===== TEAM CARDS ===== */
.team-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:14px;
}
.team-card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:12px;
  padding:18px;
  transition:all .15s;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.team-card:hover{
  border-color:var(--accent);
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}
.team-header{
  display:flex;
  align-items:center;
  gap:12px;
}
.team-avatar{
  width:44px;height:44px;
  border-radius:10px;
  background:var(--gradient-primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:16px;
  color:#fff;
  flex-shrink:0;
}
.team-avatar.gold{background:var(--gradient-gold)}
.team-name{
  font-weight:700;
  font-size:14px;
}
.team-role{
  font-size:12px;
  color:var(--accent);
  font-weight:600;
}
.team-scope{
  font-size:12.5px;
  color:var(--text-secondary);
  line-height:1.5;
}
.team-badge{
  font-size:10px;
  padding:3px 8px;
  border-radius:6px;
  background:var(--bg-tertiary);
  color:var(--text-muted);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.05em;
  width:fit-content;
}

/* ===== TIMELINE ===== */
.timeline{
  position:relative;
  padding-left:28px;
}
.timeline::before{
  content:"";
  position:absolute;
  top:0;bottom:0;left:10px;
  width:2px;
  background:var(--border);
}
.timeline-item{
  position:relative;
  padding-bottom:20px;
}
.timeline-item::before{
  content:"";
  position:absolute;
  left:-22px;top:6px;
  width:12px;height:12px;
  border-radius:50%;
  background:var(--bg-tertiary);
  border:2px solid var(--border-strong);
}
.timeline-item.active::before{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 4px rgba(59,130,246,.2)}
.timeline-item.done::before{background:var(--green);border-color:var(--green)}
.timeline-date{
  font-size:11px;
  color:var(--text-muted);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.timeline-title{font-weight:700;margin:3px 0;font-size:14px}
.timeline-desc{font-size:12.5px;color:var(--text-secondary);line-height:1.5}

/* ===== STATS ROW ===== */
.stats-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px;
}
.stat-item{
  background:var(--bg-tertiary);
  border-radius:8px;
  padding:12px;
}
.stat-label{
  font-size:11px;
  color:var(--text-muted);
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:4px;
}
.stat-value{
  font-size:18px;
  font-weight:700;
  color:var(--text-primary);
}
.stat-value.accent{color:var(--accent)}
.stat-value.gold{color:var(--gold)}
.stat-value.green{color:var(--green)}

/* ===== VOTE GAUGE (Meta) ===== */
.gauge-wrap{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.gauge-bar{
  position:relative;
  height:28px;
  background:var(--bg-tertiary);
  border-radius:999px;
  overflow:hidden;
  border:1px solid var(--border);
}
.gauge-fill{
  position:absolute;top:0;left:0;bottom:0;
  background:linear-gradient(90deg,#ef4444 0%,#f59e0b 40%,#10b981 75%,#3b82f6 100%);
  border-radius:999px;
  transition:width .8s ease;
}
.gauge-markers{
  position:relative;
  height:20px;
  font-size:10px;
  color:var(--text-muted);
}
.gauge-marker{
  position:absolute;
  transform:translateX(-50%);
  text-align:center;
}
.gauge-marker::before{
  content:"";
  display:block;
  margin:0 auto 2px;
  width:1px;height:6px;
  background:var(--text-muted);
}
.gauge-marker.gold::before{background:var(--gold)}
.gauge-marker.gold{color:var(--gold);font-weight:700}

/* ===== ADMIN & MODAL ===== */
.modal-overlay{
  position:fixed;inset:0;
  background:rgba(0,0,0,.7);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  z-index:1000;
  backdrop-filter:blur(4px);
  animation:fadeIn .2s ease;
  overflow-y:auto;
  padding:20px 16px;
}
.modal{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:16px;
  padding:28px;
  max-width:440px;
  width:100%;
  box-shadow:var(--shadow-lg);
  animation:slideUp .3s ease;
  margin:auto;
  max-height:calc(100vh - 40px);
  overflow-y:auto;
  overscroll-behavior:contain;
}
.modal::-webkit-scrollbar{width:8px}
.modal::-webkit-scrollbar-track{background:transparent}
.modal::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}
.modal-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  position:sticky;
  bottom:-28px;
  margin:16px -28px -28px;
  padding:16px 28px;
  background:var(--bg-card);
  border-top:1px solid var(--border);
  border-radius:0 0 16px 16px;
  z-index:2;
}
@keyframes slideUp{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}
.modal h2{
  font-size:20px;
  margin-bottom:8px;
  display:flex;align-items:center;gap:10px;
  position:sticky;
  top:-28px;
  margin:-28px -28px 16px;
  padding:20px 28px 12px;
  background:var(--bg-card);
  border-bottom:1px solid var(--border);
  z-index:2;
  flex-wrap:wrap;
}
.modal p{color:var(--text-secondary);font-size:13px;margin-bottom:20px;line-height:1.5}
.modal input[type="password"],.modal input[type="text"],.modal input[type="file"]{
  width:100%;
  padding:12px 14px;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--bg-tertiary);
  color:var(--text-primary);
  font-size:14px;
  margin-bottom:12px;
}
.modal input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(59,130,246,.15)}
/* .modal-actions já definido acima com sticky footer */
.modal-error{
  padding:10px 12px;
  background:rgba(239,68,68,.1);
  border:1px solid rgba(239,68,68,.3);
  color:#f87171;
  border-radius:6px;
  font-size:12.5px;
  margin-bottom:12px;
}

.admin-toolbar{
  display:flex;
  gap:10px;
  padding:12px 16px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:10px;
  margin-bottom:16px;
  align-items:center;
  flex-wrap:wrap;
  position:sticky;
  top:0;
  z-index:10;
}
.admin-toolbar .dirty{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 10px;
  background:rgba(245,158,11,.15);
  color:var(--gold);
  border-radius:6px;
  font-size:11px;
  font-weight:700;
}
.admin-toolbar .dirty::before{
  content:"";width:8px;height:8px;border-radius:50%;background:var(--gold);animation:pulse 1.5s infinite;
}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* === FILTRO GLOBAL DE PERÍODO === */
.finance-periodo-bar{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding:10px 14px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:10px;
  margin-bottom:8px;
  font-size:13px;
}
.periodo-label{font-weight:600;color:var(--text-secondary);white-space:nowrap}
.periodo-sep{color:var(--text-muted);font-size:12px}
.periodo-input{
  padding:6px 10px;
  border:1px solid var(--border);
  border-radius:6px;
  background:var(--bg-tertiary);
  color:var(--text-primary);
  font-size:12px;
  cursor:pointer;
  font-family:inherit;
}
.periodo-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px rgba(59,130,246,.2)}
.periodo-ativo{font-size:11px;margin-left:4px}
.btn-sm{
  padding:5px 12px;
  font-size:12px;
  border-radius:6px;
  font-weight:600;
  cursor:pointer;
  border:1px solid transparent;
  transition:all .15s;
  font-family:inherit;
}
.btn-sm.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-sm.btn-primary:hover{opacity:.85}
.btn-sm.btn-ghost{background:transparent;color:var(--text-secondary);border-color:var(--border)}
.btn-sm.btn-ghost:hover{background:var(--bg-tertiary)}
/* === FIM FILTRO PERÍODO === */

.admin-tabs{
  display:flex;
  gap:4px;
  flex-wrap:wrap;
  padding:8px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:10px;
  margin-bottom:16px;
}
.admin-tabs button{
  padding:8px 12px;
  border:0;
  background:transparent;
  color:var(--text-secondary);
  font-size:12px;
  font-weight:600;
  border-radius:6px;
  cursor:pointer;
  transition:all .15s;
  white-space:nowrap;
}
.admin-tabs button:hover{background:var(--bg-tertiary);color:var(--text-primary)}
.admin-tabs button.active{background:var(--accent);color:#fff}

.editor-table{width:100%;border-collapse:collapse;font-size:13px}
.editor-table th{
  background:var(--bg-tertiary);
  padding:10px 12px;
  text-align:left;
  font-size:11px;
  font-weight:700;
  color:var(--text-muted);
  text-transform:uppercase;
  letter-spacing:.05em;
  border-bottom:1px solid var(--border);
  position:sticky;top:0;
}
.editor-table td{
  padding:4px 6px;
  border-bottom:1px solid var(--border);
  vertical-align:middle;
}
.editor-table input,.editor-table select,.editor-table textarea{
  width:100%;
  padding:7px 10px;
  border-radius:6px;
  border:1px solid transparent;
  background:transparent;
  color:var(--text-primary);
  font-size:12.5px;
  font-family:inherit;
  transition:all .1s;
  min-width:80px;
}
.editor-table input:hover,.editor-table select:hover,.editor-table textarea:hover{
  background:var(--bg-tertiary);
  border-color:var(--border);
}
.editor-table input:focus,.editor-table select:focus,.editor-table textarea:focus{
  outline:none;
  background:var(--bg-tertiary);
  border-color:var(--accent);
  box-shadow:0 0 0 2px rgba(59,130,246,.2);
}
.editor-table input[type="number"]{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.editor-table textarea{min-height:40px;resize:vertical}
.editor-table tr.modified{background:rgba(245,158,11,.06)}
.editor-table tr.deleted{background:rgba(239,68,68,.08);opacity:.5}
.editor-table tr.new-row{background:rgba(16,185,129,.06)}
.row-actions{display:flex;gap:4px;justify-content:flex-end}
.icon-btn{
  width:28px;height:28px;
  border:0;
  border-radius:6px;
  background:var(--bg-tertiary);
  color:var(--text-secondary);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:all .15s;
}
.icon-btn:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.icon-btn.danger:hover{background:rgba(239,68,68,.2);color:#f87171}
.icon-btn.success:hover{background:rgba(16,185,129,.2);color:var(--green)}
.icon-btn svg{width:14px;height:14px}

.editor-form{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:14px;
}
.editor-form label{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:12px;
  color:var(--text-secondary);
  font-weight:600;
}
.editor-form input,.editor-form textarea,.editor-form select{
  padding:10px 12px;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--bg-tertiary);
  color:var(--text-primary);
  font-size:13px;
  font-family:inherit;
}
.editor-form input:focus,.editor-form textarea:focus,.editor-form select:focus{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(59,130,246,.15);
}
.editor-form textarea{min-height:60px;resize:vertical}
.editor-form .grid-full{grid-column:1/-1}

.btn-success{
  background:linear-gradient(135deg,#10b981,#059669);
  border-color:transparent;color:#fff;
}
.btn-success:hover{filter:brightness(1.1)}
.btn-danger{
  background:linear-gradient(135deg,#ef4444,#dc2626);
  border-color:transparent;color:#fff;
}
.btn-danger:hover{filter:brightness(1.1)}
.btn-ghost{background:transparent;border-color:var(--border)}

.toast{
  position:fixed;
  bottom:20px;right:20px;
  padding:14px 20px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-left:4px solid var(--green);
  border-radius:10px;
  box-shadow:var(--shadow-lg);
  font-size:13px;
  font-weight:500;
  z-index:2000;
  animation:slideIn .3s ease;
  display:flex;align-items:center;gap:10px;
}
.toast.error{border-left-color:var(--red)}
.toast.warn{border-left-color:var(--gold)}
@keyframes slideIn{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}

/* ===== THEME TOGGLE ===== */
.theme-toggle{
  display:inline-flex;
  align-items:center;
  gap:2px;
  padding:3px;
  background:var(--bg-tertiary);
  border:1px solid var(--border);
  border-radius:10px;
  position:relative;
}
.theme-toggle button{
  background:transparent;
  border:0;
  padding:6px 10px;
  border-radius:7px;
  cursor:pointer;
  color:var(--text-muted);
  font-size:12px;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:5px;
  transition:all .2s;
}
.theme-toggle button:hover{color:var(--text-primary)}
.theme-toggle button.active{
  background:var(--bg-card);
  color:var(--text-primary);
  box-shadow:var(--shadow-sm);
}
[data-theme="dark"] .theme-toggle button.active{
  background:linear-gradient(135deg,rgba(59,130,246,.25),rgba(139,92,246,.25));
  color:#fff;
}
[data-theme="light"] .theme-toggle button.active{
  background:linear-gradient(135deg,rgba(217,119,6,.18),rgba(245,158,11,.2));
  color:var(--gold-hover);
}
.theme-toggle svg{width:14px;height:14px;stroke-width:2.2}

/* ===== UTIL ===== */
.flex{display:flex}
.flex-between{display:flex;justify-content:space-between;align-items:center}
.text-muted{color:var(--text-muted)}
.text-gold{color:var(--gold)}
.text-green{color:var(--green)}
.text-red{color:var(--red)}
.text-right{text-align:right}
.text-center{text-align:center}
.mb-0{margin-bottom:0 !important}
.mt-12{margin-top:12px}
.mt-16{margin-top:16px}
.mt-24{margin-top:24px}
.mb-12{margin-bottom:12px}
.mb-16{margin-bottom:16px}
.mb-24{margin-bottom:24px}
.bold{font-weight:700}

/* ===== SCROLLBAR GLOBAL ===== */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:var(--bg-primary)}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}

/* ===== PRINT / RELATÓRIOS ===== */
@media print {
  body{background:#fff !important;color:#000 !important}
  .sidebar,.topbar,.btn,.theme-toggle,.user-badge,.modal-overlay,.toast,
  .sidebar-overlay,.menu-toggle,
  .admin-toolbar,.admin-tabs,.filters,.row-actions,.icon-btn{display:none !important}
  .app{display:block !important}
  .main{overflow:visible !important}
  .content{padding:0 !important;overflow:visible !important;background:#fff !important}
  .card{break-inside:avoid;page-break-inside:avoid;box-shadow:none !important;border:1px solid #ddd !important;background:#fff !important;color:#000 !important}
  .card *,.kpi *{color:#000 !important}
  .kpi{border:1px solid #ddd !important;background:#fafafa !important}
  .pill{border:1px solid #999;background:#f5f5f5 !important;color:#333 !important}
  table{font-size:11px}
  th,td{color:#000 !important;border-color:#ccc !important}
  /* O cabeçalho de impressão é injetado via .print-header (com foto base64) */
  .page::after{
    content:"MISSÃO 2026 · Bispo André Santos · Deputado Federal SP · Republicanos (10) · Confidencial · Núcleo Executivo";
    display:block;
    text-align:center;
    font-size:10px;
    color:#666;
    margin-top:30px;
    border-top:1px solid #ddd;
    padding-top:10px;
  }
  @page{margin:1.5cm 1.2cm}
}

/* Header oculto que aparece só no print */
.print-header{display:none}
@media print {
  .print-header{
    display:flex !important;
    align-items:center;
    gap:18px;
    padding:0 0 16px;
    margin-bottom:24px;
    border-bottom:3px solid var(--gold);
  }
  .print-header img{width:80px;height:80px;border-radius:50%;object-fit:cover;border:2px solid #f59e0b}
  .print-header .info{flex:1}
  .print-header h1{font-size:20px;margin:0 0 4px;color:#000;font-weight:800}
  .print-header p{font-size:12px;color:#444;margin:0}
}

/* ===== RESPONSIVE ===== */
@media (max-width:1024px) and (min-width:901px){
  .app{grid-template-columns:220px 1fr}
  .sidebar{width:220px}
  .brand-title{font-size:15px}
  .nav-item{font-size:12.5px;padding:9px 16px}
  /* Nesta faixa a sidebar continua como coluna fixa; hambúrguer fica oculto */
  .menu-toggle{display:none}
}
@media (max-width:900px){
  /* Layout em coluna única: o conteúdo ocupa 100% da largura.
     A sidebar deixa de ser uma coluna do grid e vira um drawer sobreposto. */
  .app{
    grid-template-columns:1fr;
    grid-template-rows:auto 1fr;
    height:100vh;
    height:100dvh;
  }

  /* Botão hambúrguer visível apenas no mobile */
  .menu-toggle{display:inline-flex}

  /* Sidebar como drawer deslizante (slide-in) — fica fora da tela por padrão */
  .sidebar{
    display:flex;
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    width:280px;
    max-width:85vw;
    height:100vh;
    height:100dvh;
    z-index:50;
    transform:translateX(-100%);
    transition:transform .28s cubic-bezier(.4,0,.2,1);
    box-shadow:4px 0 24px rgba(0,0,0,.45);
    will-change:transform;
  }
  /* Estado aberto: controlado por classe no <body> via JS */
  body.sidebar-open .sidebar{transform:translateX(0)}
  body.sidebar-open .sidebar-overlay{display:block;opacity:1}

  /* Trava o scroll do fundo enquanto o menu está aberto */
  body.sidebar-open{overflow:hidden}

  /* Conteúdo e topbar ocupam 100% da largura */
  .main{width:100%}
  .topbar{padding:12px 16px}
  .topbar-title{font-size:17px}
  .topbar-title small{display:none}
  .content{padding:16px}

  /* KPIs e grids empilham melhor em telas pequenas */
  .kpi-grid{grid-template-columns:1fr 1fr;gap:12px}
  .kpi{padding:16px}
  .kpi-value{font-size:24px}

  /* Tabelas: garantem scroll horizontal sem quebrar o layout */
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .content table{min-width:560px}

  /* Alvos de toque maiores na navegação */
  .nav-item{padding:13px 20px;font-size:14px}

  #map,#heatmap{height:420px}
}

/* Ajustes para telas muito pequenas (smartphones) */
@media (max-width:560px){
  .kpi-grid{grid-template-columns:1fr}
  .content{padding:12px}
  .topbar{padding:10px 12px;gap:10px}
  .topbar-actions{gap:6px}
  /* Reduz ações secundárias para caber na largura */
  .topbar-actions .btn span,
  .topbar-actions .theme-toggle button{font-size:12px}
  .sidebar{width:86vw;max-width:320px}
  #map,#heatmap{height:360px}
}

/* ============================================================
   CRM TERRITORIAL — Fase 3.3.1 (Validação e Qualidade)
   ============================================================ */

/* Indicador de qualidade de georreferenciamento */
.crm-qualidade-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px 18px;
  margin-bottom: 16px;
}

.crm-qualidade-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 10px;
}

.crm-qualidade-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
}

.crm-qualidade-progress {
  height: 8px;
  background: var(--bg-tertiary);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 8px;
}

.crm-qualidade-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.6s ease;
}

.crm-qualidade-info {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 12px;
  color: var(--text-muted);
}

.crm-qualidade-warn {
  color: #f59e0b;
  font-weight: 500;
}

/* Badges de qualidade nos cards */
.crm-qual-warnings {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}

.crm-qual-warn {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 600;
  background: rgba(245, 158, 11, 0.15);
  color: #f59e0b;
  border: 1px solid rgba(245, 158, 11, 0.3);
}

.crm-qual-error {
  background: rgba(239, 68, 68, 0.12);
  color: #ef4444;
  border-color: rgba(239, 68, 68, 0.25);
}

/* Card sem georreferenciamento — borda sutil */
.crm-card-no-geo {
  border-left: 3px solid #f59e0b;
}

/* Texto de campo faltante */
.crm-missing {
  color: #ef4444;
  font-style: italic;
  font-size: 12px;
}

/* Bloco de erros no formulário */
.crm-form-erros {
  background: rgba(239, 68, 68, 0.1);
  border: 1px solid rgba(239, 68, 68, 0.35);
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 16px;
}

.crm-erros-lista {
  font-size: 13px;
  color: #fca5a5;
}

.crm-erros-lista strong {
  display: block;
  margin-bottom: 6px;
  color: #f87171;
}

.crm-erros-lista ul {
  margin: 0;
  padding-left: 18px;
}

.crm-erros-lista li {
  margin-bottom: 4px;
}

/* Grid de cards do CRM */
.crm-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
  padding: 16px;
}

.crm-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  transition: box-shadow 0.2s, transform 0.2s;
}

.crm-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.crm-card-inactive {
  opacity: 0.6;
}

.crm-card-header {
  display: flex;
  gap: 12px;
  padding: 14px 14px 10px;
  border-bottom: 1px solid var(--border);
}

.crm-card-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.crm-card-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.crm-card-initials {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
}

.crm-card-info {
  flex: 1;
  min-width: 0;
}

.crm-card-name {
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.crm-card-role {
  font-size: 12px;
  color: var(--text-muted);
  margin: 2px 0 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.crm-card-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.crm-card-body {
  padding: 10px 14px;
  font-size: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.crm-card-detail {
  display: flex;
  gap: 4px;
}

.crm-label {
  color: var(--text-muted);
  min-width: 80px;
  flex-shrink: 0;
}

.crm-card-actions {
  display: flex;
  gap: 8px;
  padding: 10px 14px;
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}

.crm-intensity-bar {
  height: 4px;
  background: var(--bg-tertiary);
  border-radius: 2px;
  margin-top: 4px;
  overflow: hidden;
}

.crm-intensity-fill {
  height: 100%;
  background: var(--accent);
  border-radius: 2px;
}

/* Upload de foto */
.crm-foto-upload {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 6px;
}

.crm-foto-preview {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--bg-tertiary);
  border: 2px dashed var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  font-size: 12px;
}

.crm-foto-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.btn-sm{padding:6px 10px;font-size:12px;border-radius:6px}
.btn-danger-ghost{background:transparent;border:1px solid var(--red);color:var(--red)}
.btn-danger-ghost:hover{background:rgba(239,68,68,.1)}
.pill-green{background:rgba(16,185,129,.15);color:var(--green);border-color:rgba(16,185,129,.3)}
.pill-red{background:rgba(239,68,68,.15);color:var(--red);border-color:rgba(239,68,68,.3)}
.pill-gray{background:rgba(100,116,139,.15);color:var(--text-muted);border-color:rgba(100,116,139,.3)}
.pill-cyan{background:rgba(6,182,212,.15);color:var(--cyan);border-color:rgba(6,182,212,.3)}
.crm-empty{grid-column:1/-1}

/* Responsivo CRM */
@media (max-width: 768px) {
  .crm-cards-grid {
    grid-template-columns: 1fr;
    padding: 10px;
  }

  .crm-qualidade-title {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .crm-qualidade-info {
    flex-direction: column;
    gap: 4px;
  }
}

/* =====================================================================
   INTELIGÊNCIA ELEITORAL — Estilos específicos
   ===================================================================== */

/* Pills adicionais para status */
.pill-blue  { background: rgba(59,130,246,0.15); color: #3b82f6; }
.pill-gold  { background: rgba(245,158,11,0.15); color: #f59e0b; }
.pill-red   { background: rgba(239,68,68,0.15);  color: #ef4444; }
.pill-gray  { background: rgba(107,114,128,0.15);color: #6b7280; }

/* KPI purple variant */
.kpi.purple { border-left: 3px solid #8b5cf6; }
.kpi.purple .kpi-value { color: #8b5cf6; }

/* Ranking item */
.intel-ranking-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.intel-ranking-item:last-child { border-bottom: none; }

/* Avatar circular com iniciais */
.intel-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
}

/* Responsividade do módulo */
@media (max-width: 768px) {
  #intel-tabs { flex-wrap: wrap; }
  #intel-tabs button { font-size: 12px; padding: 6px 10px; }
}

/* ===== BOTOES ICONE PEQUENOS (editar/excluir em cards e tabelas) ===== */
.btn-icon-sm {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg-tertiary);
  color: var(--text-muted);
  cursor: pointer;
  font-size: 13px;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  padding: 0;
  line-height: 1;
}
.btn-icon-sm:hover {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
.btn-icon-sm.btn-icon-danger:hover {
  background: var(--red);
  color: #fff;
  border-color: var(--red);
}

/* ===== MODAL ESTRUTURADO (header/body/footer + form-group/form-control) ===== */
.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: -28px;
  margin: -28px -28px 20px;
  padding: 20px 28px 16px;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
  z-index: 2;
  border-radius: 16px 16px 0 0;
}
.modal-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -.02em;
}
.modal-close {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 22px;
  cursor: pointer;
  line-height: 1;
  padding: 2px 6px;
  border-radius: 6px;
  transition: background .15s, color .15s;
}
.modal-close:hover { background: var(--bg-tertiary); color: var(--text-primary); }
.modal-body { padding: 4px 0; }
.modal-footer {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  position: sticky;
  bottom: -28px;
  margin: 20px -28px -28px;
  padding: 16px 28px;
  background: var(--bg-card);
  border-top: 1px solid var(--border);
  border-radius: 0 0 16px 16px;
  z-index: 2;
}
.form-group {
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.form-group label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.form-control {
  width: 100%;
  padding: 11px 14px;
  background: var(--bg-tertiary);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-primary);
  font-size: 14px;
  font-family: inherit;
  transition: border-color .15s, box-shadow .15s;
}
.form-control:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(59,130,246,.15);
}
.form-control::placeholder { color: var(--text-muted); }
textarea.form-control {
  min-height: 80px;
  resize: vertical;
  line-height: 1.5;
}
select.form-control {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 36px;
  cursor: pointer;
}
select.form-control option { background: var(--bg-card); color: var(--text-primary); }
.btn-secondary {
  background: var(--bg-tertiary);
  border: 1px solid var(--border-strong);
  color: var(--text-secondary);
}
.btn-secondary:hover { background: var(--bg-card-hover); color: var(--text-primary); }


/* ============================================================
   LIGHT THEME HARDCODE OVERRIDE
   Corrige modulos que usam cores escuras hardcoded inline
   (background:#161616, #1f1f1f, #111827, etc.) e textos claros
   (#fff, #eee, #ddd) que vazavam o tema escuro no modo claro.
   Aplica-se SOMENTE quando data-theme="light". Nao afeta o dark.
   ============================================================ */

/* --- Fundos escuros hardcoded -> superficie clara --- */
[data-theme="light"] [style*="background:#0e0e0e"],
[data-theme="light"] [style*="background:#0f0f0f"],
[data-theme="light"] [style*="background:#111827"],
[data-theme="light"] [style*="background:#161616"],
[data-theme="light"] [style*="background:#1a1a1a"],
[data-theme="light"] [style*="background:#1a1a2e"],
[data-theme="light"] [style*="background:#1a2332"],
[data-theme="light"] [style*="background:#1c1c1c"],
[data-theme="light"] [style*="background:#1f1f1f"],
[data-theme="light"] [style*="background:#1f2937"],
[data-theme="light"] [style*="background:#222"],
[data-theme="light"] [style*="background:#2a2a2a"],
[data-theme="light"] [style*="background:#374151"],
[data-theme="light"] [style*="background: #0e0e0e"],
[data-theme="light"] [style*="background: #0f0f0f"],
[data-theme="light"] [style*="background: #111827"],
[data-theme="light"] [style*="background: #161616"],
[data-theme="light"] [style*="background: #1a1a1a"],
[data-theme="light"] [style*="background: #1a1a2e"],
[data-theme="light"] [style*="background: #1c1c1c"],
[data-theme="light"] [style*="background: #1f1f1f"],
[data-theme="light"] [style*="background: #1f2937"],
[data-theme="light"] [style*="background: #374151"]{
  background:var(--bg-card) !important;
  color:var(--text-primary) !important;
  border-color:var(--border) !important;
}

/* --- Headers de tabela (thead/th) escuros -> cabecalho claro --- */
[data-theme="light"] thead[style],
[data-theme="light"] thead tr[style],
[data-theme="light"] thead th[style],
[data-theme="light"] tr[style*="background:#1f1f1f"],
[data-theme="light"] tr[style*="background:#161616"],
[data-theme="light"] tr[style*="background:#111827"],
[data-theme="light"] tr[style*="background:#1f2937"],
[data-theme="light"] th[style*="background:#1f1f1f"],
[data-theme="light"] th[style*="background:#161616"]{
  background:var(--bg-tertiary) !important;
  color:var(--text-primary) !important;
}

/* --- Verde solido hardcoded (#2e7d32) usado em headers/badges --- */
/* Em headers de tabela, normaliza para superficie clara; */
/* mantem botoes/acoes verdes funcionais (btn) inalterados. */
[data-theme="light"] thead[style*="background:#2e7d32"],
[data-theme="light"] thead tr[style*="background:#2e7d32"],
[data-theme="light"] th[style*="background:#2e7d32"],
[data-theme="light"] tr[style*="background:#2e7d32"]{
  background:var(--bg-tertiary) !important;
  color:var(--text-primary) !important;
}

/* --- Textos claros hardcoded sobre fundo agora claro --- */
[data-theme="light"] [style*="background:#0e0e0e"][style*="color:#fff"],
[data-theme="light"] [style*="background:#161616"][style*="color:#fff"],
[data-theme="light"] [style*="background:#1f1f1f"][style*="color:#fff"],
[data-theme="light"] [style*="background:#111827"][style*="color:#fff"],
[data-theme="light"] [style*="background:#1f2937"][style*="color:#fff"],
[data-theme="light"] [style*="background:#374151"][style*="color:#fff"]{
  color:var(--text-primary) !important;
}

/* color:#9bd49b (verde claro de header dark) fica ilegivel no claro */
[data-theme="light"] [style*="color:#9bd49b"]{
  color:var(--accent) !important;
}
/* textos cinza-claro/branco hardcoded -> texto legivel no claro */
[data-theme="light"] [style*="color:#eee"],
[data-theme="light"] [style*="color:#ddd"],
[data-theme="light"] [style*="color:#e6e6e6"],
[data-theme="light"] [style*="color:#f9fafb"],
[data-theme="light"] [style*="color:#d1d5db"]{
  color:var(--text-primary) !important;
}
[data-theme="light"] [style*="color:#bbb"],
[data-theme="light"] [style*="color:#aaa"],
[data-theme="light"] [style*="color:#999"],
[data-theme="light"] [style*="color:#9ca3af"],
[data-theme="light"] [style*="color:#888"],
[data-theme="light"] [style*="color:#777"]{
  color:var(--text-secondary) !important;
}

/* --- Badges de papeis no Nucleo de Pessoas (360) --- */
[data-theme="light"] .pp-badge,
[data-theme="light"] [class*="badge"][style*="background:#1f1f1f"],
[data-theme="light"] [class*="badge"][style*="background:#161616"],
[data-theme="light"] [class*="badge"][style*="background:#2a2a2a"]{
  background:var(--bg-tertiary) !important;
  color:var(--text-primary) !important;
  border:1px solid var(--border) !important;
}

/* --- Containers de Locais Estrategicos e IA: bordas internas --- */
[data-theme="light"] [style*="background:#0f0f0f"] *,
[data-theme="light"] [style*="background:#161616"] *,
[data-theme="light"] [style*="background:#1c1c1c"] *{
  border-color:var(--border) !important;
}

/* --- Classes injetadas via <style> no head (modo claro) --- */
/* aba ativa do Perfil 360 usava verde solido #2e7d32 + texto branco */
[data-theme="light"] #page-perfil_pessoa .pp-tab.active{
  background:var(--accent) !important;
  color:#fff !important;
}

/* --- Borda dos badges de papeis hardcoded (#444) no modo claro --- */
[data-theme="light"] [style*="border:1px solid #444"],
[data-theme="light"] [style*="border: 1px solid #444"]{
  border-color:var(--border) !important;
}

/* --- Reforco: qualquer elemento que combine fundo escuro + texto claro
       hardcoded recebe texto escuro legivel no modo claro --- */
[data-theme="light"] [style*="background:#1f2937"][style*="color:#f9fafb"],
[data-theme="light"] [style*="background:#111827"][style*="color:#f9fafb"],
[data-theme="light"] [style*="background:#374151"][style*="color:#f9fafb"],
[data-theme="light"] [style*="background:#1f2937"] [style*="color:#fff"],
[data-theme="light"] [style*="background:#111827"] [style*="color:#fff"]{
  color:var(--text-primary) !important;
}

/* --- Central de Importacao: alerta/containers verde escuro hardcoded (#1e3a2f / #2e7d32) --- */
[data-theme="light"] [style*="background:#1e3a2f"]{
  background:var(--bg-tertiary) !important;
  border-color:var(--border) !important;
  color:var(--text-primary) !important;
}
[data-theme="light"] [style*="background:#1e3a2f"] strong{
  color:var(--text-primary) !important;
}
[data-theme="light"] [style*="border:1px solid #2e7d32"],
[data-theme="light"] [style*="border: 1px solid #2e7d32"]{
  border-color:var(--border) !important;
}
/* titulos/botoes que usam verde solido #2e7d32: usa o accent legivel no modo claro */
[data-theme="light"] [style*="color:#2e7d32"]{
  color:var(--accent) !important;
}
/* --- Containers de mapa com fundo escuro hardcoded (var(--bg,#111827)) no modo claro --- */
[data-theme="light"] [style*="background:var(--bg,#111827)"]{
  background:var(--bg) !important;
  color:var(--text-primary) !important;
}