/* Storefront integration for the Nimbus navigation. The original links remain
   usable before the island mounts or if JavaScript is unavailable. */
.header [data-liquid-navigation="desktop"] { display: contents; }
.header [data-liquid-navigation="mobile"] { display: block; min-width: 0; }
.header [data-liquid-navigation] .nimbus-nav span { margin: 0; }
.header [data-liquid-navigation] .nimbus-nav {
  font-family: Manrope, Arial, sans-serif;
  --n-fg: #25151c;
  --n-fg-soft: #39353c;
  --n-tint: rgba(240, 235, 239, .52);
}
.header [data-liquid-navigation] .nimbus-nav[data-tone="dark"] {
  --n-fg: #fff7f8;
  --n-fg-soft: #e5dce0;
  --n-tint: rgba(37, 21, 32, .56);
}
.header .nimbus-nav[data-tone="dark"][data-gl="off"] .nimbus-drop {
  background: linear-gradient(155deg, #5a3444, #2e2533 75%);
  box-shadow: inset 0 1px 2px #d09cab, inset 0 0 0 1px #996a80, 0 2px 8px #09050b55;
}
.header .nimbus-nav[data-tone="light"][data-gl="off"] .nimbus-drop {
  background: linear-gradient(155deg, #fff, #f2e3e7 80%);
  box-shadow: inset 0 1px 2px #fff, inset 0 0 0 1px #d4a7b3, 0 2px 8px #4e28301c;
}
.header [data-liquid-navigation] .nimbus-label { color: inherit; }
.header .nimbus-nav:has(.nimbus-item[data-preview]:not([aria-current])) [aria-current="page"] .nimbus-label {
  text-decoration: underline; text-decoration-color: var(--accent);
  text-underline-offset: .32em;
}
.header :is([data-liquid-navigation="desktop"], [data-liquid-navigation="mobile"]) a:focus-visible,
.header .graphite-mobile-menu summary:focus-visible {
  outline: 3px solid #008bd2;
  outline-offset: 2px;
  border-radius: 9px;
}

@media (min-width: 1241px) {
  body[data-theme="graphite"] .header { gap: 10px; padding-inline: 16px; }
  body[data-theme="graphite"] .header .brand { width: 140px; }
  body[data-theme="graphite"] .header .desktop-nav {
    display: flex; flex: 0 0 auto; min-width: 0; margin-left: auto;
    gap: 0; font-size: 12px; white-space: nowrap;
  }
  body[data-theme="graphite"] .header .desktop-nav [data-liquid-navigation="desktop"] > a {
    padding: 0 6px; min-height: 44px;
  }
  body[data-theme="graphite"] .header .desktop-nav .nimbus-nav {
    max-width: none; flex-wrap: nowrap; padding: 4px; gap: 1px;
  }
  body[data-theme="graphite"] .header .desktop-nav a.nimbus-item {
    min-height: 44px; white-space: nowrap; gap: 5px;
    padding-inline: clamp(5px, calc(3.2vw - 35px), 13px);
    font: 650 clamp(12px, .91vw, 13.5px)/1.2 Manrope, Arial, sans-serif;
  }
  .header .desktop-nav .nv-ico svg { display: block; width: 16px; height: 16px; }
  body[data-theme="graphite"] .header .search { flex: 0 1 155px; min-width: 100px; margin-left: 0; }
  body[data-theme="graphite"] .header .nav-tools { flex: 0 0 auto; }
  body[data-theme="graphite"] .header .graphite-mobile-menu { display: none; }
}

/* Below this width a single row of all eight labels and the tools does not fit
   at a readable size, so use the existing menu instead of hiding labels. */
@media (max-width: 1240px) {
  body[data-theme="graphite"] .header .desktop-nav { display: none; }
  body[data-theme="graphite"] .header .graphite-mobile-menu { display: block; position: relative; flex: 0 0 auto; }
  body[data-theme="graphite"] .header .graphite-mobile-menu summary {
    display: grid; place-items: center; width: 44px; height: 44px;
    list-style: none; cursor: pointer; border-radius: 10px; -webkit-tap-highlight-color: transparent;
  }
  body[data-theme="graphite"] .header .graphite-mobile-menu summary::-webkit-details-marker { display: none; }
  body[data-theme="graphite"] .header .graphite-mobile-menu summary svg { width: 22px; height: 22px; }
  body[data-theme="graphite"] .header .graphite-mobile-menu nav {
    position: absolute; z-index: 30; top: calc(100% + 16px); right: 0;
    display: block; width: 270px; max-width: calc(100vw - 32px);
    max-height: min(70vh, calc(100dvh - 120px)); overflow-y: auto; overflow-x: hidden;
    overscroll-behavior: contain; padding: 10px; border: 1px solid var(--gn-edge);
    border-radius: 14px; color: var(--ink); background: var(--gn-solid);
    box-shadow: 0 20px 40px #0006; -webkit-overflow-scrolling: touch;
  }
  body[data-theme="graphite"] .header .graphite-mobile-menu nav > a,
  body[data-theme="graphite"] .header .graphite-mobile-menu [data-liquid-navigation="mobile"] > a {
    display: flex; align-items: center; min-height: 44px; padding: 10px 14px;
    color: var(--ink); font: 700 15px/1.4 Manrope, Arial, sans-serif;
    white-space: normal; overflow-wrap: anywhere;
  }
  body[data-theme="graphite"] .header .graphite-mobile-menu .nimbus-nav { width: 100%; max-width: 100%; }
  body[data-theme="graphite"] .header .graphite-mobile-menu .nimbus-item { min-height: 44px; }
}
@media (min-width: 901px) and (max-width: 1240px) {
  body[data-theme="graphite"] .header .search { margin-left: auto; width: min(260px, 25vw); }
}
@media (max-width: 760px) {
  body[data-theme="graphite"] .header .graphite-mobile-menu { position: absolute; right: 14px; bottom: 13px; }
  body[data-theme="graphite"] .header .graphite-mobile-menu nav {
    top: calc(100% + 22px); max-width: calc(100vw - 32px);
    max-height: calc(100dvh - 160px);
  }
}
