/* =============================================================
   EAF Sidebar Shared (v1.10) — classes com prefixo .eaf-sb-*
   pra evitar conflito com CSS interno das páginas.
   Aplicar em qualquer página autenticada (exceto login/trocar_senha).
   ============================================================= */
:root{
  --eaf-sb-azul:     #213764;
  --eaf-sb-azul-dk:  #16264a;
  --eaf-sb-azul-lt:  #2d4a87;
  --eaf-sb-verde:    #9dd354;
  --eaf-sb-verde-dk: #7bb83a;
  --eaf-sb-bg:       #f4f6fa;
  --eaf-sb-text:     #1a2540;
  --eaf-sb-muted:    #8b95ab;
  --eaf-sb-border:   #e5eaf2;
  --eaf-sb-w:        240px;
  --eaf-sb-w-c:      68px;
}

/* ────────── Layout: sidebar FIXED + body com padding-left ────────── */
html, body{ height: auto; min-height: 100%; }
body.eaf-has-sb{
  display: block !important;
  margin: 0 !important;
  padding: 0 0 0 var(--eaf-sb-w) !important;   /* ← reserva 240px na esquerda */
  min-height: 100vh;
  transition: padding-left .25s ease;
  position: relative;
}
body.eaf-has-sb.eaf-sb-collapsed{ padding-left: var(--eaf-sb-w-c) !important; }

/* Páginas SEM topbar (index) — centraliza todo o conteúdo */
body.eaf-has-sb.eaf-no-tb{
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}
body.eaf-has-sb.eaf-no-tb > .wrap{ margin: auto; }

/* OCULTA todas as estruturas de navegação originais — tudo na sidebar */
body.eaf-has-sb > header,
body.eaf-has-sb > .top-bar,
body.eaf-has-sb > .breadcrumbs{ display: none !important; }
/* Em páginas que mantêm topbar interna (dashboard, entrega_*), oculta o
   hamburger nativo — a sidebar shared tem seu próprio (floating) */
body.eaf-has-sb .topbar .tb-burger,
body.eaf-has-sb #sbToggle,
body.eaf-has-sb #sbBackdrop{ display: none !important; }

/* ────────── Páginas com SIDEBAR NATIVA (.app > .sidebar > .main) ──────────
   dashboard_infovia05, entrega_mcom_etapa01, entrega_opneutro_etapa01:
   essas páginas têm HTML legado com <div class="app"> + <aside class="sidebar">.
   Em vez de mexer no HTML (que quebra JS interno), neutralizamos via CSS:
   - .app vira display block (desfaz o grid 240+1fr)
   - .sidebar nativa fica oculta
   - .main perde restrições de coluna do grid */
