
  

  
    .media-fit-contain {
      --product-media-fit: contain;
    }

    /* Media fit for all media elements */
    .media-fit-contain :is(img, video, iframe, .deferred-media__poster-image) {
      object-fit: contain;
      width: 100%;
      height: 100%;
    }

    /* 3D Models (no object-fit support, just sizing) */
    .media-fit-contain model-viewer {
      width: 100%;
      height: 100%;
    }
  

  

  /* Add background color so carousel arrows' mix-blend-mode works correctly even on transparent areas. */
  
    .media-fit-contain :is(img, .deferred-media__poster-image) {
      background-color: var(--color-background);
    }
  

  
  
  
    
    ::view-transition-old(gallery-item-open),
    ::view-transition-new(gallery-item-open),
    ::view-transition-old(gallery-item-close),
    ::view-transition-new(gallery-item-close) {
      height: auto;
      width: 100%;
      object-fit: contain;
      top: 50%;
      transform: translateY(-50%);
    }
  
  

  :root { --gallery-media-border-radius: 0px; }
