/* ══════════════════════════════════════════════════════════════════
   CENTRAL DE CONTROLE · Grupo Singular — camada visual (tema Claro)
   Identidade Singular: preto e branco, linhas como estrutura,
   cantos retos, sem sombras. Cor SOMENTE com significado.
   Carregar DEPOIS do <style> original. Nenhum seletor de JS alterado.
   ══════════════════════════════════════════════════════════════════ */

@font-face{font-family:"Gilroy";src:url("fonts/Gilroy-Light.ttf") format("truetype");font-weight:300;font-display:swap}
@font-face{font-family:"Gilroy";src:url("fonts/Gilroy-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Gilroy";src:url("fonts/Gilroy-Medium.ttf") format("truetype");font-weight:500;font-display:swap}
@font-face{font-family:"Gilroy";src:url("fonts/Gilroy-SemiBold.ttf") format("truetype");font-weight:600;font-display:swap}
@font-face{font-family:"Gilroy";src:url("fonts/Gilroy-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
@font-face{font-family:"Gilroy";src:url("fonts/Gilroy-ExtraBold.ttf") format("truetype");font-weight:800;font-display:swap}

/* ── 1. Tokens (as variáveis originais são reaproveitadas pelo JS) ── */
:root{
  --bg:#ffffff; --surface:#ffffff; --surface2:#f5f5f4;
  --border:#e3e3e0; --accent:#000000; --accent2:#4a4a47;
  --text:#000000; --muted:#6b6b66; --radius:0px;
  --green:#15803d; --red:#b91c1c; --yellow:#a16207;

  --rule:#000000; --grey:#80807b; --hover:#f5f5f4;
  --ok-fg:#14532d;   --ok-bg:#dcfce7;   --ok-bd:#4fb377;
  --err-fg:#991b1b;  --err-bg:#fee2e2;  --err-bd:#e05252;
  --warn-fg:#78350f; --warn-bg:#fef3c7; --warn-bd:#d9a514;
  --info-fg:#1e40af; --info-bg:#dbeafe; --info-bd:#5b8fe0;
  --mkt-fg:#5b21b6;  --mkt-bg:#ede9fe;  --mkt-bd:#8b5cf6;

  --font:"Gilroy","Helvetica Neue",Arial,sans-serif;
  --t:.15s;
}

/* ── 2. Base ── */
body{background:var(--bg);font-family:var(--font);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;}
button,input,select,textarea{font-family:var(--font);}
::selection{background:#000;color:#fff;}

/* Cantos retos e sem sombra em tudo (incl. estilos gerados pelo JS) */
*,*::before,*::after{border-radius:0 !important;box-shadow:none !important;}
/* Exceções: pontos de status e spinner continuam circulares */
.ig-conn-dot,.notes-dot,.app-loading-spinner,[style*="border-radius:50%"],[style*="border-radius: 50%"]{border-radius:50% !important;}

/* Pesos: Heavy/Black do código viram Bold (a Gilroy 900 fica pesada demais em dados) */
[style*="font-weight:900"],[style*="font-weight: 900"],[style*="font-weight:800"],[style*="font-weight: 800"]{font-weight:700 !important;}

/* Texto colorido gerado pelo JS: tons ajustados para contraste AA sobre branco */
[style*=";color:#ef4444"],[style^="color:#ef4444"],[style*=" color:#ef4444"],
[style*=";color:#dc2626"],[style^="color:#dc2626"],[style*=" color:#dc2626"],
[style*=";color:#e03131"],[style^="color:#e03131"],[style*=" color:#e03131"]{color:#b91c1c !important;}
[style*=";color:#22c55e"],[style^="color:#22c55e"],[style*=" color:#22c55e"],
[style*=";color:#16a34a"],[style^="color:#16a34a"],[style*=" color:#16a34a"],
[style*=";color:#2b9a66"],[style^="color:#2b9a66"],[style*=" color:#2b9a66"],
[style*=";color:#059669"],[style^="color:#059669"],[style*=" color:#059669"]{color:#15803d !important;}
[style*=";color:#f59e0b"],[style^="color:#f59e0b"],[style*=" color:#f59e0b"],
[style*=";color:#e08c00"],[style^="color:#e08c00"],[style*=" color:#e08c00"]{color:#a16207 !important;}
[style*=";color:#3b82f6"],[style^="color:#3b82f6"],[style*=" color:#3b82f6"]{color:#1d4ed8 !important;}

/* Foco visível */
:focus{outline:none;}
:focus-visible{outline:2px solid #000 !important;outline-offset:3px;}
.sidebar :focus-visible,#loginOverlay :focus-visible,#homeOverlay :focus-visible,header :focus-visible{outline-color:#fff !important;}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none !important;animation:none !important;}}

::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-track{background:var(--surface2);}
::-webkit-scrollbar-thumb{background:#b9b9b5;}
::-webkit-scrollbar-thumb:hover{background:#000;}

/* ── 3. Menu lateral ── */
.sidebar{background:#000 !important;border-right:2px solid #000 !important;}
.sidebar-brand{padding:22px 18px 18px;border-bottom:1px solid #2a2a28 !important;}
.sidebar-logo-wrap img{mix-blend-mode:normal !important;opacity:1 !important;width:136px !important;}
.sidebar-brand-tagline{color:#b4b4ae !important;font-weight:500;letter-spacing:.18em !important;}
.sidebar-brand-tagline::before{content:"[ ";color:#80807b;}
.sidebar-brand-tagline::after{content:" ]";color:#80807b;}
.sidebar-nav{padding:10px 0 20px;}
.nav-section-header{color:#b4b4ae !important;font-weight:500 !important;letter-spacing:.14em !important;font-size:10.5px !important;padding:10px 18px !important;min-height:38px;}
.nav-section-header svg{opacity:.7 !important;}
.nav-section-header:hover,.nav-section-header.has-active{color:#fff !important;}
.nav-section-header.has-active svg{opacity:1 !important;}
.nav-sub-item{color:#b4b4ae !important;font-size:12.5px;padding:8px 14px 8px 16px !important;margin:1px 12px 1px 30px !important;border-left:1px solid #2a2a28 !important;transition:background-color var(--t),color var(--t);white-space:normal !important;line-height:1.25;}
.nav-sub-item:hover{color:#fff !important;border-left-color:#fff !important;}
.nav-sub-item.active{background:#fff;color:#000 !important;border-left-color:#fff !important;font-weight:600 !important;}
.nav-add-item{color:#80807b !important;opacity:1 !important;margin-left:30px !important;padding:8px 14px 8px 16px !important;text-transform:uppercase;letter-spacing:.1em;font-size:10px !important;font-weight:500;}
.nav-add-item:hover{color:#fff !important;}
.sidebar-divider{background:#2a2a28 !important;margin:6px 18px !important;}
.sidebar-user{border-top:1px solid #2a2a28 !important;}
.sidebar-user-role{color:#80807b !important;}
.sidebar-logout{border:1px solid #fff !important;color:#fff !important;text-transform:uppercase;letter-spacing:.1em !important;font-weight:500;padding:6px 10px !important;transition:background-color var(--t),color var(--t);}
.sidebar-logout:hover{background:#fff !important;color:#000 !important;}

/* ── 4. Cabeçalho ── */
header{background:#000 !important;border-bottom:2px solid #000 !important;padding:12px 28px !important;min-height:56px;gap:16px;flex-wrap:wrap;}
.logo,#headerTitle{font-size:13px !important;font-weight:500 !important;letter-spacing:.14em !important;color:#fff !important;}
.logo span,#headerTitle span{color:#fff !important;font-weight:700;}
#headerInfo{color:#b4b4ae !important;}
.btn-pdf{border:1px solid #fff !important;color:#fff !important;text-transform:uppercase;letter-spacing:.1em;font-weight:500 !important;font-size:11px !important;padding:7px 12px !important;transition:background-color var(--t),color var(--t);}
.btn-pdf:hover,.btn-pdf-all:hover{background:#fff !important;color:#000 !important;border-color:#fff !important;}
.btn-pdf-all{border-color:#fff !important;color:#fff !important;}

/* ── 5. Títulos ── */
main h1,main h2{letter-spacing:-.005em;line-height:1.1;}
.section-divider,.plan-sec-title{color:#000 !important;font-weight:500 !important;letter-spacing:.16em !important;font-size:10.5px !important;margin:18px 0 12px !important;}
.section-divider::after,.plan-sec-title::after{background:#000 !important;height:1px;}

/* ── 6. Filtros e campos ── */
#periodFilterBar,.upload-strip,#filesLoadedList,.ig-conn-bar{background:#fff !important;border:1px solid var(--border) !important;border-left:0 !important;border-right:0 !important;border-top:2px solid #000 !important;padding-left:0;padding-right:0;}
#periodFilterBar{padding:10px 0 !important;gap:12px !important;}
.upload-strip{padding:10px 0 !important;}
#periodFilterBar label,.modal-field label,.login-field label,.perm-cat-header,#filesLoadedList .fl-header span{font-weight:500 !important;letter-spacing:.14em !important;font-size:10px !important;}
.filter-bar input,.filter-bar select,#periodFilterBar input[type=date],.modal-field input,.modal-field select,.ig-date,.ig-sort,.content-area input[type=text],.content-area input[type=number],.content-area input[type=date],.content-area input[type=month],.content-area input[type=search],.content-area select,.content-area textarea{
  background:#fff !important;border:1px solid var(--grey) !important;color:#000 !important;min-height:36px;padding:7px 11px;font-size:13px;transition:border-color var(--t);
}
.filter-bar input:hover,.filter-bar select:hover,.content-area input:hover,.content-area select:hover,.modal-field input:hover,.modal-field select:hover{border-color:#000 !important;}
.filter-bar input:focus,.filter-bar select:focus,#periodFilterBar input:focus,.modal-field input:focus,.modal-field select:focus,.content-area input:focus,.content-area select:focus,.content-area textarea:focus{border-color:#000 !important;outline:1px solid #000 !important;outline-offset:0;}
input:disabled,select:disabled,textarea:disabled{border-style:dashed !important;color:#80807b !important;background:#fff !important;cursor:not-allowed;}
.content-area select,.modal-field select,.filter-bar select,.ig-sort{-webkit-appearance:none;appearance:none;padding-right:30px !important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-position:right 11px center !important;}
input::placeholder,textarea::placeholder{color:#9a9a95;font-weight:300;}
input[type=checkbox],input[type=radio]{accent-color:#000;}

/* ── 7. Abas, sub-abas e chips ── */
.tabs,.ig-tabs,.plan-tabs{gap:0 !important;border-bottom:2px solid #000;margin-bottom:18px !important;flex-wrap:wrap;}
.tab,.ig-tab,.plan-tab{border:0 !important;border-bottom:2px solid transparent !important;margin-bottom:-2px;background:transparent !important;color:#4a4a47 !important;font-size:11.5px !important;font-weight:500 !important;letter-spacing:.1em;text-transform:uppercase;padding:10px 14px !important;transition:background-color var(--t),color var(--t);}
.tab:hover,.ig-tab:hover,.plan-tab:hover{color:#000 !important;background:var(--hover) !important;}
.tab.active,.ig-tab.active,.plan-tab.active{background:#000 !important;color:#fff !important;border-bottom-color:#000 !important;}
.mode-btn,.scenario-btn,.ig-chip,.plan-year,.plan-year-add,.ig-apply,.ig-conn-btn{border:1px solid var(--border) !important;background:#fff !important;color:#4a4a47 !important;font-weight:500 !important;font-size:11px !important;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px !important;min-height:30px;transition:background-color var(--t),color var(--t),border-color var(--t);}
.mode-btn:hover,.scenario-btn:hover,.ig-chip:hover,.plan-year:hover,.plan-year-add:hover,.ig-apply:hover,.ig-conn-btn:hover{border-color:#000 !important;color:#000 !important;}
.mode-btn.active,.scenario-btn.active,.ig-chip.active,.plan-year.active{background:#000 !important;color:#fff !important;border-color:#000 !important;}
.plan-year-add{border-style:dashed !important;}
.ig-sep{background:#000 !important;}

/* ── 8. Blocos: cards de indicador, gráficos, tabelas ── */
.cards{gap:12px !important;}
.card,.ig-kpi,.plan-ident,.plan-valor,.plan-card,.ig-eng-block,.ig-card,.chart-box,.table-box,.ig-setup{
  background:#fff !important;border:1px solid var(--border) !important;border-top:2px solid #000 !important;
}
.card{padding:14px 16px 16px !important;}
.card .label,.ig-kl,.plan-il{font-size:10px !important;font-weight:500 !important;letter-spacing:.14em !important;text-transform:uppercase;color:#4a4a47 !important;margin-bottom:10px !important;}
.card .value,.ig-kv{font-size:26px !important;font-weight:700 !important;letter-spacing:-.015em;line-height:1 !important;color:#000;}
.card .sub,.ig-kd{font-size:11.5px !important;color:#6b6b66;margin-top:6px !important;}
/* Positivo / negativo / pendente / info / marketing — cor + linha superior */
.card.green{border-top-color:var(--green) !important;} .card.green .value{color:var(--green) !important;}
.card.red{border-top-color:var(--red) !important;} .card.red .value{color:var(--red) !important;}
.card.yellow,.card.orange{border-top-color:#d9a514 !important;} .card.yellow .value,.card.orange .value{color:var(--yellow) !important;}
.card.blue{border-top-color:#1d4ed8 !important;} .card.blue .value{color:#1d4ed8 !important;}
.card.purple{border-top-color:#6d28d9 !important;} .card.purple .value{color:#6d28d9 !important;}
.ig-kd.up{color:var(--green) !important;} .ig-kd.dn{color:var(--red) !important;}
.ig-kd.up::before{content:"▲ ";} .ig-kd.dn::before{content:"▼ ";}

.chart-box,.table-box{padding:16px 18px !important;}
.chart-box h3,.table-box h3,.ig-ct,.ig-eng-type{font-size:10.5px !important;font-weight:500 !important;letter-spacing:.16em !important;color:#000 !important;text-transform:uppercase;}
.chart-box h3::before,.table-box h3::before{content:"[ ";color:#80807b;}
.chart-box h3::after,.table-box h3::after{content:" ]";color:#80807b;}

/* Tabelas densas */
table{font-size:12.5px;}
th,.ig-table th,.plan-ind-table th{color:#000 !important;font-weight:500 !important;font-size:10px !important;letter-spacing:.12em !important;text-transform:uppercase;border-bottom:2px solid #000 !important;padding:9px 10px !important;background:#fff;}
td,.ig-table td,.plan-ind-table td{border-bottom:1px solid #ececea !important;padding:8px 10px !important;}
tr:hover:not(.total-row) td{background:var(--hover) !important;}
tr.total-row td{background:#f5f5f4 !important;border-top:2px solid #000 !important;font-weight:700 !important;}
tr.selected td,tr.is-selected td,tr[aria-selected="true"] td{background:#eff6ff !important;}
.plan-ind-table th:last-child,.plan-ind-table td:last-child{background:#fff !important;border-left:1px solid var(--border);}
.plan-edit:focus{background:#fff !important;outline:2px solid #000 !important;outline-offset:1px;}

/* Barras de progresso e ranking */
.progress-track,.plan-bar,.ig-bt,.rank-bar-track{background:#ececea !important;}
.progress-track,.plan-bar{height:6px !important;}
.rank-bar-fill{color:#fff !important;font-weight:600;}
.ig-bf{background:#000 !important;} .ig-bf-red{background:var(--red) !important;}

/* Pílulas informativas */
.pill{background:#fff !important;border:1px solid var(--border) !important;font-size:12px;}
.pill b{color:#000 !important;}

/* ── 9. Badges (cor + símbolo; nunca só cor) ── */
.badge,.ig-badge,.ig-type,.fl-tag,.plan-status{font-size:10px !important;font-weight:600 !important;letter-spacing:.06em;text-transform:uppercase;padding:3px 7px !important;border:1px solid transparent;}
.badge.green{background:var(--ok-bg) !important;color:var(--ok-fg) !important;border-color:var(--ok-bd);}
.badge.green::before{content:"✓ ";}
.badge.red{background:var(--err-bg) !important;color:var(--err-fg) !important;border-color:var(--err-bd);}
.badge.red::before{content:"! ";}
.badge.yellow{background:var(--warn-bg) !important;color:var(--warn-fg) !important;border-color:var(--warn-bd);}
.badge.yellow::before{content:"◷ ";}
.badge.blue,.badge.cyan{background:var(--info-bg) !important;color:var(--info-fg) !important;border-color:var(--info-bd);}
.ig-badge-amber{background:var(--warn-bg) !important;color:var(--warn-fg) !important;}
.ig-badge-blue,.ig-type-foto{background:var(--info-bg) !important;color:var(--info-fg) !important;}
.ig-type-video{background:var(--mkt-bg) !important;color:var(--mkt-fg) !important;}
.ig-type-carrossel{background:var(--warn-bg) !important;color:var(--warn-fg) !important;}
.ig-org{color:var(--green) !important;} .ig-paid{color:var(--yellow) !important;}
.plan-st-todo{background:#fff !important;color:#4a4a47 !important;border-color:#80807b;}
.plan-st-doing{background:var(--warn-bg) !important;color:var(--warn-fg) !important;border-color:var(--warn-bd);}
.plan-st-done{background:var(--ok-bg) !important;color:var(--ok-fg) !important;border-color:var(--ok-bd);}
.plan-obj .chk{border:1px solid #000 !important;}
.plan-obj.done .chk{background:var(--green) !important;border-color:var(--green) !important;}
.empty-badge{border:1px solid #000 !important;color:#000 !important;font-weight:500 !important;letter-spacing:.1em;text-transform:uppercase;}

/* ── 10. Botões ── */
.btn,.ig-connect-btn{font-size:11px !important;font-weight:500 !important;letter-spacing:.1em;text-transform:uppercase;padding:9px 16px !important;min-height:36px;border:1px solid #000 !important;transition:background-color var(--t),color var(--t),border-color var(--t);}
.btn:hover{opacity:1 !important;}
.btn-primary,.ig-connect-btn{background:#000 !important;color:#fff !important;}
.btn-primary:hover,.ig-connect-btn:hover{background:#fff !important;color:#000 !important;}
.btn-outline{background:#fff !important;color:#000 !important;}
.btn-outline:hover{background:#000 !important;color:#fff !important;}
.btn:disabled,.btn[disabled],button:disabled{border-style:dashed !important;background:#fff !important;color:#80807b !important;border-color:#80807b !important;cursor:not-allowed;}
.plan-del:hover,.notes-clear-btn:hover{color:var(--red) !important;}
.plan-addrow{color:#000 !important;text-transform:uppercase;letter-spacing:.1em;font-size:11px !important;font-weight:500 !important;}
.fl-swap-btn,.fl-toggle,.plan-mv:hover{color:#000 !important;}
/* Botões gerados pelo JS com estilo inline: hover consistente */
.content-area button[style*="border:1px solid var(--border)"]{transition:border-color var(--t),color var(--t);}
.content-area button[style*="border:1px solid var(--border)"]:hover{border-color:#000 !important;color:#000 !important;}
.content-area button[style*="background:var(--accent)"]{text-transform:uppercase;letter-spacing:.08em;font-weight:500 !important;}

/* ── 11. Upload ── */
.upload-zone{border:1px dashed #000 !important;background:#fff !important;transition:background-color var(--t);}
.upload-zone:hover,.upload-zone.drag{background:var(--hover) !important;border-style:solid !important;}
.upload-zone svg{color:#000 !important;}
.upload-zone h3{text-transform:uppercase;font-weight:500 !important;letter-spacing:.06em;}
.upload-strip .file-icon{color:#000 !important;}
#fileInput{position:absolute !important;width:1px !important;height:1px !important;opacity:0 !important;overflow:hidden;pointer-events:none;} /* acionado pelo botão "Selecionar arquivo(s)" */

/* ── 12. Modais ── */
.modal-box{border:1px solid #000 !important;border-top:4px solid #000 !important;padding:28px !important;}
.modal-box h2{text-transform:uppercase;font-weight:600 !important;letter-spacing:.04em;font-size:16px !important;}
.modal-actions{border-top:1px solid var(--border);padding-top:16px;}
.perm-cat{background:#fff !important;border:1px solid var(--border) !important;}

/* ── 13. Observações (anotações) ── */
#notes-fab{background:#000 !important;border:1px solid #000 !important;width:48px !important;height:48px !important;transition:background-color var(--t);}
#notes-fab:hover{transform:none !important;background:#2a2a28 !important;}
#notes-fab .notes-dot{background:#fff !important;border:2px solid #000;}
#notes-panel{border:1px solid #000 !important;border-top:4px solid #000 !important;}
.notes-panel-header,.notes-panel-footer{background:#fff !important;}
.notes-panel-title{text-transform:uppercase;letter-spacing:.1em;font-weight:600 !important;}

/* ── 14. Estados: vazio, carregando ── */
.empty-section h2{text-transform:uppercase;font-weight:600 !important;letter-spacing:.04em;}
#appLoadingOverlay{background:#fff !important;color:#000 !important;}
.app-loading-box{font-weight:500 !important;letter-spacing:.14em !important;text-transform:uppercase;font-size:11px !important;}
.app-loading-spinner{border:2px solid #e3e3e0 !important;border-top-color:#000 !important;}

/* ── 15. Login ── */
#loginOverlay{background:#000 !important;}
.login-box{border-top:2px solid #fff;border-bottom:2px solid #fff;padding:40px 28px 28px;max-width:420px !important;}
.login-logo-mark img{mix-blend-mode:normal !important;opacity:1 !important;filter:none !important;width:170px !important;}
.login-logo-mark{margin-bottom:28px !important;}
.login-divider{display:none;}
.login-eyebrow{color:#b4b4ae !important;font-weight:500 !important;letter-spacing:.2em !important;font-size:10px !important;}
.login-eyebrow::before{content:"[ ";} .login-eyebrow::after{content:" ]";}
.login-title{font-weight:500 !important;font-size:24px !important;letter-spacing:.04em !important;margin-bottom:32px !important;}
.login-field label{color:#b4b4ae !important;}
.login-field input{background:#000 !important;border:1px solid #80807b !important;color:#fff !important;min-height:46px;font-size:16px !important;}
.login-field input:hover{border-color:#fff !important;}
.login-field input:focus{border-color:#fff !important;outline:1px solid #fff !important;}
.login-field input::placeholder{color:#80807b !important;}
#loginRememberDevice{accent-color:#fff !important;}
.login-btn{background:#fff !important;color:#000 !important;border:1px solid #fff !important;font-weight:500 !important;letter-spacing:.2em !important;min-height:48px;transition:background-color var(--t),color var(--t);}
.login-btn:hover{opacity:1 !important;background:#000 !important;color:#fff !important;}
.login-err{color:#fca5a5 !important;font-weight:500;}
.login-err:not(:empty)::before{content:"! ";}
.login-footer-divider{display:none;}
.login-footer-tagline{color:#80807b !important;font-weight:500;}

/* ── 16. Boas-vindas ── */
#homeOverlay{background:#000 !important;}
.home-greeting{color:#b4b4ae !important;font-weight:500 !important;font-size:11px !important;}
.home-name{font-weight:600 !important;text-transform:uppercase;letter-spacing:.02em !important;}
.home-quote{color:#b4b4ae !important;}
.home-quote-author{color:#80807b !important;}
.home-divider{background:#fff !important;height:2px !important;}
.home-area-card{background:#000 !important;border:1px solid #fff !important;transition:background-color var(--t),color var(--t);}
.home-area-card:hover{background:#fff !important;}
.home-area-card:hover .home-area-label{color:#000 !important;}
.home-area-card:hover .home-area-sub{color:#4a4a47 !important;}
.home-area-label{font-weight:600 !important;letter-spacing:.1em !important;}
.home-area-sub{color:#b4b4ae !important;}
.home-skip{color:#b4b4ae !important;font-weight:500;}
.home-skip:hover{color:#fff !important;}

/* ── 17. Celular e tablet ── */
@media (max-width:900px){
  main{padding:18px 16px !important;}
  .plan-wrap,.ig-wrap{padding:18px 16px 60px !important;}
}
@media (max-width:768px){
  /* O menu lateral (antes oculto no celular) vira faixa superior rolável — mesmos elementos e cliques */
  .app-shell{flex-direction:column;}
  .sidebar{display:flex !important;position:relative !important;width:100% !important;min-width:0 !important;height:auto !important;border-right:0 !important;border-bottom:1px solid #2a2a28 !important;overflow:visible !important;}
  .sidebar-brand{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px !important;}
  .sidebar-brand-tagline{margin-top:0 !important;}
  .sidebar-logo-wrap img{width:130px !important;}
  .sidebar-nav{display:flex;align-items:stretch;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 8px 8px !important;gap:2px;}
  .sidebar-nav::-webkit-scrollbar{display:none;}
  .nav-section{display:flex;align-items:center;flex:none;margin:0 !important;}
  .nav-section-items{padding:0 !important;}
  .nav-section-items:not([style*="display:none"]):not([style*="display: none"]){display:flex !important;gap:2px;}
  .nav-section-header{min-height:44px;padding:0 12px !important;white-space:nowrap;}
  .nav-section-header.open{color:#fff !important;}
  .nav-sub-item,.nav-add-item{margin:0 !important;border-left:0 !important;min-height:40px;padding:0 12px !important;white-space:nowrap !important;}
  .sidebar-divider{display:none;}
  .sidebar-user{padding:8px 16px !important;}
  .content-area{margin-left:0 !important;}
  header{padding:10px 16px !important;min-height:0;}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .card .value,.ig-kv{font-size:21px !important;}
  .filter-bar input{min-width:0 !important;flex:1 1 100%;}
  .filter-bar input,.filter-bar select,.content-area input:not([type=checkbox]):not([type=radio]),.content-area select,.modal-field input,.modal-field select{min-height:44px;font-size:16px !important;}
  .btn,.tab,.ig-tab,.plan-tab{min-height:44px;}
  .tabs,.ig-tabs,.plan-tabs{flex-wrap:nowrap !important;overflow-x:auto;scrollbar-width:none;}
  .tab,.ig-tab,.plan-tab{flex:none;}
  .upload-zone{width:100% !important;padding:36px 20px !important;}
  .modal-box{padding:20px !important;}
  #notes-fab{bottom:16px !important;right:16px !important;}
  #notes-panel{right:16px !important;bottom:72px !important;}
  .ig-two,.ig-sgrid,.ig-eng-cols,.plan-ident,.plan-obj-grid{grid-template-columns:1fr !important;}
  .ig-eng-div{display:none;}
  .ig-eng-col{padding:0 !important;}
}
@media (max-width:420px){
  .cards{grid-template-columns:1fr !important;}
}

/* ── 18. Impressão ── */
@media print{
  body{font-family:var(--font) !important;}
  .card,.chart-box,.table-box{border:1px solid #000 !important;border-top:2px solid #000 !important;}
  th{border-bottom:2px solid #000 !important;}
  .badge,.card.green .value,.card.red .value,.card.yellow .value{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .badge.green{background:#dcfce7 !important;color:#14532d !important;}
  .badge.red{background:#fee2e2 !important;color:#991b1b !important;}
  .badge.yellow{background:#fef3c7 !important;color:#78350f !important;}
  .sidebar{display:none !important;}
}
