/* NexusDocs sidebar collapse override.
   Zensical's theme pins top-level section children visible regardless of
   checkbox :checked state, hides the top-level label (the chevron host)
   via ".md-nav__item--section>.md-nav__container>:nth-child(2){display:none}",
   and hides the chevron icon's ::after pseudo-element on nested sections.
   Restore consistent toggle-controlled collapse + visible chevron for
   top-level categories so they behave like nested sub-groups.
   Uses max-height + opacity (no grid-template-rows) to avoid layout-thrash
   flash on click. */

/* (0) Make the top-level section label clickable as a single big toggle.
   The theme applies pointer-events: none to .md-nav__item--section>.md-nav__link
   that is not also .md-nav__container; restore pointer-events so clicks reach
   the underlying checkbox input and toggle the children. */
.md-nav__item--section.md-nav__item--nested > .md-nav__link {
  pointer-events: auto;
  cursor: pointer;
  user-select: none;
}

.md-nav__item--section.md-nav__item--nested > .md-nav__container:hover,
.md-nav__item--section.md-nav__item--nested > label.md-nav__link:hover {
  background: var(--md-default-fg-color--lightest);
  border-radius: 0.4rem;
}

/* Neutralize the theme's own .md-nav__link[for]:hover background so the
   chevron label never paints a second highlight chip on top of the row. */
.md-nav--primary .md-nav__item--section.md-nav__item--nested > .md-nav__container > label.md-nav__link:hover {
  background-color: initial;
}

/* Full-row clickable overlay so the whole category row acts as a single toggle. */
.md-nav__item--section.md-nav__item--nested .md-nav__container > label.md-nav__link::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  cursor: pointer;
}

/* (1) Un-hide the label (the chevron host) that the theme hides at
   .md-nav__item--section>.md-nav__container>:nth-child(2). This rule only
   applies when the section was rendered with the index.md-style wrapper
   (.md-nav__container around a link + label). Top-level sections without
   index.md use the bare label, which is handled by (0) + (3). */
.md-nav__item--section.md-nav__item--nested > .md-nav__container > :nth-child(2) {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  padding: 0.35rem;
  cursor: pointer;
}

/* Hide the <a> link to section index.md inside container.
index.md files were deleted (AGENTS.md 1); the link would 404.
Keep only the <label> toggle so section acts as a single-button collapse. */
.md-nav__item--section.md-nav__item--nested .md-nav__container {
  position: relative;
}
.md-nav__item--section.md-nav__item--nested .md-nav__container > a.md-nav__link {
  pointer-events: none;
  cursor: pointer;
  flex: 1 1 auto;
  min-width: 0;
  color: inherit;
}
.md-nav__item--section.md-nav__item--nested .md-nav__container > label.md-nav__link {
  position: static;
  margin-left: auto;
}

/* (2) Top-level collapse — no-layout animation to avoid flash on click.
   Override the theme's
   .md-nav__item--section>.md-nav { display:block; opacity:1; visibility:visible } */
.md-nav__item--section.md-nav__item--nested > .nav,
.md-nav__item--section.md-nav__item--nested > .md-nav {
  display: block;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: max-height .2s ease, opacity .15s ease, visibility 0s .2s;
}

.md-nav__item--section.md-nav__item--nested > .md-nav__toggle:checked ~ .nav,
.md-nav__item--section.md-nav__item--nested > .md-nav__toggle:checked ~ .md-nav {
  max-height: 100vh;
  opacity: 1;
  visibility: visible;
  transition: max-height .25s ease, opacity .15s ease, visibility 0s;
}

/* (3) Top-level category chevron — show the icon's ::after override the
   theme rule .md-nav__item--nested.md-nav__item--section>.md-nav__link
   .md-nav__icon:after { display:none } */
.md-nav__item--section.md-nav__item--nested > .md-nav__link .md-nav__icon {
  display: inline-block;
  width: 0.9rem;
  height: 0.9rem;
}

.md-nav__item--section.md-nav__item--nested > .md-nav__link .md-nav__icon:after {
  display: block;
  background-color: currentcolor;
  content: "";
  height: 100%;
  width: 100%;
  -webkit-mask-image: var(--md-nav-icon--next);
          mask-image: var(--md-nav-icon--next);
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  transition: transform .25s;
}

[dir="rtl"] .md-nav__item--section.md-nav__item--nested > .md-nav__link .md-nav__icon:after {
  transform: rotate(180deg);
}

.md-nav__item--section.md-nav__item--nested > .md-nav__toggle:checked ~ .md-nav__link .md-nav__icon:after {
  transform: rotate(90deg);
}

[dir="rtl"] .md-nav__item--section.md-nav__item--nested > .md-nav__toggle:checked ~ .md-nav__link .md-nav__icon:after {
  transform: rotate(270deg);
}