/* Menü links mit Gruppen (Unterpunkte) */
.sidebar-nav .nav-group { display: flex; flex-direction: column; gap: 2px; }
.sidebar-nav .nav-group[hidden] { display: none !important; }
.nav-group-head { border: none; background: transparent; color: var(--text-muted); display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 9px 12px; border-radius: 12px; cursor: pointer; font: inherit; font-size: 0.9rem; text-align: left; transition: background var(--transition-fast), color var(--transition-fast); }
.nav-group-head:hover { background: var(--bg-elevated-soft, #2a2a2a); color: var(--text-main, #fff); }
.nav-group-head:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.nav-group-head > i:first-child { width: 18px; }
.nav-group-head > span { flex: 1; }
.nav-group-caret { font-size: 0.7rem; opacity: .7; transition: transform var(--transition-fast); }
.nav-group.is-open .nav-group-caret { transform: rotate(180deg); }
.nav-group.has-active > .nav-group-head { color: var(--text-main, #fff); }
.nav-group-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); flex: 0 0 auto; }
.nav-group.is-open .nav-group-dot, .nav-group-dot[hidden] { display: none; }
.nav-group-items { display: none; flex-direction: column; gap: 2px; margin: 0 0 4px 17px; padding-left: 8px; border-left: 1px solid var(--border-subtle, #3a3a3a); }
.nav-group.is-open .nav-group-items { display: flex; }
.nav-group-items .nav-item { font-size: 0.86rem; padding: 7px 10px; }
@media (prefers-reduced-motion: reduce) { .nav-group-caret { transition: none; } }