/**
 * Kategori / arama (modern-category-page) — ultra premium, anasayfa ile uyumlu.
 * Sadece .modern-category-page altında; diğer sayfalara dokunmaz.
 */

/* --------------------------------------------------------------------------
   Sayfa kabuğu (anasayfa: temiz beyaz / çok hafif gri)
   -------------------------------------------------------------------------- */
body.orion-category-page {
    background: #fafbfc !important;
}

.modern-category-page {
    background: linear-gradient(180deg, #fafbfc 0%, #ffffff 48%, #f5f6f8 100%) !important;
    min-height: 50vh;
    padding: 0 0 48px !important;
    font-family: var(--font-main, 'Inter', -apple-system, sans-serif);
}

.modern-category-page .container {
    max-width: 1400px !important;
    padding-left: clamp(12px, 3vw, 24px) !important;
    padding-right: clamp(12px, 3vw, 24px) !important;
}

/* v2 kabuk: header/footer .container ile birebir (1320 / 1520) */
.modern-category-page.orion-category-shell-v2 > .container.ocv2-container {
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-sizing: border-box !important;
    max-width: 1320px !important;
}

.modern-category-page.orion-category-shell-v2 > .container.ocv2-container.orion-filters-sidebar-visible {
    max-width: 1320px !important;
}

@media (min-width: 1600px) {
    .modern-category-page.orion-category-shell-v2 > .container.ocv2-container,
    .modern-category-page.orion-category-shell-v2 > .container.ocv2-container.orion-filters-sidebar-visible {
        max-width: 1520px !important;
    }
}

@media (max-width: 768px) {
    .modern-category-page.orion-category-shell-v2 > .container.ocv2-container {
        width: 100% !important;
        max-width: none !important;
        padding-left: max(4px, env(safe-area-inset-left, 0px)) !important;
        padding-right: max(4px, env(safe-area-inset-right, 0px)) !important;
    }

    body.orion-category-page .orion-category-shell-v2 .ocv2-product-host {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* v2 dışı modern kategori kabuğu */
    .modern-category-page .container {
        padding-left: max(4px, env(safe-area-inset-left, 0px)) !important;
        padding-right: max(4px, env(safe-area-inset-right, 0px)) !important;
    }
}

/* --------------------------------------------------------------------------
   Üst bölüm: cam + ince çerçeve (premium hero)
   -------------------------------------------------------------------------- */
.modern-category-page .category-header {
    background: rgba(255, 255, 255, 0.82) !important;
    backdrop-filter: saturate(180%) blur(20px) !important;
    -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    border-radius: var(--radius-lg, 16px) !important;
    padding: clamp(16px, 3vw, 24px) !important;
    margin-bottom: clamp(16px, 2.5vw, 24px) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06), 0 1px 0 rgba(255, 255, 255, 0.9) inset !important;
}

.modern-category-page .category-breadcrumb {
    margin-bottom: 12px !important;
}

.modern-category-page .category-header .breadcrumb {
    background: rgba(245, 245, 247, 0.9) !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    border-radius: 999px !important;
    padding: 8px 16px !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.modern-category-page .category-title {
    font-size: clamp(1.35rem, 4vw, 1.85rem) !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    color: var(--text-main, #1d1d1f) !important;
    margin: 0 0 4px 0 !important;
    line-height: 1.2 !important;
}

.modern-category-page .category-title i {
    opacity: 0.85;
}

/* Sıralama / görünüm çubuğu */
.modern-category-page .category-actions {
    margin-top: 16px !important;
    padding-top: 16px !important;
    border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

.modern-category-page .sort-select {
    min-width: min(100%, 220px) !important;
    border-radius: 12px !important;
    border: 1px solid var(--border-light, #e5e5ea) !important;
    padding: 10px 14px !important;
    font-weight: 600 !important;
    background: #fff !important;
    box-shadow: var(--shadow-sm, 0 2px 8px rgba(0, 0, 0, 0.04)) !important;
}

.modern-category-page .view-btn {
    border-radius: 10px !important;
    border: 1px solid var(--border-light, #e5e5ea) !important;
    background: #fff !important;
}

.modern-category-page .view-btn.active,
.modern-category-page .view-btn:hover {
    background: var(--color-primary, #000) !important;
    border-color: var(--color-primary, #000) !important;
    color: #fff !important;
}

/* --------------------------------------------------------------------------
   İçerik: mobilde ürün ızgarası 2 sütun; masaüstünde 4 sütun (anasayfa kart grid ile uyum); filtre üstte
   -------------------------------------------------------------------------- */
.modern-category-page .modern-category-content {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 260px) !important;
    grid-template-areas: "ocv2-main ocv2-aside" !important;
    gap: clamp(16px, 2vw, 24px) !important;
    align-items: start !important;
}

.modern-category-page .modern-category-content.ocv2-body.orion-layout--no-filters {
    grid-template-columns: 1fr !important;
    grid-template-areas: "ocv2-main" !important;
}

.modern-category-page .modern-category-content.ocv2-body:not(.orion-layout--no-filters) {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 380px) !important;
    gap: clamp(12px, 1.5vw, 18px) !important;
}

.modern-category-page .category-sidebar.orion-filters-empty {
    display: none !important;
}

.modern-category-page .category-main.ocv2-main,
.modern-category-page .category-main {
    grid-area: ocv2-main !important;
}

.modern-category-page .category-sidebar.ocv2-aside,
.modern-category-page .category-sidebar {
    grid-area: ocv2-aside !important;
    position: sticky !important;
    top: 88px !important;
}

.modern-category-page .filter-section {
    background: var(--bg-card, #fff) !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    border-radius: var(--radius-lg, 16px) !important;
    padding: 18px !important;
    box-shadow: var(--shadow-sm, 0 2px 8px rgba(0, 0, 0, 0.04)) !important;
}

.modern-category-page .filter-section h3 {
    font-size: 15px !important;
    font-weight: 700 !important;
    margin-bottom: 12px !important;
}

.modern-category-page .category-main {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* Ürün alanı: dış grid’i kapat; liste ül içinde grid */
.modern-category-page .modern-products-grid {
    display: block !important;
    padding: 0 !important;
    min-height: 0 !important;
    margin-bottom: 0 !important;
}

/*
 * temp.php içindeki .modern-products-grid { display:grid } #products-container’da tek çocuk
 * (TableBox) ile tek “sütun” oluşturuyordu — ID ile sıfırla.
 */
body.orion-category-page .modern-category-page #products-container.modern-products-grid {
    display: block !important;
    grid: none !important;
    grid-template-columns: unset !important;
}

body.orion-category-page #products-container .primary-box,
body.orion-category-page #products-container .block_content,
body.orion-category-page #products-container .block-content {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
}

/*
 * ShopPHP çıktısı: .view-product-list veya .category_prod üzerine grid verilince
 * tek çocuk <ul> tek grid hücresi olur; li’ler blok gibi alt alta görünür.
 * Sarmalayıcıyı blok yap, ızgarayı yalnızca ürün <ul>’üne uygula.
 */
body.orion-category-page #products-container .view-product-list,
body.orion-category-page #products-container .category_prod.view-product-list {
    display: block !important;
    grid: none !important;
    grid-template-columns: unset !important;
    width: 100% !important;
    min-width: 0 !important;
}

body.orion-category-page #products-container .category_prod {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
}

/* Bootstrap sütun sınıfı kalmış li’ler tek sütun zorlamasın */
body.orion-category-page #products-container li.ps-product-item[class*="col-"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    float: none !important;
}

/* .view-product-list içindeki ul (doğrudan veya iç içe) — product-list.grid ise flex bloğu (dosya sonu) kullanılır */
body.orion-category-page #products-container .view-product-list ul.orion-category-product-grid:not(.product-list.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 .category_prod ul.orion-category-product-grid:not(.product-list.grid),
body.orion-category-page #products-container .category_prod ul.urunler,
body.orion-category-page #products-container .category_prod ul.product-list,

/* JS ile işaretlenen ürün listesi (grid yedek; .product-list.grid değilse) */
body.orion-category-page #products-container ul.orion-category-product-grid:not(.product-list.grid),
.modern-category-page #products-container ul.orion-category-product-grid:not(.product-list.grid) {
    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;
    box-sizing: border-box !important;
}

/* Sistem çıktısı: ul.urunler / ul.product-list — mobil önce 2 sütun (JS yoksa yedek) */
.modern-category-page #products-container ul.urunler,
.modern-category-page #products-container ul.product-list,
.modern-category-page .modern-products-grid ul.urunler,
.modern-category-page .modern-products-grid ul.product-list,
.modern-category-page #products-container ul:has(> li.ps-product-item),
.modern-category-page #products-container .block-content 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: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

/* Masaüstü: 992px+ ızgara görünümünde 5 sütun (tüm kategoriler); mobil 2 sütun temel kurallarda */
@media (min-width: 992px) {
    body.orion-category-page #products-container:not(.list-view) .view-product-list ul.orion-category-product-grid:not(.product-list.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) .category_prod ul.orion-category-product-grid:not(.product-list.grid),
    body.orion-category-page #products-container:not(.list-view) .category_prod ul.urunler,
    body.orion-category-page #products-container:not(.list-view) .category_prod ul.product-list,
    body.orion-category-page #products-container:not(.list-view) ul.orion-category-product-grid:not(.product-list.grid),
    .modern-category-page #products-container:not(.list-view) ul.orion-category-product-grid:not(.product-list.grid) {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .modern-category-page #products-container:not(.list-view) ul.urunler,
    .modern-category-page #products-container:not(.list-view) ul.product-list,
    .modern-category-page .modern-products-grid:not(.list-view) ul.urunler,
    .modern-category-page .modern-products-grid:not(.list-view) ul.product-list,
    .modern-category-page #products-container:not(.list-view) ul:has(> li.ps-product-item),
    .modern-category-page #products-container:not(.list-view) .block-content ul:has(li.ps-product-item) {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }
}

/* Eski tema float düzeni — grid hücrelerini bozmasın (flex .product-list.grid hariç) */
.modern-category-page #products-container ul.orion-category-product-grid:not(.product-list.grid) > li,
.modern-category-page #products-container ul.urunler:not(.product-list.grid) > li,
.modern-category-page #products-container ul.product-list:not(.product-list.grid) > li,
.modern-category-page #products-container ul:has(> li.ps-product-item):not(.product-list.grid) > li,
.modern-category-page #products-container .block-content ul:has(li.ps-product-item):not(.product-list.grid) > li {
    float: none !important;
    clear: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
}

/*
 * temp.php içi .modern-products-grid .ps-product-item { min/max 235px } kategori #products-container
 * için daraltıldı; product-list.grid (flex) kullanıldığında genişlik aşağıdaki blokta verilir.
 */
body.orion-category-page #products-container ul:not(.product-list.grid) li.ps-product-item {
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    margin-right: 0 !important;
}

