@media screen and (min-width: 60em) {
  .md-sidebar--secondary {
    margin-top: var(--ng-main-start-offset-negative) !important;
    top: var(--ng-fixed-nav-height) !important;
    height: calc(100vh - var(--ng-fixed-nav-height)) !important;
  }

  .md-sidebar--secondary .md-sidebar__scrollwrap {
    height: calc(100vh - var(--ng-fixed-nav-height) - var(--ng-sidebar-padding-block)) !important;
    max-height: calc(100vh - var(--ng-fixed-nav-height) - var(--ng-sidebar-padding-block)) !important;
    overscroll-behavior: contain;
  }
}

@media screen and (min-width: 76.25em) {
  .md-sidebar--primary {
    margin-top: var(--ng-main-start-offset-negative) !important;
    top: var(--ng-fixed-nav-height) !important;
    height: calc(100vh - var(--ng-fixed-nav-height)) !important;
  }

  .md-sidebar--primary .md-sidebar__scrollwrap {
    height: calc(100vh - var(--ng-fixed-nav-height) - var(--ng-sidebar-padding-block)) !important;
    max-height: calc(100vh - var(--ng-fixed-nav-height) - var(--ng-sidebar-padding-block)) !important;
    overscroll-behavior: contain;
  }
}

@media screen and (max-width: 76.1875em) {
  .md-sidebar--primary {
    display: none !important;
  }
}

/* Keep the current category in the top tabs/header, not the left sidebar. */
.md-sidebar--primary .md-nav--primary > .md-nav__list > .md-nav__item--active.md-nav__item--nested > .md-nav__link,
.md-sidebar--primary .md-nav[data-md-level="1"] > .md-nav__list > .md-nav__item--active.md-nav__item--nested > .md-nav__link,
.md-sidebar--primary .md-nav[data-md-level="1"] > .md-nav__list > .md-nav__item--active.md-nav__item--nested > .md-nav__container,
.md-sidebar--primary .md-nav[data-md-level="1"] > .md-nav__list > .md-nav__item--active.md-nav__item--nested > .md-nav > .md-nav__title {
  display: none;
}

/* When a section is open, don't repeat its title above the article links. */
.md-sidebar--primary .md-nav[data-md-level="2"] > .md-nav__list > .md-nav__item--active.md-nav__item--nested > .md-nav > .md-nav__title {
  display: none;
}

/* Make the whole section row toggle the nested items, not just the arrow. */
.md-sidebar--primary .md-nav[data-md-level="2"] > .md-nav__list > .md-nav__item--nested > .md-nav__container {
  position: relative;
}

.md-sidebar--primary .md-nav[data-md-level="2"] > .md-nav__list > .md-nav__item--nested > .md-nav__container > .md-nav__link:not(label) {
  padding-right: 2.25rem;
}

.md-sidebar--primary .md-nav[data-md-level="2"] > .md-nav__list > .md-nav__item--nested > .md-nav__container > label.md-nav__link {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 0.6rem;
  background: transparent;
  cursor: pointer;
  z-index: 1;
}

/* Hide the intermediate "Articles" group and show its contents directly. */
.md-sidebar--primary .md-nav[data-md-level="3"] > .md-nav__list > .md-nav__item--nested > .md-nav__toggle,
.md-sidebar--primary .md-nav[data-md-level="3"] > .md-nav__list > .md-nav__item--nested > .md-nav__link,
.md-sidebar--primary .md-nav[data-md-level="3"] > .md-nav__list > .md-nav__item--nested > .md-nav > .md-nav__title {
  display: none;
}

.md-sidebar--primary .md-nav[data-md-level="3"] > .md-nav__list > .md-nav__item--nested > .md-nav {
  display: block !important;
  max-height: none !important;
  opacity: 1 !important;
  overflow: visible !important;
  visibility: visible !important;
}

.md-sidebar--primary .md-nav[data-md-level="3"] > .md-nav__list > .md-nav__item--nested > .md-nav > .md-nav__list {
  padding-inline-start: 0;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Ensure article links remain visible after the wrapper is flattened. */
.md-sidebar--primary .md-nav[data-md-level="4"] .md-nav__link {
  color: var(--md-default-fg-color);
  display: block;
  opacity: 1 !important;
  visibility: visible !important;
}

.md-sidebar--primary .md-nav[data-md-level="2"] .md-nav__link--active,
.md-sidebar--primary .md-nav[data-md-level="3"] .md-nav__link--active,
.md-sidebar--primary .md-nav[data-md-level="4"] .md-nav__link--active {
  color: #00afeb;
}

.md-sidebar--primary .md-nav[data-md-level="4"] .md-ellipsis {
  color: inherit;
  display: inline;
  visibility: visible;
  opacity: 1 !important;
  white-space: normal;
}