/* =====================================================================
   PAINEL DE PROJETOS — CONTROLADORIA · Amigos do Bem
   styles.css · visual institucional, sóbrio e responsivo
   ---------------------------------------------------------------------
   IDENTIDADE ADB (ajuste os hex aqui se a marca mudar):
     --adb-amarelo : #FFD000  (acento oficial)
     --tinta        : #111     (header / textos fortes)
   ===================================================================== */

:root{
  --adb-amarelo:#FFD000;
  --adb-amarelo-2:#e6bd00;
  --tinta:#111418;
  --tinta-2:#1b2026;
  --cinza-bg:#f3f4f6;
  --cinza-card:#ffffff;
  --cinza-borda:#e2e5ea;
  --cinza-borda-2:#d2d6dd;
  --texto:#1f2937;
  --texto-mid:#6b7280;
  --texto-fraco:#9aa1ab;
  --ok:#1a7f37; --ok-bg:#e9f6ec;
  --info:#0b69c7; --info-bg:#e7f1fb;
  --warn:#b9770a; --warn-bg:#fdf3e2;
  --err:#b42318; --err-bg:#fdecea;
  --roxo:#5b3fb0;
  --s1:0 1px 2px rgba(16,24,40,.06);
  --s2:0 4px 14px rgba(16,24,40,.10);
  --r:8px;
  --nav-w:232px;
  font-family:'Segoe UI',system-ui,-apple-system,'Inter',sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--cinza-bg);color:var(--texto);font-size:14px;line-height:1.45}
a{color:var(--info);text-decoration:none}
a:hover{text-decoration:underline}
button{font-family:inherit;cursor:pointer}

/* ---------- Botões ---------- */
.btn-primary{background:var(--tinta);color:#fff;border:none;border-radius:6px;
  padding:9px 16px;font-size:13px;font-weight:600;transition:background .15s}
.btn-primary:hover{background:#2a2f37}
.btn-ghost{background:#fff;color:var(--texto-mid);border:1px solid var(--cinza-borda-2);
  border-radius:6px;padding:8px 14px;font-size:13px;font-weight:600;transition:.15s}
.btn-ghost:hover{border-color:var(--texto-mid);color:var(--texto)}
.btn-danger{background:#fff;color:var(--err);border:1px solid var(--err);border-radius:6px;
  padding:8px 14px;font-size:13px;font-weight:600}
.btn-danger:hover{background:var(--err);color:#fff}

/* =====================================================================
   LOGIN
   ===================================================================== */
#login{position:fixed;inset:0;background:linear-gradient(160deg,#0d1014,#1b2026);
  display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}
.login-box{background:#fff;border-radius:12px;padding:36px 34px;width:100%;max-width:400px;
  box-shadow:0 12px 40px rgba(0,0,0,.4);border-top:4px solid var(--adb-amarelo)}
.login-brand{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.login-logo{width:54px;height:54px;border-radius:50%;flex-shrink:0;object-fit:contain;
  box-shadow:0 0 0 1px var(--cinza-borda)}
.login-org{font-size:10px;letter-spacing:.18em;color:var(--texto-fraco);font-weight:700}
.login-title{font-size:19px;font-weight:700;color:var(--tinta);line-height:1.15}
.login-sub{font-size:12px;color:var(--texto-mid)}
.login-form{display:flex;flex-direction:column}
.login-form label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--texto-mid);margin-bottom:5px;margin-top:12px}
.login-form input{border:1px solid var(--cinza-borda-2);border-radius:6px;padding:11px 12px;
  font-size:14px;outline:none;transition:border .15s}
.login-form input:focus{border-color:var(--tinta)}
#btn-entrar{margin-top:22px}
.login-erro{color:var(--err);font-size:12px;margin-top:10px;min-height:16px}
.login-rodape{margin-top:22px;padding-top:16px;border-top:1px solid var(--cinza-borda);
  text-align:center;font-size:11px;color:var(--texto-fraco)}

/* =====================================================================
   APP SHELL
   ===================================================================== */
#app{display:none;min-height:100vh;flex-direction:column}
#app.on{display:flex}

.topbar{height:58px;background:var(--tinta);display:flex;align-items:center;gap:12px;
  padding:0 18px;flex-shrink:0;position:sticky;top:0;z-index:50}
.top-logo{width:36px;height:36px;border-radius:50%;object-fit:contain;
  box-shadow:0 0 0 1px rgba(255,255,255,.15)}
