/* se-nav.css - the navigation's mechanics, from the site engine's components.
 * Installed by `site-engine build-nav`, linked at the TOP of <head> so every stylesheet the build writes
 * after it wins at equal specificity. Structure only: no colour, no type, no spacing. The build gives the
 * overlay its own background, its own type and its own layout inside. Which of the toggle and the bar
 * shows at a width is not here: build-nav writes it beside this link, from the page's own breakpoint. */

/* Below the breakpoint, the panel is a full-viewport overlay above the page, closed until opened. */
[data-se-nav][data-se-nav-mode="overlay"] {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  overflow-y: auto;
  overscroll-behavior: contain;
}
[data-se-nav][data-se-nav-mode="overlay"]:not([data-se-nav-open]) {
  display: none;
}

/* A submenu is closed until its button opens it; with no script, every group stays open. */
@media (scripting: enabled) {
  [data-se-nav-submenu]:not([data-se-nav-sub-open]) {
    display: none;
  }
}

/* The toggle stays above its open overlay so it can close it (it must be positioned or a flex item for
 * z-index to apply; its position is the build's, never set here). */
html[data-se-nav-open] [data-se-nav-toggle] {
  z-index: 2147483001;
}

/* The page behind an open menu does not scroll. */
html[data-se-nav-open] {
  overflow: hidden;
}
