/* Shared storefront performance: reserve media boxes so CLS does not return. */
img {
    max-width: 100%;
}

img[width][height] {
    height: auto;
}

.theme-logo,
header img.theme-logo {
    width: auto;
    height: 3rem;
    max-width: 11rem;
    object-fit: contain;
    aspect-ratio: 15 / 4;
}

/* Diara home hero: matches h-50 / lg:h-90 (200px / 360px) */
#mainSlider .swiper-slide > a > div,
#mainSlider .theme-hero-frame {
    aspect-ratio: 1495 / 360;
    height: 12.5rem;
    width: 100%;
    overflow: hidden;
}

@media (min-width: 1024px) {
    #mainSlider .swiper-slide > a > div,
    #mainSlider .theme-hero-frame {
        height: 22.5rem;
    }
}

.mobile-banner-swiper .swiper-slide img,
#mobileBannerSwiper img {
    width: 100%;
    aspect-ratio: 459 / 200;
    object-fit: cover;
    height: auto;
}

/* Karin hero already has h-52 / md:h-96; keep images filling that box */
.header-slider img,
#karin-main-slider-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 16 / 7;
}

/* ShopTemplate desktop / mobile sliders */
#main-slider .carousel-inner,
#main-slider-res .carousel-inner {
    min-height: 12.5rem;
}

#main-slider .lazy-image-wrapper {
    aspect-ratio: 3 / 1;
    min-height: 12.5rem;
}

#main-slider-res .lazy-image-wrapper {
    aspect-ratio: 459 / 200;
    min-height: 12.5rem;
}

/* Product thumbs: square slot before the file arrives */
.diara-product-card img,
.product-card img,
.amazing-products img,
.new-products-card-swiper img {
    aspect-ratio: 1 / 1;
    object-fit: contain;
}

/* FormBuilder screenshot carousel */
.fb-banner-carousel-wrap img,
.screen-carousel img {
    aspect-ratio: 390 / 844;
    width: 100%;
    height: auto;
    object-fit: cover;
}