/* Left nav (Contents) and right menu (On This Page): spacing, current-page
   highlight, menu titles, and font sizes. */

/* Decorative group heading in the left nav, such as "Releases and Lifecycle".
   Added in mkdocs.yml as an empty nav entry:
     - '<span class="nav-deco">Heading</span>': []
   Same font and color as the menu titles ("Contents", "On This Page"). */
.nav-deco {
  font-size: .7rem;
  color: var(--md-default-fg-color--light);
  font-weight: 700;
  margin-top: 1rem;
  display: block;
  padding-bottom: .3rem;
  border-bottom: 1px solid var(--md-default-fg-color--lighter);
}

/* Makes the decorative nav item truly non-interactive */
.md-nav__link:has(.nav-deco) {
  pointer-events: none;
  cursor: default;
}

/* Removes hover/focus background completely */
.md-nav__link:has(.nav-deco):hover,
.md-nav__link:has(.nav-deco):focus {
  background: none;
}

/* Even spacing between items at every nav level */
@media screen and (min-width: 76.25em) {
  /* Same space above and below every item instead of a top-only margin */
  .md-nav--primary .md-nav__link {
    margin-top: 0;
    padding: .2rem 0;
  }

  /* Tighter lines inside a wrapped label, so it reads as one item */
  .md-nav--primary .md-nav__link .md-ellipsis {
    line-height: 1.2;
  }

  /* Remove the extra space at the end of opened sections that causes the jump */
  .md-nav--primary .md-nav__list {
    padding-bottom: 0;
  }
  .md-nav--primary .md-nav__item .md-nav {
    margin-bottom: 0;
  }

  /* A section with an index page wraps its link and toggle in a container
     that also has .md-nav__link. Pad only the inner elements, not both. */
  .md-nav--primary .md-nav__link.md-nav__container {
    padding: 0;
  }

  /* The expand icon is .9rem tall, taller than the text line, so it makes
     section rows taller than page rows. Match it to the line height
     (1.2 x the link font size), so all rows are the same height. */
  .md-nav--primary .md-nav__link .md-nav__icon {
    height: 1.2em;
    width: 1.2em;
  }
}

/* Highlight the current page in the left nav */
@media screen and (min-width: 76.25em) {
  .md-nav--primary a.md-nav__link--active {
    font-weight: 700;
    color: var(--md-default-fg-color);
    border-left: .15rem solid #0066cc;
    padding-left: .4rem;
    padding-right: .4rem;
    background: var(--md-default-fg-color--lightest);
    /* Round only the right corners so the bar stays straight */
    border-radius: 0 .2rem .2rem 0;
    /* Pull the bar into the gutter so the text does not shift */
    margin-left: -.55rem;
  }
}

/* Long page titles wrap at the same point as section titles, before the
   column of expand icons (.4rem gap + 1.2em icon). Section rows already
   leave this space; page rows (a link directly in the item) do not.
   Placed after the highlight rule so it also applies to the active page. */
@media screen and (min-width: 76.25em) {
  .md-nav--primary .md-nav__item > a.md-nav__link {
    padding-right: calc(1.2em + .4rem);
  }
}

/* The left nav title has two labels (custom_theme/partials/nav.html):
   site_name for the mobile drawer, "Contents" for the desktop sidebar,
   so the sidebar does not repeat the header. */
.nav-title--desktop {
  display: none;
}

@media screen and (min-width: 76.25em) {
  .nav-title--mobile {
    display: none;
  }
  .nav-title--desktop {
    display: inline;
  }
}

@media screen and (min-width: 76.25em) {
  .md-nav--primary > .md-nav__title {
    display: block;
    color: var(--md-default-fg-color--light);
    font-weight: 700;
    padding: 0 0 .3rem;
    margin: 0 .6rem .3rem;
    border-bottom: 1px solid var(--md-default-fg-color--lighter);
  }
}

@media screen and (min-width: 60em) {
  .md-nav--secondary > .md-nav__title {
    display: block;
    color: var(--md-default-fg-color--light);
    font-weight: 700;
    padding: 0 0 .3rem;
    margin: 0 .6rem .3rem;
    border-bottom: 1px solid var(--md-default-fg-color--lighter);
  }
}

/* Align both titles with the breadcrumbs above the page title.
   Theme default sidebar top padding is 1.2rem; the TOC sidebar shows
   from 60em up, the left nav from 76.25em up. */
@media screen and (min-width: 76.25em) {
  .md-sidebar--primary {
    padding-top: 1.03rem;
  }
}

@media screen and (min-width: 60em) {
  .md-sidebar--secondary {
    padding-top: 1.03rem;
  }
}

/* Font sizes differ per menu on purpose:
   - Contents (left nav, .md-nav--primary): top-level items .75rem, slightly
     larger than the theme default (.7rem) but below the body text (.8rem);
     items below the top level .68rem.
   - On This Page (right menu, .md-nav--secondary): .68rem at every level. */

/* Contents (left nav) */
@media screen and (min-width: 76.25em) {
  .md-nav--primary .md-nav__link {
    font-size: .75rem;
  }
  .md-nav--primary .md-nav .md-nav__link {
    font-size: .68rem;
  }
}

/* On This Page (right menu) */
@media screen and (min-width: 60em) {
  .md-nav--secondary .md-nav__link {
    font-size: .68rem;
  }
}

/* Same even spacing in the table of contents as in the left nav */
@media screen and (min-width: 60em) {
  .md-nav--secondary .md-nav__link {
    margin-top: 0;
    padding: .2rem 0;
  }

  .md-nav--secondary .md-nav__link .md-ellipsis {
    line-height: 1.2;
  }

  .md-nav--secondary .md-nav__list {
    padding-bottom: 0;
  }
  .md-nav--secondary .md-nav__item .md-nav {
    margin-bottom: 0;
  }
}