/* Masaüstü kategori / tüm ürünler liste katmanı (2026-10-22, Burak: Kategori_Listeleri_ve_2x3_Gorsel_Claude_Promptu).
   YALNIZ >=1024 px ve yalnız body.ls-ana (urun/*.html liste sayfaları); <=1023 px'te katman ve yeni altbilgi display:none, eski sayfa aynen durur.
   Renkler: zemin #fff, metin #242424/#666, düğme #333/#454545, ayırıcı #e8e8e8. Ürün fotoğrafı: görünmez kare yuva (beyaz) + yatay ortalı 2:3 çerçeve (2:3 KARARI: kare/gri kutuya dönme). */
.ls, body.ls-ana .ms-alt { display: none; }

@media (min-width: 1024px) {
  body.ls-ana, body.ls-ana main { background: #fff; color: #242424; }
  body.ls-ana main > .kap { display: none; }                 /* eski liste (DOM'da durur; mobil kullanır): çift görünüm ve gizli odak yok */
  body.ls-ana > footer.alt { display: none; }
  body.ls-ana .ms-alt { display: block; }
  /* JS/veri yüklenemezse eski liste geri gelir (boş sayfa yok) */
  html.ls-hata body.ls-ana main > .kap { display: block; }
  html.ls-hata .ls, html.ls-hata body.ls-ana .ms-alt { display: none; }
  html.ls-hata body.ls-ana > footer.alt { display: block; }

  .ls { display: block; box-sizing: border-box; width: min(1280px, 100% - 48px); margin: 0 auto; padding: 20px 0 72px; color: #242424; background: #fff; }
  .ls a:focus-visible, .ls button:focus-visible, .ls input:focus-visible, .ls select:focus-visible { outline: 2px solid #242424; outline-offset: 2px; border-radius: 3px; }
  .ls-iz ol { display: flex; flex-wrap: wrap; gap: 4px 8px; list-style: none; margin: 0; padding: 0; font-size: 14px; line-height: 1.4; color: #666; }
  .ls-iz li + li::before { content: "/"; margin-right: 8px; color: #999; }
  .ls-iz a { color: #666; text-decoration: none; }
  .ls-iz a:hover { color: #242424; text-decoration: underline; text-underline-offset: 3px; }
  .ls-iz [aria-current] { color: #242424; }
  .ls-baslik { margin: 12px 0 26px; font-size: 31px; line-height: 1.2; font-weight: 600; letter-spacing: 0; color: #242424; }
  .ls-govde { display: grid; grid-template-columns: 208px minmax(0, 1fr); gap: 28px; align-items: start; }

  /* ---- filtre paneli */
  .ls-pb { margin: 0 0 12px; font-size: 17px; font-weight: 600; letter-spacing: 0; color: #242424; }
  .ls-grup { margin: 0; padding: 16px 0; border: 0; border-top: 1px solid #e8e8e8; min-width: 0; }
  .ls-grup fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
  .ls-grup legend { padding: 0; margin: 0 0 10px; font-size: 15px; font-weight: 600; color: #242424; }
  .ls-grup ul { list-style: none; margin: 0; padding: 0; }
  .ls-grup li { display: flex; align-items: center; gap: 8px; min-height: 30px; margin: 0; }
  .ls-grup input[type="checkbox"] { flex: none; width: 16px; height: 16px; margin: 0; accent-color: #333; }
  .ls-grup li label { display: flex; flex: 1; min-width: 0; justify-content: space-between; gap: 8px; font-size: 15px; line-height: 1.35; color: #242424; cursor: pointer; }
  .ls-grup li label span:first-child { overflow-wrap: anywhere; }
  .ls-grup input:disabled + label { color: #999; cursor: default; }
  .ls-adet { flex: none; font-size: 13px; color: #666; }
  .ls-daha { margin-top: 8px; padding: 0; background: none; border: 0; font: inherit; font-size: 14px; font-weight: 600; color: #242424; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
  .ls-bilgi { margin: 0; font-size: 15px; line-height: 1.4; color: #242424; }
  .ls-fiyat-alan { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .ls-fiyat-alan label { display: block; margin-bottom: 4px; font-size: 14px; color: #666; }
  .ls-fiyat-alan input { box-sizing: border-box; width: 100%; height: 40px; padding: 0 10px; border: 1px solid #c9c9c9; border-radius: 6px; font: inherit; font-size: 15px; color: #242424; background: #fff; }
  .ls-hata { margin: 8px 0 0; font-size: 14px; line-height: 1.4; color: #b3261e; }
  .ls-fiyat-form .ls-dugme { margin-top: 10px; min-height: 40px; }
  .ls-not { margin: 10px 0 0; font-size: 13px; line-height: 1.45; color: #666; }

  /* ---- araç çubuğu, etiketler */
  .ls-arac { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
  .ls-say { margin: 0; font-size: 15px; line-height: 1.4; color: #242424; }
  .ls-say:focus { outline: none; }
  .ls-sirala { display: flex; align-items: center; gap: 10px; font-size: 15px; color: #666; }
  .ls-sirala select { height: 40px; padding: 0 30px 0 10px; border: 1px solid #c9c9c9; border-radius: 6px; font: inherit; font-size: 15px; color: #242424; background-color: #fff; }
  .ls-secili { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 18px; }
  .ls-secili[hidden] { display: none; }
  .ls-etiket { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; padding: 0 10px; background: #f4f4f4; border: 1px solid #e8e8e8; border-radius: 6px; font: inherit; font-size: 14px; color: #242424; cursor: pointer; }
  .ls-etiket:hover { border-color: #333; }
  .ls-temizle { padding: 0 4px; background: none; border: 0; font: inherit; font-size: 14px; font-weight: 600; color: #242424; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

  /* ---- ürün ızgarası + kart (1024-1439: 3 sütun, >=1440: 4 sütun) */
  .ls-izgara { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px 24px; }
  .ls-izgara[hidden] { display: none; }
  .ls-kart { display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 0; background: #fff; }
  .ls-yuva { position: relative; aspect-ratio: 1 / 1; background: #fff; display: flex; justify-content: center; }      /* görünmez kare yuva: yükseklik = yuva genişliği */
  .ls-foto { display: block; flex: none; width: 66.6667%; height: 100%; background: #fff; }                          /* görünür/tıklanabilir 2:3 çerçeve */
  .ls-foto img { display: block; width: 100%; height: 100%; object-fit: contain; }
  .ls-fav { position: absolute; top: 4px; right: 4px; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; background: #fff; border: 1px solid #e8e8e8; border-radius: 50%; color: #242424; cursor: pointer; }
  .ls-fav svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
  .ls-fav[aria-pressed="true"] svg { fill: currentColor; }
  .ls-fav:hover { border-color: #333; }
  .ls-metin { flex: 1 1 auto; padding-top: 14px; text-align: center; }      /* fotoğraf ortalı, yazılar da ortalı (Burak: asimetri) */
  .ls-marka { margin: 0 0 4px; font-size: 12.5px; line-height: 1.4; color: #666; }
  .ls-ad { margin: 0; font-size: 16.5px; line-height: 1.35; font-weight: 600; min-height: 2.7em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
  .ls-ad a { color: #242424; text-decoration: none; }
  .ls-ad a:hover { text-decoration: underline; text-underline-offset: 3px; }
  .ls-ozellik { margin: 6px 0 0; font-size: 14px; line-height: 1.5; color: #666; min-height: 21px; }
  .ls-fiyat { margin: 10px 0 0; font-size: 14px; line-height: 1.3; color: #666; }
  .ls-fiyat strong { font-size: 22px; font-weight: 600; color: #242424; }
  .ls-birim { margin: 3px 0 0; font-size: 12.5px; line-height: 1.4; color: #666; }
  .ls-dugme { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; min-height: 44px; margin: 14px 0 0; padding: 0 16px; background: #333; color: #fff; border: 1px solid #333;
    border-radius: 6px; font: inherit; font-size: 15px; font-weight: 600; line-height: 1.2; text-decoration: none; cursor: pointer; transition: background-color .15s ease; }
  .ls-dugme:hover { background: #454545; border-color: #454545; }
  .ls-dugme-ince { background: #fff; color: #333; }
  .ls-dugme-ince:hover { background: #f4f4f4; color: #242424; border-color: #333; }
  .ls-tukendi { display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 44px; margin-top: 14px; border: 1px solid #e8e8e8; border-radius: 6px; font-size: 15px; color: #666; }
  .ls-bos { padding: 48px 0; text-align: center; }
  .ls-bos[hidden] { display: none; }
  .ls-bos p { margin: 0 0 16px; font-size: 16px; color: #242424; }
  .ls-bos .ls-dugme { display: inline-flex; width: auto; margin-top: 0; }

  /* ---- sayfalama */
  .ls-sayfa ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; list-style: none; margin: 44px 0 0; padding: 0; }
  .ls-sayfa a, .ls-sayfa span { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 40px; height: 40px; padding: 0 12px; border: 1px solid #e8e8e8; border-radius: 6px; font-size: 15px; color: #242424; text-decoration: none; }
  .ls-sayfa a:hover { border-color: #333; }
  .ls-sayfa .ls-simdi { background: #333; border-color: #333; color: #fff; font-weight: 600; }
  .ls-sayfa .ls-pasif { color: #999; }
  .ls-sayfa .ls-nokta { border-color: transparent; min-width: 24px; padding: 0; }
  .ls-destek { margin: 40px 0 0; padding-top: 20px; border-top: 1px solid #e8e8e8; font-size: 15px; color: #666; }
  .ls-destek a { color: #242424; text-decoration: underline; text-underline-offset: 3px; }
}
@media (min-width: 1344px) { .ls { width: min(1280px, 100% - 64px); } }
@media (min-width: 1440px) { .ls-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { .ls * { transition: none !important; } }