/* header-nav.css — desktop inline, mobile dropdown (no backdrop) */

/* Header container stays above page content */
.site-header { position: relative; z-index: 10; background: var(--bg, #0f172a); }
.site-header .topbar { position: relative; }

/* Nav and toggle */
#site-nav { position: relative; z-index: 11; }
.site-header .menu-toggle { position: relative; z-index: 12; }

/* Menu base reset (ID beats generic .menu styles) */
#primary-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Links */
#primary-menu a {
  display: block;
  padding: .7rem .8rem;
  text-decoration: none;
}

/* ============== Mobile (default) — dropdown ============== */
@media (max-width: 1023.98px) {
  /* ensure nothing clips the dropdown */
  #site-nav { position: relative; overflow: visible; }

  #primary-menu {
    position: absolute !important;
    top: 100% !important;          /* place directly under the nav bar */
    right: 0 !important;
    width: min(92vw, 360px) !important;
    max-height: calc(100vh - 64px);
    overflow: auto;
    background: var(--panel, #111827);
    border: 1px solid var(--muted, #94a3b8);
    border-radius: 8px;
    box-shadow: 0 12px 24px rgba(0,0,0,.35);
    padding: .5rem;
    display: none !important;      /* closed until body.nav-open */
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* open state */
  body.nav-open #site-nav > #primary-menu {
    display: block !important;
  }

  /* if the partial added [hidden], ignore it */
  #primary-menu[hidden] {
    display: block !important;
  }
}

/* ============== Desktop — inline menu ============== */
@media (min-width: 1024px) {
  #primary-menu {
    position: static !important;
    display: flex !important;
    gap: .5rem;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
}