/* Optional product-art treatments. The uploaded artwork is never modified. */
body[data-product-image-theme="1"] #productGrid .product-visual::before,
body[data-product-image-theme="2"] #productGrid .product-visual::before,
body[data-product-image-theme="3"] #productGrid .product-visual::before{
  content:"";
  position:absolute;
  inset:6px;
  z-index:4;
  border:1px solid transparent;
  border-radius:10px;
  pointer-events:none;
}

body[data-product-image-theme="1"] #productGrid .product-visual::before{
  border-color:rgba(255,166,91,.75);
  box-shadow:inset 0 0 22px rgba(249,92,35,.16),0 0 14px rgba(249,92,35,.13);
}
body[data-product-image-theme="1"] #productGrid .product-image-effect{
  inset:-8% -4%;
  transform:none;
  opacity:.45;
  background-image:radial-gradient(ellipse at 8% 92%,rgba(249,78,35,.34),transparent 54%),radial-gradient(ellipse at 92% 4%,rgba(255,181,69,.18),transparent 48%),repeating-linear-gradient(126deg,transparent 0 34px,rgba(255,134,73,.22) 35px,transparent 37px 66px);
  background-size:auto,auto,130px 130px;
}
body[data-product-image-theme="1"] #productGrid .product-img{filter:saturate(1.14) contrast(1.045)!important}

body[data-product-image-theme="2"] #productGrid .product-visual::before{
  border-color:rgba(94,234,212,.68);
  box-shadow:inset 0 0 24px rgba(20,184,166,.14),0 0 15px rgba(34,211,238,.14);
}
body[data-product-image-theme="2"] #productGrid .product-image-effect{
  inset:-5% -3%;
  transform:none;
  opacity:.39;
  background-image:radial-gradient(ellipse at 2% 90%,rgba(20,184,166,.32),transparent 56%),radial-gradient(ellipse at 95% 8%,rgba(56,189,248,.25),transparent 52%),linear-gradient(122deg,transparent 35%,rgba(167,243,208,.18) 48%,transparent 59%);
  background-size:auto,auto,210% 100%;
}
body[data-product-image-theme="2"] #productGrid .product-img{filter:saturate(1.12) contrast(1.04)!important}

body[data-product-image-theme="3"] #productGrid .product-visual::before{
  inset:5px;
  border-radius:5px;
  border-color:rgba(250,204,21,.72);
  box-shadow:inset 0 0 18px rgba(34,211,238,.12),0 0 13px rgba(250,204,21,.12);
}
body[data-product-image-theme="3"] #productGrid .product-image-effect{
  inset:0;
  transform:none;
  opacity:.34;
  background-image:linear-gradient(180deg,transparent 41%,rgba(250,204,21,.36) 49%,rgba(34,211,238,.2) 52%,transparent 60%),repeating-linear-gradient(90deg,transparent 0 23px,rgba(34,211,238,.16) 24px,transparent 25px 47px),linear-gradient(135deg,transparent 35%,rgba(255,255,255,.10) 49%,transparent 56%);
  background-size:100% 100%,auto 100%,220% 100%;
}
body[data-product-image-theme="3"] #productGrid .product-img{filter:saturate(1.13) contrast(1.06)!important}

html[data-store-motion="on"] body[data-product-image-theme="1"] #productGrid .product-image-effect{animation:productFinishEmber 7s linear infinite!important}
html[data-store-motion="on"] body[data-product-image-theme="2"] #productGrid .product-image-effect{animation:productFinishAurora 8s ease-in-out infinite!important}
html[data-store-motion="on"] body[data-product-image-theme="3"] #productGrid .product-image-effect{animation:productFinishScan 5.5s linear infinite!important}

@keyframes productFinishEmber{from{background-position:0 0,100% 0,0 0}to{background-position:0 0,0 100%,130px 130px}}
@keyframes productFinishAurora{0%,100%{background-position:0 0,100% 0,100% 0}50%{background-position:0 0,0 100%,0 0}}
@keyframes productFinishScan{from{background-position:0 0,0 0,100% 0}to{background-position:0 0,0 0,-120% 0}}

html[data-store-motion="off"] body[data-product-image-theme] #productGrid .product-image-effect,
html[data-store-performance="lite"] body[data-product-image-theme] #productGrid .product-image-effect{animation:none!important}
@media(prefers-reduced-motion:reduce){
  html body[data-product-image-theme] #productGrid .product-image-effect{animation:none!important}
}

@media(max-width:640px){
  body[data-product-image-theme="1"] #productGrid .product-visual::before,
  body[data-product-image-theme="2"] #productGrid .product-visual::before{inset:4px}
  body[data-product-image-theme="3"] #productGrid .product-visual::before{inset:4px}
}