/* SAGAPES Gestão — só o que é da Gestão (IDENTIDADE_v01 §12 e §13).
   Regra: montado com as peças e os TOKENS do ADE; nenhum hex novo aqui. O que vier do ADE fica em
   ade-base.css (extração com origem) e propulsor-ui.css (cópia intocada). */

/* ── marca SAGAPES (IDENTIDADE_v01 §11) ── */
/* Login: o logo completo. No escuro, a versão branca: o logo tem duas cores e não dá para trocar
   um token só, então o mesmo arquivo vira branco por filtro (equivale ao PNG branco do site). */
.vcv-login h1.gestao-lockup{width:216px;margin:0 0 12px;font-size:0;line-height:0}
.vcv-login h1.gestao-lockup img{display:block;width:100%;height:auto}
html[data-tema="escuro"] .vcv-login h1.gestao-lockup img{filter:brightness(0) invert(1)}
/* Menu lateral: o skyline do logo, na cor de tinta da casa (preto no claro, amarelo no escuro). */
.gestao-marca{width:38px;height:22px;flex:0 0 38px;fill:var(--ae-ink)}
.pui-sidebar-logo{display:flex;align-items:center;gap:10px}

/* ── acessibilidade ── */
.gestao-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ── contagem no menu (Entrada, Alertas) ── */
.gestao-contagem{margin-left:auto;min-width:22px;height:20px;padding:0 7px;border-radius:999px;display:inline-grid;place-items:center;
  font-size:var(--ts-3);font-weight:800;background:var(--pui-surface-muted);color:var(--pui-text)}
.pui-nav-item.is-active .gestao-contagem{background:var(--ae-on-primary);color:var(--ae-ink)}
.pui-app.is-sidebar-collapsed .gestao-contagem{display:none}

/* ── grupos e linhas de tarefa (IDENTIDADE_v01 §13: linha no desktop, cartão de uma linha no celular) ── */
.gestao-grupo{margin:0 0 18px}
.gestao-grupo .pui-section-head{margin-bottom:8px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:10px}
.gestao-grupo .pui-section-head h2{margin:0}
.gestao-lista{list-style:none;margin:0;padding:0;background:var(--pui-surface);border:1px solid var(--pui-border);border-radius:18px;overflow:hidden}
.gestao-linha{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 14px;border-top:1px solid var(--pui-border)}
.gestao-linha:first-child{border-top:0}
.gestao-linha-est{display:inline-flex;align-items:center}
.gestao-linha-corpo{display:flex;flex-direction:column;gap:3px;min-width:0;text-align:left;background:none;border:0;padding:2px 0;font:inherit;color:inherit;cursor:pointer}
.gestao-linha-corpo.is-estatico{cursor:default}
.gestao-linha-corpo:hover .gestao-linha-titulo{text-decoration:underline;text-underline-offset:3px}
.gestao-linha-corpo.is-estatico:hover .gestao-linha-titulo{text-decoration:none}
.gestao-linha-titulo{font-size:var(--ts-9);font-weight:600;color:var(--pui-text);overflow-wrap:anywhere}
.gestao-linha-meta{font-size:var(--ts-6);color:var(--pui-text-soft);overflow-wrap:anywhere}
.gestao-linha-desc{font-size:var(--ts-6);color:var(--pui-text-muted);overflow-wrap:anywhere}
.gestao-linha-sinais{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:2px}
.gestao-linha-sinais .pui-badge{gap:4px}
.gestao-linha-sinais .pui-badge svg{width:13px;height:13px}
.gestao-motivo{font-size:var(--ts-5);color:var(--pui-text-muted)}
.gestao-linha>.pui-button{min-height:32px;padding:0 14px}
.gestao-vazio{background:var(--pui-surface);border:1px dashed var(--pui-border-strong);border-radius:18px;padding:22px;color:var(--pui-text-soft);font-size:var(--ts-8)}

/* ── link dentro de tabela ── */
.gestao-link{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--pui-text);cursor:pointer;text-align:left}
.gestao-link:hover{text-decoration:underline;text-underline-offset:3px}

