/* Compact, task-oriented navigation. Only the current area stays expanded. */
aside nav { gap: 8px; margin-top: 24px; min-height: 0; overflow-y: auto; padding-right: 3px; scrollbar-width: thin; scrollbar-color: #34445c transparent; }
.nav-group { display: block; }
.nav-group details { border-radius: 10px; }
.nav-group summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 40px; padding: 9px 12px; border-radius: 9px; color: #9cabc0; cursor: pointer; list-style: none; font-size: 11px; font-weight: 850; letter-spacing: .075em; transition: color .18s, background .18s; }
.nav-group summary::-webkit-details-marker { display: none; }
.nav-group summary:hover,.nav-group details[open]>summary { color: #fff; background: #19263a; }
.nav-group summary span { color: #6f8098; font-size: 16px; line-height: 1; transition: transform .18s; }
.nav-group details[open]>summary span { transform: rotate(180deg); }
.nav-group details>div { display: grid; gap: 3px; padding: 4px 0 8px 8px; }
.nav-group a { position: relative; padding: 8px 11px 8px 15px; font-size: 14px; }
.nav-group a::before { content: ""; position: absolute; left: 2px; top: 50%; width: 4px; height: 4px; border-radius: 50%; background: #51627a; transform: translateY(-50%); }
.nav-group a.active::before { width: 5px; height: 16px; border-radius: 999px; background: #4d91f4; }
.nav-dashboard-link { margin-bottom: 4px; padding: 11px 13px; font-weight: 850; }
.workspace .header-actions { align-items: center; }
.alert-bell { position: relative; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid #e6e9ee; border-radius: 10px; color: #536174; background: #fff; }
.alert-bell:hover,.alert-bell.active { color: #1268e5; border-color: #b9d2f6; background: #f5f9ff; }
.alert-bell svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.alert-count { position: absolute; top: -6px; right: -7px; display: grid; place-items: center; min-width: 20px; height: 20px; border: 2px solid #fff; border-radius: 999px; background: #f59e0b; padding: 0 4px; color: #111827; font-size: 10px; font-weight: 900; line-height: 1; }
.alert-count[hidden] { display: none; }
.alert-list article form { display: grid; justify-items: end; gap: 8px; }
.alert-list article form button { border: 1px solid var(--line); border-radius: 8px; background: #fff; padding: 7px 10px; color: var(--blue); font-weight: 800; }
.alert-unread { border-left: 4px solid #f59e0b; background: #fffcf4; }
.alert-read { opacity: .76; }

@media (max-width: 760px) {
  .mobile-navigation nav { gap: 6px; }
  .mobile-navigation .nav-group summary { min-height: 38px; padding: 8px 11px; }
  .mobile-navigation .nav-group details>div { padding-left: 7px; }
  .mobile-navigation .nav-group a { padding: 8px 11px 8px 15px; }
  .mobile-navigation .nav-dashboard-link { display: block; margin-bottom: 5px; padding: 10px 11px; }
  .workspace header { padding: 0 18px; }
  .workspace header > span { display: none; }
  .alert-list article { display: grid; grid-template-columns: 1fr; }
  .alert-list article form { grid-template-columns: auto 1fr; justify-items: start; align-items: center; }
}
