/* Only the shortcode's inner content is sized; the Showit frame stays intact. */
.swth-native-gallery-shortcode {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-height: 100%;
    overflow: hidden;
}

.swth-native-gallery-shortcode > .product {
    margin: 0;
}

.swth-native-gallery-shortcode.woocommerce > .product > .woocommerce-product-gallery.images {
    float: none;
    width: 100%;
    margin: 0;
}

/* WooCommerce draws the zoom icon with pseudo-elements. Keep its magnifier
 * visibly lighter without changing the trigger's size or position. */
body.swth-style-layer .woocommerce-product-gallery__trigger::before {
    border-width: 1px !important;
}

body.swth-style-layer .woocommerce-product-gallery__trigger::after {
    border-top-width: 1px !important;
}

/* WooCommerce writes every slide into the document before Flexslider changes
 * the gallery into a carousel. Keep the pre-init slides out of the document
 * flow so their short-lived height cannot flash a browser scrollbar. */
body.single-product.swth-native-gallery-enabled .woocommerce-product-gallery:not(:has(.flex-viewport)) {
    overflow: hidden;
    transition: opacity .12s ease-out !important;
}

body.single-product.swth-native-gallery-enabled .woocommerce-product-gallery:not(:has(.flex-viewport)) .woocommerce-product-gallery__wrapper {
    position: relative;
    overflow: hidden;
}

body.single-product.swth-native-gallery-enabled .woocommerce-product-gallery:not(:has(.flex-viewport)) .woocommerce-product-gallery__image:not(:first-child) {
    position: absolute;
    inset: 0;
    visibility: hidden;
    pointer-events: none;
}