/* =====================================================================================================================
   İLHAM GALERİSİ v2 (27.09.2026) — /ilham, /ilham/urun-gorunumu/{id}. tasarim.css (--yt- belirteçleri) + araclar.css (.yt-arac-bas,
   .yt-pencere, .yt-bolum, .yt-iskelet …) üzerine yalnız bu araca özgü parçalar. Önek .ykg- (betikle sözleşme: public/js/yk/ilham.js).
   4 px ızgara; vurgu rengi lacivert (--yt-l); kırmızı (--yt-cta) YALNIZ "Sepete ekle". Mobil öncelikli; hareket prefers-reduced-motion'da kapalı.
   ===================================================================================================================== */
.ykg ul, .ykg ol { margin: 0; padding: 0; list-style: none; }
.ykg li { list-style: none; }
.ykg a.yt-cip, .ykg a.yt-btn, .ykg a.ykg-mekan, .ykg a.ykg-kart__ac { text-decoration: none; }

/* ------------------------------------------------------------------ mekân sekmeleri */
.ykg-mekanlar { margin: 0 0 16px; }
.ykg-mekanlar ul { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding: 2px 2px 6px; margin: -2px -2px 0; }
.ykg-mekanlar ul::-webkit-scrollbar { display: none; }
.ykg-mekanlar li { flex: 0 0 auto; }
.ykg a.ykg-mekan { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px; border: 1px solid var(--yt-cizgi-g); border-radius: var(--yt-r-o);
  background: var(--yt-beyaz); color: var(--yt-m); font-size: 14px; line-height: 20px; font-weight: 500; white-space: nowrap;
  transition: border-color .15s ease, background-color .15s ease, color .15s ease; }
