/* Frame gambar produk. Nilainya diatur dari editor produk (Media > Frame Gambar)
   dan disimpan pada theme, sehingga halaman publik dan pratinjau editor sama. */
.detail [data-product-part="media"][data-frame],
#canvas [data-product-part="media"][data-frame]{
  position:relative;
  padding:var(--product-frame-padding,12px);
  border:var(--product-frame-width,1px) solid var(--product-frame-color,#bb8b32);
  border-radius:var(--product-frame-radius,4px);
  background:linear-gradient(145deg,#2a2b2d,#111214);
  box-shadow:none;
}
.detail [data-product-part="media"][data-frame="lineShadow"],
#canvas [data-product-part="media"][data-frame="lineShadow"]{
  box-shadow:0 18px 45px #00000075,0 0 0 4px #18191b,0 0 0 5px color-mix(in srgb,var(--product-frame-color,#bb8b32) 55%,#0d0d0d);
}
.detail [data-product-part="media"][data-frame="shadow"],
#canvas [data-product-part="media"][data-frame="shadow"]{
  border-color:transparent;
  box-shadow:0 18px 45px #00000075;
}
.detail [data-product-part="media"][data-frame="none"],
#canvas [data-product-part="media"][data-frame="none"]{
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
}
@media(max-width:600px){
  .detail [data-product-part="media"][data-frame="lineShadow"],
  #canvas [data-product-part="media"][data-frame="lineShadow"]{
    box-shadow:0 10px 28px #00000075,0 0 0 3px #18191b,0 0 0 4px color-mix(in srgb,var(--product-frame-color,#bb8b32) 55%,#0d0d0d);
  }
}

/* Sudut gambar produk: gambar utama, gambar kecil galeri, dan gambar kartu
   produk mengikuti satu pengaturan global. */
.detail [data-product-part="media"] .main-image,
#canvas [data-product-part="media"] .main-image{border-radius:var(--product-image-radius,0)}
.detail [data-product-part="media"] .gallery button,
.detail [data-product-part="media"] .gallery img,
#canvas [data-product-part="media"] .gallery button,
#canvas [data-product-part="media"] .gallery img{border-radius:var(--product-thumb-radius,0);overflow:hidden}
.product-page .product-related img,
.product-page .product-grid img,
#canvas .product-related img{border-radius:var(--product-image-radius,0)}