@media (max-width: 900px) {
    .modern-category-page .modern-category-content {
        grid-template-columns: 1fr !important;
        grid-template-areas: "ocv2-main" "ocv2-aside" !important;
    }

    .modern-category-page .category-sidebar.ocv2-aside,
    .modern-category-page .category-sidebar {
        position: relative !important;
        top: auto !important;
    }
}

@media (max-width: 480px) {
    body.orion-category-page #products-container ul.orion-category-product-grid:not(.product-list.grid),
    .modern-category-page #products-container ul.orion-category-product-grid:not(.product-list.grid),
    .modern-category-page #products-container ul.urunler,
    .modern-category-page #products-container ul.product-list,
    .modern-category-page .modern-products-grid ul.urunler,
    .modern-category-page .modern-products-grid ul.product-list,
    .modern-category-page #products-container ul:has(> li.ps-product-item),
    .modern-category-page #products-container .block-content ul:has(li.ps-product-item) {
        gap: 6px !important;
    }

    .modern-category-page .category-header {
        padding: 14px !important;
        margin-bottom: 12px !important;
    }

    .modern-category-page .category-actions {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .modern-category-page .sort-select {
        width: 100% !important;
    }

    .modern-category-page .view-controls {
        justify-content: center !important;
    }
}

/* --------------------------------------------------------------------------
   Kartlar (anasayfa product-container ile uyum)
   -------------------------------------------------------------------------- */
