/* Square product gallery; keep these rules separate from the fullscreen viewer. */
body.swv-product .cms-element-image-gallery .gallery-slider-item.is-cover,
body.swv-product .cms-element-image-gallery .gallery-slider-item.is-contain,
body.swv-product .cms-element-image-gallery .gallery-slider-single-image {
    min-height: 0 !important;
    width: 100%;
    max-width: 675px;
    aspect-ratio: 1;
    height: auto;
    padding: 0;
    margin-inline: auto;
}

body.swv-product .cms-element-image-gallery .gallery-slider-item.is-cover .gallery-slider-image,
body.swv-product .cms-element-image-gallery .gallery-slider-item.is-contain .gallery-slider-image,
body.swv-product .cms-element-image-gallery .gallery-slider-single-image .gallery-slider-image {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-height: 100%;
    margin: auto;
    object-fit: contain;
}

body.swv-product .cms-element-image-gallery .gallery-slider-container {
    height: auto;
}

/* Limit the visible gallery, not tiny-slider's multi-slide track. */
body.swv-product .cms-element-image-gallery .gallery-slider {
    max-width: 675px;
    margin-inline: auto;
}

body.swv-product .cms-element-image-gallery .base-slider-dots {
    position: static;
    width: 100%;
    transform: none;
    text-align: center;
    margin: 12px 0 0;
    padding: 0;
}

/* Start at a full-image view. Shopware's transform still provides zoom and pan. */
body.swv-product .zoom-modal .gallery-slider {
    top: 64px;
    bottom: 100px;
}
body.swv-product .zoom-modal.no-thumbnails .gallery-slider {
    bottom: 16px;
}
body.swv-product .zoom-modal .gallery-slider-item {
    min-height: 0 !important;
    height: 100%;
}
body.swv-product .zoom-modal .image-zoom-container {
    padding: 0 16px;
}
body.swv-product .zoom-modal .gallery-slider-image {
    position: relative;
    inset: auto;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    margin: auto;
}
@media (max-width: 767.98px) {
    body.swv-product .zoom-modal .gallery-slider {
        bottom: 16px;
    }
}
