/*
 * liste-karti.css — kategori / arama / marka liste kartları + filtre + sayfalama (07.10.2026 Sunai, UX-2). Eşleri: includes/liste_karti.php,
 * js/liste-paylas.js. <head>'de yüklenir (kategori.php/arama.php/markalar.php $extraHead). Tailwind derlemesine bağımsız (JIT tuzağı).
 * Uyguno yalnız açık tema. Renkler ana sayfa v3 ile aynı aile; beyaz zemine göre:
 *   kasa turuncusu #c2410c 5,18:1 (beyaz metinle de 5,18:1) · fiş mürekkebi #0f172a 17,8:1 · etiket grisi #475569 7,6:1
 *   indirim kırmızısı #b91c1c (beyaz 6,47:1) · liste yeşili #15803d (beyaz 5,02:1) · şerit bağlantısı #fdba74 / #0f172a 10,6:1
 * İmza: "liste şeridi" — + basılınca ekranın altında tek satır: "Alışveriş listende N ürün · Listeyi gör". Liste iç sayfalarda
 * yalnız menü çekmecesinde (06.10 kararı, K1 açık); şerit eklenen ürünün NEREYE gittiğini söyler. Tek hareket o; gerisi sakin.
 */

/* ---------- Kart: bütün kart tek bağlantı (::after), liste düğmesi bağlantının KARDEŞİ ---------- */
.lk-kart { position: relative; }
.lk-bag {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  color: inherit;
  text-decoration: none;
}
.lk-bag::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.lk-bag:focus { outline: none; }
.lk-bag:focus-visible::after { outline: 3px solid #c2410c; outline-offset: 2px; }

.lk-ekle {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  background: #fff;
  color: #0f172a;
  cursor: pointer;
  box-shadow: 0 1px 2px rgb(15 23 42 / .12);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.lk-ekle::before { content: ""; position: absolute; inset: -4px; border-radius: 999px; } /* dokunma alanı 44 px */
.lk-ekle:hover { background: #c2410c; border-color: #c2410c; color: #fff; }
.lk-ekle:focus-visible { outline: 3px solid #c2410c; outline-offset: 2px; }
.lk-ik { grid-area: 1 / 1; width: 18px; height: 18px; transition: transform .2s ease, opacity .2s ease; }
.lk-ik--tamam { opacity: 0; transform: scale(.6); }
.lk-ekle[aria-pressed="true"] { background: #15803d; border-color: #15803d; color: #fff; }
.lk-ekle[aria-pressed="true"]:hover { background: #166534; border-color: #166534; }
.lk-ekle[aria-pressed="true"] .lk-ik--arti { opacity: 0; transform: rotate(90deg) scale(.6); }
.lk-ekle[aria-pressed="true"] .lk-ik--tamam { opacity: 1; transform: none; }

/* ---------- Kart rozetleri (Görai G-05/G-16: 700 tonları, ≥ 11 px) ---------- */
.lk-rozet {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
}
.lk-rozet--bim       { background: #b91c1c; color: #fff; }   /* 6,47:1 */
.lk-rozet--sok       { background: #facc15; color: #7f1d1d; } /* 6,54:1 */
.lk-rozet--a101      { background: #0f766e; color: #fff; }   /* 5,47:1 */
.lk-rozet--migros    { background: #c2410c; color: #fff; }   /* 5,18:1 */
.lk-rozet--carrefour { background: #1e3a8a; color: #fff; }   /* 10,4:1 */
.lk-rozet--diger     { background: #e2e8f0; color: #334155; } /* 8,4:1 */
.lk-indirim {
  padding: 2px 6px;
  border-radius: 8px;
  background: #b91c1c;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
}

/* ---------- Filtreler ---------- */
.lk-kutu-secili { background: #c2410c; border-color: #c2410c; }           /* seçili kutu: beyaza 5,18:1 (1.4.11) */
.lk-cip-secili  { background: #c2410c; border-color: #c2410c; color: #fff; }
.lk-dolgu       { background: #c2410c; }
.lk-aralik { display: flex; align-items: flex-end; gap: 8px; }
.lk-aralik-alan { flex: 1 1 0; min-width: 0; }
.lk-aralik-etiket { display: block; margin-bottom: 4px; font-size: 12px; font-weight: 600; color: #475569; }
.lk-girdi {
  width: 100%;
  min-height: 44px;
  padding: 0 10px;
  border: 1px solid #64748b;           /* alan sınırı beyaza 4,76:1 (1.4.11 ≥ 3:1); odakta turuncu halka */
  border-radius: 10px;
  background: #fff;
  color: #0f172a;
  font: inherit;
  font-size: 16px;                     /* iOS odakta yakınlaştırmasın */
  font-variant-numeric: tabular-nums;
}
.lk-girdi:focus { outline: 3px solid #c2410c; outline-offset: 1px; border-color: #c2410c; }
.lk-aralik-uygula {
  display: grid;
  place-items: center;
  flex: none;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: #c2410c;
  color: #fff;
  cursor: pointer;
}
.lk-aralik-uygula:hover { background: #9a3412; }
.lk-aralik-uygula:focus-visible { outline: 3px solid #c2410c; outline-offset: 2px; }
.lk-aralik-uygula svg { width: 20px; height: 20px; }
@media (min-width: 640px) { .lk-girdi { font-size: 14px; } }

/* ---------- Sayfalama ---------- */
.lk-sayfa-ok { min-height: 44px; }

/* ---------- Liste şeridi (imza) ---------- */
.lk-serit {
  position: fixed;
  left: 12px;
  right: 72px;                         /* "Sayfa başına dön" düğmesinin (sağ alt, 44 px) üstüne binmez */
  bottom: calc(76px + env(safe-area-inset-bottom, 0px));
  z-index: 55;
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 460px;
  min-height: 52px;
  padding: 4px 4px 4px 14px;
  border-radius: 14px;
  background: #0f172a;
  color: #fff;
  font-size: 14px;
  line-height: 1.35;
  box-shadow: 0 12px 32px rgb(15 23 42 / .28);
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, 12px, 0);
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
}
.lk-serit.is-acik { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease, transform .2s ease, visibility 0s; }
.lk-serit-ik { flex: none; width: 20px; height: 20px; color: #86efac; }
.lk-serit-metin { flex: 1 1 auto; min-width: 0; }
.lk-serit a {
  display: inline-flex;
  align-items: center;
  flex: none;
  min-height: 44px;
  padding: 0 12px;
  border-radius: 10px;
  color: #fdba74;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
}
.lk-serit a:focus-visible { outline: 3px solid #fdba74; outline-offset: -3px; }
@media (min-width: 1024px) { .lk-serit { left: 24px; right: auto; bottom: 24px; } }

@media (prefers-reduced-motion: reduce) {
  .lk-ekle, .lk-ik, .lk-serit, .lk-serit.is-acik { transition: none; }
  .lk-serit { transform: none; }
}

/* ==========================================================================
   80 · TASARIM DALGASI D3 — liste kartı = raf etiketi dili (07.10.2026 Sunai)
   Kullanan: kategori.php (kart markup'ı değişti, önbellek kategori:html:v12). arama.php / markalar.php markup'ı DEĞİŞMEDİ;
   onları yalnız .lk-indirim rengi ve görsel yok yer tutucusu etkiler.
   Ölçüt ana sayfa (css/anasayfa-v3.css): yeşil #15803d = yalnız "en ucuz" · market rengi yalnız kare işaret ·
   kesikli 2 px çizgi = fiyat bandı · Tipografi B: başlık 650, fiyat 750, meta 450 (Inter; kategori sayfası Tailwind
   Inter'ini kullanıyor, yeni dosya yok).
   ========================================================================== */
.lk-kart { --lk-murekkep: #0f172a; --lk-etiket: #475569; --lk-cizgi: #e2e8f0; --lk-kazanc: #15803d; }
.lk-marka { margin: 2px 0 2px; font-size: .8125rem; font-weight: 450; line-height: 1.3; color: var(--lk-etiket); letter-spacing: 0; }
.lk-ad {
  flex: 1 0 auto; margin: 0 0 10px; font-size: 1rem; font-weight: 500; line-height: 1.375; color: var(--lk-murekkep);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.75em;
  text-wrap: pretty;   /* "Süt 1
L" gibi tek karakterlik yetim satır olmasın */
}
.lk-kart:hover .lk-ad { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: #cbd5e1; }
.lk-alt { padding-top: 8px; border-top: 2px dashed var(--lk-cizgi); }
.lk-pazar { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; margin: 0 0 2px; font-size: .8125rem; line-height: 1.35; color: var(--lk-etiket); }
.lk-en { font-weight: 450; }
.lk-daha { font-weight: 450; white-space: nowrap; }
.lk-mk { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; color: var(--lk-murekkep); white-space: nowrap; }
.lk-mk-n { width: 9px; height: 9px; border-radius: 3px; background: var(--m, #64748b); box-shadow: inset 0 0 0 1px rgb(15 23 42 / .15); flex: none; }
.lk-mk--bim { --m: #e30613; } .lk-mk--a101 { --m: #0097a7; } .lk-mk--sok { --m: #ffcb05; }
.lk-mk--migros { --m: #f37021; } .lk-mk--carrefour { --m: #0055a5; } .lk-mk--koop { --m: #00843d; } .lk-mk--diger { --m: #64748b; }
.lk-fiyat-satir { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 8px; margin: 0; }
.lk-fiyat { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--lk-murekkep); font-size: 1.1875rem; }
.lk-fiyat--en { color: var(--lk-kazanc); }
.lk-fg { display: inline-flex; align-items: flex-start; font-weight: 750; letter-spacing: -0.03em; line-height: 1; }
.lk-fl { font-size: 1.25em; }
.lk-fk, .lk-ftl { font-size: .72em; margin-top: .08em; }
.lk-ftl { margin-left: .18em; font-weight: 600; }
.lk-eski { font-size: .8125rem; font-weight: 450; color: var(--lk-etiket); font-variant-numeric: tabular-nums; }
.lk-birim {
  display: inline-block; margin: 6px 0 0; padding: 2px 8px; border-radius: 999px; background: #f1f5f9;
  font-size: .8125rem; font-weight: 450; line-height: 1.4; color: #334155; font-variant-numeric: tabular-nums;
}
/* İndirim: ana sayfadaki düşüş rozetiyle aynı yeşil (önce kırmızı #b91c1c — "kötü" sinyali veriyordu) */
.lk-indirim { background: #15803d; border-radius: 999px; padding: 3px 9px; font-size: 12px; font-weight: 750; font-variant-numeric: tabular-nums; }
/* Görsel yok: dev sepet ikonu yerine küçük, sakin yer tutucu (ana sayfa .gorsel-yer %36) */
.lk-kart img.gorsel-yok { padding: 30% !important; opacity: .55; }

/* --- Sıralama + tür çipleri: mobilde TEK SATIR kayar (önce: 3 satır, ilk ürün 960 px'te başlıyordu) --- */
[data-facet="sort"] > a, [data-facet="type"] > a {
  min-height: 44px; display: inline-flex; align-items: center; font-size: .875rem; font-weight: 500;
}
[data-facet="sort"] > a[aria-current="true"] { font-weight: 600; }
[data-facet="type"] > a > span.w-2 { display: none; }            /* her çipte turuncu nokta: bilgi taşımıyordu */
@media (max-width: 767px) {
  [data-facet="sort"] { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; margin-inline: -16px; padding-inline: 16px; scroll-padding-inline: 16px; }
  [data-facet="sort"]::-webkit-scrollbar { display: none; }
  [data-facet="sort"] > * { flex: none; white-space: nowrap; }
}

/* --- Tipografi B: sayfa başlığı 800 → 650 --- */
h1.speakable-title { font-weight: 650; letter-spacing: -0.028em; }

/* 11.10.2026 Sunai — market adı yerine LOGO (includes/market_logo.php 'rozet': yükseklik ≤18, genişlik ≤84; alt = ad).
   Satır yüksekliği sabit 18 px → logo yüklenirken kayma yok (CLS 0); işaret karesi logoda gereksiz, basılmıyor. */
.lk-mk--logo { gap: 0; min-height: 18px; max-width: 100%; }
.lk-mk--logo .mlogo { display: block; max-width: 100%; height: auto; }

/* 11.10.2026 Sunai tur2: ?v= yenileme (tur1 ACL penceresinde 404 önbelleğe girmiş olabilir) */