/* ── folha (modal) ── */
.vcv-overlay-box.pui-card{max-width:520px;padding:20px 22px;max-height:92vh;overflow:auto}
.vcv-overlay-box .pui-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.gestao-folha-titulo{font-family:var(--ae-display);font-size:var(--tn-1);font-weight:800;margin:0;letter-spacing:-.01em}
.gestao-folha-sub{font-size:var(--ts-9);font-weight:600;color:var(--pui-text);margin:0 0 8px;overflow-wrap:anywhere}
.gestao-folha-estado{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:var(--ts-7);color:var(--pui-text-soft);margin:0 0 4px}
.gestao-folha-estado b{color:var(--pui-text)}
.vcv-overlay-box .pui-segmented{margin:6px 0 14px}
.vcv-overlay-box .pui-field{margin-bottom:12px}
.vcv-overlay-box .pui-field>span{display:block;margin-bottom:5px}
.vcv-overlay-box .pui-field input,.vcv-overlay-box .pui-field select,.vcv-overlay-box .pui-field textarea{box-sizing:border-box;background:var(--ae-field);color:var(--pui-text)}
.vcv-overlay-box .pui-field textarea{min-height:76px;resize:vertical}
.gestao-duas{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.gestao-check{display:flex;align-items:center;gap:8px;font-size:var(--ts-7);color:var(--pui-text);margin:4px 0 12px}
.gestao-nota{font-size:var(--ts-6);color:var(--pui-text-soft);background:var(--pui-surface-muted);border-radius:10px;padding:9px 11px;margin:0 0 12px}
.gestao-folha-acoes{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}

/* ── aviso flutuante ── */
.gestao-aviso{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:80;max-width:min(560px,calc(100vw - 32px));box-shadow:0 12px 32px -12px rgba(20,20,28,.35)}
.gestao-aviso[hidden]{display:none}

/* ── login: campos e alertas ── */
.vcv-login .pui-alert{margin:0 0 14px}
.vcv-login .pui-field input{box-sizing:border-box;background:var(--ae-field);color:var(--pui-text)}
.vcv-login .alt a{color:var(--pui-text-soft)}
.vcv-login [hidden]{display:none}
/* `.vcv-login` é display:grid, e display de autor vence o atributo [hidden] (a mesma armadilha do
   #app[hidden] do ADE): sem esta linha o login fica por cima do app depois de entrar. */
.vcv-login[hidden]{display:none}

/* ── processos (Fase 1B) ── */
.pui-page-head .pui-action-row .pui-button{white-space:nowrap}
a.gestao-linha-corpo{text-decoration:none;color:inherit}
.gestao-linha-acoes{display:flex;align-items:center;gap:6px}
.gestao-linha-acoes .pui-button{min-height:32px;padding:0 14px}
.gestao-ico-linha{width:18px;height:18px;color:var(--pui-text-muted)}
.gestao-trilha{font-size:var(--ts-6);color:var(--pui-text-soft);margin:0 0 6px}
.gestao-trilha a{color:var(--pui-text-soft)}
.gestao-grupo .pui-section-head .pui-button{min-height:32px;padding:0 14px}
.gestao-versoes{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.gestao-versao{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 12px;border-radius:999px;border:1px solid var(--pui-border);
  background:var(--pui-surface);color:var(--pui-text);font:inherit;font-size:var(--ts-7);font-weight:700;cursor:pointer}
.gestao-versao.is-active{border-color:var(--ae-ink);box-shadow:inset 0 0 0 1px var(--ae-ink)}
.gestao-editor input,.gestao-editor select{width:100%;box-sizing:border-box;min-height:32px;padding:0 8px;border:1px solid var(--pui-border);border-radius:var(--pui-radius-sm);
  background:var(--ae-field);color:var(--pui-text);font:inherit;font-size:var(--ts-7)}
.gestao-editor input[type=checkbox]{width:18px;min-height:18px;height:18px}
.gestao-editor input:disabled{background:var(--pui-surface-muted)}
.gestao-editor .gestao-num{width:64px}
.gestao-editor td{vertical-align:middle}
.gestao-editor td:nth-child(2){min-width:240px}
.gestao-editor td:nth-child(6){min-width:96px}
.gestao-editor-acoes{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0 18px}
.gestao-espaco{flex:1 1 auto}
.gestao-resumo{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:16px 18px;margin:0 0 14px}
.gestao-resumo>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.gestao-resumo b{font-size:var(--ts-9);color:var(--pui-text)}
.gestao-resumo-rot{font-size:var(--ts-3);font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--pui-text-muted)}
.gestao-aviso-fixo{margin:0 0 14px}
/* Prévia da cascata: os dependentes afetados levam o contorno pontilhado de --ae-foco (ARQUITETURA_v04 §6.2). */
.gestao-previa{margin:0 0 12px}
.gestao-previa:empty{display:none}
.gestao-previa-tit{font-size:var(--ts-3);font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--pui-text-muted);margin:0 0 6px}
.gestao-previa-lista{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column;gap:6px}
.gestao-previa-lista li{font-size:var(--ts-7);color:var(--pui-text);padding:7px 10px;border-radius:10px;background:var(--pui-surface-muted);overflow-wrap:anywhere}
.gestao-previa-lista li.is-afetada{background:transparent;outline:1.5px dashed var(--ae-foco);outline-offset:-1.5px}

