/* Ürünler (K34): katalog ve ürün sayfası. Renkler ana sayfanın koyu
   vitrin değişkenlerinden (ana.css .koyu). Tablo yok: özellikler dar
   ekranda alt alta (genel mobil kuralı). */

[hidden] { display: none !important; }

.urun-govde main { min-height: 60vh; }
.ana .urun-bas { padding: 72px 0 96px; }
.urun-bas .bolum-bas { margin-bottom: 28px; }
.urun-bos { color: var(--muted); font-size: 15px; margin: 8px 0 0; }

/* ---- süzgeç */
.urun-filtre { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.urun-filtre button {
  min-height: 36px; padding: 6px 14px; border-radius: 999px; font: inherit; font-size: 14px; cursor: pointer;
  background: transparent; color: var(--ink); border: 1px solid var(--line);
}
.urun-filtre button:hover { border-color: var(--accent); }
.urun-filtre button[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }

/* ---- katalog ızgarası */
.urun-izgara { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.urun-kart { padding: 0; display: flex; flex-direction: column; color: inherit; text-decoration: none; }
.urun-kart:hover { text-decoration: none; }
.urun-gorsel {
  aspect-ratio: 4 / 3; display: grid; place-items: center; overflow: hidden;
  background: color-mix(in srgb, var(--ink) 5%, var(--panel)); border-bottom: 1px solid var(--line);
}
.urun-gorsel img { width: 100%; height: 100%; object-fit: contain; display: block; }
.urun-gorsel-yok {
  display: grid; place-items: center; width: 100%; height: 100%;
  font: 700 44px/1 var(--mono); color: color-mix(in srgb, var(--accent) 60%, var(--muted));
}
.urun-kart-govde { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.urun-kart-govde h3 { margin: 0; font-size: 18px; }
.urun-kart-govde p { font-size: 14.5px; }
.urun-kart-alt { margin-top: auto; padding-top: 8px; display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; justify-content: space-between; }
.urun-kategori { font: 600 12px/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--accent); margin: 0; }
.urun-fiyat { font-weight: 700; font-size: 16px; color: var(--ink); }
.urun-stok {
  font-size: 12.5px; font-weight: 600; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--line);
  color: var(--muted);
}
.urun-stok.s-var { color: var(--ok); border-color: color-mix(in srgb, var(--ok) 40%, var(--line)); }
.urun-stok.s-siparisle { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); }
.urun-stok.s-tukendi { color: var(--bad); border-color: color-mix(in srgb, var(--bad) 40%, var(--line)); }
.urun-stok.s-yakinda { color: var(--uyari); border-color: color-mix(in srgb, var(--uyari) 40%, var(--line)); }

