/* Native section disclosures reuse disclosures.css: right when closed, down
   when open. The sidebar nodes also live inside the phone's navigation dialog. */
#sidebar .main-nav-group { min-width: 0; }
#sidebar .main-team-group { margin-top: 14px; padding-top: 8px; border-top: 1px solid var(--crm-line, var(--line)); }
#sidebar .main-nav-group > .main-nav-summary {
  display: flex;
  align-items: center;
  min-height: 36px;
  margin: 0;
  padding: 7px 10px;
  color: var(--crm-muted, var(--muted));
  font-size: .75rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .05em;
  text-transform: uppercase;
  overflow-wrap: anywhere;
  cursor: pointer;
  border-radius: 7px;
  list-style: none;
}
#sidebar .main-nav-group > .main-nav-summary:focus-visible { outline: 3px solid var(--crm-accent, var(--accent)); outline-offset: 2px; }
#sidebar .main-nav-group > .team-nav { margin: 0; padding: 0; border: 0; }
#sidebar .main-nav-group > #project-nav { margin: 0; }
.main-nav-toggle {
  position: absolute; top: 24px; right: -23px; z-index: 6;
  display: grid; place-items: center; width: 44px; height: 44px;
  min-width: 44px; min-height: 44px; margin: 0; padding: 0; border: 0;
  border-radius: 8px; background: transparent;
  color: var(--crm-muted, var(--muted)); touch-action: manipulation;
}
/* Only the 24px tag is painted; its transparent button retains a 44px target.
   Scope these spans above .brand span so the logo caption cannot restyle them. */
#sidebar .main-nav-toggle .main-nav-toggle-icon {
  display: grid; place-items: center; width: 24px; height: 32px; margin: 0;
  border: 1px solid var(--crm-control, var(--muted)); border-radius: 6px;
  background: var(--crm-paper, var(--surface)); color: var(--crm-muted, var(--muted));
  box-shadow: 0 2px 5px rgb(48 46 40 / .10);
  font-size: 1.25rem; font-weight: 600; line-height: 1;
}
#sidebar .main-nav-toggle .main-nav-toggle-label {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap;
}
.main-nav-toggle:focus-visible { outline: 3px solid var(--crm-accent, var(--accent)); outline-offset: 2px; }
.main-nav-toggle:active:not(:disabled) { box-shadow: none; }
#sidebar .main-nav-toggle:active .main-nav-toggle-icon { background: var(--crm-soft, var(--soft)); }
.main-nav-tooltip {
  position: fixed; z-index: 100; max-width: 280px; padding: 8px 12px;
  border: 1px solid var(--crm-line, var(--line)); border-radius: 8px;
  background: var(--crm-paper, var(--surface)); color: var(--crm-text, #252b36);
  box-shadow: var(--shadow); font-size: .8125rem; line-height: 1.4;
  overflow-wrap: anywhere; pointer-events: auto;
}
/* Desktop rows previously used at least 50px plus 6px gaps. Keep all icon,
   active-state and permission styles, but recover space for the actual list. */
@media (min-width: 821px) {
  /* The tag straddles the internal column boundary, inside the workspace's
     clipping rectangle. Keep it above the main pane in both rail widths. */
  #sidebar { position: relative; overflow: visible; padding-top: 24px; }
  #sidebar .brand { padding-bottom: 22px; }
  #sidebar #main-nav, #sidebar #project-nav, #sidebar .team-nav { gap: 2px; }
  #sidebar nav button { min-height: 40px; padding: 7px 10px; gap: 10px; }
  #sidebar .project-section { margin: 14px 0 0; padding-top: 8px; }
  /* A real grid-column change releases 166px at normal CRM desktop width.
     No nav nodes are cloned: active, hidden and disabled states stay owned by
     the original features, and native group disclosures remain usable. */
  html #workspace[data-nav-collapsed="true"] { grid-template-columns: 70px minmax(0, 1fr); }
  #sidebar[data-nav-collapsed="true"] { padding: 16px 8px 18px; }
  #sidebar[data-nav-collapsed="true"] .brand { justify-content: center; padding: 0 0 14px; }
  #sidebar[data-nav-collapsed="true"] .brand > div { display: none; }
  #sidebar[data-nav-collapsed="true"] .main-nav-toggle { top: 13px; }
  html #sidebar[data-nav-collapsed="true"] nav button { justify-content: center; width: 100%; min-height: 40px; gap: 0; padding: 7px; font-size: 0; }
  #sidebar[data-nav-collapsed="true"] nav button > :not(.nav-icon):not(.team-nav-icon) { display: none; }
  #sidebar[data-nav-collapsed="true"] .team-nav-icon { flex: 0 0 24px; font-size: 20px; }
  #sidebar[data-nav-collapsed="true"] .project-section { margin-inline: 0; }
  #sidebar[data-nav-collapsed="true"] .main-nav-summary { justify-content: center; gap: 5px; padding: 5px 3px; min-height: 36px; font-size: 0; letter-spacing: 0; }
  #sidebar[data-nav-collapsed="true"] .main-nav-summary::before { flex-basis: 6px; width: 6px; height: 6px; margin-inline-end: 0; }
  #sidebar[data-nav-collapsed="true"] .main-nav-summary::after { content: attr(data-nav-group-icon); order: -1; width: 24px; font-size: 20px; text-align: center; }
  #sidebar[data-nav-collapsed="true"] .aside-bottom { padding: 22px 0 0; text-align: center; }
  #sidebar[data-nav-collapsed="true"] .aside-bottom a { display: grid; place-items: center; min-height: 40px; border-radius: 8px; font-size: 0; }
  #sidebar[data-nav-collapsed="true"] .aside-bottom a::before { content: "⇩"; font-size: 24px; }
  #sidebar[data-nav-collapsed="true"] .aside-bottom p,
  #sidebar[data-nav-collapsed="true"] #app-version { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  #sidebar[data-nav-collapsed="true"] .team-account { justify-content: center; padding: 10px 0 0; }
  #sidebar[data-nav-collapsed="true"] .team-account > :not(button) { display: none; }
  #sidebar[data-nav-collapsed="true"] .team-account button { margin: 0; width: 44px; min-height: 40px; border-radius: 8px; }
}
@media (max-width: 820px) {
  #main-nav-toggle, .main-nav-tooltip { display: none; }
  #mobile-nav-dialog #sidebar .main-team-group { margin-top: 14px; padding-top: 8px; }
  #mobile-nav-dialog #sidebar .main-nav-group > .main-nav-summary { min-height: 44px; margin: 0; padding: 10px 12px; }
  #mobile-nav-dialog #sidebar .main-nav-group > .team-nav { margin: 0; padding: 0; border: 0; }
  #mobile-nav-dialog #sidebar nav button { min-height: 44px; }
}
@media (hover: hover) and (pointer: fine) {
  #sidebar .main-nav-group > .main-nav-summary:hover { background: var(--crm-soft, var(--soft)); }
  #sidebar .main-nav-toggle:hover .main-nav-toggle-icon { background: var(--crm-soft, var(--soft)); color: var(--crm-text, #252b36); }
}
/* Keep the current section identifiable while its links are collapsed. */
html[data-color-variant="crm"] #sidebar .main-nav-group:not([open]):has(nav button.active) > .main-nav-summary {background:#e7efe9;color:#263e37;box-shadow:inset 3px 0 0 #39745b;font-weight:700}