/* ── Gantt (Fase 1C, ARQUITETURA_v04 §6.2) — só tokens do ADE ── */
.gantt-filtros{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 12px;margin:0 0 10px}
.gantt-filtros .pui-field{margin:0;min-width:150px;flex:0 1 190px}
.gantt-filtros .pui-field>span{display:block;margin-bottom:5px}
.gantt-filtros select{box-sizing:border-box;background:var(--ae-field);color:var(--pui-text)}
.gantt-zoom{display:flex;flex-direction:column;gap:5px}
.gantt-zoom-rot{font-size:var(--ts-3);font-weight:700;color:var(--pui-text-soft)}
.gantt-legenda{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0 0 10px;font-size:var(--ts-5);color:var(--pui-text-soft)}
.gantt-legenda span{display:inline-flex;align-items:center;gap:6px}
.gantt-leg{display:inline-block;width:18px;height:8px;border-radius:4px}
.gantt-leg.is-ok{background:var(--pui-success)}
.gantt-leg.is-med{background:var(--pui-warning)}
.gantt-leg.is-ruim{background:var(--pui-danger)}
.gantt-leg.is-base{height:4px;background:var(--pui-border-strong)}
.gantt-leg.is-deslize{background:repeating-linear-gradient(45deg,var(--pui-danger-soft) 0 3px,var(--pui-danger) 3px 4.5px)}
.gantt-leg.is-marco{width:10px;height:10px;border-radius:1px;transform:rotate(45deg);background:var(--ae-ink)}
.gantt-leg.is-hoje{width:2px;height:14px;border-radius:0;background:var(--ae-corte)}

.gantt-quadro{--gantt-rotulo:300px;position:relative;overflow:auto;max-height:calc(100vh - 290px);min-height:220px;
  background:var(--pui-surface);border:1px solid var(--pui-border);border-radius:18px}
.gantt-grade{display:grid;grid-template-rows:44px auto;width:max-content}
.gantt-canto{position:sticky;top:0;left:0;z-index:4;display:flex;align-items:center;padding:0 12px;
  background:var(--pui-surface-strong);border-bottom:1px solid var(--pui-border);border-right:1px solid var(--pui-border);
  font-size:var(--ts-3);font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--pui-text-muted)}
.gantt-escala{position:sticky;top:0;z-index:3;display:block;background:var(--pui-surface-strong);border-bottom:1px solid var(--pui-border)}
.gantt-rotulos{position:sticky;left:0;z-index:2;background:var(--pui-surface);border-right:1px solid var(--pui-border)}
.gantt-corpo{display:block;user-select:none;-webkit-user-select:none}
.gantt-rotulo{box-sizing:border-box;display:flex;align-items:center;border-bottom:1px solid var(--pui-border);min-width:0}
.gantt-rotulo.is-grupo{background:var(--pui-surface-muted)}
.gantt-rotulo>button{display:flex;align-items:center;gap:8px;flex:1 1 auto;min-width:0;height:100%;padding:0 10px;
  background:none;border:0;font:inherit;color:var(--pui-text);text-align:left;cursor:pointer}
.gantt-rotulo.is-grupo>button{font-size:var(--ts-6);font-weight:800}
.gantt-rotulo.is-etapa>button{padding-left:34px;font-size:var(--ts-6)}
.gantt-rotulo.is-fora-do-filtro{opacity:.45}
.gantt-rotulo-txt{display:flex;flex-direction:column;min-width:0;overflow:hidden}
.gantt-rotulo-txt,.gantt-rotulo-txt b,.gantt-rotulo-txt small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gantt-rotulo-txt b{font-size:var(--ts-7);font-weight:700}
.gantt-rotulo-txt small{font-size:var(--ts-3);color:var(--pui-text-soft)}
.gantt-rotulo-n{margin-left:auto;font-size:var(--ts-3);color:var(--pui-text-soft)}
.gantt-chevron{width:15px;height:15px;flex:0 0 15px;color:var(--pui-text-muted);transition:transform .15s ease}
.gantt-alternar.is-fechado .gantt-chevron{transform:rotate(-90deg)}
.gantt-ico{width:16px;height:16px;flex:0 0 16px;color:var(--pui-text-soft)}
.gantt-ir{margin-right:8px;flex:0 0 auto}
.gantt-ir svg{width:14px;height:14px}

