/**
 * Site header / mobile nav — load after main.css (and page-specific CSS)
 */

/* Desktop: logo left, nav right */
@media (min-width: 1200px) {
  .site-header-inner {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
  }

  .site-header-inner .logosm {
    flex: 0 0 auto;
    margin-right: auto;
  }

  .site-header-inner .navmenu {
    flex: 0 0 auto;
  }
}

/* Mobile / tablet */
@media (max-width: 1199px) {
  .site-header-inner {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 100%;
  }

  .site-header-inner .logosm {
    flex: 0 1 auto;
    min-width: 0;
    max-width: calc(100% - 3.5rem);
    margin-right: 0;
  }

  .site-header-inner .logosm img {
    display: block;
    max-width: 100%;
    height: auto;
    max-height: 56px;
  }

  .site-header-inner .mobile-nav-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 2.75rem;
    margin-left: auto;
    color: #fff;
    font-size: 1.75rem;
    line-height: 1;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    border: none;
    background: transparent;
    z-index: 100062;
  }

  /* Closed: only hide the link list (nav stays in the bar; no invisible fullscreen layer) */
  #header .navmenu > ul {
    display: none !important;
  }

  /* Open: full-viewport overlay above page content (beats floor-builder-pro #header z-index) */
  body.mobile-nav-active #header.header,
  body.mobile-nav-active #header {
    z-index: 100061 !important;
  }

  body.mobile-nav-active #header .navmenu,
  body.mobile-nav-active #navmenu.navmenu.is-open {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    height: 100% !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: none !important;
    z-index: 100060 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    background: rgba(16, 31, 55, 0.92) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.mobile-nav-active #header .navmenu > ul,
  body.mobile-nav-active #navmenu.navmenu.is-open > ul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: 5rem !important;
    left: 1.25rem !important;
    right: 1.25rem !important;
    bottom: 1.5rem !important;
    inset: 5rem 1.25rem 1.5rem 1.25rem !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0.75rem 0 !important;
    list-style: none !important;
    border-radius: 8px !important;
    background-color: #ffffff !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25) !important;
    overflow-y: auto !important;
    max-height: none !important;
    z-index: 1 !important;
  }

  body.mobile-nav-active #header .navmenu a,
  body.mobile-nav-active #header .navmenu a:focus {
    color: #444444 !important;
  }

  body.mobile-nav-active .site-header-inner .mobile-nav-toggle,
  body.mobile-nav-active .mobile-nav-toggle {
    position: fixed !important;
    top: 14px !important;
    right: 14px !important;
    z-index: 100062 !important;
    color: #fff !important;
    font-size: 2rem !important;
    line-height: 1 !important;
    margin: 0 !important;
  }
}
