/**
 * Kategori ürün ızgarası — SON katman (list-view / eski LS / sınıf eksikleri için zorunlu grid)
 * body.orion-category-page — anasayfaya dokunmaz.
 */

/* Sarmalayıcılar: grid DEĞİL (tek çocuk ul yanlış hücreye sıkışmasın) */
body.orion-category-page #products-container,
body.orion-category-page #products-container #view-product-list,
body.orion-category-page #products-container .ocv2-product-host {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
}

/*
 * Ürün listesi: .list-view dahil — aynı kurallar (tek sıra = LS/list-view kaynaklıydı)
 */
body.orion-category-page #products-container .view-product-list ul.orion-category-product-grid,
body.orion-category-page #products-container .view-product-list ul.urunler,
body.orion-category-page #products-container .view-product-list ul.product-list,
body.orion-category-page #products-container .ocv2-product-host ul.orion-category-product-grid,
body.orion-category-page #products-container .ocv2-product-host ul.urunler,
body.orion-category-page #products-container .ocv2-product-host ul.product-list,
body.orion-category-page #products-container #view-product-list ul.orion-category-product-grid,
body.orion-category-page #products-container #view-product-list ul.urunler,
body.orion-category-page #products-container #view-product-list ul.product-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    float: none !important;
    clear: both !important;
    /* flex + negatif margin (eski tema) iptal */
    flex-wrap: unset !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

@media (min-width: 769px) and (max-width: 991px) {
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.orion-category-product-grid,
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.urunler,
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.product-list,
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul.orion-category-product-grid,
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul.urunler,
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul.product-list,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.orion-category-product-grid,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.urunler,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.product-list {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.orion-category-product-grid,
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.urunler,
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.product-list,
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul.orion-category-product-grid,
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul.urunler,
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul.product-list,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.orion-category-product-grid,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.urunler,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.product-list {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 14px !important;
    }
}

@media (min-width: 1200px) {
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.orion-category-product-grid,
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.urunler,
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.product-list,
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul.orion-category-product-grid,
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul.urunler,
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul.product-list,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.orion-category-product-grid,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.urunler,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.product-list {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }
}

body.orion-category-page #products-container ul.orion-category-product-grid > li.ps-product-item,
body.orion-category-page #products-container ul.urunler > li.ps-product-item,
body.orion-category-page #products-container ul.product-list > li.ps-product-item,
body.orion-category-page #products-container #view-product-list ul > li.ps-product-item {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    flex: initial !important;
    flex-basis: auto !important;
    float: none !important;
    box-sizing: border-box !important;
}

/* Desktop: kalp sağ üstte, hover'da görünür, kalp üstüne gelince kırmızı */
@media (min-width: 769px) and (hover: hover) {
    body.orion-category-page #products-container .product-container .left-block {
        position: relative !important;
        overflow: hidden !important;
    }

    /*
     * style.css .product-list li .buttons { width:100% } — tam genişlik + transform = kalp merkeze göre
     * küçülüp kısa süre SOL ÜSTTE görünüyormuş gibi sıçrar. Kutuyu içeriğe daralt + origin sağ üst.
     */
    body.orion-category-page #products-container .product-container .left-block .buttons {
        position: absolute !important;
        top: 14px !important;
        right: 8px !important;
        left: auto !important;
        bottom: auto !important;
        margin: 0 !important;
        width: max-content !important;
        min-width: 0 !important;
        max-width: none !important;
        text-align: left !important;
        z-index: 12 !important;
        opacity: 0 !important;
        transform: translateY(-4px) scale(0.96) !important;
        transform-origin: top right !important;
        transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease !important;
        pointer-events: none !important;
        visibility: hidden !important;
    }

    body.orion-category-page #products-container .product-container:hover .left-block .buttons,
    body.orion-category-page #products-container .product-container:focus-within .left-block .buttons {
        opacity: 1 !important;
        transform: translateY(0) scale(1) !important;
        transform-origin: top right !important;
        pointer-events: auto !important;
        visibility: visible !important;
    }

    /* Favoride: hover olmadan resim üzerinde sabit dolu kalp */
    body.orion-category-page #products-container .product-container .left-block .buttons:has(.addtowishlist.orion-wishlist--active) {
        opacity: 1 !important;
        transform: translateY(0) scale(1) !important;
        transform-origin: top right !important;
        pointer-events: auto !important;
        visibility: visible !important;
    }

    /* Global hover kurallarıyla çakışmayı kesin ez: kalp her zaman sağ üstte */
    body.orion-category-page #products-container li.ps-product-item .product-container .left-block .buttons,
    body.orion-category-page #products-container li.ps-product-item:hover .product-container .left-block .buttons,
    body.orion-category-page #products-container .product-container:hover .left-block .buttons {
        left: auto !important;
        right: 8px !important;
        top: 14px !important;
        bottom: auto !important;
        inset: 14px 8px auto auto !important;
    }

    body.orion-category-page #products-container .product-container .left-block .buttons a,
    body.orion-category-page #products-container .product-container .left-block .buttons a.addtowishlist,
    body.orion-category-page #products-container .product-container .left-block a.addtowishlist,
    body.orion-category-page #products-container .product-container:hover .left-block .buttons a.addtowishlist {
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        left: auto !important;
        bottom: auto !important;
        inset: 0 0 auto auto !important;
    }

    body.orion-category-page #products-container .product-container .left-block .buttons a.addtowishlist,
    body.orion-category-page #products-container .product-container .left-block .addtowishlist {
        position: relative !important;
        left: auto !important;
        right: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        border-radius: 999px !important;
        border: 1px solid rgba(15, 23, 42, 0.14) !important;
        background: rgba(255, 255, 255, 0.92) !important;
        backdrop-filter: blur(4px) !important;
        -webkit-backdrop-filter: blur(4px) !important;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.16) !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1 !important;
        color: #334155 !important;
        transform: none !important;
        transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease !important;
    }

    /* temp.php ürün kartı: .buttons a:hover { transform: scale(1.1) } — küçük kutuda sola sıçrama yapıyor */
    body.orion-category-page #products-container .product-container .left-block .buttons a.addtowishlist:hover,
    body.orion-category-page #products-container .product-container .left-block .addtowishlist:hover {
        transform: none !important;
        border-color: rgba(239, 68, 68, 0.45) !important;
        background: #ffffff !important;
        color: #ef4444 !important;
    }

    body.orion-category-page #products-container .product-container .left-block .buttons a.addtowishlist:hover i,
    body.orion-category-page #products-container .product-container .left-block .addtowishlist:hover i {
        color: #ef4444 !important;
    }
}


