/* PDP-only enhancements; shared storefront styles remain unchanged. */
.sfy-product-gallery [hidden], .sfy-product-lightbox [hidden] { display: none !important; }
.sfy-product-gallery__thumbs { position: relative; }
.sfy-product-gallery__slide { text-decoration: none; }
.sfy-product-gallery__feedback { min-height: 2.75rem; padding: .5rem 0; font-size: .8125rem; text-align: center; }
.sfy-product-gallery__feedback button, .sfy-product-gallery__fallback a { display: inline-flex; min-height: 44px; align-items: center; padding: .5rem .75rem; text-decoration: underline; }
.sfy-product-gallery__fallback { display: flex; flex-wrap: wrap; list-style: none; padding: 0; }
.sfy-product-gallery__dot { width: 44px; min-width: 44px; height: 44px; display: inline-grid; place-items: center; background: transparent; border-radius: .25rem; }
.sfy-product-gallery__dot::after { content: ''; width: 8px; height: 8px; border-radius: 999px; background: var(--color-muted-foreground); }
.sfy-product-gallery__dot.is-active { width: 44px; background: transparent; }
.sfy-product-gallery__dot.is-active::after { width: 24px; background: var(--color-foreground); }
.sfy-product-gallery__dots { flex-wrap: wrap; gap: 0; margin-top: .25rem; }
.sfy-product-gallery :is(button, a):focus-visible { outline: 2px solid var(--color-foreground); outline-offset: -3px; }

/* Native modal supplies inert background and keyboard focus containment. */
dialog.sfy-product-lightbox { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; color: white; background: #111; overflow: hidden; opacity: 1; }
dialog.sfy-product-lightbox:not([open]) { display: none; }
dialog.sfy-product-lightbox::backdrop { background: #111; }
.sfy-product-lightbox__toolbar { position: absolute; top: max(8px, env(safe-area-inset-top)); left: 16px; right: 16px; display: flex; align-items: center; gap: 12px; z-index: 3; font-size: .875rem; }
.sfy-product-lightbox__toolbar > span { margin-right: auto; }
.sfy-product-lightbox button { min-width: 44px; min-height: 44px; border: 1px solid #777; border-radius: .5rem; background: #222; color: white; padding: 8px 12px; cursor: pointer; }
.sfy-product-lightbox .sfy-product-lightbox__close { position: static; font-size: 1.75rem; line-height: 1; }
.sfy-product-lightbox__viewport { position: absolute; inset: max(64px, calc(env(safe-area-inset-top) + 56px)) 16px max(100px, calc(env(safe-area-inset-bottom) + 92px)); display: flex; align-items: center; justify-content: center; overflow: auto; overscroll-behavior: contain; }
.sfy-product-lightbox__figure { display: contents; }
.sfy-product-lightbox__figure img { display: block; width: auto; height: auto; max-width: min(100%, 1100px); max-height: 100%; object-fit: contain; }
.sfy-product-lightbox.is-zoomed .sfy-product-lightbox__viewport { display: block; }
.sfy-product-lightbox.is-zoomed .sfy-product-lightbox__figure img { max-width: none; max-height: none; margin: auto; }
.sfy-product-lightbox .sfy-product-lightbox__nav { top: 50%; transform: translateY(-50%); z-index: 2; font-size: 2rem; line-height: 1; }
.sfy-product-lightbox .sfy-product-lightbox__nav--prev { left: 8px; }
.sfy-product-lightbox .sfy-product-lightbox__nav--next { right: 8px; }
.sfy-product-lightbox__status { position: absolute; bottom: max(8px, env(safe-area-inset-bottom)); left: 16px; right: 16px; min-height: 64px; display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; text-align: center; font-size: .8125rem; }
.sfy-product-lightbox :is(button, [tabindex]):focus-visible { outline: 2px solid white; outline-offset: -4px; }

/* One compact family selector, preserving a real URL and price for each SKU. */
.sfy-product-family--summary { margin-top: 1.5rem; padding-top: 0; }
.sfy-product-family--summary .sfy-product-family__eyebrow { display: none; }
.sfy-product-family--summary .sfy-product-family__list { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.sfy-product-family--summary .sfy-product-family__link { display: flex; flex-direction: column; align-items: center; gap: 4px; min-height: 44px; height: 100%; padding: 6px 4px; border: 1px solid var(--color-border); border-radius: .5rem; text-align: center; }
.sfy-product-family--summary .sfy-product-family__link.is-current { border: 2px solid var(--color-foreground); padding: 5px 3px; }
.sfy-product-family--summary .sfy-product-family__media { width: 60px; height: 60px; aspect-ratio: auto; background: transparent; }
.sfy-product-family--summary .sfy-product-family__image { width: 100%; height: 100%; object-fit: contain; }
.sfy-product-family--summary .sfy-product-family__current { display: none; }
.sfy-product-family--summary .sfy-product-family__body { display: grid; grid-template-rows: 2.025rem auto; gap: 2px; width: 100%; min-width: 0; }
.sfy-product-family--summary .sfy-product-family__label { min-width: 0; min-height: 2.025rem; max-height: 2.025rem; font-size: .75rem; line-height: 1.35; overflow-wrap: anywhere; white-space: normal; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.sfy-product-family--summary .sfy-product-family__price { min-width: 0; justify-content: center; white-space: nowrap; }
.sfy-product-family--summary .sfy-product-family__meta { font-size: .625rem; }
.sfy-product-family--summary .sfy-product-family__link:focus-visible { outline: 2px solid var(--color-foreground); outline-offset: -3px; }
@media (max-width: 359px) { .sfy-product-family--summary .sfy-product-family__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { .sfy-product-gallery *, .sfy-product-lightbox * { scroll-behavior: auto; transition: none; } }
.sfy-product-section__content table { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: .875rem; }
.sfy-product-section__content :is(th, td) { padding: .75rem .5rem; border-bottom: 1px solid var(--color-border); text-align: left; }
.sfy-product-section__content th { font-weight: 500; }
/* Important preflight [hidden] lives in base; reserve space in that same layer. */
@layer base {
  .sfy-product-gallery .sfy-product-gallery__dots[hidden] { display: flex !important; visibility: hidden; }
  @media (min-width: 768px) {
    .sfy-product-gallery .sfy-product-gallery__dots[hidden] { display: none !important; }
    .sfy-product-gallery .sfy-product-gallery__thumbs[hidden] { display: flex !important; visibility: hidden; }
  }
}
