/* 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;
}

/* Reserve carousel height so skeleton → products does not inflate CLS */
#amazing-section .new-products-card-swiper,
#new-products-section .new-products-card-swiper,
#suggested-category-groups-section .new-products-card-swiper,
#best-selling-products-section .new-products-card-swiper,
section .new-products-card-swiper {
    min-height: 18.5rem;
}

#amazing-section .swiper-slide,
#new-products-section .swiper-slide,
section .new-products-card-swiper .swiper-slide {
    min-height: 17.5rem;
    height: auto;
}

#amazing-section,
#new-products-section {
    content-visibility: auto;
    contain-intrinsic-size: auto 22rem;
}

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

/* Accessibility: touch targets + muted text contrast */
.min-w-11 { min-width: 2.75rem; }
.min-h-11 { min-height: 2.75rem; }

.diara-mobile-bottom-nav__item,
.diara-home-cart-add-btn,
button.password-toggle,
#dark-mode-toggle,
#voiceSearchBtn,
#voiceSearchBtnMobile {
    min-width: 2.75rem;
    min-height: 2.75rem;
}

/* Improve low-contrast gray placeholders / muted UI text */
.placeholder-gray-400::placeholder,
input::placeholder {
    color: #6b7280;
}

.dark .placeholder-gray-500::placeholder,
.dark input::placeholder {
    color: #9ca3af;
}

.text-gray-400 {
    color: #6b7280;
}

.dark .text-gray-500 {
    color: #9ca3af;
}