.modern-category-page #products-container .ps-product-item,
.modern-category-page .modern-products-grid .ps-product-item {
    height: 100% !important;
}

.modern-category-page #products-container .product-container,
.modern-category-page .modern-products-grid .product-container {
    border-radius: var(--radius-lg, 16px) !important;
    border: 1px solid var(--border-light, #e5e5ea) !important;
    background: var(--bg-card, #fff) !important;
    box-shadow: var(--shadow-sm, 0 2px 8px rgba(0, 0, 0, 0.04)) !important;
    transition: box-shadow 0.25s ease, border-color 0.25s ease !important;
}

.modern-category-page #products-container .product-container:hover,
.modern-category-page .modern-products-grid .product-container:hover {
    border-color: rgba(0, 0, 0, 0.12) !important;
    box-shadow: var(--shadow-md, 0 8px 24px rgba(0, 0, 0, 0.08)) !important;
}

.modern-category-page #products-container .product-name a,
.modern-category-page .modern-products-grid .product-name a {
    font-size: 13px !important;
    line-height: 1.25 !important;
}

body.orion-category-page .modern-category-page #products-container .ps-product-item .left-block .product-name-overlay {
    padding: 18px 10px 5px !important;
}

body.orion-category-page .modern-category-page #products-container .product-container .right-block {
    padding: 8px 10px 10px !important;
}