/* :has destekli tarayıcılar: sınıf adı kaçsa bile ürün ul */
/* JS sınıfları: ul.product-list.grid — eski flex kuralını ezen yüksek özgüllük */
body.orion-category-page #products-container #view-product-list ul.product-list.grid,
body.orion-category-page #products-container #view-product-list ul.orion-category-product-grid.product-list.grid,
body.orion-category-page #products-container #view-product-list ul:has(> li.ps-product-item),
body.orion-category-page #products-container .ocv2-product-host ul:has(> li.ps-product-item) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    list-style: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

@media (min-width: 769px) and (max-width: 991px) {
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.product-list.grid,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.orion-category-product-grid.product-list.grid,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul:has(> li.ps-product-item),
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul:has(> li.ps-product-item) {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.product-list.grid,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.orion-category-product-grid.product-list.grid,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul:has(> li.ps-product-item),
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul:has(> li.ps-product-item) {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 14px !important;
    }
}

@media (min-width: 1200px) {
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.product-list.grid,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul.orion-category-product-grid.product-list.grid,
    body.orion-category-page #products-container:not(.list-view) #view-product-list ul:has(> li.ps-product-item),
    body.orion-category-page #products-container:not(.list-view) .ocv2-product-host ul:has(> li.ps-product-item) {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }
}

/* Mobil: kare görsel + ürün adı resmin altında + premium kart */
@media (max-width: 768px) {
    body.orion-category-page #products-container ul > li.ps-product-item {
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        box-shadow: none !important;
    }

    body.orion-category-page #products-container .product-container {
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
        overflow: hidden !important;
        border-radius: 14px !important;
        background: #fff !important;
        border: 1px solid rgba(15, 23, 42, 0.06) !important;
        box-shadow:
            0 1px 2px rgba(15, 23, 42, 0.04),
            0 8px 24px rgba(15, 23, 42, 0.08) !important;
    }

    /* Kare görsel (1:1): aspect-ratio bazı mobilde yükseklik 0 veriyor — padding-top %100 güvenli */
    body.orion-category-page #products-container .product-container .left-block {
        position: relative !important;
        width: 100% !important;
        height: 0 !important;
        padding-top: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        padding-bottom: 0 !important;
        aspect-ratio: auto !important;
        background: #0f172a !important;
        overflow: hidden !important;
        margin: 0 !important;
        line-height: 0 !important;
        border-radius: 14px 14px 0 0 !important;
        flex-shrink: 0 !important;
    }

    body.orion-category-page #products-container .product-container .left-block .imgLink,
    body.orion-category-page #products-container .product-container .left-block .img-container {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        overflow: hidden !important;
        line-height: 0 !important;
        z-index: 1 !important;
    }

    /* Sadece renk — background: kısayolu gradient/shimmer’ı komple siler + tekrarlayan katman riski */
    body.orion-category-page #products-container .product-container .left-block .img-container:not(.loaded):not(.img-error) {
        background-color: #f1f5f9 !important;
    }

    body.orion-category-page #products-container .product-container .left-block .img-container.loaded,
    body.orion-category-page #products-container .product-container .left-block .imgLink {
        background: #fff !important;
    }

    body.orion-category-page #products-container .product-container .left-block .img-container img,
    body.orion-category-page #products-container .product-container .left-block .imgLink img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center center !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        opacity: 0 !important;
        visibility: visible !important;
        vertical-align: top !important;
        z-index: 2 !important;
    }

    body.orion-category-page #products-container .product-container .left-block .img-container.loaded img,
    body.orion-category-page #products-container .product-container .left-block .imgLink .img-container.loaded img {
        opacity: 1 !important;
    }

    body.orion-category-page #products-container .product-container .left-block .img-container.img-error img {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body.orion-category-page #products-container .product-container .left-block .img-container.img-error {
        line-height: normal !important;
    }

    /* Görsel üstü başlık kapalı — başlık sadece resmin altında (right-block) */
    body.orion-category-page #products-container .product-container .left-block .product-name-overlay,
    body.orion-category-page #products-container .ps-product-item .left-block .product-name-overlay {
        display: none !important;
    }

    body.orion-category-page #products-container .product-container .right-block {
        margin-top: 0 !important;
        padding: 8px 10px 10px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
        position: relative !important;
    }

    body.orion-category-page #products-container .product-container .right-block .product-name {
        display: block !important;
        order: -1 !important;
        margin: 0 0 2px 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        text-align: left !important;
    }

    body.orion-category-page #products-container .product-container .right-block .product-name a {
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.35 !important;
        letter-spacing: -0.01em !important;
        color: #0f172a !important;
        text-decoration: none !important;
    }

    body.orion-category-page #products-container .product-container .content_price {
        margin-top: 0 !important;
        gap: 2px !important;
    }

    body.orion-category-page #products-container .product-container .price.old-price,
    body.orion-category-page #products-container .product-container span.old-price {
        font-size: 11px !important;
        color: #94a3b8 !important;
    }

    body.orion-category-page #products-container .product-container .price.product-price,
    body.orion-category-page #products-container .product-container span.product-price {
        font-size: 16px !important;
        font-weight: 700 !important;
        color: #0f172a !important;
        letter-spacing: -0.02em !important;
    }

    /* Sepet ikonu: modern çerçeveli, anasayfa hissi */
    body.orion-category-page #products-container .product-container .right-block .add-to-cart-btn,
    body.orion-category-page #products-container .product-container .right-block .quick_basket,
    body.orion-category-page #products-container .product-container .right-block .addtocart {
        position: absolute !important;
        right: 10px !important;
        bottom: 10px !important;
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        border-radius: 12px !important;
        border: 1px solid rgba(15, 23, 42, 0.16) !important;
        background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
        box-shadow:
            0 2px 6px rgba(15, 23, 42, 0.12),
            inset 0 1px 0 rgba(255, 255, 255, 0.85) !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        margin: 0 !important;
        z-index: 6 !important;
    }

    body.orion-category-page #products-container .product-container .right-block .add-to-cart-btn i,
    body.orion-category-page #products-container .product-container .right-block .quick_basket i,
    body.orion-category-page #products-container .product-container .right-block .addtocart i {
        font-size: 16px !important;
        line-height: 1 !important;
        margin: 0 !important;
    }

    /* Görsel üstü: % indirim, Yeni vb. rozetler + kalp (favori) — kaldır */
    body.orion-category-page #products-container .product-container .left-block .catalog-item-ribbons,
    body.orion-category-page #products-container .product-container .left-block .ps-badges {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body.orion-category-page #products-container .product-container .left-block .buttons,
    body.orion-category-page #products-container .product-container .left-block a.addtowishlist,
    body.orion-category-page #products-container .product-container .left-block .addtowishlist {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/**
 * Eski görünüm sınıfları (.grid-2 / .grid-3 / .grid-4) — Orion PLP: viewport ile 3 / 4 / 5 (list-view hariç).
 */