/* ---- ürün sayfası */
.urun-detay { padding-top: 36px; padding-bottom: 90px; }       /* yan boşluk .kap'tan (telefonda 16 px) */
.ana .urun-detay section { padding: 0; }                        /* ana sayfanın 104 px bölüm boşluğu burada yok */
.urun-detay .geri { display: inline-flex; align-items: center; min-height: 34px; font-size: 14px; color: var(--muted); margin: 0 0 18px; }
.urun-ust { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 40px; align-items: start; }
.urun-galeri { display: grid; gap: 10px; min-width: 0; }
.urun-ana-gorsel {
  aspect-ratio: 4 / 3; display: grid; place-items: center; overflow: hidden; border-radius: 16px;
  background: color-mix(in srgb, var(--ink) 5%, var(--panel)); border: 1px solid var(--line);
}
.urun-ana-gorsel img { width: 100%; height: 100%; object-fit: contain; display: block; }
.urun-gorsel-yok.buyuk { font-size: 72px; }
.urun-kucukler { display: flex; flex-wrap: wrap; gap: 8px; }
.urun-kucuk {
  width: 64px; height: 64px; padding: 0; overflow: hidden; border-radius: 10px; cursor: pointer;
  background: color-mix(in srgb, var(--ink) 5%, var(--panel)); border: 1px solid var(--line);
}
.urun-kucuk img { width: 100%; height: 100%; object-fit: cover; display: block; }
.urun-kucuk[aria-pressed="true"] { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.urun-bilgi { display: grid; gap: 14px; align-content: start; min-width: 0; }
.urun-bilgi h1 { margin: 0; font-size: clamp(26px, 4vw, 38px); letter-spacing: -.02em; line-height: 1.15; overflow-wrap: anywhere; }
.urun-bilgi .rozetler { margin: 0; }
.urun-fiyat-kutu { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.urun-fiyat-kutu .urun-fiyat { font-size: 26px; }
.urun-fiyat-notu { color: var(--muted); font-size: 14px; }
.urun-ozet { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.65; }
.urun-bilgi .btn { justify-self: start; }
.urun-ayrinti { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 40px; margin: 48px 0 0; }
.urun-ayrinti h2, .siparis h2 { font-size: 20px; margin: 0 0 14px; }
.urun-aciklama p { margin: 0 0 12px; line-height: 1.7; white-space: pre-line; overflow-wrap: anywhere; }
.urun-ozellik { margin: 0; display: grid; gap: 0; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.urun-ozellik > div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 12px; padding: 10px 14px; }
.urun-ozellik > div + div { border-top: 1px solid var(--line); }
.urun-ozellik dt { color: var(--muted); font-size: 14px; overflow-wrap: anywhere; }
.urun-ozellik dd { margin: 0; font-weight: 600; font-size: 14.5px; overflow-wrap: anywhere; }
.urun-yok { padding: 40px 0; display: grid; gap: 12px; justify-items: start; }
.urun-yok h1 { margin: 0; }

/* ---- sipariş talebi */
.ana .urun-detay .siparis {
  margin: 56px 0 0; padding: 28px; border-radius: 16px; border: 1px solid var(--line);
  background: linear-gradient(180deg, var(--panel), color-mix(in srgb, var(--panel) 55%, var(--bg)));
}
.siparis > p { margin: 0 0 18px; }
.siparis-form { padding: 0; }

/* ---- mağaza vitrini (K36) */
.gorunmez { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.urun-kart-ust { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.urun-rozet {
  font: 700 11.5px/1.2 var(--mono); letter-spacing: .06em; text-transform: uppercase;
  padding: 4px 8px; border-radius: 999px; background: var(--accent); color: var(--accent-ink);
}
.urun-eski-fiyat { color: var(--muted); font-weight: 500; font-size: .85em; }
.one-cikan-bolum { margin: 0 0 8px; }
.urun-ara-baslik { font-size: 20px; margin: 0 0 16px; }
.one-cikan-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 40px; }
.one-cikan .urun-kart-govde h3 { font-size: 21px; }

/* ---- çerez bandı (K36): akışın içinde, sayfanın en üstünde (içeriğin üstüne binmez) */
.cerez-bant { background: var(--panel); border-bottom: 1px solid var(--line); padding: 14px 0; }
.cerez-bant .kap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; }
.cerez-bant p { margin: 0; flex: 1 1 320px; font-size: 14.5px; color: var(--ink); }
.cerez-dugmeler { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.cerez-dugmeler button {
  min-height: 38px; padding: 8px 18px; border-radius: 9px; font: 600 14.5px/1.2 var(--yazi); cursor: pointer;
  background: var(--accent); color: var(--accent-ink); border: 1px solid var(--accent);   /* kabul ve red eşit görünür */
}
.cerez-ayrinti { display: inline-flex; align-items: center; min-height: 34px; font-size: 14px; }
.baglanti-dugme {
  display: inline-flex; align-items: center; min-height: 34px; padding: 0; border: 0; background: none;
  color: var(--accent); font: inherit; cursor: pointer; text-decoration: underline;
}

@media (max-width: 980px) {
  .urun-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .urun-ust, .urun-ayrinti { grid-template-columns: minmax(0, 1fr); gap: 28px; }
}
@media (max-width: 760px) {
  .urun-ozellik > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .ana .urun-detay .siparis { padding: 20px 16px; }
}
@media (max-width: 620px) {
  .urun-izgara, .one-cikan-izgara { grid-template-columns: minmax(0, 1fr); }
  .cerez-dugmeler button { flex: 1 1 auto; }
  .ana .urun-bas { padding: 48px 0 64px; }
  .urun-bilgi .btn { justify-self: stretch; }
}