/* Cross-document snapshots preserve normal WooCommerce document navigation. */
@view-transition { navigation: auto; }
/* The named photograph is drawn in the transition layer, so its stage must
   not expose the separate blurred loading preview underneath. */
html[data-rcs-product-motion="native"] body.single-product .rcp-gal .rcp-stage { background-image: none !important; }
html[data-rcs-product-motion="native"] .rcs-main { view-transition-name: none !important; }
html[data-rcs-product-motion="native"]::view-transition-group(rcs-product-photo) {
  animation-duration: 360ms !important;
  animation-timing-function: cubic-bezier(.22,1,.36,1) !important;
  overflow: hidden;
  border-radius: 10px;
  z-index: 2;
}
html[data-rcs-product-motion="native"]::view-transition-old(rcs-product-photo),
html[data-rcs-product-motion="native"]::view-transition-new(rcs-product-photo) {
  width: 100%; height: 100%; object-fit: cover;
  animation-duration: 360ms !important;
  animation-timing-function: cubic-bezier(.22,1,.36,1) !important;
  mix-blend-mode: normal;
}
html[data-rcs-product-motion="native"]::view-transition-old(root) {
  animation: rcsProductOut 220ms ease-out both !important;
}
html[data-rcs-product-motion="native"]::view-transition-new(root) {
  animation: rcsProductIn 300ms cubic-bezier(.22,1,.36,1) both !important;
}
html[data-rcs-product-motion="leave"] #rcs-main {
  animation: rcsProductLeave 110ms ease-out both !important;
  transition: none !important;
}
html[data-rcs-product-motion="enter"] #rcs-main {
  animation: rcsProductIn 280ms cubic-bezier(.22,1,.36,1) both !important;
  transition: none !important;
}
@keyframes rcsProductOut { to { opacity: 0; transform: translateY(-4px); } }
@keyframes rcsProductIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes rcsProductLeave { to { opacity: .86; transform: translateY(-4px); } }
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  html[data-rcs-product-motion] #rcs-main { animation: none !important; transform: none !important; opacity: 1 !important; }
}
