/* Native mobile navigation: avoids JavaScript-dependent menu toggling on phone browsers. */
body.premium .site-nav-menu {
  position: relative;
  display: flex;
  align-items: center;
}

body.premium .site-nav-menu > summary {
  list-style: none;
}

body.premium .site-nav-menu > summary::-webkit-details-marker {
  display: none;
}

@media (min-width: 761px) {
  body.premium .site-nav-menu > .site-nav-toggle {
    display: none;
  }

  /* Safari may retain the native closed-details hiding rule. Force the
     desktop navigation to remain visible regardless of the details state. */
  body.premium .site-nav-menu > .site-nav,
  body.premium .site-nav-menu:not([open]) > .site-nav {
    display: flex !important;
  }
}

@media (max-width: 760px) {
  body.premium .site-nav-menu {
    position: static;
  }

  body.premium .site-nav-menu > .site-nav-toggle {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    gap: 8px;
    padding: 0 13px;
    border: 1px solid var(--premium-line);
    border-radius: 999px;
    color: var(--premium-ink);
    background: #fff;
    box-shadow: none;
    font: inherit;
    font-size: .8rem;
    font-weight: 720;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    user-select: none;
  }

  body.premium .site-nav-menu[open] > .site-nav-toggle {
    color: #fff;
    background: var(--premium-green);
  }

  body.premium .site-nav-menu > .site-nav,
  body.premium .site-nav-menu:not([open]) > .site-nav {
    position: absolute;
    top: calc(100% + 8px);
    right: 12px;
    left: 12px;
    z-index: 1100;
    display: none !important;
    padding: 10px;
    border: 1px solid var(--premium-line);
    border-radius: 18px;
    background: rgba(255,255,255,.99);
    box-shadow: var(--premium-shadow);
  }

  body.premium .site-nav-menu[open] > .site-nav {
    display: grid !important;
  }
}