.top-title{font-size:15px;font-weight:700;color:#fff;line-height:1.1}
.top-sub{font-size:11px;color:#9aa1ab}
.top-spacer{flex:1}
.top-user{text-align:right;line-height:1.25}
.top-uname{font-size:13px;color:#eef0f2;font-weight:600}
.top-urole{font-size:10px;color:var(--adb-amarelo);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.top-avatar{width:34px;height:34px;border-radius:50%;background:var(--adb-amarelo);color:var(--tinta);
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0}
#btn-sair{padding:6px 12px;font-size:12px;background:transparent;color:#9aa1ab;border-color:#333a43}
#btn-sair:hover{color:#fff;border-color:#5a626d}

.shell{flex:1;display:flex;align-items:stretch}

/* ---------- Sidebar ---------- */
.sidenav{width:var(--nav-w);background:#fff;border-right:1px solid var(--cinza-borda);
  flex-shrink:0;padding:14px 0}
.nav-item{display:flex;align-items:center;gap:10px;padding:10px 18px;font-size:13px;
  color:var(--texto-mid);cursor:pointer;border-left:3px solid transparent;font-weight:600;transition:.12s}
.nav-item:hover{background:#f7f8fa;color:var(--texto)}
.nav-item.sel{background:#f4f5f7;border-left-color:var(--adb-amarelo);color:var(--tinta)}
.nav-item .nav-ico{width:18px;text-align:center;font-size:15px}
.nav-badge{margin-left:auto;background:var(--err);color:#fff;font-size:10px;font-weight:700;
  border-radius:10px;padding:1px 7px;min-width:18px;text-align:center}
.nav-sep{font-size:10px;font-weight:700;color:var(--texto-fraco);text-transform:uppercase;
  letter-spacing:.1em;padding:16px 18px 6px}

/* ---------- Conteúdo ---------- */
.content{flex:1;padding:24px 28px;overflow-x:hidden;max-width:100%}
.view{display:none}
.view.on{display:block;animation:fade .15s ease}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

.view-head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 16px;margin-bottom:20px;
  padding-bottom:14px;border-bottom:1px solid var(--cinza-borda)}
.view-head h1{font-size:21px;font-weight:700;color:var(--tinta)}
.view-desc{font-size:13px;color:var(--texto-mid);flex:1;min-width:200px}
.view-actions{margin-left:auto;display:flex;gap:8px;align-items:center}

/* =====================================================================
   DASHBOARD
   ===================================================================== */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;margin-bottom:22px}
.card{background:var(--cinza-card);border:1px solid var(--cinza-borda);border-radius:var(--r);
  padding:16px 18px;box-shadow:var(--s1)}
.card.destaque{border-left:4px solid var(--adb-amarelo)}
.card.clicavel{cursor:pointer;transition:transform .12s,box-shadow .12s,border-color .12s}
.card.clicavel:hover{transform:translateY(-2px);box-shadow:var(--s2);border-color:var(--adb-amarelo)}
.chart-card canvas{cursor:default}
.chip-rapido{display:inline-flex;align-items:center;gap:8px;background:var(--adb-amarelo);color:var(--tinta);
  border-radius:20px;padding:7px 14px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}
.chip-rapido[hidden]{display:none}
.chip-rapido:hover{background:var(--adb-amarelo-2)}
.card-num{font-size:30px;font-weight:700;color:var(--tinta);line-height:1}
.card-lbl{font-size:12px;color:var(--texto-mid);margin-top:6px}
.card-sub{font-size:11px;color:var(--texto-fraco);margin-top:2px}

.charts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.chart-card{background:var(--cinza-card);border:1px solid var(--cinza-borda);border-radius:var(--r);
  padding:16px 18px;box-shadow:var(--s1)}
.chart-card.chart-wide{grid-column:1/-1}
.chart-card h3{font-size:13px;font-weight:700;color:var(--texto);margin-bottom:12px}
.chart-card canvas{max-height:260px}
/* Demanda por setor: barra horizontal com 1 linha por setor — precisa de altura
   para caber todos os rótulos (ver autoSkip:false no app.js). */
#chart-setor{max-height:360px}

/* =====================================================================
   ALTERNADOR QUADRO / GRADE
   ===================================================================== */
.view-toggle{display:inline-flex;background:#fff;border:1px solid var(--cinza-borda-2);
  border-radius:8px;padding:3px;margin-bottom:14px;gap:2px}
.toggle-btn{background:none;border:none;border-radius:6px;padding:7px 16px;font-size:13px;
  font-weight:600;color:var(--texto-mid)}
.toggle-btn.ativo{background:var(--tinta);color:#fff}

/* linha de controles do catálogo (Quadro/Grade + Agrupar por) */
.projetos-controles{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-bottom:14px}
.projetos-controles .view-toggle{margin-bottom:0}
.agrupar-por{display:inline-flex;align-items:center;gap:2px;background:#fff;
  border:1px solid var(--cinza-borda-2);border-radius:8px;padding:3px 3px 3px 12px}
.agrupar-por[hidden]{display:none}
.agrupar-lbl{font-size:12px;font-weight:600;color:var(--texto-mid);margin-right:6px}

/* link "em breve" (Power BI/HTML sem link ainda) */
.link-pend{font-size:11px;color:var(--texto-fraco);font-style:italic}
.proj-link.btn-primary,.det-acesso .btn-primary{display:inline-block}

/* =====================================================================
   VISÃO GRADE (tabela)
   ===================================================================== */
.grade-wrap{background:#fff;border:1px solid var(--cinza-borda);border-radius:var(--r);
  overflow:hidden;box-shadow:var(--s1)}
table.grade{width:100%;border-collapse:collapse;font-size:13px}
table.grade thead th{text-align:left;font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.04em;color:var(--texto-mid);padding:11px 14px;border-bottom:1px solid var(--cinza-borda);
  background:#f7f8fa}
table.grade tbody td{padding:11px 14px;border-bottom:1px solid #f0f1f4;vertical-align:middle}
table.grade tbody tr{cursor:pointer;transition:background .12s}
table.grade tbody tr:hover{background:#f7f8fa}
table.grade tbody tr:last-child td{border-bottom:none}
.g-nome{font-weight:600;color:var(--tinta);max-width:340px}
.cat-pill{font-size:11px;background:#f0f1f4;color:var(--texto-mid);border-radius:10px;padding:2px 9px;white-space:nowrap}
.g-link{font-size:12px;font-weight:600}

/* =====================================================================
   DETALHE (somente leitura)
   ===================================================================== */
.det-acesso{margin-bottom:16px}
.det-desc{font-size:13px;color:var(--texto);line-height:1.6;margin-bottom:16px;white-space:pre-line}
.det-row{display:flex;gap:10px;padding:8px 0;border-top:1px solid #f0f1f4;font-size:13px}
.det-rot{min-width:120px;font-weight:700;color:var(--texto-mid)}
.det-acoes{margin-top:18px;padding-top:16px;border-top:1px solid var(--cinza-borda);text-align:right}

/* ----- Triagem da IA (tela de avaliar) ----- */
.ia-box{background:#f5f8fb;border:1px solid #d6e0ea;border-left:4px solid var(--tinta);
  border-radius:8px;padding:14px 16px;margin-bottom:18px}
.ia-box[hidden]{display:none}
.ia-head{font-size:13px;font-weight:700;color:#163E5C;display:flex;align-items:center;gap:10px;margin-bottom:8px}
.ia-vered{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;border-radius:10px;padding:2px 9px}
.ia-vered.aprovar{background:var(--ok-bg);color:var(--ok)}
.ia-vered.precisa_info{background:var(--warn-bg);color:var(--warn)}
.ia-vered.recusar{background:var(--err-bg);color:var(--err)}
.ia-resumo{font-size:13px;color:var(--texto);line-height:1.55;margin:0 0 4px}
.ia-sec{font-size:12.5px;color:var(--texto);margin-top:8px;line-height:1.5}
.ia-rot{display:block;font-weight:700;color:#163E5C;font-size:11px;text-transform:uppercase;letter-spacing:.03em;margin-bottom:2px}
.ia-ul{margin:2px 0 0 16px;padding:0}
.ia-ul li{margin-bottom:2px}
.resp-input{width:100%;margin-top:8px;border:1px solid var(--cinza-borda-2);border-radius:6px;
  padding:8px 10px;font-size:13px;font-family:inherit;resize:vertical;outline:none}
.resp-input:focus{border-color:var(--tinta)}

/* =====================================================================
   FILTROS
   ===================================================================== */
.filtros{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.f-input{border:1px solid var(--cinza-borda-2);border-radius:6px;padding:8px 10px;font-size:13px;
  background:#fff;outline:none;min-width:150px}
.f-input:focus{border-color:var(--tinta)}

/* =====================================================================
   COLUNAS POR CATEGORIA (catálogo)
   ===================================================================== */
.colunas{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;align-items:start}
/* o atributo hidden deve vencer o display:grid acima (alternância Quadro/Grade) */
.colunas[hidden],.grade-wrap[hidden]{display:none}
.coluna{background:#eef0f3;border:1px solid var(--cinza-borda);border-radius:var(--r);padding:12px;min-height:80px}
.coluna-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;
  padding-bottom:8px;border-bottom:2px solid var(--adb-amarelo)}
.coluna-head h3{font-size:13px;font-weight:700;color:var(--tinta)}
.coluna-count{font-size:11px;font-weight:700;color:var(--texto-mid);background:#fff;
  border-radius:10px;padding:1px 8px}
.proj-card{background:#fff;border:1px solid var(--cinza-borda);border-radius:6px;padding:12px;
  margin-bottom:10px;box-shadow:var(--s1);cursor:pointer;transition:.12s}
.proj-card:hover{box-shadow:var(--s2);transform:translateY(-1px);border-color:var(--cinza-borda-2)}
.proj-titulo{font-size:13px;font-weight:700;color:var(--tinta);margin-bottom:4px}
.proj-desc{font-size:12px;color:var(--texto-mid);margin-bottom:8px;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.proj-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:11px;color:var(--texto-fraco)}
.proj-tools{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
.tool-chip{font-size:10px;background:#f0f1f4;color:var(--texto-mid);border-radius:4px;padding:2px 6px}
.proj-link{display:inline-block;margin-top:8px;font-size:12px;font-weight:600}

/* ---------- Badges de status ---------- */
.badge{font-size:10px;font-weight:700;border-radius:10px;padding:2px 9px;text-transform:uppercase;letter-spacing:.03em}
.badge.solicitado{background:var(--cinza-borda);color:var(--texto-mid)}
.badge.em_avaliacao{background:var(--info-bg);color:var(--info)}
.badge.aprovado{background:#eae6f7;color:var(--roxo)}
.badge.em_desenvolvimento{background:var(--warn-bg);color:var(--warn)}
.badge.em_producao{background:var(--ok-bg);color:var(--ok)}
.badge.pausado{background:#eef0f3;color:var(--texto-mid)}
.badge.cancelado{background:var(--err-bg);color:var(--err)}
.badge-prio{font-size:10px;font-weight:700;border-radius:4px;padding:2px 7px}
.badge-prio.baixa{background:#eef0f3;color:var(--texto-mid)}
.badge-prio.media{background:var(--info-bg);color:var(--info)}
.badge-prio.alta{background:var(--err-bg);color:var(--err)}

/* =====================================================================
   SOLICITAÇÕES (lista)
   ===================================================================== */
.solic-lista{display:flex;flex-direction:column;gap:10px}
.solic-row{background:#fff;border:1px solid var(--cinza-borda);border-radius:var(--r);padding:14px 16px;
  box-shadow:var(--s1);display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center}
.solic-main{flex:1;min-width:220px}
.solic-titulo{font-size:14px;font-weight:700;color:var(--tinta)}
.solic-sub{font-size:12px;color:var(--texto-mid);margin-top:3px}
.solic-info{font-size:11px;color:var(--texto-fraco);margin-top:4px}
.solic-acoes{display:flex;gap:8px;align-items:center}

/* =====================================================================
   FERRAMENTAS (chips)
   ===================================================================== */
.chips-lista{display:flex;flex-wrap:wrap;gap:10px}
.ferr-chip{background:#fff;border:1px solid var(--cinza-borda);border-radius:20px;padding:8px 14px;
  font-size:13px;display:flex;align-items:center;gap:10px;box-shadow:var(--s1)}
.ferr-chip .ferr-del{color:var(--texto-fraco);cursor:pointer;font-weight:700;border:none;background:none;font-size:15px}
.ferr-chip .ferr-del:hover{color:var(--err)}
.inline-form{display:flex;gap:8px}

/* =====================================================================
   FORMULÁRIOS (cards e modais)
   ===================================================================== */
.form-card{background:#fff;border:1px solid var(--cinza-borda);border-radius:var(--r);
  padding:22px;max-width:680px;box-shadow:var(--s1)}
.form-card label,.modal-body label{display:block;font-size:12px;font-weight:700;color:var(--texto-mid);
  margin:14px 0 5px}
.form-card input,.form-card textarea,.form-card select,
.modal-body input,.modal-body textarea,.modal-body select{
  width:100%;border:1px solid var(--cinza-borda-2);border-radius:6px;padding:10px 11px;
  font-size:13px;font-family:inherit;outline:none}
.form-card input:focus,.form-card textarea:focus,.form-card select:focus,
.modal-body input:focus,.modal-body textarea:focus,.modal-body select:focus{border-color:var(--tinta)}
.form-card textarea,.modal-body textarea{resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-card .btn-primary{margin-top:20px}
.form-msg{font-size:12px;margin-top:10px;min-height:16px}
.form-msg.ok{color:var(--ok)}
.form-msg.err{color:var(--err)}

/* =====================================================================
   MODAIS
   ===================================================================== */
.modal{position:fixed;inset:0;background:rgba(16,24,40,.55);z-index:200;
  display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;overflow-y:auto}
.modal[hidden]{display:none}
.modal-box{background:#fff;border-radius:12px;width:100%;max-width:640px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;
  border-bottom:1px solid var(--cinza-borda)}
.modal-head h2{font-size:17px;font-weight:700;color:var(--tinta)}
.modal-x{border:none;background:none;font-size:24px;color:var(--texto-fraco);line-height:1}
.modal-x:hover{color:var(--texto)}
.modal-body{padding:20px 22px}
.modal-foot{display:flex;align-items:center;justify-content:space-between;margin-top:22px;
  padding-top:16px;border-top:1px solid var(--cinza-borda)}
.modal-foot-right{display:flex;gap:8px;margin-left:auto}
.check-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px;
  border:1px solid var(--cinza-borda);border-radius:6px;padding:10px}
.check-grid label{display:flex;align-items:center;gap:7px;margin:0;font-weight:500;
  color:var(--texto);text-transform:none;font-size:13px;cursor:pointer}
.check-grid input{width:auto}

.hint{font-size:12px;color:var(--texto-mid);margin-bottom:10px;line-height:1.6}
.hint code{background:#f0f1f4;border-radius:4px;padding:1px 5px;font-size:11px}
.hint-list{font-size:12px;color:var(--texto-mid);margin:0 0 16px 18px;line-height:1.8}
.import-actions{display:flex;gap:10px;flex-wrap:wrap}
.file-label{display:inline-flex;align-items:center}
.import-resultado{margin-top:18px;border-top:1px solid var(--cinza-borda);padding-top:14px;font-size:13px}
.import-resultado .imp-ok{color:var(--ok);font-weight:700}
.import-resultado .imp-err{color:var(--err);font-weight:700}
.import-resultado ul{margin:8px 0 0 18px;font-size:12px;color:var(--err)}

/* =====================================================================
   CONFIGURAÇÕES (painel)
   ===================================================================== */
.cfg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;align-items:start}
.cfg-card{background:var(--cinza-card);border:1px solid var(--cinza-borda);border-radius:var(--r);
  padding:18px 20px;box-shadow:var(--s1)}
.cfg-card.cfg-wide{grid-column:1/-1}
.cfg-h{font-size:14px;font-weight:700;color:var(--tinta);margin-bottom:14px;padding-bottom:9px;
  border-bottom:2px solid var(--adb-amarelo);display:inline-block}
.cfg-field{margin-bottom:16px}
.cfg-field label{display:block;font-size:12px;font-weight:700;color:var(--texto-mid);margin-bottom:7px}
.cfg-seg{display:inline-flex;background:#fff;border:1px solid var(--cinza-borda-2);border-radius:8px;padding:3px;gap:2px}
.cfg-seg button{background:none;border:none;border-radius:6px;padding:7px 15px;font-size:13px;font-weight:600;
  color:var(--texto-mid);transition:.12s}
.cfg-seg button.ativo{background:var(--tinta);color:#fff}
.cfg-hint{font-size:11.5px;color:var(--texto-fraco);margin-top:6px;line-height:1.5}
/* TRAVA DE SEGURANÇA: cards/ações só-admin nunca aparecem para quem não é
   Controladoria — vale mesmo sem JS ou com cache antigo (além do hidden do renderConfig). */
body:not(.role-controladoria) .cfg-admin{display:none !important}
.cfg-actions{display:flex;flex-wrap:wrap;gap:8px}
.cfg-about{font-size:15px;font-weight:700;color:var(--tinta)}
.cfg-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}
.cfg-cats h3{font-size:11px;font-weight:700;color:var(--texto-mid);text-transform:uppercase;
  letter-spacing:.06em;margin-bottom:10px}
.cfg-cats .chips-lista{margin-bottom:10px}
.cfg-acessos{overflow-x:auto}
.cfg-acessos table{width:100%;border-collapse:collapse;font-size:13px}
.cfg-acessos th{text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.04em;
  color:var(--texto-mid);padding:8px 10px;border-bottom:1px solid var(--cinza-borda)}
.cfg-acessos td{padding:8px 10px;border-bottom:1px solid #f0f1f4;vertical-align:middle}
.cfg-acessos select{border:1px solid var(--cinza-borda-2);border-radius:6px;padding:6px 8px;
  font-size:13px;background:#fff;color:var(--texto)}
.cfg-acessos .btn-ghost{padding:6px 12px;font-size:12px}

/* Densidade compacta (preferência de Aparência) */
body.densidade-compacta .content{padding:16px 20px}
body.densidade-compacta .card{padding:12px 14px}
body.densidade-compacta .proj-card{padding:9px 10px;margin-bottom:8px}
body.densidade-compacta .coluna{padding:9px}
body.densidade-compacta .cfg-card{padding:14px 16px}
body.densidade-compacta table.grade tbody td{padding:8px 12px}

/* =====================================================================
   FAVORITOS (estrela)
   ===================================================================== */
.proj-card{position:relative}
.proj-card .proj-titulo{padding-right:24px}
.fav-btn{position:absolute;top:8px;right:8px;background:none;border:none;font-size:17px;line-height:1;
  color:var(--texto-fraco);cursor:pointer;padding:2px;transition:transform .1s,color .15s}
.fav-btn:hover{transform:scale(1.15);color:var(--adb-amarelo-2)}
.fav-btn.on{color:var(--adb-amarelo)}
.g-favcell{width:30px;text-align:center}
.g-fav{background:none;border:none;font-size:15px;color:var(--texto-fraco);cursor:pointer;padding:0;line-height:1}
.g-fav:hover{color:var(--adb-amarelo-2)}
.g-fav.on{color:var(--adb-amarelo)}

/* =====================================================================
   FEEDBACK (banner + estrelas + lista)
   ===================================================================== */
.fb-banner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;
  background:#fff7d6;border:1px solid var(--adb-amarelo);border-left:4px solid var(--adb-amarelo);
  border-radius:var(--r);padding:12px 16px;margin-bottom:16px}
.fb-banner[hidden]{display:none}
.fb-banner-txt{font-size:13px;color:var(--texto)}
.fb-banner-acoes{display:flex;gap:8px;flex-shrink:0}
.fb-stars{display:flex;gap:8px;margin-bottom:8px}
.fb-stars button{background:none;border:none;font-size:32px;line-height:1;color:var(--cinza-borda-2);
  cursor:pointer;padding:0;transition:color .1s,transform .1s}
.fb-stars button:hover{transform:scale(1.12)}
.fb-stars button.on{color:var(--adb-amarelo)}
.cfg-feedbacks{display:flex;flex-direction:column;gap:10px}
.fb-media{font-size:13px;color:var(--texto-mid);margin-bottom:4px}
.fb-media strong{color:var(--tinta);font-size:17px}
.fb-item{border:1px solid var(--cinza-borda);border-radius:8px;padding:10px 12px;background:#fff}
.fb-item-top{display:flex;justify-content:space-between;gap:10px;align-items:center}
.fb-item-stars{color:var(--adb-amarelo);font-size:14px;letter-spacing:1px}
.fb-item-meta{font-size:11px;color:var(--texto-fraco)}
.fb-item-cmt{font-size:13px;color:var(--texto);margin-top:6px;line-height:1.5}

/* =====================================================================
   SUGESTÕES DE MELHORIA
   ===================================================================== */
.sug-form{display:flex;flex-direction:column;gap:8px;max-width:640px;margin-bottom:18px}
.sug-form .f-input{width:100%}
.sug-form .btn-primary{align-self:flex-start;margin-top:2px}
.sug-lista-titulo{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  color:var(--texto-mid);margin-bottom:8px}
.cfg-sugestoes{display:flex;flex-direction:column;gap:10px}
.sug-item{border:1px solid var(--cinza-borda);border-radius:8px;padding:10px 12px;background:#fff}
.sug-item-top{display:flex;justify-content:space-between;gap:10px;align-items:center}
.sug-item-tit{font-weight:700;color:var(--tinta);font-size:13px}
.sug-item-desc{font-size:13px;color:var(--texto);margin-top:5px;line-height:1.5}
.sug-item-meta{font-size:11px;color:var(--texto-fraco);margin-top:6px}
.sug-badge{font-size:10px;font-weight:700;border-radius:10px;padding:2px 9px;text-transform:uppercase;
  letter-spacing:.03em;flex-shrink:0}
.sug-badge.s-nova{background:var(--info-bg);color:var(--info)}
.sug-badge.s-em_analise{background:var(--warn-bg);color:var(--warn)}
.sug-badge.s-planejada{background:#eae6f7;color:var(--roxo)}
.sug-badge.s-concluida{background:var(--ok-bg);color:var(--ok)}
.sug-badge.s-recusada{background:var(--err-bg);color:var(--err)}
.sug-status{border:1px solid var(--cinza-borda-2);border-radius:6px;padding:5px 8px;font-size:12px;
  background:#fff;color:var(--texto);flex-shrink:0}

/* =====================================================================
   DIVERSOS
   ===================================================================== */
.vazio{text-align:center;color:var(--texto-fraco);font-size:13px;padding:40px 20px;
  background:#fff;border:1px dashed var(--cinza-borda-2);border-radius:var(--r)}
.so-controladoria{display:none}
body.role-controladoria .so-controladoria{display:inline-flex}

.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:500;
  background:var(--tinta);color:#fff;padding:11px 20px;border-radius:8px;font-size:13px;
  box-shadow:0 8px 24px rgba(0,0,0,.3)}
.toast[hidden]{display:none}
.toast.err{background:var(--err)}
.toast.ok{background:var(--ok)}

/* =====================================================================
   CONFIGURAÇÕES (engrenagem + menu)
   ===================================================================== */
.top-config{position:relative}
.btn-config{width:34px;height:34px;border-radius:8px;border:1px solid #333a43;background:transparent;
  color:#9aa1ab;display:flex;align-items:center;justify-content:center;transition:.15s}
.btn-config:hover{color:#fff;border-color:#5a626d}
.btn-config.aberto{color:var(--adb-amarelo);border-color:var(--adb-amarelo)}
.btn-config svg{width:17px;height:17px}
.config-menu{position:absolute;top:calc(100% + 10px);right:0;background:var(--cinza-card);
  border:1px solid var(--cinza-borda);border-radius:10px;box-shadow:var(--s2);
  min-width:195px;padding:8px;z-index:80}
.config-menu[hidden]{display:none}
.config-titulo{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:var(--texto-fraco);padding:4px 10px 6px}
.config-op{display:flex;align-items:center;gap:9px;width:100%;text-align:left;background:none;
  border:none;border-radius:7px;padding:9px 10px;font-size:13px;font-weight:600;
  color:var(--texto);transition:background .12s}
.config-op:hover{background:#f4f5f7}
.config-op .config-ico{width:16px;text-align:center}
.config-op .config-check{margin-left:auto;color:var(--ok);opacity:0;font-weight:700}
.config-op.ativo .config-check{opacity:1}

/* =====================================================================
   TEMA ESCURO — html[data-tema="dark"]
   As variáveis fazem o grosso; as regras abaixo cobrem os tons que
   estavam fixos no CSS original (brancos/cinzas de superfície).
   ===================================================================== */
html[data-tema="dark"]{
  --cinza-bg:#0f1216; --cinza-card:#171c23; --cinza-borda:#262d37; --cinza-borda-2:#39424e;
  --texto:#e6eaf0; --texto-mid:#9aa4b1; --texto-fraco:#6e7784;
  --ok:#4ade80;  --ok-bg:rgba(34,197,94,.14);
  --info:#60a5fa; --info-bg:rgba(59,130,246,.15);
  --warn:#fbbf24; --warn-bg:rgba(245,158,11,.15);
  --err:#f87171;  --err-bg:rgba(239,68,68,.15);
  --roxo:#b8a1f8;
  --s1:0 1px 2px rgba(0,0,0,.45);
  --s2:0 6px 20px rgba(0,0,0,.55);
}
html[data-tema="dark"] body{background:var(--cinza-bg);color:var(--texto)}
html[data-tema="dark"] a{color:var(--info)}

/* botões */
html[data-tema="dark"] .btn-primary{background:var(--adb-amarelo);color:#111418}
html[data-tema="dark"] .btn-primary:hover{background:var(--adb-amarelo-2)}
html[data-tema="dark"] .btn-ghost{background:transparent;color:var(--texto-mid);border-color:var(--cinza-borda-2)}
html[data-tema="dark"] .btn-ghost:hover{color:var(--texto);border-color:var(--texto-mid)}
html[data-tema="dark"] .btn-danger{background:transparent}

/* sidebar e navegação */
html[data-tema="dark"] .sidenav{background:#12161c;border-right-color:var(--cinza-borda)}
html[data-tema="dark"] .nav-item:hover{background:#1a2027;color:var(--texto)}
html[data-tema="dark"] .nav-item.sel{background:#1c232b;color:var(--texto)}

/* textos fortes que usavam --tinta (tinta segue escura p/ topbar) */
html[data-tema="dark"] .view-head h1,
html[data-tema="dark"] .card-num,
html[data-tema="dark"] .coluna-head h3,
html[data-tema="dark"] .g-nome,
html[data-tema="dark"] .proj-titulo,
html[data-tema="dark"] .solic-titulo,
html[data-tema="dark"] .modal-head h2,
html[data-tema="dark"] .chart-card h3,
html[data-tema="dark"] .login-title{color:var(--texto)}
html[data-tema="dark"] #view-minhas h2{color:var(--texto) !important}

/* superfícies (eram #fff / cinzas claros fixos) */
html[data-tema="dark"] .card,
html[data-tema="dark"] .chart-card,
html[data-tema="dark"] .grade-wrap,
html[data-tema="dark"] .proj-card,
html[data-tema="dark"] .solic-row,
html[data-tema="dark"] .ferr-chip,
html[data-tema="dark"] .form-card,
html[data-tema="dark"] .modal-box,
html[data-tema="dark"] .vazio,
html[data-tema="dark"] .login-box{background:var(--cinza-card)}
html[data-tema="dark"] .coluna{background:#12161c;border-color:var(--cinza-borda)}
html[data-tema="dark"] .coluna-count{background:var(--cinza-card);color:var(--texto-mid)}
html[data-tema="dark"] .view-toggle,
html[data-tema="dark"] .agrupar-por,
html[data-tema="dark"] .cfg-seg,
html[data-tema="dark"] .cfg-acessos select{background:var(--cinza-card);border-color:var(--cinza-borda-2)}
html[data-tema="dark"] .agrupar-lbl{color:var(--texto-mid)}
html[data-tema="dark"] .cfg-acessos select{color:var(--texto)}
/* títulos do painel de Configurações usam "tinta" (quase-preta); no dark viram texto claro */
html[data-tema="dark"] .cfg-h,
html[data-tema="dark"] .cfg-about{color:var(--texto)}
html[data-tema="dark"] .cfg-seg button.ativo{background:var(--adb-amarelo);color:#111418}
html[data-tema="dark"] .fb-banner{background:rgba(255,208,0,.10)}
html[data-tema="dark"] .fb-item{background:var(--cinza-card);border-color:var(--cinza-borda)}
html[data-tema="dark"] .fb-media strong{color:var(--texto)}
html[data-tema="dark"] .sug-item{background:var(--cinza-card);border-color:var(--cinza-borda)}
html[data-tema="dark"] .sug-item-tit{color:var(--texto)}
html[data-tema="dark"] .sug-status{background:var(--cinza-card);border-color:var(--cinza-borda-2);color:var(--texto)}
html[data-tema="dark"] .toggle-btn.ativo{background:var(--adb-amarelo);color:#111418}
html[data-tema="dark"] table.grade thead th{background:#12161c;border-bottom-color:var(--cinza-borda)}
html[data-tema="dark"] table.grade tbody td{border-bottom-color:var(--cinza-borda)}
html[data-tema="dark"] table.grade tbody tr:hover{background:#1c232b}
html[data-tema="dark"] .tool-chip,
html[data-tema="dark"] .cat-pill,
html[data-tema="dark"] .hint code{background:#232a34;color:var(--texto-mid)}
html[data-tema="dark"] .badge.solicitado,
html[data-tema="dark"] .badge.pausado,
html[data-tema="dark"] .badge-prio.baixa{background:#232a34;color:var(--texto-mid)}
html[data-tema="dark"] .badge.aprovado{background:rgba(124,58,237,.2);color:var(--roxo)}

/* campos de formulário */
html[data-tema="dark"] .f-input,
html[data-tema="dark"] .login-form input,
html[data-tema="dark"] .form-card input,
html[data-tema="dark"] .form-card textarea,
html[data-tema="dark"] .form-card select,
html[data-tema="dark"] .modal-body input,
html[data-tema="dark"] .modal-body textarea,
html[data-tema="dark"] .modal-body select,
html[data-tema="dark"] .resp-input{background:#12161c;color:var(--texto);border-color:var(--cinza-borda-2)}
html[data-tema="dark"] .f-input:focus,
html[data-tema="dark"] .login-form input:focus,
html[data-tema="dark"] .form-card input:focus,
html[data-tema="dark"] .form-card textarea:focus,
html[data-tema="dark"] .form-card select:focus,
html[data-tema="dark"] .modal-body input:focus,
html[data-tema="dark"] .modal-body textarea:focus,
html[data-tema="dark"] .modal-body select:focus,
html[data-tema="dark"] .resp-input:focus{border-color:var(--adb-amarelo)}
html[data-tema="dark"] select option{background:var(--cinza-card);color:var(--texto)}

/* triagem da IA, modal, menu config */
html[data-tema="dark"] .ia-box{background:#141b24;border-color:#243244;border-left-color:var(--adb-amarelo)}
html[data-tema="dark"] .ia-head,html[data-tema="dark"] .ia-rot{color:#9cc3e8}
html[data-tema="dark"] .check-grid label{color:var(--texto)}
html[data-tema="dark"] .modal{background:rgba(0,0,0,.68)}
html[data-tema="dark"] .config-op:hover{background:#1c232b}
html[data-tema="dark"] .det-row{border-top-color:var(--cinza-borda)}
html[data-tema="dark"] table.grade tbody td{border-bottom-color:#1d232c}

/* =====================================================================
   RESPONSIVO
   ===================================================================== */
@media (max-width:820px){
  .shell{flex-direction:column}
  .sidenav{width:100%;display:flex;flex-wrap:wrap;padding:6px;border-right:none;
    border-bottom:1px solid var(--cinza-borda)}
  .nav-item{border-left:none;border-bottom:3px solid transparent;padding:8px 12px}
  .nav-item.sel{border-left:none;border-bottom-color:var(--adb-amarelo)}
  .nav-sep{display:none}
  .content{padding:16px}
  .form-row{grid-template-columns:1fr}
  .top-titles .top-sub{display:none}
}