/*
BELARA — ABAYAS V6 FINAL UX
Visual cleanup based on live desktop QA.
*/

body.belara-abayas-archive {
    --abaya-v6-ink:#2c1d19;
    --abaya-v6-muted:#78655d;
    --abaya-v6-line:rgba(58,34,27,.12);
    --abaya-v6-soft:#fbf7f3;
}

/* 1) Compact the oversized native category title block. */
.belara-abayas-archive .page-title,
.belara-abayas-archive .wd-page-title,
.belara-abayas-archive .shop-page-title,
.belara-abayas-archive .page-title-default,
.belara-abayas-archive .title-size-default {
    min-height: 0 !important;
    margin-bottom: 18px !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.belara-abayas-archive .page-title h1,
.belara-abayas-archive .wd-page-title h1,
.belara-abayas-archive .shop-page-title h1 {
    margin: 0 !important;
    font-size: clamp(25px,2.2vw,34px) !important;
    line-height: 1.4 !important;
}

/* 2) Make the V5 collection intro lighter and shorter. */
.belara-abayas-archive .belara-abayas-intro {
    margin-top: 0 !important;
    margin-bottom: 24px !important;
    padding: 21px 24px !important;
    border-radius: 18px !important;
}

.belara-abayas-archive .belara-abayas-intro h2 {
    margin-bottom: 7px !important;
    font-size: clamp(20px,2vw,28px) !important;
}

.belara-abayas-archive .belara-abayas-intro p {
    max-width: 820px !important;
    font-size: 12.5px !important;
    line-height: 1.8 !important;
}

.belara-abayas-archive .belara-abayas-intro__facts {
    margin-top: 12px !important;
}

/* 3) Hide sorting/result-count UI: collection is curated and all prices are identical. */
.belara-abayas-archive .woocommerce-ordering,
.belara-abayas-archive .woocommerce-result-count,
.belara-abayas-archive .wd-products-per-page,
.belara-abayas-archive .wd-products-shop-view,
.belara-abayas-archive .wd-show-sidebar-btn {
    display:none !important;
}

.belara-abayas-archive .belara-v6-hide-filter {
    display:none !important;
}

/* Avoid empty loop-head bars after hiding their contents. */
.belara-abayas-archive .shop-loop-head:empty,
.belara-abayas-archive .wd-shop-tools:empty {
    display:none !important;
}

/* 4) Product grid/card rhythm. */
.belara-abayas-archive .products {
    row-gap: 28px !important;
}

.belara-abayas-archive .product-wrapper,
.belara-abayas-archive .wd-product .product-wrapper {
    height: 100%;
    border-radius: 17px;
}

.belara-abayas-archive .product-element-bottom,
.belara-abayas-archive .wd-product .product-element-bottom {
    padding: 14px 16px 16px !important;
}

.belara-abayas-archive .wd-entities-title,
.belara-abayas-archive .woocommerce-loop-product__title,
.belara-abayas-archive .product-title {
    min-height: 0 !important;
    margin: 0 0 5px !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

.belara-abayas-archive .price {
    min-height: 0 !important;
    margin: 0 0 11px !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
}

/* 5) Keep color choices visible, but simplify the size line. */
.belara-abayas-archive .belara-abaya-card-meta {
    min-height: 42px !important;
    margin-top: 6px !important;
}

.belara-abayas-archive .belara-abaya-card-sizes {
    font-size:0 !important;
    margin-top:5px !important;
}

.belara-abayas-archive .belara-abaya-card-sizes::after {
    content:"المقاسات 52–60";
    color:var(--abaya-v6-muted);
    font-size:10px;
    line-height:1.4;
    font-weight:500;
}

.belara-abayas-archive .belara-abaya-color-count {
    font-size:10px !important;
}

/* 6) Conversion-oriented button with less dead space. */
.belara-abayas-archive .wd-add-btn,
.belara-abayas-archive .add-to-cart-loop,
.belara-abayas-archive .button.product_type_variable,
.belara-abayas-archive a.button {
    min-height: 44px !important;
    margin-top: 10px !important;
    border-radius: 9px !important;
    font-family: Almarai,sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

/* Keep card image geometry consistent. */
.belara-abayas-archive .product-element-top,
.belara-abayas-archive .product-image-link {
    aspect-ratio: 4 / 5;
    border-radius: 15px 15px 0 0 !important;
}

.belara-abayas-archive .product-element-top img,
.belara-abayas-archive .product-image-link img {
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center top !important;
}

/* Mobile tightening */
@media (max-width:767px) {
    .belara-abayas-archive .page-title,
    .belara-abayas-archive .wd-page-title,
    .belara-abayas-archive .shop-page-title {
        margin-bottom:12px !important;
        padding-top:14px !important;
        padding-bottom:14px !important;
    }

    .belara-abayas-archive .belara-abayas-intro {
        margin:0 8px 18px !important;
        padding:17px 13px !important;
    }

    .belara-abayas-archive .belara-abayas-intro__eyebrow {
        font-size:9px !important;
    }

    .belara-abayas-archive .belara-abayas-intro h2 {
        font-size:18px !important;
        line-height:1.55 !important;
    }

    .belara-abayas-archive .belara-abayas-intro p {
        font-size:11px !important;
    }

    .belara-abayas-archive .belara-abayas-intro__facts span {
        font-size:9px !important;
        padding:5px 8px !important;
    }

    .belara-abayas-archive .product-element-bottom,
    .belara-abayas-archive .wd-product .product-element-bottom {
        padding:11px 10px 12px !important;
    }

    .belara-abayas-archive .wd-entities-title,
    .belara-abayas-archive .woocommerce-loop-product__title,
    .belara-abayas-archive .product-title {
        font-size:12px !important;
    }

    .belara-abayas-archive .price {
        font-size:13px !important;
        margin-bottom:8px !important;
    }

    .belara-abayas-archive .belara-abaya-color-dot {
        width:13px !important;
        height:13px !important;
        flex-basis:13px !important;
    }

    .belara-abayas-archive .belara-abaya-card-sizes::after,
    .belara-abayas-archive .belara-abaya-color-count {
        font-size:8.5px !important;
    }

    .belara-abayas-archive .wd-add-btn,
    .belara-abayas-archive .add-to-cart-loop,
    .belara-abayas-archive .button.product_type_variable,
    .belara-abayas-archive a.button {
        min-height:41px !important;
        font-size:11px !important;
    }
}
