/* Vitrin: ürün özelliği süzgeci (liste / kategori / arama). Masaüstünde sol yan panel, dar ekranda alttan açılan çekmece. */
.vf-ac{display:none}
.vf-duzen{display:grid;grid-template-columns:268px minmax(0,1fr);gap:28px;align-items:start}
.vf-sonuc{min-width:0}
.vf-panel{position:sticky;top:calc(var(--ust-yuk,130px) + 16px);max-height:calc(100vh - var(--ust-yuk,130px) - 32px);overflow:auto;border:1px solid var(--kenar);border-radius:calc(var(--kose) + 4px);background:var(--kart-zemin,var(--zemin));color:var(--yazi);overscroll-behavior:contain;scrollbar-width:thin}
.vf-form{display:flex;flex-direction:column}
.vf-ust{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--kenar);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--yazi-2)}
.vf-kapat{display:none;border:0;background:transparent;color:var(--yazi);font-size:1.6rem;line-height:1;width:36px;height:36px;border-radius:50%;cursor:pointer}
.vf-kapat:hover{background:var(--yuzey)}
.vf-cipler{display:flex;flex-wrap:wrap;gap:6px;padding:12px 18px;border-bottom:1px solid var(--kenar)}
.vf-cip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:99px;background:var(--yuzey);border:1px solid var(--kenar);color:var(--yazi);font-size:.8rem;text-decoration:none}
.vf-cip:hover{border-color:var(--ana);text-decoration:none}
.vf-temizle{align-self:center;margin-left:auto;font-size:.82rem;color:var(--ana);text-decoration:underline}
.vf-grup{border-bottom:1px solid var(--kenar)}
.vf-grup:last-of-type{border-bottom:0}
.vf-grup>summary{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px 18px;font-weight:600;font-size:.92rem;cursor:pointer;list-style:none}
.vf-grup>summary::-webkit-details-marker{display:none}
.vf-grup>summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--yazi-2);border-bottom:2px solid var(--yazi-2);transform:rotate(45deg);transition:transform .15s;margin-left:auto;margin-right:2px}
.vf-grup[open]>summary::after{transform:rotate(-135deg)}
.vf-grup>summary .vf-sayi{margin-left:6px}
/* TEK kaydırma: yalnız panel kaydırılır; grup içi değer listeleri kendi çubuğunu taşımaz (iç içe iki kaydırma kullanımı bozuyordu) */
.vf-grup ul{list-style:none;margin:0;padding:0 18px 14px}
.vf-grup li{margin:0}
.vf-grup label{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:.9rem;cursor:pointer;line-height:1.3}
.vf-grup input[type=checkbox]{width:22px;height:22px;flex:none;accent-color:var(--ana);margin:0}
.vf-ad{flex:1;min-width:0;overflow-wrap:anywhere}
.vf-n{color:var(--yazi-2);font-size:.8rem;font-variant-numeric:tabular-nums}
.vf-sayi{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--ana);color:var(--ana-yazi);font-size:.72rem;font-weight:700}
.vf-alt{padding:14px 18px;border-top:1px solid var(--kenar);position:sticky;bottom:0;background:var(--kart-zemin,var(--zemin))}
.vf-uygula{width:100%}
.vf-perde{display:none}
.vf-temizle-baglanti{font-weight:600}

