body[data-product="CUSTOM ENAMEL PINS"] .placedDesign.pinDieCutArtwork,
body[data-product="CUSTOM ENAMEL PINS"] .approvalDesign.pinDieCutArtwork {
  isolation: isolate;
}

body[data-product="CUSTOM ENAMEL PINS"] .placedDesign.pinDieCutArtwork > img:not(.pinDieCutUnderlay),
body[data-product="CUSTOM ENAMEL PINS"] .approvalDesign.pinDieCutArtwork > img:not(.pinDieCutUnderlay) {
  position: relative;
  z-index: 2;
}

body[data-product="CUSTOM ENAMEL PINS"] .pinDieCutUnderlay,
body[data-product="CUSTOM ENAMEL PINS"] .pinSilverBack {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: calc(var(--pin-diecut-scale) * 100%) !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, -50%) !important;
  transform-origin: center !important;
}

body[data-product="CUSTOM ENAMEL PINS"] .pinDieCutUnderlay {
  z-index: 1;
  filter: drop-shadow(0 3px 4px rgba(0, 0, 0, .28));
}

body[data-product="CUSTOM ENAMEL PINS"] .approvalFace.backFace > .approvalDesign {
  display: none !important;
}

body[data-product="CUSTOM ENAMEL PINS"] .pinBackPreview {
  position: absolute;
  z-index: 4;
  transform: translate(-50%, -50%);
  transform-origin: center;
  pointer-events: none;
}

body[data-product="CUSTOM ENAMEL PINS"] .pinBackPreview .pinSilverBack {
  z-index: 1;
  transform: translate(-50%, -50%) scaleX(-1) !important;
  filter: drop-shadow(0 5px 8px rgba(0, 0, 0, .38));
}

body[data-product="CUSTOM ENAMEL PINS"] .pinBackPreview .pinBackClasp {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  display: block;
  width: 52%;
  height: 52%;
  object-fit: contain;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 6px 7px rgba(0, 0, 0, .42));
}

@media (max-width: 760px) {
  body[data-product="CUSTOM ENAMEL PINS"] .pinBackPreview .pinBackClasp {
    width: 58%;
    height: 58%;
  }
}
