/* ===== Ürün listeleme (urunler.php) ===== */
.ykmz-liste {
  --ykmz-ana: #fa5942;
  --ykmz-ana-koyu: #e04a34;
  --ykmz-yazi: #333;
  --ykmz-soluk: #8a8a8a;
  --ykmz-cizgi: #e6e6e6;
  --ykmz-zemin: #f5f5f5;
  --ykmz-yesil: #0bc15c;
  padding-top: .75rem;
  padding-bottom: 3rem;
  color: var(--ykmz-yazi);
}

/* Breadcrumb + başlık */
.ykmz-breadcrumb {
  display: flex; flex-wrap: wrap; gap: .25rem;
  list-style: none; padding: 0; margin: 0 0 .5rem;
  font-size: .75rem; color: var(--ykmz-soluk);
}
.ykmz-breadcrumb li + li::before { content: "›"; margin-right: .25rem; }
.ykmz-breadcrumb a { color: var(--ykmz-soluk); }
.ykmz-breadcrumb a:hover { color: var(--ykmz-ana); }

.ykmz-liste-baslik { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; margin-bottom: .75rem; }
.ykmz-liste-baslik h1 { font-size: 1.25rem; font-weight: 600; margin: 0; }
.ykmz-liste-baslik span { font-size: .8125rem; color: var(--ykmz-soluk); }

