/* ---------- esqueleto ---------- */
.app{display:grid;grid-template-columns:var(--sidebar-w) 1fr;min-height:100vh}
.conteudo{min-width:0;padding:var(--sp-6) var(--sp-7) var(--sp-8)}
.faixa{max-width:1240px;margin:0 auto}

/* ---------- navegação lateral ---------- */
.lateral{
  position:sticky;top:0;height:100vh;display:flex;flex-direction:column;
  background:var(--sidebar);color:var(--text-inv);padding:var(--sp-5) var(--sp-4) var(--sp-4);
}
.logo{display:flex;align-items:center;gap:12px;padding:2px 4px var(--sp-5)}
.logo__marca{width:26px;height:auto;flex:none}
.logo__txt{display:flex;flex-direction:column;line-height:1.12}
.logo__txt b{font-size:var(--fs-sm);font-weight:700;letter-spacing:-.01em}
.logo__txt i{font-style:normal;font-size:var(--fs-xs);color:rgba(244,243,239,.5)}

.nav{flex:1;overflow-y:auto}
.nav__link{
  display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:var(--r);
  font-size:var(--fs-sm);font-weight:500;color:rgba(244,243,239,.62);
  transition:background var(--t),color var(--t);
}
.nav__link:hover{background:var(--sidebar-2);color:var(--text-inv)}
.nav__link.on{background:var(--sidebar-2);color:var(--text-inv);font-weight:600}
.nav__link .ic{flex:none;opacity:.9}
.nav ul{display:flex;flex-direction:column;gap:2px}
.nav__sep{
  margin:var(--sp-5) 11px var(--sp-2);font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(244,243,239,.34);
}
.usuario{
  display:flex;align-items:center;gap:11px;padding:10px;border-radius:var(--r);
  border-top:1px solid var(--line-inv);margin-top:var(--sp-3);padding-top:var(--sp-4);
}
.usuario:hover{background:var(--sidebar-2)}
.usuario__av{
  display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:50%;
  background:var(--sidebar-2);color:var(--text-inv);font-size:var(--fs-xs);font-weight:700;
}
.usuario__txt{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.usuario__txt b{font-size:var(--fs-sm);font-weight:600}
.usuario__txt i{font-style:normal;font-size:var(--fs-xs);color:rgba(244,243,239,.5)}

.abre-lateral{display:none;position:fixed;top:14px;left:14px;z-index:60;
  width:42px;height:42px;border-radius:var(--r);background:var(--surface);
  border:1px solid var(--line-2);box-shadow:var(--sh-2);place-items:center}
.veu-lateral{display:none}

/* ---------- topo do conteúdo ---------- */
.topo{
  display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-5);
  margin-bottom:var(--sp-6);flex-wrap:wrap;
}
.topo__txt h1{font-size:var(--fs-2xl);letter-spacing:-.025em}
.topo__txt p{color:var(--text-2);margin-top:5px;max-width:56ch;font-size:var(--fs-md)}
.topo__acoes{display:flex;align-items:center;gap:var(--sp-2)}

.busca-mini{
  display:flex;align-items:center;gap:8px;padding:0 13px;height:38px;
  border-radius:var(--r);border:1px solid var(--line-2);background:var(--surface);
  color:var(--text-3);transition:border-color var(--t),box-shadow var(--t);
}
.busca-mini:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.busca-mini input{border:0;outline:0;background:none;width:180px;font-size:var(--fs-sm);color:var(--text)}

/* ---------- rodapé de página ---------- */
.pe-pag{
  margin-top:var(--sp-8);padding-top:var(--sp-5);border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;
  font-size:var(--fs-xs);color:var(--text-3);
}

/* ---------- responsivo ---------- */
@media (max-width:1080px){
  .conteudo{padding:var(--sp-5) var(--sp-5) var(--sp-7)}
}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  .lateral{
    position:fixed;inset:0 auto 0 0;width:270px;z-index:70;
    transform:translateX(-100%);transition:transform var(--t-med);
  }
  body.lateral-aberta .lateral{transform:none}
  .veu-lateral{display:block;position:fixed;inset:0;z-index:65;background:rgba(20,25,24,.42);
    opacity:0;pointer-events:none;transition:opacity var(--t-med)}
  body.lateral-aberta .veu-lateral{opacity:1;pointer-events:auto}
  .abre-lateral{display:grid}
  .conteudo{padding:70px var(--sp-4) var(--sp-7)}
  .topo{flex-direction:column;align-items:stretch}
  .topo__acoes{justify-content:space-between}
  .busca-mini{flex:1}
  .busca-mini input{width:100%}
}