body.eaf-has-sb .app{
  display: block !important;
  grid-template-columns: none !important;
  min-height: auto !important;
  width: 100% !important;          /* ocupa todo espaço disponivel (body padding-left) */
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.eaf-has-sb .app > .sidebar{ display: none !important; }
body.eaf-has-sb .app > .main{
  padding-left: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
}

/* ────────── Sidebar FIXED (não rola com o conteúdo) ────────── */
.eaf-sb{
  background: linear-gradient(180deg, var(--eaf-sb-azul-dk) 0%, var(--eaf-sb-azul) 100%);
  color: #fff; padding: 0;     /* ← removido padding-top 24px pra brand começar em 0 */
  position: fixed; top: 0; left: 0;
  width: var(--eaf-sb-w); height: 100vh;
  display: flex; flex-direction: column;
  transition: width .25s ease;
  z-index: 100;
  font-family: 'Barlow', system-ui, -apple-system, sans-serif;
  overflow: visible;
  box-sizing: border-box;
}
.eaf-sb.eaf-collapsed{ width: var(--eaf-sb-w-c); }
.eaf-sb *{ box-sizing: border-box; }

/* Botão minimizar — verde EAF, fica POR FORA da sidebar à direita */
.eaf-sb-collapse{
  position: absolute; top: 18px; right: -16px;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--eaf-sb-verde); color: var(--eaf-sb-azul-dk);
  border: 3px solid #fff;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; padding: 0;
  box-shadow: 0 4px 14px rgba(33,55,100,.35), 0 0 0 1px rgba(33,55,100,.15);
  transition: transform .2s ease, background .2s ease;
  z-index: 101;             /* ← acima da propria sidebar */
  font-family: inherit;
}
.eaf-sb-collapse:hover{ transform: scale(1.12); background: #b6e389; }
.eaf-sb-collapse:active{ transform: scale(.96); }
.eaf-sb-collapse svg{ width: 16px; height: 16px; transition: transform .25s ease; stroke-width: 3; }
.eaf-sb.eaf-collapsed .eaf-sb-collapse svg{ transform: rotate(180deg); }

/* Brand — altura FIXA pra coincidir com a topbar (74px) */
.eaf-sb-brand{
  height: 74px;        /* MESMA altura da topbar */
  padding: 0 22px;
  display: flex; align-items: center; gap: 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  flex-shrink: 0;
  box-sizing: border-box;
}
.eaf-sb-logo{ width: 44px; height: auto; flex-shrink: 0; object-fit: contain; border-radius: 4px; }
.eaf-sb-brand-text h1{ font-size: 16px; font-weight: 800; letter-spacing: .5px; line-height: 1.1; color: #fff; margin: 0; }
.eaf-sb-brand-text p{ font-size: 10px; color: var(--eaf-sb-verde); font-weight: 600; text-transform: uppercase; letter-spacing: .8px; margin: 3px 0 0; }

/* Estado colapsado desktop */
.eaf-sb.eaf-collapsed{ padding: 18px 0; }
.eaf-sb.eaf-collapsed .eaf-sb-brand{ padding: 0 0 18px; justify-content: center; }
.eaf-sb.eaf-collapsed .eaf-sb-brand-text{ display: none; }
.eaf-sb.eaf-collapsed .eaf-sb-logo{ width: 36px; }

/* Nav — scroll interno (não no .eaf-sb pra não cortar o sb-collapse) */
.eaf-sb-nav{
  padding: 14px 10px 0;
  flex: 1 1 auto;
  min-height: 0;        /* essencial pra flex item ter scroll */
  overflow-y: auto;
  overflow-x: hidden;
}
.eaf-sb-nav::-webkit-scrollbar{ width: 4px; }
.eaf-sb-nav::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.08); border-radius: 999px; }
.eaf-sb-group{ margin-bottom: 4px; }
.eaf-sb-grouph{
  display: flex; align-items: center; gap: 11px;
  width: 100%; padding: 10px 14px;
  background: transparent; border: 0; outline: 0;
  color: rgba(255,255,255,.85);
  font-size: 11.5px; font-weight: 700;
  letter-spacing: .6px; text-transform: uppercase;
  border-radius: 8px; cursor: pointer;
  transition: background .15s, color .15s;
  font-family: inherit; text-align: left;
}
.eaf-sb-grouph:hover{ background: rgba(255,255,255,.06); color: #fff; }
.eaf-sb-grouph .eaf-ico{ width: 17px; height: 17px; opacity: .9; flex-shrink: 0; }
.eaf-sb-chev{
  width: 14px; height: 14px; margin-left: auto;
  opacity: .65; transition: transform .2s ease; flex-shrink: 0;
}
.eaf-sb-grouph[aria-expanded="false"] .eaf-sb-chev{ transform: rotate(-90deg); }

.eaf-sb-sublist{
  list-style: none;
  margin: 4px 0 8px 26px;
  padding: 0 0 0 8px;
  border-left: 1px solid rgba(255,255,255,.10);
  max-height: 600px; overflow: hidden;
  transition: max-height .25s ease, margin .25s ease, opacity .2s ease;
  opacity: 1;
}
.eaf-sb-grouph[aria-expanded="false"] + .eaf-sb-sublist{
  max-height: 0; margin-top: 0; margin-bottom: 0; opacity: 0;
}

.eaf-sb-nav .eaf-sb-sublist > li{ list-style: none; }
.eaf-sb-nav .eaf-sb-sublist > li > a{
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px;
  color: rgba(255,255,255,.78); text-decoration: none;
  border-radius: 6px;
  font-size: 12.5px; font-weight: 500;
  margin-bottom: 1px;
  transition: .15s;
}
.eaf-sb-nav .eaf-sb-sublist > li > a:hover{ background: rgba(255,255,255,.06); color: #fff; }
.eaf-sb-nav .eaf-sb-sublist > li > a.eaf-active{
  background: var(--eaf-sb-verde); color: var(--eaf-sb-azul-dk); font-weight: 700;
}
.eaf-sb-nav .eaf-sb-sublist > li > a.eaf-active .eaf-sb-dot{ background: var(--eaf-sb-azul-dk); }
.eaf-sb-dot{
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(255,255,255,.35); flex-shrink: 0; display: inline-block;
}

/* Colapsada: esconder textos e sublistas */
.eaf-sb.eaf-collapsed .eaf-sb-nav .eaf-sb-chev,
.eaf-sb.eaf-collapsed .eaf-sb-nav .eaf-sb-sublist{ display: none !important; }
.eaf-sb.eaf-collapsed .eaf-sb-grouph{
  justify-content: center; padding: 12px 8px; margin-bottom: 6px; font-size: 0;
}
.eaf-sb.eaf-collapsed .eaf-sb-grouph .eaf-sb-lbl{ display: none; }
.eaf-sb.eaf-collapsed .eaf-sb-grouph .eaf-ico{ width: 20px; height: 20px; opacity: 1; }

/* Foot — usuário + sair */
.eaf-sb-foot{
  margin-top: auto; padding: 16px 18px;
  border-top: 1px solid rgba(255,255,255,.08);
  display: flex; align-items: center; gap: 10px; min-height: 64px;
}
.eaf-sb-av{
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--eaf-sb-verde); color: var(--eaf-sb-azul-dk);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 12px; flex-shrink: 0;
  font-family: inherit;
}
.eaf-sb-info{ flex: 1; overflow: hidden; min-width: 0; }
.eaf-sb-info .eaf-nm{
  font-weight: 700; color: #fff; font-size: 12px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eaf-sb-info .eaf-rl{
  font-size: 9px; font-weight: 700;
  color: rgba(255,255,255,.50); text-transform: uppercase; letter-spacing: .6px;
  margin-top: 1px;
}
.eaf-sb-out{
  background: transparent; border: 1px solid rgba(255,255,255,.18); color: rgba(255,255,255,.78);
  width: 30px; height: 30px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-family: inherit; font-size: 14px;
  transition: background .15s, color .15s;
}
.eaf-sb-out:hover{ background: rgba(255,255,255,.10); color: #fff; }

/* Versão — embaixo do usuário */
.eaf-sb-ver{
  padding: 8px 18px 14px;
  text-align: center;
  font-size: 10px; font-weight: 700;
  color: rgba(255,255,255,.35);
  letter-spacing: 1px;
  font-variant-numeric: tabular-nums;
  font-family: inherit;
}
.eaf-sb.eaf-collapsed .eaf-sb-foot,
.eaf-sb.eaf-collapsed .eaf-sb-ver{ display: none; }

/* ────────── Topbar — REGRAS UNIFICADAS pra qualquer topbar ──────────
   Vale tanto pra topbar shared (.eaf-tb) — injetada pelo sidebar.js —
   quanto pra topbar nativa (.topbar) — do dashboard/entregas.
   Forçamos altura, largura, padding e posição idênticos. */
body.eaf-has-sb .eaf-tb,
body.eaf-has-sb .topbar{
  background: #fff !important;
  width: 100% !important;
  max-width: none !important;
  height: 74px !important;       /* altura fixa = mesma em todas */
  min-height: 74px !important;
  padding: 14px 32px !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--eaf-sb-border) !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  position: sticky !important; top: 0 !important; z-index: 40 !important;
  font-family: 'Barlow', system-ui, -apple-system, sans-serif !important;
  box-sizing: border-box !important;
}
/* Tamanhos uniformes do conteúdo da topbar shared */
.eaf-tb-left h2,
body.eaf-has-sb .topbar .tb-left h2{
  font-size: 21px !important; font-weight: 700 !important;
  margin: 0 !important; line-height: 1.2 !important;
}
.eaf-tb-left p,
body.eaf-has-sb .topbar .tb-left p{
  font-size: 12px !important;
  margin: 2px 0 0 !important;
}

/* ────────── Padronização de conteúdo das páginas ──────────
   Largura máxima e centralização consistentes para <main>, .content
   e footer.page-footer. O .wrap do index preserva seu próprio layout. */
body.eaf-has-sb > main,
body.eaf-has-sb > .content,
body.eaf-has-sb > footer.page-footer{
  max-width: 1400px !important;
  width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box;
}

/* Padding-top entre topbar e início do conteúdo (só onde topbar shared existe) */
body.eaf-has-sb:not(.eaf-no-tb) > main{ padding-top: 24px !important; }
body.eaf-has-sb:not(.eaf-no-tb) > .content{ padding-top: 24px !important; }

/* Páginas sem topbar shared (index, dashboard, entregas) — zera margem do topo */
body.eaf-has-sb.eaf-no-tb > main,
body.eaf-has-sb.eaf-no-tb > .content{ padding-top: 0; margin-top: 0; }

/* Topbar INTERNA (dashboard/entregas) — ocupa TODA largura da área de
   conteúdo, do fim da sidebar até a borda direita. Como ela agora é
   filha direta do body, e o body tem padding-left:240px, ela vai
   automaticamente do 240 até o fim do viewport. */
body.eaf-has-sb > .topbar{
  background: #fff;
  width: 100% !important; max-width: none !important;
  margin: 0 !important;
  position: sticky; top: 0; z-index: 40;
  box-sizing: border-box;
}
.eaf-tb-burger{
  display: none;
  background: transparent; border: 1px solid var(--eaf-sb-border);
  width: 38px; height: 38px; border-radius: 9px;
  align-items: center; justify-content: center;
  cursor: pointer; font-family: inherit;
  flex-direction: column; gap: 3px; padding: 0;
}
.eaf-tb-burger span{
  display: block; width: 18px; height: 2px; background: var(--eaf-sb-text); border-radius: 1px;
}
.eaf-tb-left{ flex: 1; min-width: 0; }
.eaf-tb-left h2{
  font-size: 18px; font-weight: 700; color: var(--eaf-sb-text);
  letter-spacing: -.3px; line-height: 1.1; margin: 0;
}
.eaf-tb-left p{
  font-size: 11.5px; color: var(--eaf-sb-muted); margin: 2px 0 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eaf-tb-right{ display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.eaf-tb-env{
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  color: #92400e; font-size: 10.5px; font-weight: 800;
  padding: 5px 10px; border-radius: 999px;
  letter-spacing: .5px; text-transform: uppercase;
}
.eaf-tb-env::before{
  content: ''; width: 6px; height: 6px; border-radius: 50%; background: #d97706;
}


/* ────────── Userbox na topbar (nome + role + sair) ────────── */
.eaf-userbox{
  display: flex; align-items: center; gap: 10px;
  padding: 0 0 0 14px;
  margin-left: 4px;
  border-left: 1px solid var(--eaf-sb-border);
  font-family: 'Barlow', system-ui, -apple-system, sans-serif;
}
.eaf-userbox-info{
  display: flex; flex-direction: column; align-items: flex-end;
  line-height: 1.15; gap: 2px;
}
.eaf-userbox-name{
  font-size: 13px; font-weight: 700; color: var(--eaf-sb-text);
  max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eaf-userbox-role{
  font-size: 9px; font-weight: 800; letter-spacing: .8px;
  padding: 2px 7px; border-radius: 999px;
  text-transform: uppercase; line-height: 1;
}
.eaf-userbox-role.eaf-role-admin{ background: rgba(46,125,50,.12); color: #2e7d32; }
.eaf-userbox-role.eaf-role-editor{ background: rgba(123,184,58,.15); color: #4a8c00; }
.eaf-userbox-role.eaf-role-comum{ background: rgba(139,149,171,.18); color: var(--eaf-sb-muted); }
.eaf-userbox-out{
  background: transparent; border: 1px solid var(--eaf-sb-border);
  color: var(--eaf-sb-muted);
  width: 32px; height: 32px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-family: inherit; font-size: 14px;
  transition: background .15s, color .15s, border-color .15s;
}
.eaf-userbox-out:hover{
  background: rgba(217,83,79,.10);
  border-color: rgba(217,83,79,.30);
  color: #d9534f;
}

/* Mobile <600px: esconde nome (mantém só role + sair) */
@media (max-width: 600px){
  .eaf-userbox{ padding-left: 8px; gap: 6px; }
  .eaf-userbox-name{ display: none; }
}

/* ────────── Mobile (≤900px) — sidebar vira drawer ────────── */
.eaf-sb-overlay{
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,.45); z-index: 54;
  opacity: 0; pointer-events: none; transition: opacity .2s ease;
}

@media (max-width: 900px){
  /* Mobile: body sem padding pra sidebar (ela vira drawer) */
  body.eaf-has-sb,
  body.eaf-has-sb.eaf-sb-collapsed{
    padding-left: 0 !important;
  }
  body.eaf-has-sb > .eaf-sb{
    transform: translateX(-100%);
    box-shadow: 4px 0 20px rgba(0,0,0,.30);
    transition: transform .25s ease, width .25s ease;
  }
  body.eaf-has-sb > .eaf-sb.eaf-open{ transform: translateX(0); }
  .eaf-sb .eaf-sb-collapse{ display: none !important; }
  /* Forçar expandida no drawer mobile */
  .eaf-sb.eaf-collapsed{ padding: 24px 0 !important; }
  .eaf-sb.eaf-collapsed .eaf-sb-brand{ padding: 0 22px 26px !important; justify-content: flex-start !important; }
  .eaf-sb.eaf-collapsed .eaf-sb-brand-text{ display: block !important; }
  .eaf-sb.eaf-collapsed .eaf-sb-logo{ width: 44px !important; }
  .eaf-sb.eaf-collapsed .eaf-sb-nav .eaf-sb-chev,
  .eaf-sb.eaf-collapsed .eaf-sb-nav .eaf-sb-sublist{ display: block !important; }
  .eaf-sb.eaf-collapsed .eaf-sb-grouph{ justify-content: flex-start !important; padding: 10px 14px !important; font-size: 11.5px !important; }
  .eaf-sb.eaf-collapsed .eaf-sb-grouph .eaf-sb-lbl{ display: inline !important; }
  .eaf-sb.eaf-collapsed .eaf-sb-foot{ display: flex !important; }

  /* Overlay drawer */
  .eaf-sb-overlay{ display: block; }
  .eaf-sb-overlay.eaf-open{ opacity: 1; pointer-events: auto; }

  /* Hamburger na topbar */
  .eaf-tb-burger{ display: flex; }
  body.eaf-has-sb > .eaf-tb{ padding: 12px 16px; gap: 10px; }
  .eaf-tb-left h2{ font-size: 15px; }
  .eaf-tb-left p{ font-size: 10.5px; }
}

@media (max-width: 600px){
  body.eaf-has-sb > .eaf-tb{ padding: 10px 12px; }
  .eaf-tb-env{ display: none; }
}

/* ────────── Botões Export PDF/PNG (shared) ────────── */
.eaf-exp-btn{
  display: inline-flex; align-items: center; gap: 4px;
  background: var(--eaf-sb-azul-dk); color: #fff;
  padding: 7px 13px; border-radius: 999px;
  border: none; cursor: pointer; font-family: inherit;
  font-size: 12px; font-weight: 600;
  transition: background .15s, transform .15s;
}
.eaf-exp-btn:hover:not(:disabled){ background: #0f2a4d; transform: translateY(-1px); }
.eaf-exp-btn:disabled{ opacity: .6; cursor: wait; }
.eaf-exp-btn.eaf-exp-png{ background: var(--eaf-sb-verde-dk); }
.eaf-exp-btn.eaf-exp-png:hover:not(:disabled){ background: #4a8c00; }
/* Dentro da topbar nativa, ajusta estilo pra coerência */
.topbar .eaf-exp-btn{ font-size: 12px; }

/* ───── Perfis v1.17.58 (Time PAIS / Acesso Externo) ───── */
.eaf-userbox-role.eaf-role-pais{ background: rgba(33,55,100,.10); color:#213764; }
.eaf-userbox-role.eaf-role-externo{ background: rgba(217,119,6,.14); color:#b45309; }
.badge-role.pais{ background: rgba(33,55,100,.10); color:#213764; }
.badge-role.externo{ background: rgba(217,119,6,.12); color:#b45309; }
.role.pais{ background: rgba(255,255,255,.12); color:#dbe4f5; }
.role.externo{ background: rgba(240,173,78,.22); color:#ffd591; }

/* ───── Subitem (ex.: Lançamento de Cabo sob Infovia 05) ───── */
.eaf-sb-nav .eaf-sb-sublist > li > a.eaf-subitem{ margin-left: 18px; font-size: 12px; }
.eaf-sb-nav .eaf-sb-sublist > li > a.eaf-subitem .eaf-sb-dot{ position: relative; }
.eaf-sb-nav .eaf-sb-sublist > li > a.eaf-subitem .eaf-sb-dot::before{
  content:''; position:absolute; left:-10px; top:-8px; width:9px; height:13px;
  border-left:1.5px solid rgba(255,255,255,.20); border-bottom:1.5px solid rgba(255,255,255,.20);
  border-bottom-left-radius:5px;
}

/* ───── Etiqueta "em desenvolvimento" em item do menu ───── */
.eaf-sb-dev{
  display:block; width:fit-content; margin-top:3px;
  background:rgba(240,173,78,.18); color:#ffce8a;
  font-size:8px; font-weight:800; letter-spacing:.4px; text-transform:uppercase;
  padding:1px 6px; border-radius:999px; line-height:1.7; white-space:nowrap;
}
.eaf-sb-nav .eaf-sb-sublist > li > a:has(.eaf-sb-dev){ align-items:flex-start; }

/* ───── Mobile: topbar (nativa e shared) cresce com o conteúdo e não fica sob o hambúrguer ───── */
@media (max-width: 900px){
  body.eaf-has-sb .topbar,
  body.eaf-has-sb .eaf-tb{
    height: auto !important; min-height: 60px !important;
    flex-wrap: wrap !important; row-gap: 6px;
  }
  body.eaf-has-sb .topbar{ padding: 12px 14px 12px 60px !important; }
  body.eaf-has-sb .topbar .tb-left{ flex: 1 1 100% !important; min-width: 0; }
  body.eaf-has-sb .topbar .tb-left h2{ font-size: 15px !important; line-height: 1.2 !important; }
  body.eaf-has-sb .topbar .tb-left p{ font-size: 11px !important; white-space: normal !important; }
  body.eaf-has-sb .topbar .tb-right{ flex: 1 1 100% !important; flex-wrap: wrap; row-gap: 6px; }
}
@media (max-width: 560px){
  body.eaf-has-sb .topbar .tb-left p{ display: none !important; }
}


/* ═══════════ Árvore de navegação aninhada (v1.17.58) ═══════════ */
.eaf-sb-tree{ list-style: none; margin: 0; padding: 0; }
.eaf-sb-tree > li{ list-style: none; }
.eaf-sb-tree-root{
  margin: 4px 0 8px 26px; padding: 0 0 0 8px;
  border-left: 1px solid rgba(255,255,255,.10);
  overflow: hidden; max-height: 1800px; opacity: 1;
  transition: max-height .28s ease, opacity .2s ease, margin .25s ease;
}
.eaf-sb-grouph[aria-expanded="false"] + .eaf-sb-tree-root{
  max-height: 0; opacity: 0; margin-top: 0; margin-bottom: 0;
}
.eaf-sb-tree .eaf-sb-tree{
  margin: 1px 0 3px 7px; padding-left: 9px;
  border-left: 1px solid rgba(255,255,255,.09);
}
.eaf-sb-row{
  display: flex; align-items: center; gap: 9px;
  width: 100%; padding: 7px 11px; margin-bottom: 1px;
  border: 0; background: transparent; font-family: inherit; text-align: left;
  color: rgba(255,255,255,.78); text-decoration: none;
  border-radius: 6px; font-size: 12.5px; font-weight: 500;
  transition: background .15s, color .15s;
}
a.eaf-sb-row:hover{ background: rgba(255,255,255,.06); color: #fff; }
.eaf-sb-row.eaf-active{ background: var(--eaf-sb-verde); color: var(--eaf-sb-azul-dk); font-weight: 700; }
.eaf-sb-row.eaf-active .eaf-sb-dot{ background: var(--eaf-sb-azul-dk); }
.eaf-sb-row:has(.eaf-sb-dev){ align-items: flex-start; }
/* nó de seção (não clicável): Etapa 01, Etapa 02, Entrega, Fase 01 */
.eaf-sb-row.eaf-sb-node{
  cursor: default; color: rgba(255,255,255,.50);
  font-size: 9.5px; font-weight: 800; letter-spacing: .9px; text-transform: uppercase;
  padding: 9px 11px 3px; gap: 0;
}
.eaf-sb-row.eaf-sb-node:hover{ background: transparent; }
.eaf-sb-row.eaf-sb-node .eaf-sb-dot{ display: none; }
/* colapsada (desktop icon-only): esconde a árvore */
.eaf-sb.eaf-collapsed .eaf-sb-nav .eaf-sb-tree-root{ display: none !important; }
/* mobile: drawer mostra a árvore mesmo com classe collapsed */
@media (max-width: 900px){
  .eaf-sb.eaf-collapsed .eaf-sb-nav .eaf-sb-tree-root{ display: block !important; }
}