/* Shared feedback, loaded after page styles on every storefront layout. */
:where(a[href], button, input[type="submit"], summary) {
  transition: color .2s ease, background-color .2s ease, border-color .2s ease,
    box-shadow .2s ease, filter .2s ease, opacity .2s ease;
}
:where(a[href], button, input[type="submit"], summary):focus-visible {
  outline: 3px solid #b78028;
  outline-offset: 4px;
}
.navbar__links a {
  position: relative;
}
.navbar__links a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 2px;
  height: 2px;
  border-radius: 2px;
  background: #7a1f2b;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
}
.navbar__links a[aria-current="page"],
.navigation-modal__link[aria-current="page"] {
  color: #7a1f2b;
}
.navbar__links a[aria-current="page"]::after,
.navbar__links a:focus-visible::after {
  transform: scaleX(1);
}
.navigation-modal__link[aria-current="page"] {
  background: rgba(122, 31, 43, .08);
  box-shadow: inset 3px 0 #7a1f2b;
}
@media (hover: hover) and (pointer: fine) {
  :where(a[href], button, input[type="submit"], summary):not(:disabled):not([aria-disabled="true"]):hover {
    filter: brightness(.88);
  }
  .navbar__links a:hover, .navigation-modal__link:hover {
    color: #7a1f2b;
  }
  .navbar__links a:hover::after { transform: scaleX(1); }
  .navigation-modal__link:hover { background: rgba(122, 31, 43, .08); }
  :is(.merch__btn, .collection-card__btn, .faq-bulk__btn, .home__button,
      .btn-primary, .btn-google, .nd-whatsapp-fab, .marketing-popup__cta):not(:disabled):not([aria-disabled="true"]):hover {
    box-shadow: 0 6px 18px rgba(17, 17, 17, .2);
  }
  /* Match the Explore More button's color, lift, and shared hover shadow. */
  .hero__cta:hover {
    background: var(--color-maroon);
    color: var(--color-white);
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(17, 17, 17, .2);
  }
  :is(.icon-btn, .lang-switch__option, .product-card__actions button,
      .home__category, .category-pill):not(:disabled):hover {
    box-shadow: 0 0 0 2px rgba(122, 31, 43, .3);
  }
  :is(.footer-col, .footer-contact, .product-card__body) a:hover,
  a.product-card__name:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
  }
}
@media (prefers-reduced-motion: reduce) {
  :where(a[href], button, input[type="submit"], summary), .navbar__links a::after {
    transition: none !important;
  }
}