/* Premium multi-photo preview for product cards.
   Desktop: hover across the image to preview the carousel.
   Touch: keep the existing swipe/arrow carousel behavior.
   Detail galleries remain unchanged. */
#products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count="1"] .shoe-gallery-prev,
#products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count="1"] .shoe-gallery-next,
#products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count="1"] .shoe-gallery-dots,
#products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count="1"] .shoe-gallery-count{display:none!important}

@media (hover:hover) and (pointer:fine){
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-prev,
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-next,
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-dots{
    opacity:0;
    transition:opacity .18s ease;
  }
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]):hover .shoe-gallery-prev,
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]):hover .shoe-gallery-next,
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]):hover .shoe-gallery-dots{
    opacity:1;
  }
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-count{
    opacity:0;
    transition:opacity .18s ease;
  }
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]):hover .shoe-gallery-count{
    opacity:1;
  }
}

@media (prefers-reduced-motion:reduce){
  #products .shoe-gallery:not(.shoe-gallery-detail) .shoe-gallery-prev,
  #products .shoe-gallery:not(.shoe-gallery-detail) .shoe-gallery-next,
  #products .shoe-gallery:not(.shoe-gallery-detail) .shoe-gallery-dots,
  #products .shoe-gallery:not(.shoe-gallery-detail) .shoe-gallery-count{transition:none!important}
}

/* Clean touch-card presentation: swipe first, minimal chrome. */
@media (hover:none), (pointer:coarse){
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-prev,
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-next,
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-count{
    display:none!important;
  }
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-dots{
    opacity:.72;
    pointer-events:none;
  }
}

/* Phone/tablet hard rule: product-card arrows are never shown on touch-sized layouts.
   Swipe remains the navigation method; this also overrides older global arrow CSS. */
@media (max-width: 760px), (hover:none) and (pointer:coarse){
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-prev,
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-next{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
}

/* Keep product-card navigation quiet until the card is actually being explored. */
@media (hover:hover) and (pointer:fine){
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-prev,
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]) .shoe-gallery-next{
    pointer-events:none;
  }
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]):hover .shoe-gallery-prev,
  #products .shoe-gallery:not(.shoe-gallery-detail)[data-photo-count]:not([data-photo-count="1"]):hover .shoe-gallery-next{
    pointer-events:auto;
  }
}

/* v186: touch product cards never create/show navigation arrows. */
@media (hover:none), (pointer:coarse), (max-width:760px){#products .shoe-gallery:not(.shoe-gallery-detail) .shoe-gallery-prev,#products .shoe-gallery:not(.shoe-gallery-detail) .shoe-gallery-next{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}}
