/* 2026-05-28 Madde 5 (rev3): Sol kolon TOPYEKÜN sticky + max-width override
   + chip alan tam kullanım. Önceki rev'lerde shell'in tek başına sticky'si
   ata zinciri (özellikle .searchfield-wrapper max-width:203px !important) ile
   çakıştığı için takip etmiyordu. Bu sürüm sol kolonun KENDİSİNİ sticky'leyip
   form + filtre + scroll'u tek bütün olarak sabitler. */

/* ── 1) max-width override (stok-urunler scope) ─────────────────────────
   .searchfield-wrapper style-2024.css'te 203px hard-cap'li. :has() ile
   yalnız stok-urunler sayfasında geçersizleştir, %95 alan kullansın. */
.col-xs-5.col-sm-1.col-lg-1:has(.cms-stok-filter-shell) .searchfield-wrapper,
.col-xs-5.col-sm-1.col-lg-1:has(.cms-stok-filter-shell) .searchfield-wrapper-col,
.col-xs-5.col-sm-1.col-lg-1:has(.cms-stok-filter-shell) .left-menu-outer {
    max-width: none !important;
    width: 95% !important;
    padding: 6px !important;
    margin: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    /* overflow visible: grup flyout'u (left:100%) sağa taşarken kesilmesin */
    overflow: visible !important;
}

/* ── 2) Sol kolonu komple STICKY ─────────────────────────────────────────
   Shell tek başına sticky bozuluyor (parent overflow/max-width); kolonun
   kendisi sticky → form + filtre + tüm içerik beraber takip eder. */
.col-xs-5.col-sm-1.col-lg-1:has(.cms-stok-filter-shell) {
    position: sticky;
    top: 96px;
    align-self: flex-start;
    /* 2026-08-03 Madde 4: sütun sticky. z-index, fixed .modul-table-search-wrapper
       (z-index:3) ÜSTÜNDE olmalı — aksi halde sütun kendi stacking-context'ini 3'e
       hapsedip grup flyout'unu (içteki z-index:1000) bar'ın altında bırakıyor. */
    z-index: 50;
}

/* Madde 4: stok-urunler sayfasında footer gösterme */
body:has(.cms-stok-filter-shell) footer {
    display: none !important;
}

/* Bootstrap row'un align-items'ini override (flexbox stretch sticky'i bozar) */
.row:has(.cms-stok-filter-shell) {
    align-items: flex-start;
}

/* ── 3) Shell — beyaz kart + orijinal drop-shadow (2026-08-03 Madde 4) ─── */
.cms-stok-filter-shell {
    position: relative;        /* artık kendisi sticky değil — parent kolon */
    width: 100%;
    box-sizing: border-box;
    background: #ffffff;
    border: 1px solid #e6eaf0;
    border-radius: 6px;
    /* Orijinal .searchfield-wrapper drop-shadow'u geri getirildi */
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
    padding: 8px;
    margin: 4px 0 24px; /* alttaki modul-table-search-wrapper'a yapışmasın */
    z-index: 3;
}

/* ── 3b) treeMenu görünümü — List sayfası .multi-level-menu paritesi ───── */
.cms-brand-list {
    display: block;
    width: 100%;
    border-top: 3px solid #173e62; /* v3-brand-nav üst çizgisi */
}

/* Her marka = menu-item: alt alta, ince ayraç; flyout için relative */
.cms-brand-block {
    position: relative;
    border-bottom: 1px solid #e0e0e0;
}

.cms-brand-block:last-child {
    border-bottom: none;
}

/* Marka satırı = menu-link (level-0): flex satır, sağda chevron */
.cms-brand-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 0;
    padding: 7px 10px;
    cursor: pointer;
    background: #ffffff;
    color: #333 !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    user-select: none;
    transition: all 0.3s ease;
}

.cms-brand-header:hover {
    background: #173e62;
    color: #ffffff !important;
}

/* Seçili (aktif) marka — treeMenu .active */
.cms-brand-block:has(input.brand-checkbox:checked) .cms-brand-header,
.cms-brand-header.selected {
    background: #deecfa;
    color: #222 !important;
    font-weight: 600;
}

.cms-brand-header input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.cms-brand-name {
    flex: 1 1 auto;
    white-space: normal;
    word-break: break-word;
}

/* Chevron — sağda, yalnız çok gruplu markada; açılınca döner (treeMenu chevron) */
.cms-brand-caret {
    flex: 0 0 auto;
    margin-left: auto;
    font-size: 12px;
    opacity: 0.6;
    display: none;
    transition: transform 0.3s ease;
}