@media (max-width: 768px) {
    .modern-category-page #products-container .product-name a,
    .modern-category-page .modern-products-grid .product-name a {
        font-size: 13px !important;
        line-height: 1.3 !important;
        -webkit-line-clamp: 2 !important;
    }

    .modern-category-page #products-container .product-price,
    .modern-category-page .modern-products-grid .product-price {
        font-size: 15px !important;
    }

    .modern-category-page #products-container .right-block,
    .modern-category-page .modern-products-grid .right-block {
        padding: 6px 8px 8px !important;
        gap: 2px !important;
    }

    .modern-category-page #products-container .left-block img,
    .modern-category-page .modern-products-grid .left-block img {
        padding: 0 !important;
        object-fit: cover !important;
    }

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

    body.orion-category-page .modern-category-page #products-container .product-container .left-block {
        display: flex !important;
        flex-direction: column !important;
        aspect-ratio: auto !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    body.orion-category-page .modern-category-page #products-container .left-block .imgLink {
        position: relative !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        aspect-ratio: 1 / 1 !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        height: auto !important;
    }

    body.orion-category-page .modern-category-page #products-container .left-block .img-container {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
    }

    body.orion-category-page .modern-category-page #products-container .ps-product-item .left-block .product-name-overlay {
        position: static !important;
        background: transparent !important;
        padding: 8px 8px 0 !important;
        margin: 0 !important;
    }

    body.orion-category-page .modern-category-page #products-container .left-block .product-name-overlay .product-name a {
        color: #0f172a !important;
        text-shadow: none !important;
        font-size: 13px !important;
        line-height: 1.3 !important;
        font-weight: 600 !important;
    }
}

/* Sayfalama (varsa) */
.modern-category-page .pagination,
.modern-category-page ul.pagination {
    margin-top: 32px !important;
    padding: 16px 0 !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.modern-category-page .pagination a,
.modern-category-page ul.pagination a {
    border-radius: 10px !important;
    min-width: 40px !important;
    font-weight: 600 !important;
    border: 1px solid var(--border-light, #e5e5ea) !important;
    background: #fff !important;
}

.modern-category-page .pagination a:hover,
.modern-category-page .pagination a.active {
    background: var(--color-primary, #000) !important;
    color: #fff !important;
    border-color: var(--color-primary, #000) !important;
}

/* TableBox kalıntıları: taşmayı önle */
.modern-category-page #products-container .primary-box,
.modern-category-page #products-container table,
.modern-category-page .modern-products-grid .primary-box,
.modern-category-page .modern-products-grid table {
    max-width: 100% !important;
}

.modern-category-page #products-container .categoryTextWrap,
.modern-category-page .modern-products-grid .categoryTextWrap {
    margin-bottom: 16px !important;
}

/* Liste görünümü: eski 1 sütun masaüstü kuralı kaldırıldı — grid orion-category-grid-nuclear.css */

@media (max-width: 900px) {
    .modern-category-page #products-container.list-view ul.orion-category-product-grid:not(.product-list.grid),
    .modern-category-page #products-container.list-view ul.urunler,
    .modern-category-page #products-container.list-view ul.product-list,
    .modern-category-page .modern-products-grid.list-view ul.orion-category-product-grid:not(.product-list.grid),
    .modern-category-page .modern-products-grid.list-view ul.urunler,
    .modern-category-page .modern-products-grid.list-view ul.product-list,
    .modern-category-page #products-container.list-view ul:has(> li.ps-product-item):not(.product-list.grid),
    .modern-category-page #products-container.list-view .block-content ul:has(li.ps-product-item):not(.product-list.grid) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }
}

/* Sarmalayıcı — grid ürün ul üzerinde (flex + grid:none blokları kaldırıldı; tek sıra buna bağlıydı) */
body.orion-category-page #products-container .view-product-list {
    display: block !important;
    width: 100% !important;
}

/* ==========================================================================
   Grid kilidi: ürün <ul> — list-view dahil (eski :not(.list-view) kaldırıldı)
   ========================================================================== */
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: clamp(12px, 2vw, 20px) !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: start !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

@media (min-width: 992px) {
    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: 16px !important;
    }
}

body.orion-category-page #products-container ul:has(> li.ps-product-item) > li.ps-product-item {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    float: none !important;
    clear: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

@media (max-width: 900px) {
    body.orion-category-page #products-container ul.product-list,
    body.orion-category-page #products-container ul.urunler,
    body.orion-category-page #products-container ul.orion-category-product-grid:not(.product-list.grid) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }
}

/* v2 kabuk: üst bölümdeki “cam kart / kalın kutu” ultra-premium kurallarını iptal et */
.orion-category-shell-v2.modern-category-page .category-header {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: none !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin-bottom: 4px !important;
}

.orion-category-shell-v2.modern-category-page .category-header .breadcrumb {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

.orion-category-shell-v2.modern-category-page .category-actions {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
}

.orion-category-shell-v2.modern-category-page .sort-select {
    background: transparent !important;
    box-shadow: none !important;
}

.orion-category-shell-v2.modern-category-page .view-btn.active,
.orion-category-shell-v2.modern-category-page .view-btn:hover {
    background: rgba(15, 23, 42, 0.08) !important;
    border-color: rgba(15, 23, 42, 0.12) !important;
    color: var(--ocv2-text, #0f172a) !important;
}