@media (min-width: 769px) and (max-width: 991px) {
    body.orion-category-page #products-container:not(.list-view) ul.product-list.grid-2,
    body.orion-category-page #products-container:not(.list-view) ul.product-list.grid-3,
    body.orion-category-page #products-container:not(.list-view) ul.product-list.grid-4,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid.grid-2,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid.grid-3,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid.grid-4,
    body.orion-category-page #products-container:not(.list-view) ul.urunler.grid-2,
    body.orion-category-page #products-container:not(.list-view) ul.urunler.grid-3,
    body.orion-category-page #products-container:not(.list-view) ul.urunler.grid-4 {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    body.orion-category-page #products-container:not(.list-view) ul.product-list.grid-2,
    body.orion-category-page #products-container:not(.list-view) ul.product-list.grid-3,
    body.orion-category-page #products-container:not(.list-view) ul.product-list.grid-4,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid.grid-2,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid.grid-3,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid.grid-4,
    body.orion-category-page #products-container:not(.list-view) ul.urunler.grid-2,
    body.orion-category-page #products-container:not(.list-view) ul.urunler.grid-3,
    body.orion-category-page #products-container:not(.list-view) ul.urunler.grid-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 1200px) {
    body.orion-category-page #products-container:not(.list-view) ul.product-list.grid-2,
    body.orion-category-page #products-container:not(.list-view) ul.product-list.grid-3,
    body.orion-category-page #products-container:not(.list-view) ul.product-list.grid-4,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid.grid-2,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid.grid-3,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid.grid-4,
    body.orion-category-page #products-container:not(.list-view) ul.urunler.grid-2,
    body.orion-category-page #products-container:not(.list-view) ul.urunler.grid-3,
    body.orion-category-page #products-container:not(.list-view) ul.urunler.grid-4 {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
}