/* Shared product-photo base and live print layer for every mug preview. */
.modal-preview { overflow: visible; }

.mug-render {
  position: relative;
  width: min(100%, 390px);
  aspect-ratio: 1;
  isolation: isolate;
}

.mug-model {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}

.mug.big.mug-print {
  position: absolute;
  z-index: 1;
  top: 16%;
  left: 10%;
  width: 61%;
  height: 69%;
  display: grid;
  place-items: center;
  padding: 5px 12px;
  overflow: hidden;
  border: 0;
  border-radius: 5px 5px 10px 10px;
  background: transparent !important;
  box-shadow: none;
  clip-path: polygon(0 0, 100% 0, 96% 100%, 4% 100%);
  color: inherit;
  font-size: 12px;
  letter-spacing: .04em;
  text-align: center;
}

.mug.big.mug-print::before { content: none; }

.mug.big.mug-print::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  background: linear-gradient(90deg, rgba(40, 40, 40, .06), transparent 15%, rgba(255,255,255,.13) 58%, rgba(30,30,30,.08));
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.mug.big.mug-print img {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  mix-blend-mode: multiply;
  opacity: .92;
}

.mug.big.mug-print img[hidden] { display: none !important; }
.mug.big.mug-print span { position: relative; z-index: 3; max-width: 94%; }

@media (max-width: 860px) {
  .mug-render { width: min(100%, 340px); }
}