/* v78 — estabilidade visual, dark mode e glass hover discreto */

/* Sidebar: ocupa a viewport inteira e permite acessar todos os itens. */
.layout{height:100dvh;min-height:0}
.sidebar{height:100dvh;min-height:0;overflow:hidden}
.sidebar>.logo,.sidebar>.sidebar-footer{flex:0 0 auto}
.sidebar>.nav{
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--accent) 28%,var(--border)) transparent;
  overscroll-behavior:contain;
}
.sidebar>.nav::-webkit-scrollbar{width:5px}
.sidebar>.nav::-webkit-scrollbar-track{background:transparent}
.sidebar>.nav::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--accent) 24%,var(--border));
  border-radius:999px;
}
.sidebar>.nav::-webkit-scrollbar-thumb:hover{
  background:color-mix(in srgb,var(--accent) 38%,var(--border));
}

/* Hover glass discreto nos itens de navegação. */
.nav-item{
  position:relative;
  border:1px solid transparent;
  transform:translateZ(0);
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.nav-item:hover{
  background:color-mix(in srgb,var(--accent) 7%,var(--surface));
  border-color:color-mix(in srgb,var(--accent) 16%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 6px 16px rgba(20,60,130,.055);
  backdrop-filter:blur(7px) saturate(112%);
  -webkit-backdrop-filter:blur(7px) saturate(112%);
  transform:translateX(1px);
}
.nav-item.active{
  border-color:color-mix(in srgb,var(--accent) 18%,transparent);
}
body.dark .nav-item:hover{
  background:color-mix(in srgb,var(--accent) 9%,rgba(13,18,30,.72));
  border-color:color-mix(in srgb,var(--accent) 20%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 7px 18px rgba(0,0,0,.12);
}

/* Dark mode: força controles nativos e superfícies auxiliares a respeitarem a paleta. */
body.dark{color-scheme:dark}
body.dark option,
body.dark optgroup{background:#10141C;color:var(--text)}
body.dark th{background:var(--surface-2,#1B202B);color:var(--text-3)}
body.dark .table-wrap,
body.dark .aluno-actions-menu,
body.dark .registro-modal,
body.dark .registro-modal-card,
body.dark .aluno-modal-card,
body.dark .modal-card{
  background:linear-gradient(145deg,rgba(20,24,32,.94),rgba(15,22,38,.91));
  border-color:color-mix(in srgb,var(--accent) 18%,var(--border));
}
body.dark .registro-modal-head,
body.dark .modal-head,
body.dark .aluno-modal-head{
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 8%,var(--surface)),var(--surface));
  border-color:var(--border);
}
body.dark .aluno-actions-menu button:hover{
  background:color-mix(in srgb,var(--accent) 10%,var(--surface));
}
body.dark .cad-filter-tabs,
body.dark .period-tabs,
body.dark .user-chip{
  background:color-mix(in srgb,var(--surface) 92%,transparent);
}

/* Mantém o rodapé visível e evita que textos longos quebrem a barra. */
.sidebar-footer{position:relative;z-index:2;background:inherit}
.user-chip{min-width:0}
.user-chip>div:not(.user-avatar){min-width:0}
.user-name,.user-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Telas estreitas: a barra vira compacta, mas continua rolável e funcional. */
@media(max-width:820px){
  .sidebar>.nav{padding-bottom:12px}
  .sidebar-footer{flex:0 0 auto}
}
