/* ==== HSA Responsive Enhancements (Archive) ==== */

/* ---------- Grid: auto-fill + variable min width ---------- */
#hsa-grid { --hsa-card-min: 220px; }
.hsa--sidebar-collapsed #hsa-grid { --hsa-card-min: 240px; }

/* Breakpoints برای حداقل عرض کارت‌ها */
@media (max-width: 1280px) { #hsa-grid { --hsa-card-min: 220px; } }
@media (max-width: 992px)  { #hsa-grid { --hsa-card-min: 180px; } }
@media (max-width: 680px)  { #hsa-grid { --hsa-card-min: 160px; } }
@media (max-width: 480px)  { #hsa-grid { --hsa-card-min: 150px; } }

/* گرید محصولات */
.facetwp-template.hsa-products,
.hsa-products.facetwp-template{
    grid-template-columns: repeat(auto-fill, minmax(var(--hsa-card-min), 1fr)) !important;
}

/* اسکلت‌ها هم‌راستا با گرید محصولات */
.hsa-skeletons{
    grid-template-columns: repeat(auto-fill, minmax(var(--hsa-card-min), 1fr)) !important;
}

/* ---------- Product Card: موبایل فرندلی ---------- */
.product-card{
    min-height: auto !important;
    padding: 12px;
}
.product-image-gallery{
    height: auto !important;
    aspect-ratio: 1 / 1;            /* نسبت 1:1 شبیه اپ‌ها */
    width: 100%;
    display: block;
    position: relative;
}
.product-image-gallery .product-image,
.product-image{
    width: 100%; height: 100%;
    object-fit: contain;
}
.product-title a{
    font-size: clamp(13px, 2.6vw, 15px);
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.product-tags-container{ row-gap: 6px; }
.product-tags-container a{ font-size: 12px; }

/* قیمت و دکمه‌ها */
.price{ font-size: clamp(13px, 2.5vw, 15px); }
.product-card .btn,
.product-card .hsa-btn{
    min-height: 34px; padding: 8px 12px; border-radius: 8px;
}

/* ---------- Toolbar & Chips ---------- */
@media (max-width: 768px){
    .hsa-sort-bar__label{ display: none; }
    .hsa-sort-bar__nav ul{
        display: flex; gap: 8px;
        overflow-x: auto; white-space: nowrap; padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }
    .hsa-sort-bar__nav ul::-webkit-scrollbar{ display: none; }
    #hsa-active-filters{
        display:flex; gap:8px; overflow-x:auto; padding:6px 0;
        -webkit-overflow-scrolling: touch;
    }
    #hsa-active-filters::-webkit-scrollbar{ display:none; }
}

/* ---------- Sidebar as Mobile Flyout ---------- */
@media (max-width: 992px){
    .hsa-layout{ grid-template-columns: 1fr !important; }

    /* اورلی */
    .hsa-overlay{
        position: fixed; inset: 0;
        background: rgba(0,0,0,.35);
        opacity: 0; visibility: hidden;
        transition: opacity .2s ease;
        z-index: 10000;
    }
    .hsa--mobile-filters-open .hsa-overlay{
        opacity: 1; visibility: visible;
    }

    /* پنل فیلتر */
    #hsa-sidebar{
        position: fixed; top: 0; bottom: 0; right: 0; /* RTL */
        width: min(92vw, 380px);
        max-width: 92vw;
        background: #fff;
        border-left: 1px solid #eef0f3;
        transform: translateX(100%);
        transition: transform .25s ease;
        z-index: 10001;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        padding: 16px;
        box-shadow: -2px 0 20px rgba(0,0,0,.08);
    }
    .hsa--mobile-filters-open #hsa-sidebar{
        transform: translateX(0);
    }
}

/* ---------- Swiper nav on small screens ---------- */
@media (max-width: 640px){
    #hsa-archive .hsa-swiper-button-prev,
    #hsa-archive .hsa-swiper-button-next { display:none !important; }
}