/* SVG: cores por token, nos dois temas. */
.gantt-mes{font-size:var(--ts-5);font-weight:700;fill:var(--pui-text)}
.gantt-dia{font-size:var(--ts-3);fill:var(--pui-text-soft)}
.gantt-dia.is-folga{fill:var(--pui-text-muted)}
.gantt-dia.is-hoje{fill:var(--ae-corte);font-weight:800}
.gantt-grade-mes{stroke:var(--pui-border-strong);stroke-width:1}
.gantt-grade-semana{stroke:var(--pui-border);stroke-width:1}
.gantt-folga{fill:var(--pui-surface-muted);opacity:.6}
.gantt-faixa-grupo{fill:var(--pui-surface-muted);opacity:.7}
.gantt-sep{stroke:var(--pui-border);stroke-width:1}
.gantt-barra,.gantt-barra-resumo{stroke:none}
.gantt-barra.is-ok,.gantt-barra-resumo.is-ok{fill:var(--pui-success)}
.gantt-barra.is-med,.gantt-barra-resumo.is-med{fill:var(--pui-warning)}
.gantt-barra.is-ruim,.gantt-barra-resumo.is-ruim{fill:var(--pui-danger)}
.gantt-barra.is-feita,.gantt-barra-resumo.is-feita{fill:var(--pui-text-muted);opacity:.5}
.gantt-barra.is-cancelada{fill:none;stroke:var(--pui-text-muted);stroke-dasharray:3 2}
.gantt-barra-resumo{opacity:.85}
.gantt-base{fill:var(--pui-border-strong)}
.gantt-deslize{fill:url(#gantt-hachura)}
.gantt-hachura-fundo{fill:var(--pui-danger-soft)}
.gantt-hachura-traco{stroke:var(--pui-danger);stroke-width:2}
.gantt-marco{fill:var(--ae-ink);stroke:var(--ae-ink);stroke-width:1.5}
.gantt-marco.is-feita{fill:var(--pui-text-muted);stroke:var(--pui-text-muted)}
.gantt-marco.is-vazado{fill:var(--pui-surface);stroke:var(--ae-ink);stroke-width:2}
.gantt-marco-base{fill:none;stroke:var(--pui-border-strong);stroke-width:1.5}
.gantt-hoje{stroke:var(--ae-corte);stroke-width:2}
.gantt-seta{fill:none;stroke:var(--pui-text-muted);stroke-width:1.5}
.gantt-seta-ponta{fill:var(--pui-text-muted)}
.gantt-alvo{fill:transparent}
.gantt-etapa.is-fora-do-filtro{opacity:.35}
.gantt-etapa[data-arrastavel="1"]{cursor:grab;touch-action:none}
.gantt-etapa.is-arrastando{cursor:grabbing;opacity:.85}
/* Dependentes que a reprogramação empurraria: contorno pontilhado em --ae-foco. */
.gantt-etapa.is-afetada .gantt-barra,.gantt-etapa.is-afetada .gantt-marco{stroke:var(--ae-foco);stroke-width:2.5;stroke-dasharray:4 2}
.gantt-dica{position:fixed;z-index:90;pointer-events:none;padding:6px 10px;border-radius:10px;background:var(--ae-ink);color:var(--ae-on-primary);
  font-size:var(--ts-6);font-weight:700;box-shadow:0 8px 20px -8px rgba(20,20,28,.4)}
.gantt-dica[hidden]{display:none}

/* ── celular (régua do ADE: 375px) ── */
@media(max-width:599px){
  #btn-captura .btn-lbl{display:none}
  #btn-captura{padding-left:11px;padding-right:11px}
  .gestao-duas{grid-template-columns:minmax(0,1fr)}
  .gestao-resumo{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:14px}
  .gantt-filtros{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .gantt-filtros .pui-field{min-width:0}
  .gestao-editor-acoes .pui-button{flex:1 1 auto;justify-content:center}
  .gestao-espaco{display:none}
  .gestao-linha{padding:12px;gap:10px}
  .gestao-lista{border-radius:14px}
  .gestao-aviso{bottom:14px}
  .gestao-contagem{position:absolute;top:2px;right:2px;margin:0;min-width:18px;height:16px;padding:0 5px;font-size:var(--ts-1)}
  #app .pui-nav-item{position:relative}
  /* O trilho do celular do ADE crava #fbf9f3 (ade-app.css:1610) e fica creme no tema escuro — o
     defeito existe no ADE também. Aqui volta a seguir o token, que vale nos dois temas. */
  #app .pui-sidebar{background:var(--pui-surface-strong)}
}