/* Dar ekran: alttan açılan çekmece */
@media(max-width:960px){
  .vf-duzen{display:block}
  .vf-ac{display:inline-flex;align-items:center;gap:8px}
  .vf-ac .vf-sayi{background:var(--ana-yazi);color:var(--ana)}
  .vf-panel{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:1200;max-height:86vh;border-radius:18px 18px 0 0;border-bottom:0;transform:translateY(105%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s;box-shadow:0 -18px 40px -18px rgba(0,0,0,.45)}
  .vf-perde{display:block;position:fixed;inset:0;z-index:1190;background:rgba(15,23,42,.5);opacity:0;pointer-events:none;transition:opacity .2s}
  body.vf-acik{overflow:hidden}
  body.vf-acik .vf-panel{transform:none;visibility:visible;transition:transform .25s ease}
  body.vf-acik .vf-perde{opacity:1;pointer-events:auto}
  .vf-kapat{display:inline-flex;align-items:center;justify-content:center}
}
@media(prefers-reduced-motion:reduce){.vf-panel,.vf-perde{transition:none}}

/* Alt kategori çipleri: çok kategori olunca düzenli ızgara (eşit hücreler, taşan metin kısalır); iki satırdan fazlası katlanır, "Tüm alt kategorileri göster" ile açılır */
html body .cip-kap{position:relative;margin:0 0 18px}
@media(min-width:961px){
  html body .cip-kap .cipler{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin:0}
  html body .cip-kap .cip{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;padding:10px 14px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
html body .cip-ac{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
html body .cip-daha{display:none;margin:12px auto 0;width:max-content;max-width:100%;padding:8px 18px;border:1px solid var(--kenar);border-radius:99px;background:var(--kart-zemin,var(--zemin));color:var(--yazi);font-size:.88rem;font-weight:600;cursor:pointer}
html body .cip-daha:hover,html body .cip-ac:focus-visible~.cip-daha{border-color:var(--ana);color:var(--ana)}
html body .cip-daha-kapat{display:none}
html body .cip-ac:checked~.cip-daha .cip-daha-ac{display:none}
html body .cip-ac:checked~.cip-daha .cip-daha-kapat{display:inline}
/* Kaydırma okları yalnız masaüstünde (961px+) görünür; mobilde şerit parmakla kaydırılır */
html body .cip-ok{display:none}
@media(min-width:961px){
  /* 10'dan fazla alt kategori: tek satırlık kaydırmalı şerit (kısalmadan, tam adlarla) + oklar; "Tüm alt kategorileri göster" hepsini alt alta sarılı açar (:has yoksa ızgara kalır) */
  html body .cip-kap:has(.cip:nth-child(11)) .cipler{display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-behavior:smooth;overscroll-behavior-x:contain;padding:3px 2px 5px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent)}
  html body .cip-kap:has(.cip:nth-child(11)) .cipler::-webkit-scrollbar{display:none}
  html body .cip-kap:has(.cip:nth-child(11)) .cipler[data-konum="orta"]{-webkit-mask-image:linear-gradient(90deg,transparent,#000 48px,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(90deg,transparent,#000 48px,#000 calc(100% - 48px),transparent)}
  html body .cip-kap:has(.cip:nth-child(11)) .cipler[data-konum="son"]{-webkit-mask-image:linear-gradient(90deg,transparent,#000 48px);mask-image:linear-gradient(90deg,transparent,#000 48px)}
  html body .cip-kap:has(.cip:nth-child(11)) .cipler[data-konum="tam"]{-webkit-mask-image:none;mask-image:none}
  html body .cip-kap:has(.cip:nth-child(11)) .cip{flex:none;display:inline-flex;overflow:visible;text-overflow:clip;padding:9px 16px}
  html body .cip-kap:has(.cip:nth-child(11)) .cip-daha{display:block}
  html body .cip-kap:has(.cip:nth-child(11)) .cip-ac:checked~.cipler{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none}
  html body .cip-ok{position:absolute;top:5px;z-index:2;width:36px;height:36px;border:1px solid var(--kenar);border-radius:50%;background:var(--kart-zemin,var(--zemin,#fff));color:var(--yazi);font-size:1.25rem;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.14);display:flex;align-items:center;justify-content:center;padding:0 0 3px}
  html body .cip-ok:hover{border-color:var(--ana);color:var(--ana)}
  html body .cip-ok[hidden]{display:none}
  html body .cip-ok-sol{left:-8px}
  html body .cip-ok-sag{right:-8px}
  html body .cip-ac:checked~.cip-ok{display:none}
}

/* Yan filtre çubuğu düzeni (kt-yan): kendi süzgeç çubuğu sol sütundadır; özellik süzgeci sonuçların üstünde yatay kart olur */
@media(min-width:961px){
  body.sayfa-liste.kt-yan .ana>.vf-duzen{grid-column:2;display:block}
  body.sayfa-liste.kt-yan .vf-panel{position:static;max-height:none;margin-bottom:22px}
  body.sayfa-liste.kt-yan .vf-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
  body.sayfa-liste.kt-yan .vf-ust,body.sayfa-liste.kt-yan .vf-cipler,body.sayfa-liste.kt-yan .vf-alt{grid-column:1 / -1}
  body.sayfa-liste.kt-yan .vf-alt{position:static}
  body.sayfa-liste.kt-yan .vf-uygula{width:auto}
}

/* Hızlı filtre çipleri (kategori sayfası; ayar hizli_filtreler): her grup bir satır, tek tıkla seçim */
html body .hf-kap{display:grid;gap:10px;margin:0 0 18px;padding:12px 16px;border:1px solid var(--kenar);border-radius:calc(var(--kose,12px) + 2px);background:var(--kart-zemin,var(--zemin,#fff))}
html body .hf-satir{display:flex;align-items:center;gap:12px;min-width:0}
html body .hf-baslik{flex:none;min-width:112px;font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--yazi-2,#667)}
html body .hf-cipler{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 1px;min-width:0}
html body .hf-cipler::-webkit-scrollbar{display:none}
html body .hf-cip{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border:1px solid var(--kenar);border-radius:99px;background:var(--kart-zemin,#fff);color:var(--yazi);font-size:.9rem;font-weight:600;text-decoration:none;transition:border-color .15s,background .15s,color .15s}
html body .hf-cip small{font-size:.74rem;font-weight:500;opacity:.6}
html body .hf-cip:hover{border-color:var(--ana);color:var(--ana);text-decoration:none}
html body .hf-cip.aktif{background:var(--ana);border-color:var(--ana);color:var(--ana-yazi,#fff)}
html body .hf-cip.aktif small{opacity:.85}
@media(max-width:700px){html body .hf-satir{flex-direction:column;align-items:stretch;gap:6px}html body .hf-kap{padding:10px 12px}html body .hf-cip{min-height:40px}}

/* Hızlı filtre: ilk grup hep görünür, diğerleri "Diğer filtreler" altında. Masaüstünde hepsi açık (özet gizli), mobilde kapalı başlar */
html body .hf-diger{display:grid;gap:10px}
html body .hf-diger>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;width:max-content;min-height:36px;padding:0 14px;border:1px dashed var(--kenar);border-radius:99px;font-size:.88rem;font-weight:600;color:var(--yazi)}
html body .hf-diger>summary::-webkit-details-marker{display:none}
html body .hf-diger>summary::after{content:"";width:7px;height:7px;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
html body .hf-diger[open]>summary::after{transform:translateY(1px) rotate(-135deg)}
html body .hf-sayi{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--ana);color:var(--ana-yazi,#fff);font-size:.74rem}
@media(min-width:701px){
  html body .hf-diger>summary{display:none}
  html body .hf-diger::details-content{content-visibility:visible;display:grid;gap:10px}
}
@media(max-width:700px){
  html body .hf-kap{gap:8px}
  /* Tam genişlik ve 44px: sabit sohbet balonu (sol/sağ köşe) düğmenin bir ucunu kapatsa bile geri kalanı dokunulabilir kalır */
  html body .hf-diger>summary{width:100%;justify-content:center;min-height:44px;padding:0 14px 0 76px;box-sizing:border-box;position:relative}
  html body .hf-diger>summary::after{position:static}
}

/* Masaüstünde (961px+) sol filtre paneli zaten tüm filtreleri gösterir; hızlı filtre çipleri yalnız panelin çekmece olduğu dar ekranlarda (mobil, tablet) görünür */
@media(min-width:961px){html body .hf-kap{display:none}}

/* Sohbet balonu filtre kontrollerinin üzerine gelmez: masaüstünde sol filtre panelinin sağına durur; panel çekmece olan dar ekranlarda
   balon bir filtre kontrolünün (sıralama/Filtrele çubuğu, hızlı filtre çipleri) üstüne denk gelince kısa süre gizlenir, kaydırınca geri gelir (vitrin-son.js) */
html body .cdw.cdw-filtre-ustunde:not([data-acik="1"]){opacity:0;pointer-events:none;transform:scale(.85);transition:opacity .15s,transform .15s}
@media(min-width:961px){html body:has(.vf-duzen) .cdw[data-konum="sol"]{left:var(--cdw-filtre-x,308px)}}