.cms-brand-block.has-groups .cms-brand-caret {
    display: inline-block;
}

/* Marka üzerine gelince chevron sağa döner (treeMenu .has-children:hover) */
.cms-brand-block.has-groups:hover .cms-brand-caret {
    transform: rotate(90deg);
    opacity: 1;
}

/* Grup listesi = treeMenu .submenu: marka üzerine gelince SAĞA doğru açılan flyout */
.cms-brand-groups {
    position: absolute;
    left: 100%;
    top: 0;
    width: 230px;
    max-width: 260px;
    margin: 0;
    padding: 0;
    background: #ffffff;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateX(-10px);
    transition: all 0.25s ease;
    z-index: 1000;
    max-height: 75vh;
    overflow-y: auto;
}

/* Yalnız çok gruplu markada ve hover'da aç */
.cms-brand-block.has-groups:hover .cms-brand-groups {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

/* Madde 4: içinde stoklu ürün olmayan grup menüde hiç gösterilmez (kalabalık azalt) */
.isk-gr-label.empty-group {
    display: none !important;
}

/* Grup öğesi = menu-link (level-1): girintili satır, ince ayraç, başında dot */
.cms-brand-groups .cms-chip {
    display: block;
    width: 100%;
    margin: 0;
    padding: 6px 10px 6px 22px;
    border: none;
    border-bottom: 1px solid #ececec;
    background: #ffffff;
    border-radius: 0;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 500;
    color: #333 !important;
}

.cms-brand-groups .cms-chip:last-child {
    border-bottom: none;
}

.cms-brand-groups .cms-chip:hover {
    background: #e9ecef;
    color: #007bff !important;
}

/* Aktif grup — treeMenu .active */
.cms-brand-groups .cms-chip:has(input:checked),
.cms-brand-groups .cms-chip.selected {
    background: #deecfa;
    color: #222 !important;
    font-weight: 600;
}

/* ── 4) Chip-row — marka yatay flex, grup dikey block ─────────────────── */
.cms-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0;
    padding: 0;
    width: 100%;
}

/* İskonto grupları — block, satır atlaya atlaya */
.cms-chip-row--grup {
    display: block;
    margin-top: 4px;
}

.cms-chip-row--grup .cms-chip {
    display: block;
    width: 100%;
    margin-bottom: 3px;
    /* 2026-05-28: başlık niteliği için +2px */
    font-size: 13.5px;
    padding: 4px 10px;
}

/* ── 5) Chip — köşeli, beyaz arka, sarar ──────────────────────────────── */
/* !important: parent .searchfield-wrapper'da `color: navy !important` var,
   onu yenmek için chip color'larında da !important. */
.cms-chip {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    border-radius: 3px;
    cursor: pointer;
    /* 2026-05-28: başlık niteliği için +2px (12→14) */
    font-size: 14px;
    line-height: 1.35;
    color: #334155 !important;
    user-select: none;
    transition: background 0.12s, border-color 0.12s, color 0.12s;
    margin: 0;
    white-space: normal;
    word-break: break-word;
    max-width: 100%;
}

.cms-chip:hover {
    border-color: #0891b2;
    color: #0891b2 !important;
    background: #f0fdfa;
}

.cms-chip input[type="radio"],
.cms-chip input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.cms-chip:has(input:checked) {
    background: #0891b2;
    border-color: #0891b2;
    color: #ffffff !important;
    font-weight: 600;
}

.cms-chip.hidden {
    display: none;
}

/* ── 6) Keyword search input — belirgin (filtre öncesi daha kuvvetli) ─── */
.cms-filter-search {
    height: 34px;
    font-size: 13px;
    padding: 4px 10px;
    margin: 4px 0 8px;
    width: 100%;
    box-sizing: border-box;
    border: 1.5px solid #0891b2;
    border-radius: 4px;
    background: #ffffff;
    color: #0f172a;
    transition: box-shadow 0.15s, border-color 0.15s;
}

.cms-filter-search::placeholder {
    color: #64748b;
    font-size: 12.5px;
}

.cms-filter-search:focus {
    outline: none;
    border-color: #0e7490;
    box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.18);
}

/* ── 7) Mobil — sticky kapanır ─────────────────────────────────────────── */
@media (max-width: 768px) {
    .col-xs-5.col-sm-1.col-lg-1:has(.cms-stok-filter-shell) {
        position: relative;
        top: auto;
        max-height: none;
        overflow-y: visible;
    }
}