/* A fixed two-level information architecture; permissions stay on leaf pages. */
.sidebar .primary-nav { display: flex; flex-direction: column; gap: 5px; }
@media(min-width:681px) {
  .sidebar .primary-nav {
    --nav-scroll-thumb: color-mix(in srgb,var(--sidebar-muted,#747389) 28%,transparent);
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: var(--nav-scroll-thumb) transparent;
    scrollbar-gutter: stable;
    overscroll-behavior-y: contain;
    scroll-padding-block: 8px;
    padding: 4px 8px 6px 2px;
    margin: -4px -8px -6px -2px;
  }
  .sidebar .primary-nav:is(:hover,:focus-within) {
    --nav-scroll-thumb: color-mix(in srgb,var(--sidebar-muted,#747389) 55%,transparent);
  }
  /* Chromium and Safari get a narrow rounded handle; Firefox uses the
     standard thin scrollbar and the same sidebar-derived colours. */
  @supports selector(::-webkit-scrollbar) {
    .sidebar .primary-nav { scrollbar-width: auto; scrollbar-color: auto; }
    .sidebar .primary-nav::-webkit-scrollbar { width: 8px; }
    .sidebar .primary-nav::-webkit-scrollbar-track { background: transparent; }
    .sidebar .primary-nav::-webkit-scrollbar-thumb {
      min-height: 40px;
      border: 2px solid transparent;
      border-radius: 999px;
      background-color: var(--nav-scroll-thumb);
      background-clip: padding-box;
    }
    .sidebar .primary-nav::-webkit-scrollbar-thumb:hover {
      background-color: color-mix(in srgb,var(--sidebar-muted,#747389) 75%,transparent);
    }
    .sidebar .primary-nav::-webkit-scrollbar-thumb:active { background-color: var(--sidebar-muted,#747389); }
    .sidebar .primary-nav::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
    .sidebar .primary-nav::-webkit-scrollbar-corner { background: transparent; }
  }
}
@media(min-width:681px) and (prefers-contrast:more) {
  .sidebar .primary-nav { --nav-scroll-thumb: var(--sidebar-muted,#747389); }
}
@media(forced-colors:active) {
  .sidebar .primary-nav { scrollbar-width: thin; scrollbar-color: auto; }
}
.nav-personal, .nav-submenu { display: flex; flex-direction: column; gap: 3px; }
.nav-personal { padding-bottom: 14px; margin-bottom: 9px; border-bottom: 1px solid var(--sidebar-line,var(--line)); }
.nav-group { min-width: 0; }
.nav-group > summary { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 11px 12px; border-radius: 9px; list-style: none; color: var(--sidebar-muted,var(--muted)); font-size: 13px; font-weight: 650; cursor: pointer; user-select: none; }
.nav-group > summary::-webkit-details-marker { display: none; }
.nav-group > summary > svg { width: 19px; height: 19px; flex-shrink: 0; }
.nav-chevron { margin-left: auto; font-size: 15px; transition: transform .15s; }
.nav-group[open] > summary .nav-chevron { transform: rotate(180deg); }
.nav-group > summary:hover { background: var(--sidebar-active-bg,var(--brand-soft)); color: var(--sidebar-active-fg,var(--brand-text)); }
.nav-group.has-current > summary { color: var(--sidebar-active-fg,var(--brand-text)); }
.nav-group > summary:focus-visible { outline: 2px solid var(--sidebar-active-fg,var(--brand-text)); outline-offset: 2px; }
.nav-submenu { margin: 2px 0 9px 21px; padding: 2px 0 2px 15px; border-left: 1px solid var(--sidebar-line,var(--line)); }
.sidebar .nav-submenu .nav-item { position: relative; width: 100%; min-height: 37px; padding: 9px 11px; font-size: 12px; font-weight: 500; border-radius: 8px; }
.nav-submenu .nav-item > svg { display: none; }
.sidebar .nav-submenu .nav-item.active { font-weight: 700; }
.nav-submenu .nav-item.active::before { content: ''; position: absolute; left: -18px; top: 50%; width: 5px; height: 5px; border-radius: 50%; transform: translateY(-50%); background: var(--sidebar-indicator,var(--brand-text)); }
.sidebar .nav-personal .nav-item, .sidebar .nav-direct .nav-item { width: 100%; min-height: 42px; padding: 10px 12px; font-size: 13px; }
.nav-direct { margin: 3px 0; }
.menu-group-section + .menu-group-section { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 20px; }
.menu-group-heading { display: flex; align-items: baseline; gap: 12px; margin: 0 0 12px; }
.menu-group-heading h3 { font-size: 14px; margin: 0; }.menu-group-heading span { font-size: 10px; color: var(--muted); }
.mobile-nav-group { border: 1px solid var(--line); border-radius: 11px; overflow: hidden; }
.mobile-nav-group > summary { display: flex; justify-content: space-between; padding: 15px; cursor: pointer; font-size: 13px; font-weight: 650; list-style: none; background: #fafafe; }.mobile-nav-group > summary::-webkit-details-marker { display: none; }
.mobile-nav-group > div { display: grid; gap: 4px; padding: 8px; }
.admin-mobile-menu .mobile-nav-group button { padding: 12px; font-size: 12px; border: 0; }
.admin-mobile-menu button[aria-current=page] { background: var(--brand-soft); color: var(--brand-text); font-weight: 650; }
.admin-mobile-menu .mobile-nav-direct button { width: 100%; font-size: 13px; }
.audit-record-label { display: inline-block; margin-bottom: 5px; color: var(--brand-text); font-size: 10px; }
@media (min-width:681px) and (max-width:980px) {
  .app-shell { grid-template-columns: 220px minmax(0,1fr); }
  .sidebar { padding-inline: 15px; }
  .sidebar .nav-item { justify-content: flex-start; }
  .sidebar .nav-item span, .sidebar .brand > span:last-child, .sidebar .mini-profile div { display: block; }
  .sidebar .brand { justify-content: flex-start; }
  .sidebar .mini-profile { grid-template-columns: 32px minmax(0,1fr) auto; gap: 8px; }
  .sidebar .icon-only { display: inline-flex; }
}
@media(max-width:680px) {
  .sidebar .primary-nav { flex-direction: row; gap: 2px; }
  .sidebar .nav-personal { display: contents; }
  .sidebar .nav-personal .nav-item { width: auto; flex: 1; min-width: 0; min-height: 49px; flex-direction: column; padding: 7px 3px; font-size: 9px; }
  .sidebar .nav-group, .sidebar .nav-direct { display: none; }
  .sidebar .mobile-admin-toggle { order: 100; }
  .sidebar .mobile-admin-toggle.active { color: var(--sidebar-active-fg,var(--brand-text)); }
}

/* Focus stays inside the item so the scrolling navigation never clips it. */
.sidebar :is(button,a,summary):focus:not(:focus-visible) { outline:none; }
.sidebar :is(button,a,summary):focus-visible { outline:2px solid var(--sidebar-active-fg,var(--brand-text));outline-offset:-4px; }
@media(forced-colors:active){.sidebar :is(button,a,summary):focus-visible { outline-color:Highlight; }}

/* Fixed icon, text and disclosure columns keep every first-level item aligned. */
@media(min-width:681px){
 .sidebar .primary-nav { gap:5px; }
 .sidebar .nav-group>summary { display:grid;grid-template-columns:20px minmax(0,1fr) 14px;column-gap:12px;min-height:44px;padding:11px 12px;line-height:1.6; }
 .sidebar .nav-personal .nav-item,.sidebar .nav-direct .nav-item { display:grid;grid-template-columns:20px minmax(0,1fr);column-gap:12px;min-height:44px;padding:11px 12px;line-height:1.6; }
 .sidebar :is(.nav-group>summary,.nav-personal .nav-item,.nav-direct .nav-item)>svg { width:20px;height:20px;margin:0; }
 .sidebar :is(.nav-group>summary,.nav-personal .nav-item,.nav-direct .nav-item)>span:not(.nav-chevron) { min-width:0;text-align:left;overflow-wrap:anywhere; }
 .sidebar .nav-chevron { width:14px;margin:0;text-align:center;justify-self:end; }
 .sidebar .nav-submenu { margin:2px 0 10px 22px;padding:2px 0 2px 20px;gap:3px; }
 .sidebar .nav-submenu .nav-item { display:flex;align-items:center;min-height:38px;padding:9px 12px;line-height:1.6;text-align:left; }
 .sidebar .nav-submenu .nav-item>span { min-width:0;overflow-wrap:anywhere; }
 .sidebar .nav-submenu .nav-item.active::before { left:-23px; }
 .sidebar .nav-direct { margin:0; }
}
.menu-group-labels { padding-bottom:22px;margin-bottom:22px;border-bottom:1px solid var(--line); }
.menu-group-labels h3,.menu-leaf-title { margin:0 0 12px;font-size:15px; }
.menu-group-labels .workflow-form-grid { margin-top:16px; }