.ykg a.ykg-mekan span { color: inherit; }   /* tema 'a span' kuralı yazıyı maviye boyamasın */
.ykg-mekan i { color: var(--yt-l); font-size: 15px; width: 18px; text-align: center; }
.ykg-mekan small { font-size: 12px; font-weight: 500; color: var(--yt-m3); font-variant-numeric: tabular-nums; }
.ykg a.ykg-mekan:hover { border-color: var(--yt-l); color: var(--yt-l-koyu); }
.ykg a.ykg-mekan.aktif { background: var(--yt-l); border-color: var(--yt-l); color: #fff; font-weight: 600; }
.ykg-mekan.aktif i, .ykg-mekan.aktif small { color: rgba(255, 255, 255, .88); }

/* ------------------------------------------------------------------ süzgeçler */
.ykg-suzgecler { padding: 16px 20px; margin: 0 0 16px; }
.ykg-suzgec-govde { display: flex; flex-direction: column; gap: 12px; }
.ykg-satir { display: flex; align-items: flex-start; gap: 8px 16px; flex-wrap: wrap; }
.ykg-satir__t { flex: 0 0 96px; padding-top: 7px; font-size: 13px; line-height: 18px; font-weight: 600; color: var(--yt-m2); }
.ykg-satir .ykg-cipler { flex: 1 1 0; min-width: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ykg-satir__not { flex: 1 0 100%; padding-left: 112px; margin-top: -4px; font-size: 12px; line-height: 16px; color: var(--yt-m3); }
.ykg .yt-cip small { font-size: 12px; font-weight: 500; color: var(--yt-m3); font-variant-numeric: tabular-nums; }
.ykg .yt-cip.aktif small { color: var(--yt-l); }
.ykg-ton__o { flex: 0 0 auto; width: 14px; height: 14px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(31, 45, 66, .22); }
.ykg-ton--acik { background: #efe8da; }
.ykg-ton--gri { background: #a2a7ae; }
.ykg-ton--koyu { background: #2f343a; }
.ykg-ton--ahsap { background: #9a6a43; }
.ykg-ton--renkli { background: conic-gradient(#d6453d, #e9a13b, #5aa55a, #3f8fc9, #7a5cc7, #d6453d); }
.ykg-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; padding-top: 12px; border-top: 1px solid var(--yt-cizgi); }
.ykg-form__alan { flex: 0 1 280px; min-width: 200px; }
.ykg-form.ykg-js .ykg-form__uygula { display: none; }
.ykg-suzgec-ac { width: 100%; justify-content: center; }
.ykg-suzgec-ac__n { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px;
  background: var(--yt-l); color: #fff; font-size: 12px; font-weight: 600; }

/* ------------------------------------------------------------------ sonuç başı */
.ykg-sonuc { display: flex; align-items: center; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; margin: 0 0 16px; min-height: 40px; }
.ykg-sonuc__sol { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ykg-sonuc__sag { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ykg-sonuc__say { margin: 0 4px 0 0; font-size: 14px; line-height: 20px; color: var(--yt-m2); }
.ykg-sonuc__say strong { color: var(--yt-l-koyu); font-weight: 700; font-variant-numeric: tabular-nums; }
.ykg-etiket { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 4px 4px 4px 12px; border: 1px solid var(--yt-l); border-radius: 999px;
  background: var(--yt-l-acik); color: var(--yt-l-koyu); font-size: 13px; line-height: 18px; font-weight: 500; }
.ykg a.ykg-etiket__sil { display: inline-flex; width: 24px; height: 24px; align-items: center; justify-content: center; border-radius: 50%; color: var(--yt-l); font-size: 12px;
  text-decoration: none; }
.ykg a.ykg-etiket__sil:hover { background: var(--yt-beyaz); color: var(--yt-l-koyu); }
.ykg a.ykg-temizle { font-size: 13px; }
.ykg a.ykg-kayitli { gap: 8px; }
.ykg-kayitli i { color: var(--yt-l); }
.ykg-kayitli__n { display: inline-flex; min-width: 20px; height: 20px; padding: 0 6px; align-items: center; justify-content: center; border-radius: 999px;
  background: var(--yt-l); color: #fff; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ykg-onceki { margin: 0 0 12px; font-size: 14px; }
.ykg-pano-not { margin: 0 0 16px; }

/* ------------------------------------------------------------------ ızgara (CSS sütunları: masonry) */
.ykg-izgara { column-count: 2; column-gap: 12px; }
@media (min-width: 768px) { .ykg-izgara { column-count: 3; column-gap: 16px; } }
@media (min-width: 1200px) { .ykg-izgara { column-count: 4; } }
.ykg-izgara--ek { margin-top: 0; }
.ykg-izgara--sabit { column-count: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 768px) { .ykg-izgara--sabit { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } }
.ykg-izgara--sabit .ykg-kart { margin: 0; }
.ykg-izgara--sabit .ykg-kart__ac img { aspect-ratio: 4 / 3; object-fit: cover; height: auto; }

.ykg-kart { position: relative; display: inline-block; width: 100%; margin: 0 0 16px; break-inside: avoid; -webkit-column-break-inside: avoid; page-break-inside: avoid;
  background: var(--yt-beyaz); border: 1px solid var(--yt-cizgi); border-radius: var(--yt-r-o); overflow: hidden; box-shadow: var(--yt-g1);
  transition: box-shadow .18s ease, border-color .18s ease; vertical-align: top; }
.ykg-kart:hover, .ykg-kart:focus-within { box-shadow: var(--yt-g2); border-color: var(--yt-l-orta); }
.ykg-kart--vurgu { border-color: var(--yt-l); box-shadow: 0 0 0 2px var(--yt-l); }
.ykg-kart__g { position: relative; background: #e8ecf1; }
.ykg a.ykg-kart__ac { position: relative; display: block; overflow: hidden; cursor: zoom-in; color: inherit; }
.ykg-kart__ac img { display: block; width: 100%; height: auto; transition: transform .35s ease; }
.ykg-kart__ac::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15, 21, 30, 0) 55%, rgba(15, 21, 30, .28) 100%); opacity: 0;
  transition: opacity .2s ease; pointer-events: none; }
.ykg-kart:hover .ykg-kart__ac img { transform: scale(1.03); }
.ykg-kart:hover .ykg-kart__ac::after, .ykg-kart__ac:focus-visible::after { opacity: 1; }
.ykg a.ykg-kart__ac:focus-visible { outline: 3px solid var(--yt-bag); outline-offset: -3px; }
.ykg-kart__incele { position: absolute; left: 50%; top: 50%; z-index: 1; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px;
  background: rgba(255, 255, 255, .96); color: var(--yt-l-koyu); font-size: 13px; line-height: 18px; font-weight: 600; white-space: nowrap; box-shadow: var(--yt-g2);
  opacity: 0; transform: translate(-50%, calc(-50% + 6px)); transition: opacity .18s ease, transform .18s ease; pointer-events: none; }
.ykg-kart__incele i { font-size: 12px; color: var(--yt-l); }
.ykg-kart:hover .ykg-kart__incele, .ykg-kart__ac:focus-visible .ykg-kart__incele { opacity: 1; transform: translate(-50%, -50%); }
.ykg-kart__rozet { position: absolute; left: 8px; top: 8px; z-index: 1; padding: 2px 10px; border-radius: 999px; background: var(--yt-l); color: #fff; font-size: 12px;
  line-height: 20px; font-weight: 600; }
.ykg-kart__sayi { position: absolute; right: 8px; bottom: 8px; z-index: 1; display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 999px;
  background: rgba(20, 29, 42, .78); color: #fff; font-size: 12px; line-height: 20px; font-weight: 500; pointer-events: none; }
.ykg-kart__sayi i { font-size: 11px; opacity: .85; }
.ykg-kaydet { position: absolute; right: 6px; top: 6px; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px;
  border: 0; border-radius: 50%; background: rgba(255, 255, 255, .94); color: var(--yt-l-koyu); font-size: 15px; cursor: pointer; box-shadow: var(--yt-g1);
  transition: background-color .15s ease, color .15s ease, transform .15s ease; }
.ykg-kaydet:hover { background: #fff; color: var(--yt-l); }
.ykg-kaydet:focus-visible { outline: 2px solid var(--yt-bag); outline-offset: 2px; }
.ykg-kaydet[aria-pressed="true"] { background: var(--yt-l); color: #fff; }
.ykg-kaydet[hidden] { display: none; }
/* fareyle gezinmede kaydet simgesi kartın üstüne gelince / odakta görünür (kaydedilmişse hep); dokunmatikte hep görünür */
@media (hover: hover) and (pointer: fine) {
  .ykg-kaydet { opacity: 0; transform: scale(.92); }
  .ykg-kart:hover .ykg-kaydet, .ykg-kart:focus-within .ykg-kaydet, .ykg-kaydet[aria-pressed="true"] { opacity: 1; transform: none; }
}
.ykg-kart__b { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px 12px; }
.ykg-kart__ust { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; min-height: 16px; font-size: 11px; line-height: 16px; }
.ykg-kart__marka { font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--yt-m3); }
.ykg-kart__mekan { display: inline-flex; align-items: center; gap: 4px; color: var(--yt-l); font-weight: 600; }
.ykg-kart__marka + .ykg-kart__mekan::before { content: ""; width: 3px; height: 3px; border-radius: 50%; background: var(--yt-m3); margin-right: 4px; }
.ykg a.ykg-kart__ad { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--yt-l-koyu); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; text-decoration: none; }
.ykg a.ykg-kart__ad:hover { color: var(--yt-bag); text-decoration: underline; }

/* yükleniyor iskeleti (betik ekler; 300 ms'den kısa yüklemede görünmez) */
.ykg-kart--iskelet { box-shadow: none; }
.ykg-kart--iskelet .yt-iskelet { border-radius: 0; }
.ykg-kart--iskelet .ykg-kart__b { gap: 0; }

/* ------------------------------------------------------------------ daha fazla göster + sayfalama */
.ykg-daha { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 24px 0 8px; text-align: center; }
.ykg-daha__durum { margin: 0; font-size: 13px; line-height: 18px; color: var(--yt-m2); font-variant-numeric: tabular-nums; }
.ykg-daha__cubuk { width: 200px; max-width: 70%; height: 4px; border-radius: 999px; background: var(--yt-l-orta); overflow: hidden; }
.ykg-daha__cubuk span { display: block; height: 100%; background: var(--yt-l); border-radius: inherit; transition: width .3s ease; }
.ykg-daha__btn { min-width: 240px; }
.ykg-daha__btn[aria-busy="true"] { opacity: .7; pointer-events: none; }
.ykg-sayfalama { margin: 16px 0 0; }
.ykg-sayfalama[hidden] { display: none; }
.ykg-sayfalama ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.ykg-sayfalama a, .ykg-sayfalama span { min-width: 40px; height: 40px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--yt-cizgi-g); border-radius: var(--yt-r); background: var(--yt-beyaz); color: var(--yt-m); font-size: 14px; text-decoration: none;
  font-variant-numeric: tabular-nums; }
.ykg .ykg-sayfalama a { color: var(--yt-m); }
.ykg .ykg-sayfalama a:hover { border-color: var(--yt-l); color: var(--yt-l-koyu); text-decoration: none; }
.ykg-sayfalama .aktif { background: var(--yt-l); border-color: var(--yt-l); color: #fff; font-weight: 600; }
.ykg-sayfalama .ykg-bosluk { border-color: transparent; background: transparent; }

/* ------------------------------------------------------------------ boş / hata durumu */
.ykg-bos-kap { margin: 8px 0 0; }
.ykg-bos { padding: 48px 20px; }
.ykg-bos__e { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 8px; }
.ykg-oneriler { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 8px; width: 100%; max-width: 440px; }
.ykg-oneriler li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border: 1px solid var(--yt-cizgi); border-radius: var(--yt-r-o);
  background: var(--yt-l-zemin); font-size: 14px; text-align: left; }
.ykg-oneriler i { color: var(--yt-l); margin-right: 6px; font-size: 12px; }
.ykg-oneriler span { flex: 0 0 auto; font-size: 13px; color: var(--yt-m2); font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------------ eylem düğmeleri (kaydet / paylaş) */
.ykg-eylemler { display: flex; flex-wrap: wrap; gap: 8px; }
.ykg-kaydet-metin[aria-pressed="true"] { background: var(--yt-l-acik); border-color: var(--yt-l); color: var(--yt-l-koyu); }
.ykg-eylemler [hidden] { display: none; }

/* ------------------------------------------------------------------ ürün paneli ("Bu görünümdeki ürünler") */
.ykg-panel { display: flex; flex-direction: column; gap: 14px; }
.ykg-panel__bas { display: flex; flex-direction: column; gap: 2px; }
.ykg-panel__t { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16px; line-height: 24px; font-weight: 700; color: var(--yt-l-koyu); }
.ykg-panel__n { display: inline-flex; min-width: 24px; height: 22px; padding: 0 8px; align-items: center; justify-content: center; border-radius: 999px; background: var(--yt-l-acik);
  color: var(--yt-l); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ykg-panel__a { margin: 0; font-size: 13px; line-height: 18px; color: var(--yt-m2); }
.ykg-urunler { display: flex; flex-direction: column; border: 1px solid var(--yt-cizgi); border-radius: var(--yt-r-o); background: var(--yt-beyaz); }
.ykg-urun { display: flex; gap: 12px; padding: 12px; border-top: 1px solid var(--yt-cizgi); }
.ykg-urun:first-child { border-top: 0; }
.ykg-urun__g { flex: 0 0 72px; width: 72px; height: 72px; display: flex; align-items: center; justify-content: center; border-radius: var(--yt-r-o); overflow: hidden;
  background: var(--yt-zemin); border: 1px solid var(--yt-cizgi); color: var(--yt-m3); }
.ykg-urun__g img { width: 100%; height: 100%; object-fit: contain; display: block; background: #fff; }
.ykg-urun__b { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ykg-urun__marka { font-size: 11px; line-height: 16px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--yt-m3); }
.ykg .ykg-urun__ad { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--yt-l-koyu); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; text-decoration: none; }
.ykg a.ykg-urun__ad:hover { color: var(--yt-bag); text-decoration: underline; }
.ykg-urun__olcu { font-size: 12px; line-height: 16px; color: var(--yt-m2); }
.ykg-urun__fiyat { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-top: 2px; font-size: 13px; line-height: 20px; }
.ykg-urun__fiyat strong { font-size: 16px; line-height: 22px; font-weight: 700; color: var(--yt-m); font-variant-numeric: tabular-nums; }
.ykg-urun__fiyat s { color: var(--yt-m3); font-size: 12px; }
.ykg-urun__teklif { font-weight: 600; color: var(--yt-l); }
.ykg-urun__yok { font-weight: 600; color: var(--yt-m2); }
.ykg-urun__eylem { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 6px; }
.ykg-urun__eylem [hidden] { display: none; }
.ykg a.ykg-urun__oda { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; font-size: 13px; font-weight: 600; color: var(--yt-l); }
.ykg a.ykg-urun__oda:hover { color: var(--yt-l-koyu); }
.ykg-urun__durum { margin: 0; font-size: 12px; line-height: 16px; color: var(--yt-m2); }
.ykg-urun__durum:empty { display: none; }
.ykg-urun__durum.ok { color: var(--yt-ok); font-weight: 600; }
.ykg-urun__durum.hata { color: var(--yt-hata); }
.ykg-urun--yok .ykg-urun__g { opacity: .6; }
.ykg-panel__fazla { margin: 0; font-size: 13px; line-height: 18px; color: var(--yt-m2); }
.ykg-panel__not { font-size: 13px; line-height: 18px; }
.ykg-panel__kunye { margin: -4px 0 0; font-size: 12px; line-height: 16px; color: var(--yt-m3); }

/* benzer görünümler (ışık kutusunda küçük ızgara) */
.ykg-benzer { padding-top: 14px; border-top: 1px solid var(--yt-cizgi); }
.ykg-benzer__t { margin: 0; font-size: 15px; line-height: 22px; font-weight: 700; color: var(--yt-l-koyu); }
.ykg-benzer__a { margin: 0 0 10px; font-size: 12px; line-height: 16px; color: var(--yt-m3); }
.ykg-benzer__liste { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ykg-benzer__liste a { display: block; border-radius: var(--yt-r); overflow: hidden; background: #e8ecf1; }
.ykg-benzer__liste img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; transition: transform .25s ease; }
.ykg-benzer__liste a:hover img { transform: scale(1.05); }
.ykg-benzer__liste a:focus-visible { outline: 2px solid var(--yt-bag); outline-offset: 2px; }

/* ------------------------------------------------------------------ ışık kutusu (yt-pencere + dialog) */
html.ykg-kilit { overflow: hidden; }
.ykg-pencere { max-width: none; width: min(1180px, 94vw); height: min(820px, 92vh); color: var(--yt-m); background: var(--yt-beyaz); }
.ykg-pencere[open] { display: block; }
.ykg-pencere .ykg-pencere__ic { height: 100%; max-height: none; grid-template-columns: minmax(0, 1.6fr) minmax(320px, 1fr); }
.ykg-pencere__g { min-height: 0; height: 100%; overflow: hidden; touch-action: pan-y; }
.ykg-pencere__g img { width: 100%; height: 100%; max-width: none; max-height: none; object-fit: contain; }   /* küçük türev büyükle aynı kutuda: geçişte sıçrama yok */
.ykg-pencere__b { height: 100%; padding: 20px 20px 24px; overscroll-behavior: contain; }
.ykg-pencere__bas { display: flex; flex-direction: column; gap: 6px; padding-right: 40px; }
.ykg-pencere__ust { margin: 0; font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--yt-m3); }
.ykg-pencere__t { margin: 0 0 6px; font-size: 20px; line-height: 28px; font-weight: 700; color: var(--yt-l-koyu); text-wrap: balance; }
.ykg-pencere__govde { min-height: 120px; }
.ykg-pencere__kapat { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; }
.ykg-pencere__kapat:focus-visible, .ykg-ok:focus-visible { outline: 2px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 4px var(--yt-bag); }
.ykg-ok { position: absolute; top: 50%; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-top: -22px; border: 0;
  border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--yt-l-koyu); font-size: 16px; cursor: pointer; box-shadow: var(--yt-g2); transition: opacity .15s ease; }
.ykg-ok--sol { left: 12px; }
.ykg-ok--sag { right: 12px; }
.ykg-ok[disabled] { opacity: 0; pointer-events: none; }
.ykg-pencere__sayac { position: absolute; left: 12px; bottom: 12px; padding: 2px 10px; border-radius: 999px; background: rgba(20, 29, 42, .72); color: #fff; font-size: 12px;
  line-height: 20px; font-variant-numeric: tabular-nums; }
.ykg-pencere__sayac:empty { display: none; }
.ykg-pencere .yt-iskelet--satir { height: 14px; }
.ykg-hata-kutu { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 16px; border: 1px solid var(--yt-cizgi); border-radius: var(--yt-r-o);
  background: var(--yt-l-zemin); font-size: 14px; }

/* ------------------------------------------------------------------ görünüm sayfası */
.ykg-g { padding: 16px 0 56px; }
.ykg-g .ykg-g__yol { background: transparent; padding: 0; margin: 0 0 16px; font-size: 13px; }
.ykg-g .ykg-g__yol > li { display: inline-block !important; }
.ykg-g__duzen { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(320px, 1fr); gap: 28px; align-items: start; }
.ykg-g__foto { position: sticky; top: 16px; margin: 0; }
.ykg-g__cerceve { border-radius: var(--yt-r-b); overflow: hidden; background: #e8ecf1; border: 1px solid var(--yt-cizgi); }
.ykg-g__img { display: block; width: 100%; height: auto; max-height: 80vh; object-fit: contain; background: #f1f3f6; }
.ykg-g__kunye { margin-top: 8px; font-size: 12px; line-height: 16px; color: var(--yt-m3); }
.ykg-g__yan { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ykg-g__on { color: var(--yt-l); }
.ykg-g__h1 { margin: 0; font-size: 26px; line-height: 34px; font-weight: 700; color: var(--yt-l-koyu); text-wrap: balance; }
.ykg-g__marka { margin: -4px 0 0; font-size: 13px; line-height: 18px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--yt-m3); }
.ykg-g__yan .ykg-eylemler { margin-bottom: 6px; }
.ykg-g__benzer { margin-top: 40px; }
.ykg-g__don { margin: 32px 0 0; font-size: 14px; }

/* ------------------------------------------------------------------ bildirim (kopyalandı vb.) */
.ykg-bildirim { position: fixed; left: 50%; bottom: 24px; z-index: 10060; max-width: calc(100vw - 32px); padding: 10px 16px; border-radius: var(--yt-r-o); background: var(--yt-l-koyu);
  color: #fff; font-size: 14px; line-height: 20px; box-shadow: var(--yt-g3); transform: translate(-50%, 12px); opacity: 0; pointer-events: none;
  transition: opacity .2s ease, transform .2s ease; }
.ykg-bildirim.acik { opacity: 1; transform: translate(-50%, 0); }

/* ------------------------------------------------------------------ duyarlı */
@media (max-width: 991px) {
  .ykg-g__duzen { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .ykg-g__foto { position: static; }
  /* dar ekranda üst üste: fotoğraf alanı SABİT yükseklikte (yüklenirken kayma yok), panel altında; tüm pencere kayar */
  .ykg-pencere .ykg-pencere__ic { display: block; height: 100%; overflow-y: auto; overscroll-behavior: contain; }
  .ykg-pencere__g { height: min(60vh, 520px); min-height: 0; }
  .ykg-pencere__b { height: auto; overflow: visible; }
}
@media (max-width: 767px) {
  .ykg-suzgecler { padding: 12px; }
  .ykg-suzgecler.ykg-kapali .ykg-suzgec-govde { display: none; }
  .ykg-suzgecler .ykg-suzgec-govde { margin-top: 12px; }
  .ykg-suzgecler.ykg-kapali { padding: 0; border: 0; background: transparent; box-shadow: none; }
  .ykg-satir { flex-direction: column; gap: 6px; }
  .ykg-satir__t { flex-basis: auto; padding-top: 0; }
  .ykg-satir .ykg-cipler { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%; padding-bottom: 2px; }
  .ykg-satir .ykg-cipler::-webkit-scrollbar { display: none; }
  .ykg-satir .ykg-cipler li { flex: 0 0 auto; }
  .ykg-satir__not { padding-left: 0; margin-top: 0; }
  .ykg-form__alan { flex: 1 1 100%; min-width: 0; }
  .ykg .yt-cip { min-height: 40px; }
  .ykg-kart { margin-bottom: 12px; }
  .ykg-kart__b { padding: 8px 10px 10px; }
  .ykg a.ykg-kart__ad { font-size: 13px; line-height: 18px; }
  .ykg-kart__incele { display: none; }
  .ykg-pencere { width: 100vw; height: 100%; max-height: none; margin: 0; border-radius: 0; }
  .ykg-pencere__g { height: min(50vh, 420px); }
  .ykg-pencere__b { padding: 16px 16px 28px; }
  .ykg-ok { width: 40px; height: 40px; margin-top: -20px; }
  .ykg-g__h1 { font-size: 22px; line-height: 30px; }
  .ykg-urun__g { flex-basis: 64px; width: 64px; height: 64px; }
  .ykg-daha__btn { width: 100%; min-width: 0; }
}
@media (max-width: 400px) {
  .ykg-izgara { column-gap: 10px; }
  .ykg-kart { margin-bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .ykg-kart__ac img, .ykg-kart:hover .ykg-kart__ac img, .ykg-benzer__liste img, .ykg-kart__incele, .ykg-bildirim, .ykg-daha__cubuk span { transition: none; transform: none; }
  .ykg-kart:hover .ykg-kart__incele { transform: translate(-50%, -50%); }
  .ykg-bildirim.acik { transform: translate(-50%, 0); }
}
@media print {
  .ykg-suzgecler, .ykg-daha, .ykg-sayfalama, .ykg-kaydet, .ykg-eylemler, .ykg-urun__eylem { display: none !important; }
}