/*
 * MediShop — cls-fixes.css v36.1
 * Reduces Cumulative Layout Shift site-wide.
 */

/* Reserve space for fixed header stack */
#ms-trust-bar {
    min-height: 34px;
}

#ms-topbar {
    min-height: 36px;
}

#ms-header {
    min-height: 64px;
}

#ms-header-inner {
    min-height: 56px;
}

@media (min-width: 768px) {
    #ms-header {
        min-height: 72px;
    }
}

/* Hero slider — stable height before images load */
.ms-slider-wrap,
.ms-slider {
    min-height: 200px;
}

.ms-slide {
    min-height: 200px;
}

@media (min-width: 768px) {
    .ms-slider-wrap,
    .ms-slider,
    .ms-slide {
        min-height: 280px;
    }
}

.ms-slide-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 5 / 2;
}

/* Product card images — aspect ratio box */
.ms-product-card .pc-image {
    aspect-ratio: 4 / 3;
    min-height: 130px;
    overflow: hidden;
    background: #f3f4f6;
}

.ms-product-card .pc-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Cart badge — reserved space */
.ms-cart-count,
#ms-cart-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    min-height: 20px;
    line-height: 1;
}

/* Search dropdown — overlay, no document push */
#ms-search {
    position: relative;
}

#ms-search-results {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 9999;
}

/* Product tabs — reserve minimum area to reduce tab-switch shift */
.ms-single-tabs-wrap {
    min-height: 320px;
}

.ms-single-tabs-wrap .woocommerce-tabs ul.tabs {
    min-height: 44px;
}

.ms-single-tabs-wrap .woocommerce-tabs .panel.active {
    min-height: 240px;
}

/* Font loading — reduce reflow */
body {
    font-size-adjust: 0.52;
}

/* Woo gallery main image */
.woocommerce-product-gallery__image img,
.ms-single-gallery img {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    object-fit: contain;
    background: #fafafa;
}

/* Demand / front-page cards */
.ms-demand-section .pc-image img,
.ms-recent-orders-section .pc-image img {
    width: 100%;
    height: 130px;
    object-fit: contain;
    background: #f8f8f8;
}