/* APE 2026 — Gallery prodotto: scroll-snap nativo, zero librerie. */
.ape-gallery { position: relative; }
.ape-gallery__track {
  display: flex; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none; border-radius: var(--ape-r-card);
  background: var(--ape-surface-2);
}
.ape-gallery__track::-webkit-scrollbar { display: none; }
.ape-gallery__slide {
  flex: 0 0 100%; margin: 0; scroll-snap-align: start; scroll-snap-stop: always;
}
.ape-gallery__slide img {
  width: 100%; aspect-ratio: 1 / 1; object-fit: contain; background: #fff;
}
.ape-gallery__dots {
  display: flex; justify-content: center; gap: 6px; padding-block: var(--ape-s2);
}
/* Tap target 24px (Lighthouse target-size): bottone 24x24, pallino visivo 8px nel ::after */
.ape-gallery__dot {
  width: 24px; height: 24px; background: none; border: 0; padding: 0;
  display: flex; align-items: center; justify-content: center;
}
.ape-gallery__dot::after {
  content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--ape-line);
  transition: background var(--ape-t-fast) var(--ape-ease), transform var(--ape-t-fast) var(--ape-ease);
}
.ape-gallery__dot.is-active::after { background: var(--ape-ink); transform: scale(1.25); }
.ape-gallery__thumbs {
  display: none; gap: var(--ape-s2); margin-top: var(--ape-s2);
  flex-wrap: wrap; /* 2026-07-15: tutte le miniature visibili (vanno a capo), niente scroll nascosto */
}
.ape-gallery__thumb {
  flex: 0 0 64px; border: 1.5px solid var(--ape-line); border-radius: 8px; overflow: hidden;
  opacity: .7; transition: all var(--ape-t-fast) var(--ape-ease);
}
.ape-gallery__thumb.is-active { border-color: var(--ape-ink); opacity: 1; }
.ape-gallery__thumb img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.ape-gallery__zoom-btn {
  position: absolute; right: var(--ape-s3); top: var(--ape-s3);
  width: 40px; height: 40px; border-radius: 50%;
  background: rgb(255 255 255 / 90%); box-shadow: var(--ape-shadow-1);
  display: grid; place-items: center; color: var(--ape-ink-soft);
}
.ape-gallery__zoom { border: 0; padding: 0; background: transparent; max-width: 96vw; max-height: 96vh; }
.ape-gallery__zoom::backdrop { background: rgb(13 17 23 / 80%); }
.ape-gallery__zoom img { max-width: 96vw; max-height: 92vh; object-fit: contain; border-radius: var(--ape-r-card); background: #fff; }
.ape-gallery__zoom-close {
  position: fixed; top: 12px; right: 12px; width: 44px; height: 44px; border-radius: 50%;
  background: rgb(255 255 255 / 95%); display: grid; place-items: center; z-index: 2;
}
.ape-gallery__placeholder {
  aspect-ratio: 1; display: grid; place-items: center;
  background: var(--ape-surface-2); border-radius: var(--ape-r-card); color: var(--ape-ink-mute);
}
@media (min-width: 1024px) {
  .ape-gallery__dots { display: none; }
  .ape-gallery__thumbs { display: flex; }
}
/* Badge sconto WC (sale flash) riposizionato sul media */
.ape-product__media { position: relative; }
.ape-product__media .onsale {
  position: absolute; top: var(--ape-s3); left: var(--ape-s3); z-index: 2;
  background: var(--ape-accent); color: var(--ape-on-accent); font-size: 12px; font-weight: 700;
  padding: 4px 10px; border-radius: 8px; min-height: 0; line-height: 1.4;
}

/* Zoom su HOVER (desktop): il punto sotto il cursore si ingrandisce (2026-07-14) */
@media (hover: hover) and (min-width: 1024px) {
  .ape-gallery__slide--zoomable { cursor: zoom-in; overflow: hidden; }
  .ape-gallery__slide--zoomable img { transition: transform .1s ease-out; will-change: transform; }
}
