/* CMS integration only. The visual system remains the selected index.html design. */
.mainnav__item { position: relative; }
.mainnav__sub {
  position: absolute;
  left: -18px;
  top: calc(100% + 20px);
  z-index: 30;
  display: none;
  width: min(340px, 82vw);
  padding: 10px;
  border: 1px solid var(--c-hairline-2);
  background: var(--c-header);
  box-shadow: var(--shadow-card-hover);
}
.mainnav__item:hover > .mainnav__sub,
.mainnav__item:focus-within > .mainnav__sub { display: block; }
.mainnav__sub .mainnav__item { width: 100%; }
.mainnav__sub .mainnav__link {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding-inline: 12px;
  white-space: normal;
}
.mainnav__sub .mainnav__sub {
  left: calc(100% - 4px);
  top: -11px;
}
.pcard__currency {
  display: block;
  margin-top: 4px;
  color: var(--c-muted);
  font-size: var(--fs-eyebrow);
  line-height: 1.2;
}
.pcard__old { margin-left: 6px; }
.pcard__fav { border: 0; }
.mainnav__link { text-transform: uppercase; }
.hm-hero { background: #0a0a0a; }
.search__field:focus-visible {
  outline: 2px solid var(--c-white);
  outline-offset: -3px;
}
.cookie_banner {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 1000;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--c-white);
  box-shadow: var(--shadow-soft-hover);
}
.cookie_banner > a {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
}
.cookie_banner img {
  width: 30px !important;
  max-width: 30px;
  height: 30px !important;
}
.cookie_banner.is-hidden { display: none; }

/* Keep light links legible and brand-neutral on every dark redesign surface. */
:is(.site-header, .site-footer, .hm-hero) a:hover,
:is(.site-header, .site-footer, .hm-hero) a:focus-visible,
a:is(.btn--accent, .btn--dark, .pr-cart, .rd-primary-link, .rd-compare__buy):hover,
a:is(.btn--accent, .btn--dark, .pr-cart, .rd-primary-link, .rd-compare__buy):focus-visible,
.rd-checkout a.btn:hover,
.rd-checkout a.btn:focus-visible,
.ct-filter-panel a.hidden-post:hover,
.ct-filter-panel a.hidden-post:focus-visible,
.rd-account-nav__link:hover,
.rd-account-nav__link:focus-visible {
  color: var(--c-white);
  opacity: 1;
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}

/* Neutral interaction states inside the light storefront UI. */
.pcard__link:is(:hover, :focus-visible, :active),
.pcard__fav:is(:hover, :focus-visible, :active),
.hm-cat__link:is(:hover, :focus-visible, :active),
.ct-cat__link:is(:hover, :focus-visible, :active),
.ct-subcat__link:is(:hover, :focus-visible, :active),
.ct-crumbs a:is(:hover, :focus-visible, :active),
.pr-gallery a:is(:hover, :focus-visible, :active),
.pr-info a:not(.pr-cart):is(:hover, :focus-visible, :active),
.pr-details a:is(:hover, :focus-visible, :active),
.rd-page__content a:is(:hover, :focus-visible, :active),
.rd-contact a:is(:hover, :focus-visible, :active),
.rd-faq a:is(:hover, :focus-visible, :active),
.rd-utility a:not(.rd-primary-link):not(.rd-compare__buy):is(:hover, :focus-visible, :active) {
  color: var(--c-ink);
  border-color: currentColor;
}
.rd-page__content a:is(:hover, :focus-visible),
.rd-contact a:is(:hover, :focus-visible),
.rd-faq a:is(:hover, :focus-visible) {
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}

@media (max-width: 1024px) {
  .site-header__toggle[aria-expanded='true'] + .site-header__nav {
    max-height: min(70vh, 620px);
    overflow-y: auto;
  }
  .mainnav__item { width: 100%; }
  .mainnav__item--expandable { position: relative; }
  .mainnav__item--expandable > .mainnav__link { padding-right: 56px; }
  .mainnav__subtoggle {
    position: absolute;
    top: 0;
    right: 0;
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    padding: 0;
    border: 0;
    color: var(--c-white);
  }
  .mainnav__subtoggle::before {
    content: '';
    width: 10px;
    height: 10px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform var(--t-fast);
  }
  .mainnav__subtoggle[aria-expanded='true']::before {
    transform: translateY(2px) rotate(225deg);
  }
  .mainnav__subtoggle:focus-visible {
    outline: 2px solid var(--c-white);
    outline-offset: -4px;
  }
  .mainnav__sub,
  .mainnav__sub .mainnav__sub {
    position: static;
    display: block;
    width: 100%;
    padding: 0 0 0 18px;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  .mainnav__sub[hidden] { display: none; }
  .mainnav__sub .mainnav__link { min-height: 44px; }
}

@media (min-width: 1025px) {
  .mainnav > .mainnav__item > .mainnav__sub::before {
    content: '';
    position: absolute;
    top: -21px;
    right: 0;
    left: 0;
    height: 21px;
  }
  .mainnav__subtoggle { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}