/* Kategori çipleri (yatay kaydırılır) */
.ykmz-cipler {
  display: flex; gap: .5rem; overflow-x: auto; padding-bottom: .5rem; margin-bottom: .5rem;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.ykmz-cipler::-webkit-scrollbar { display: none; }
.ykmz-cip {
  flex: 0 0 auto; padding: .375rem .875rem; border: 1px solid var(--ykmz-cizgi); border-radius: 999px;
  font-size: .8125rem; color: var(--ykmz-yazi); background: #fff; white-space: nowrap; transition: all .15s;
}
.ykmz-cip:hover { border-color: var(--ykmz-ana); color: var(--ykmz-ana); text-decoration: none; }
.ykmz-cip.aktif { background: var(--ykmz-ana); border-color: var(--ykmz-ana); color: #fff; }

/* Araç çubuğu */
.ykmz-arac { display: flex; gap: .5rem; margin-bottom: .75rem; }
.ykmz-arac-btn, .ykmz-sirala select {
  height: 2.5rem; border: 1px solid var(--ykmz-cizgi); border-radius: .5rem; background: #fff;
  font-size: .875rem; color: var(--ykmz-yazi); padding: 0 .875rem;
}
.ykmz-arac-btn { display: inline-flex; align-items: center; gap: .375rem; cursor: pointer; }
.ykmz-arac-btn:hover, .ykmz-sirala select:hover { border-color: var(--ykmz-ana); }
.ykmz-sayac {
  display: inline-grid; place-items: center; min-width: 1.25rem; height: 1.25rem; border-radius: 999px;
  background: var(--ykmz-ana); color: #fff; font-size: .6875rem;
}
.ykmz-sirala { margin: 0 0 0 auto; }
.ykmz-sirala select { cursor: pointer; max-width: 12rem; }
@media (max-width: 575.98px) {
  .ykmz-arac-btn, .ykmz-sirala { flex: 1 1 0; }
  .ykmz-arac-btn { justify-content: center; }
  .ykmz-sirala select { width: 100%; max-width: none; }
}

/* Filtre paneli */
.ykmz-filtre {
  border: 1px solid var(--ykmz-cizgi); border-radius: .75rem; padding: 1rem; margin-bottom: .75rem; background: #fff;
  display: grid; gap: 1rem;
}
@media (min-width: 768px) { .ykmz-filtre { grid-template-columns: 1fr 2fr; } .ykmz-filtre-alt { grid-column: 1 / -1; } }
.ykmz-filtre fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.ykmz-filtre legend { font-size: .875rem; font-weight: 600; margin-bottom: .5rem; }
.ykmz-fiyat-giris { display: flex; align-items: center; gap: .5rem; }
.ykmz-fiyat-giris input {
  width: 100%; height: 2.5rem; border: 1px solid var(--ykmz-cizgi); border-radius: .5rem; padding: 0 .75rem; font-size: .875rem;
}
.ykmz-fiyat-giris input:focus { outline: none; border-color: var(--ykmz-ana); }
.ykmz-bedenler { display: flex; flex-wrap: wrap; gap: .5rem; }
.ykmz-beden input { position: absolute; opacity: 0; pointer-events: none; }
.ykmz-beden span {
  display: inline-grid; place-items: center; min-width: 3rem; height: 2.25rem; padding: 0 .625rem;
  border: 1px solid var(--ykmz-cizgi); border-radius: .5rem; font-size: .8125rem; cursor: pointer; user-select: none;
}
.ykmz-beden input:checked + span { border-color: var(--ykmz-ana); color: var(--ykmz-ana); background: #fff4f2; font-weight: 600; }
.ykmz-beden input:focus-visible + span { outline: 2px solid var(--ykmz-ana); outline-offset: 2px; }
.ykmz-filtre-alt { display: flex; justify-content: flex-end; align-items: center; gap: 1rem; }
.ykmz-filtre-alt a { font-size: .875rem; color: var(--ykmz-soluk); }
.ykmz-filtre-alt button, .ykmz-daha-fazla {
  height: 2.5rem; padding: 0 1.5rem; border: 0; border-radius: .5rem; background: var(--ykmz-ana); color: #fff;
  font-size: .875rem; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center;
}
.ykmz-filtre-alt button:hover, .ykmz-daha-fazla:hover { background: var(--ykmz-ana-koyu); color: #fff; text-decoration: none; }

/* Aktif filtre etiketleri */
.ykmz-aktif-filtreler { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .75rem; }
.ykmz-aktif-filtreler a {
  display: inline-flex; align-items: center; gap: .375rem; padding: .25rem .625rem; border-radius: 999px;
  background: #fff4f2; color: var(--ykmz-ana); font-size: .75rem; border: 1px solid #ffd9d3;
}
.ykmz-aktif-filtreler a:hover { text-decoration: none; background: #ffe8e4; }

/* Izgara */
.ykmz-izgara { margin-left: -.375rem; margin-right: -.375rem; }
.ykmz-kol { padding-left: .375rem; padding-right: .375rem; margin-bottom: .75rem; }
@media (min-width: 992px) {
  .ykmz-izgara { margin-left: -.5rem; margin-right: -.5rem; }
  .ykmz-kol { padding-left: .5rem; padding-right: .5rem; margin-bottom: 1rem; }
}

/* Kart */
.ykmz-kart {
  position: relative; height: 100%; display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--ykmz-cizgi); border-radius: .5rem; overflow: hidden;
  transition: box-shadow .2s ease;
}
@media (hover: hover) {
  .ykmz-kart:hover { box-shadow: 0 4px 16px rgba(0, 0, 0, .1); }
  .ykmz-kart:hover .ykmz-kart-hizli { opacity: 1; transform: none; }
}
.ykmz-kart-gorsel { position: relative; display: block; aspect-ratio: 3 / 4; background: var(--ykmz-zemin); overflow: hidden; }
.ykmz-kart-gorsel img { width: 100%; height: 100%; object-fit: cover; -webkit-user-drag: none; transition: transform .5s cubic-bezier(.4, 0, .2, 1), opacity .4s ease; }
/* Hover: ikinci görsel ilkinin üstünde yumuşakça belirir (js/urunler.js ekler), görsel hafifçe yakınlaşır */
.ykmz-kart-gorsel .ykmz-kart-ikinci { position: absolute; inset: 0; opacity: 0; pointer-events: none; }
@media (hover: hover) {
  .ykmz-kart:hover .ykmz-kart-gorsel img { transform: scale(1.04); }
  .ykmz-kart:hover .ykmz-kart-ikinci.hazir { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .ykmz-kart-gorsel img { transition: none; } }

.ykmz-kart-indirim {
  position: absolute; left: .5rem; top: .5rem; padding: .125rem .375rem; border-radius: .25rem;
  background: var(--ykmz-ana); color: #fff; font-size: .75rem; font-weight: 700; line-height: 1.4;
}
.ykmz-kart-fav, .ykmz-kart-hizli {
  position: absolute; right: .5rem; width: 2rem; height: 2rem; border: 0; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .15); color: var(--ykmz-yazi);
  display: grid; place-items: center; font-size: .9375rem; cursor: pointer; z-index: 2; padding: 0;
}
.ykmz-kart-fav { top: .5rem; }
.ykmz-kart-fav:hover { color: var(--ykmz-ana); }
/* Favorideyken: beyaz zeminde turuncu kalp (tema btn-primary ikonu beyaza çeviriyordu) */
.ykmz-kart-fav.bg-primary, .ykmz-kart-fav.bg-primary:hover, .ykmz-kart-fav.bg-primary:focus, .ykmz-kart-fav.bg-primary:active {
  background: #fff !important; border: 0 !important; color: #fa5942 !important; box-shadow: 0 1px 4px rgba(0,0,0,.15) !important; }
.ykmz-kart-hizli { top: 3rem; opacity: 0; transform: translateX(.25rem); transition: all .2s ease; }
@media (hover: none) { .ykmz-kart-hizli { display: none; } }

.product-dots { display: flex; justify-content: center; gap: 4px; position: absolute; left: 0; right: 0; margin-top: -14px; z-index: 2; pointer-events: none; }
.product-dots button { width: 6px; height: 6px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .7); box-shadow: 0 0 2px rgba(0, 0, 0, .4); pointer-events: auto; }
.product-dots button[aria-selected="true"] { background: var(--ykmz-ana); }

.ykmz-kart-govde { padding: .625rem .625rem .75rem; display: flex; flex-direction: column; gap: .25rem; flex: 1; }
.ykmz-kart-baslik {
  font-size: .8125rem; line-height: 1.35; color: var(--ykmz-yazi);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.2em;
}
.ykmz-kart-baslik:hover { color: var(--ykmz-yazi); text-decoration: none; }
.ykmz-kart-baslik b { font-weight: 600; margin-right: .25rem; }

.ykmz-kart-puan { display: flex; align-items: center; gap: 1px; font-size: .6875rem; color: #ffb400; }
.ykmz-kart-puan-sayi { color: var(--ykmz-yazi); font-weight: 600; margin-right: .125rem; }
.ykmz-kart-puan-adet { color: var(--ykmz-soluk); margin-left: .125rem; }

.ykmz-kart-fiyat { margin-top: auto; display: flex; flex-direction: column; line-height: 1.25; }
.ykmz-kart-fiyat del { font-size: .75rem; color: var(--ykmz-soluk); }
.ykmz-kart-fiyat strong { font-size: 1rem; font-weight: 700; color: var(--ykmz-yazi); }
.ykmz-kart-fiyat strong.ykmz-indirimli { color: var(--ykmz-ana); }
.ykmz-kart-fiyat small { font-size: .75em; }
.ykmz-kart-etiket {
  align-self: flex-start; display: inline-flex; align-items: center; gap: .25rem; padding: .125rem .375rem;
  border-radius: .25rem; background: #e9fbf1; color: var(--ykmz-yesil); font-size: .6875rem; font-weight: 600;
}

/* Sonsuz kaydırma */
.ykmz-devam { display: flex; justify-content: center; padding: 1rem 0; min-height: 4rem; }
.ykmz-yukleniyor { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; color: var(--ykmz-soluk); }

/* Boş sonuç */
.ykmz-bos { text-align: center; padding: 3rem 1rem 2rem; }
.ykmz-bos > i { font-size: 2.5rem; color: var(--ykmz-cizgi); }
.ykmz-bos h2 { font-size: 1.125rem; margin: .75rem 0 .25rem; }
.ykmz-bos p { color: var(--ykmz-soluk); font-size: .875rem; max-width: 28rem; margin: 0 auto 1rem; }
.ykmz-oneri-baslik { font-size: 1.125rem; font-weight: 600; margin: 1.5rem 0 .75rem; }

/* +18 uyarısı */
.container-blur { filter: blur(25px); }
.modal-overlay-blur { position: fixed; inset: 0; background: rgba(0, 0, 0, .7); display: flex; align-items: center; justify-content: center; z-index: 9999; }
.modal-blur { background: #fff; padding: 1.5rem; max-width: 26rem; width: 90%; text-align: center; border-radius: .75rem; }
.modal-blur h2 { color: var(--ykmz-ana, #fa5942); font-size: 1.25rem; }
.modal-blur p { margin-bottom: 1rem; font-size: .9375rem; }
.modal-blur button { padding: .625rem 1.5rem; border: 0; border-radius: .5rem; background: #fa5942; color: #fff; cursor: pointer; margin: 0 .25rem; }
.modal-blur button.ykmz-hayir { background: #eee; color: #333; }