/**
 * Ferozzi PLP Hot-Fix Stylesheet (v2)
 *
 * Layered ON TOP of plp.css to fix four production bugs:
 *
 *  1. Sidebar sticky filtreleri scroll'u takip etmiyor (sol alan boş)
 *  2. İlk satırda 4 yerine 3 ürün (sessionStorage'da kalmış comfortable)
 *  3. Sticky toolbar reflow loop -> sayfa kilitlenmesi
 *  4. Wishlist (kalp) ikonu kaldırılması
 *
 * @package Ferozzi
 * @since   2.1.0
 */

/* ─── 1. Sticky filters: stretch column + sticky inner panel ───────── */
body.woocommerce-shop,
body.tax-product_cat {
    overflow-x: clip;
}

html:has(body.woocommerce-shop),
html:has(body.tax-product_cat) {
    overflow-x: clip;
}

body.woocommerce-shop .fz-main.fz-plp,
body.tax-product_cat .fz-main.fz-plp {
    overflow: visible !important;
    overflow-x: visible !important;
}

@media (min-width: 1025px) {
    .fz-plp {
        --fz-plp-sticky-top: calc(var(--fz-header-h, 72px) + var(--fz-nav-h, 48px) + 20px);
        --fz-plp-sticky-bottom: 28px;
        --fz-plp-sidebar-max-h: calc(100vh - var(--fz-plp-sticky-top) - var(--fz-plp-sticky-bottom));
    }

    .fz-plp-layout {
        align-items: stretch !important;
        overflow: visible !important;
        position: relative !important;
    }

    #fz-sidebar.fz-plp-layout__sidebar {
        position: relative !important;
        align-self: stretch !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        z-index: 50;
    }

    #fz-sidebar .fz-filters,
    #fz-filter-panel.fz-filters {
        max-height: var(--fz-plp-sidebar-max-h) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        border-radius: 12px !important;
    }

    body.fz-plp-has-sticky-filters #fz-filter-panel.fz-filters:not(.fz-filters--pinned):not(.fz-filters--pinned-end) {
        position: relative !important;
        top: auto !important;
    }

    #fz-filter-panel.fz-filters--pinned {
        position: fixed !important;
        z-index: 40 !important;
        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1) !important;
    }

    .fz-plp-layout {
        padding-left: clamp(12px, 1.5vw, 24px) !important;
        padding-right: clamp(20px, 3vw, 48px) !important;
    }
}

.fz-plp-layout__main,
#fz-plp-main,
.fz-product-grid {
    overflow: visible !important;
    min-height: 0 !important;
}

/* ─── 2. Grid columns: 4-col grid / 3-col comfortable ─────────────── */
@media (min-width: 1025px) {
    .fz-plp .fz-product-grid:not(.fz-product-grid--comfortable) {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    .fz-plp .fz-product-grid.fz-product-grid--comfortable {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .fz-plp .fz-product-grid,
    .fz-plp .fz-product-grid--comfortable {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767px) {
    .fz-plp .fz-product-grid,
    .fz-plp .fz-product-grid--comfortable {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* ─── 3. Pure-CSS sticky toolbar (no JS placeholder dependency) ───── */
.fz-plp .fz-toolbar {
    position: sticky !important;
    top: 60px !important;
    background: #fff !important;
    z-index: 90;
    transition: box-shadow 200ms ease-out;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Hide the JS-created placeholder so it doesn't take up space */
.fz-toolbar__placeholder {
    display: none !important;
    height: 0 !important;
    visibility: hidden !important;
}

/* When toolbar is added 'sticky' class by old JS, normalize it */
.fz-plp .fz-toolbar.fz-toolbar--sticky {
    position: sticky !important;
    top: 60px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    border-bottom: 1px solid var(--fz-border, #e8e4df);
    /* Force inline `top` from old JS to be ignored */
}

/* ─── 4. Wishlist (kalp) ikonunu kaldır ─────────────────────────────── */
.fz-product-card__wishlist,
.fz-product-card__wishlist--decorative {
    display: none !important;
}

/* ─── 5. Defensive: scroll asla kilitlenmesin ──────────────────────── */
html {
    overflow-y: auto !important;
}

body:not(.fz-modal-active):not(.admin-bar-disabled-scroll):not(.fz-filters-overlay-active):not(.fz-sort-overlay-active) {
    overflow-y: auto !important;
}

@media (min-width: 1025px) {
    body.fz-filters-overlay-active {
        overflow: auto !important;
    }
}

/* Mobile filter/sort overlays */
@media (max-width: 1024px) {
    body.fz-filters-overlay-active,
    body.fz-sort-overlay-active {
        overflow: hidden !important;
        touch-action: none;
    }

    .fz-plp .fz-toolbar {
        z-index: 50 !important;
    }

    body.fz-filters-overlay-active #fz-toolbar,
    body.fz-filters-overlay-active .fz-toolbar,
    body.fz-filters-overlay-active .fz-mobile-fab,
    body.fz-sort-overlay-active #fz-toolbar,
    body.fz-sort-overlay-active .fz-toolbar,
    body.fz-sort-overlay-active .fz-mobile-fab {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    #fz-filters-backdrop.fz-filters__backdrop--visible,
    .fz-filters__backdrop.fz-filters__backdrop--visible {
        position: fixed !important;
        inset: 0 !important;
        z-index: 1980 !important;
        background: rgba(0, 0, 0, 0.55) !important;
        opacity: 1 !important;
    }

    #fz-filter-panel.fz-filters--open,
    body > #fz-filter-panel.fz-filters--open,
    .fz-filters.fz-filters--open {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: min(100vw, 400px) !important;
        max-width: 100vw !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        z-index: 1990 !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        background: #fff !important;
        isolation: isolate;
        box-shadow: 4px 0 32px rgba(0, 0, 0, 0.2) !important;
        transform: translateX(0) !important;
    }

    body.fz-filters-overlay-active #fz-filter-panel .fz-filters__body {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        padding: 8px 24px 16px !important;
        background: #fff !important;
    }

    body.fz-filters-overlay-active #fz-filter-panel .fz-filters__header,
    body.fz-filters-overlay-active #fz-filter-panel .fz-filters__footer {
        background: #fff !important;
        flex-shrink: 0 !important;
    }

    body.fz-filters-overlay-active #fz-filter-panel .fz-filters__header {
        padding-top: max(20px, env(safe-area-inset-top, 0px)) !important;
    }

    .fz-sort-overlay:not([hidden]) {
        z-index: 2010 !important;
    }
}

/* ─── 6. Pagination kontrol noktaları her zaman görünür ───────────── */
.fz-pagination {
    display: block !important;
}

#fz-load-more {
    /* If JS hides Load More incorrectly, this brings it back. */
    /* Note: actual hidden=true attribute still wins; JS hot-fix handles that. */
}

#fz-load-more[hidden] {
    /* Browser default: hidden attribute wins. JS hot-fix overrides this. */
}

#fz-pagination-end:not([hidden]) ~ #fz-load-more,
#fz-pagination[data-current][data-pages] #fz-load-more {
    display: inline-flex !important;
}