/* Shared product galleries: edge-to-edge photographs with native swipe. */
body .shirt-gallery { min-width: 0; }
body .shirt-gallery .gallery-canvas { position: relative; isolation: isolate; overflow: hidden; }
body .shirt-gallery .shirt-stage {
  display: flex; width: 100%; aspect-ratio: 4 / 3; background: var(--forest);
  overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory;
  scrollbar-width: none; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch;
  cursor: grab; padding: 0; border: 0; gap: 0;
}
body .shirt-gallery .shirt-stage::-webkit-scrollbar { display: none; }
body .shirt-gallery .gallery-slide {
  position: relative; isolation: isolate; flex: 0 0 100%; min-width: 0;
  width: 100%; height: 100%; margin: 0; overflow: hidden;
  scroll-snap-align: start; scroll-snap-stop: always; background: var(--photo-fill, #dedbd7);
}
body .shirt-gallery .gallery-slide::before {
  content: ''; position: absolute; inset: -36px; z-index: -1;
  background-image: var(--gallery-photo); background-size: cover; background-position: center;
  filter: blur(30px); transform: scale(1.08); pointer-events: none;
}
body .shirt-gallery .shirt-stage .gallery-slide > img {
  display: block; width: 100%; height: 100%; aspect-ratio: auto;
  object-fit: contain; padding: 0; margin: 0; border: 0; user-select: none; -webkit-user-drag: none;
  mask-image: linear-gradient(90deg, transparent, #000 1.5%, #000 98.5%, transparent);
}
body .shirt-gallery .shirt-stage.is-dragging { cursor: grabbing; scroll-snap-type: none; }
body .shirt-gallery .shirt-controls {
  position: absolute; inset: 0; display: block; margin: 0; padding: 0; pointer-events: none;
}
body .shirt-gallery .shirt-controls button {
  position: absolute; bottom: 20px; right: 20px; display: grid; place-items: center;
  width: 46px; height: 46px; min-height: 46px; padding: 0; margin: 0;
  border: 0; border-radius: 50%; background: rgba(14, 23, 18, .7); color: #faf6ee;
  font-family: Georgia, serif; font-size: 32px; line-height: 1; pointer-events: auto;
  backdrop-filter: blur(14px); transition: background .2s ease, transform .2s ease;
}
body .shirt-gallery .shirt-controls [data-shirt-prev] { right: 76px; }
body .shirt-gallery .shirt-controls button:hover { background: var(--forest); transform: translateY(-2px); }
body .shirt-gallery .shirt-count {
  position: absolute; left: 20px; top: 20px; font-family: 'DM Mono', monospace;
  font-size: 12px; letter-spacing: .13em; font-variant-numeric: tabular-nums;
  color: #faf6ee; background: rgba(14, 23, 18, .7); padding: 9px 12px; backdrop-filter: blur(14px);
}
body .shirt-gallery .shirt-thumbnails {
  position: relative; display: flex; gap: 10px; padding: 14px 0 0; margin: 0;
  overflow-x: auto; scrollbar-width: none; align-items: flex-start;
}
body .shirt-gallery .shirt-thumbnails::-webkit-scrollbar { display: none; }
body .shirt-gallery .shirt-thumbnails button {
  position: relative; flex: 0 0 58px; width: 58px; height: 72px; min-width: 0;
  padding: 0 0 7px; border: 0; background: transparent; opacity: .5;
  transition: opacity .22s ease; overflow: hidden;
}
body .shirt-gallery .shirt-thumbnails button[aria-pressed='true'],
body .shirt-gallery .shirt-thumbnails button:hover { opacity: 1; border: 0; }
body .shirt-gallery .shirt-thumbnails button::after {
  content: ''; position: absolute; inset: auto 0 0; height: 2px; background: var(--gold);
  transform: scaleX(0); transform-origin: left; transition: transform .24s ease;
}
body .shirt-gallery .shirt-thumbnails button[aria-pressed='true']::after { transform: scaleX(1); }
body .shirt-gallery .shirt-thumbnails img {
  width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; display: block;
  background: transparent; border: 0;
}
body .shirt-gallery button { cursor: pointer; }
body .shirt-gallery button:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
body.women-page .shirt-gallery .shirt-stage { aspect-ratio: 3 / 4; }
@media (max-width: 600px) {
  body .shirt-gallery .shirt-stage { aspect-ratio: 1 / 1; }
  body.women-page .shirt-gallery .shirt-stage { aspect-ratio: 3 / 4; }
  body .shirt-gallery .shirt-controls button { bottom: 14px; right: 14px; }
  body .shirt-gallery .shirt-controls [data-shirt-prev] { right: 70px; }
  body .shirt-gallery .shirt-count { top: 14px; left: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  body .shirt-gallery *, body .shirt-gallery *::after { transition: none; }
}