/* Bayi portali ek stilleri (Metis uzerine). */

/* ---- urun karti */
.product-card { position: relative; overflow: hidden; transition: border-color .2s, box-shadow .2s, transform .2s; }
.product-card:hover { box-shadow: 0 6px 22px rgba(0, 0, 0, .08); }
.product-card .product-img { position: relative; }
.product-card.urun-iskontolu { border: 2px solid var(--bs-danger); box-shadow: 0 0 0 4px rgba(var(--bs-danger-rgb), .08); }
.iskonto-rozet {
  position: absolute; top: .65rem; left: .65rem; z-index: 2;
  background: var(--bs-danger); color: #fff; font-weight: 600; font-size: .78rem;
  padding: .28rem .6rem; border-radius: 999px; box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
}
.fiyat-etiket { font-size: .76rem; color: var(--bs-secondary-color); }
.fiyat-eski { font-size: .85rem; color: var(--bs-secondary-color); line-height: 1.1; }

/* ---- sepete eklendi: kart uzerinde yesil katman */
.eklendi-katman {
  position: absolute; inset: 0; z-index: 5; pointer-events: none;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem;
  background: rgba(var(--bs-success-rgb), .93); color: #fff; font-weight: 600; font-size: 1.05rem;
  opacity: 0; transform: scale(.97); transition: opacity .22s ease, transform .22s ease;
}
.eklendi-katman i { font-size: 2.8rem; line-height: 1; }
.product-card.eklendi .eklendi-katman { opacity: 1; transform: scale(1); }
.product-card.eklendi .eklendi-katman i { animation: tik-pop .5s ease-out; }
@keyframes tik-pop { 0% { transform: scale(.2); } 65% { transform: scale(1.18); } 100% { transform: scale(1); } }

/* ---- sag altta yuzen sepet */
.yuzen-sepet {
  position: fixed; right: 24px; bottom: 24px; z-index: 1040;
  width: 62px; height: 62px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--bs-primary); color: #fff; font-size: 1.6rem; text-decoration: none;
  box-shadow: 0 10px 26px rgba(var(--bs-primary-rgb), .38), 0 2px 6px rgba(0, 0, 0, .15);
  transition: transform .2s ease, box-shadow .2s ease;
}
.yuzen-sepet:hover, .yuzen-sepet:focus { color: #fff; transform: translateY(-3px); box-shadow: 0 14px 30px rgba(var(--bs-primary-rgb), .45); }
.yuzen-sepet .sepet-sayac {
  position: absolute; top: -3px; right: -3px; min-width: 24px; height: 24px; padding: 0 6px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 12px; border: 2px solid var(--bs-body-bg);
  background: var(--bs-danger); color: #fff; font-size: .78rem; font-weight: 700;
}
.sepet-sayac[data-adet="0"] { display: none !important; }
.yuzen-sepet.zipla { animation: sepet-zipla .65s ease; }
@keyframes sepet-zipla {
  0%, 100% { transform: scale(1); }
  30% { transform: scale(1.22) rotate(-8deg); }
  60% { transform: scale(.94) rotate(4deg); }
}
.ucan-urun {
  position: fixed; z-index: 1060; width: 40px; height: 40px; border-radius: 50%; pointer-events: none;
  display: flex; align-items: center; justify-content: center;
  background: var(--bs-success); color: #fff; font-size: 1.1rem; box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
  transition: transform .7s cubic-bezier(.45, -.25, .65, 1), opacity .7s ease;
}
@media (max-width: 576px) { .yuzen-sepet { right: 16px; bottom: 16px; width: 56px; height: 56px; } }

/* ---- ust menu: simetrik yuvarlak butonlar, sepet sayaci butonun icinde */
.hdr-ikon { width: 40px; height: 40px; padding: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; }
.hdr-sepet { height: 40px; padding: 0 .95rem; display: inline-flex; align-items: center; gap: .5rem; border-radius: 999px; }
.hdr-sepet .sepet-sayac {
  min-width: 22px; height: 22px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px; background: var(--bs-primary); color: #fff; font-size: .75rem; font-weight: 700;
}

/* ---- katalog aramasi */
.katalog-arama .arama-kutu .arama-ikon { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--bs-secondary-color); }
.katalog-arama .arama-kutu .arama-yukleniyor { position: absolute; right: 2.6rem; top: 50%; margin-top: -.5rem; }
#urunSonuc { transition: opacity .15s ease; }
#urunSonuc.yukleniyor { opacity: .5; }

/* ---- firma logosu */
.firma-logo { display: block; }
.katalog-arama .arama-kutu input[type=search] { padding-left: 2.85rem !important; }

/* ---- kampanyalar: cerceve ve rozet kampanya rengiyle */
.product-card.urun-kampanyali { border: 2px solid var(--kmp-renk, #f97316); box-shadow: 0 0 0 4px color-mix(in srgb, var(--kmp-renk, #f97316) 14%, transparent); }
.kampanya-rozet {
  position: absolute; top: .65rem; left: .65rem; z-index: 2;
  background: var(--kmp-renk, #f97316); color: #fff; font-weight: 700; font-size: .78rem;
  padding: .3rem .65rem; border-radius: 999px; box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
}
.iskonto-rozet.sag { left: auto; right: .65rem; }
.kampanya-fiyat { color: var(--kmp-renk, #f97316) !important; }
.kampanya-not { color: var(--kmp-renk, #f97316); font-weight: 600; font-size: .8rem; margin-top: .15rem; }
.kampanya-etiket { display: inline-block; color: #fff; background: var(--kmp-renk, #f97316); border-radius: 999px; padding: .1rem .55rem; font-weight: 600; font-size: .75rem; }
.kampanya-kutu { border-left: 4px solid var(--kmp-renk, #f97316); background: color-mix(in srgb, var(--kmp-renk, #f97316) 9%, transparent); border-radius: .5rem; padding: .6rem .8rem; }
.kampanya-baslik { background: var(--kmp-renk, #f97316); color: #fff; }
.kampanya-karti { border: 2px solid var(--kmp-renk, #f97316); overflow: hidden; }
.kampanya-karti.secili { box-shadow: 0 0 0 4px color-mix(in srgb, var(--kmp-renk, #f97316) 25%, transparent); }
.one-cikan-serit { scroll-snap-type: x mandatory; }

/* ---- doviz kuru bandi (ust bar icinde; ust bar yuksekligi bant kadar artar) */
.kur-bandi { height: 30px; font-size: .8rem; background: #0f172a; color: #fff; }
.kur-bandi .kb-ic { display: flex; align-items: center; gap: 1.25rem; height: 100%; white-space: nowrap; overflow: hidden; }
.kur-bandi .kb-kod { font-weight: 700; letter-spacing: .02em; }
.kur-bandi .kb-deger { font-weight: 600; font-variant-numeric: tabular-nums; }
.kur-bandi .kb-etiket, .kur-bandi .kb-kaynak, .kur-bandi .kb-baslik { opacity: .72; }
.kur-bant-var { --header-height: 86px; }
.kur-bant-var .admin-header .navbar { height: 56px; }
.kur-bandi-statik { position: relative; z-index: 2; }

/* ---- katalog sol suzgec paneli */
.katalog-suzgec .suzgec-bolum { padding: .85rem 1rem; border-bottom: 1px solid var(--bs-border-color); }
.katalog-suzgec .suzgec-bolum:last-child { border-bottom: 0; }
.katalog-suzgec .suzgec-baslik { display: block; font-weight: 700; font-size: .74rem; letter-spacing: .05em; text-transform: uppercase; margin-bottom: .5rem; color: var(--bs-emphasis-color); }
.katalog-suzgec .suzgec-liste { max-height: 232px; overflow: auto; padding-right: .25rem; }
.katalog-suzgec .suzgec-liste .form-check, .katalog-suzgec .suzgec-secenek .form-check { margin-bottom: .3rem; font-size: .875rem; }
.katalog-suzgec .suzgec-liste .form-check-label { line-height: 1.3; }
@media (min-width: 992px) {
  .katalog-suzgec { position: sticky; top: calc(var(--header-height) + 1rem); max-height: calc(100vh - var(--header-height) - 2rem); overflow: auto; }
}
.suzgec-etiket:hover { background: rgba(var(--bs-danger-rgb), .14) !important; }
.katalog-arac .form-select { min-width: 9rem; }

/* ---- katalog liste gorunumu: sabit sutunlar (satirlar arasi kayma olmasin) */
.urun-tablo { font-size: .875rem; min-width: 900px; table-layout: fixed; width: 100%; }
.urun-tablo th, .urun-tablo td { vertical-align: middle; padding-top: .55rem; padding-bottom: .55rem; }
.urun-tablo thead th { white-space: nowrap; font-size: .72rem; letter-spacing: .03em; color: var(--bs-secondary-color); }
.urun-tablo .baslik-not { display: block; font-weight: 400; text-transform: none; letter-spacing: 0; font-size: .7rem; }
.urun-tablo .kol-gorsel { width: 46px; text-align: center; padding-left: .5rem; padding-right: .25rem; }
.urun-tablo .kol-kod { width: 112px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.urun-tablo .kol-urun { width: auto; }
.urun-tablo .kol-paket { width: 140px; font-size: .78rem; white-space: nowrap; }
.urun-tablo .kol-isk { width: 62px; text-align: right; }
.urun-tablo .kol-fiyat { width: 104px; text-align: right; white-space: nowrap; }
.urun-tablo .kol-net { width: 116px; text-align: right; white-space: nowrap; }
.urun-tablo .kol-tavsiye { width: 104px; text-align: right; white-space: nowrap; }
.urun-tablo .kol-stok { width: 70px; white-space: nowrap; font-size: .82rem; }
.urun-tablo .kol-takip { width: 44px; text-align: center; padding-left: .25rem; padding-right: .25rem; }
.urun-tablo .kol-siparis { width: 168px; }
.urun-tablo .urun-adi { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.3; }
.urun-tablo .urun-alt { display: flex; flex-wrap: wrap; gap: .3rem .5rem; align-items: center; margin-top: .2rem; font-size: .76rem; }
.urun-tablo .satir-not { font-size: .74rem; font-weight: 400; line-height: 1.25; margin-top: .1rem; }
.urun-tablo .isk-rozet { font-size: .78rem; font-weight: 700; }
.urun-tablo .resim-ac { color: var(--bs-primary); }
.urun-tablo .resim-ac:hover, .urun-tablo .resim-ac:focus-visible { color: var(--bs-primary); background: color-mix(in srgb, var(--bs-primary) 14%, transparent); }
.urun-tablo .gorsel-yok { color: var(--bs-secondary-color); opacity: .3; }
.urun-tablo .siparis-form { display: flex; align-items: center; gap: .4rem; }
.urun-tablo .siparis-form .input-group { width: 104px; flex: 0 0 104px; }
.urun-tablo .siparis-form .qty-input { min-width: 0; text-align: center; }
.urun-tablo .siparis-form .sepette-rozet { min-width: 44px; padding-left: .4em; padding-right: .4em; }
.urun-tablo tr.satir-kampanyali td:first-child { box-shadow: inset 4px 0 0 var(--kmp-renk, #f97316); }
.urun-tablo tr.satir-iskontolu td:first-child { box-shadow: inset 4px 0 0 var(--bs-danger); }
.urun-tablo tr.eklendi td { animation: satir-eklendi 1.3s ease; }
@keyframes satir-eklendi { 0%, 35% { background: rgba(var(--bs-success-rgb), .22); } 100% { background: transparent; } }
.resim-modal-img { max-height: 72vh; object-fit: contain; }

/* ---- urun adi / kodu baglantilari: alti cizili degil, ustune gelince ana renk */
.urun-link { text-decoration: none; }
.urun-link:hover, .urun-link:focus-visible { color: var(--bs-primary) !important; }

/* ---- takip yildizi, yeni rozeti */
.btn-ghost { background: transparent; border-color: transparent; color: var(--bs-secondary-color); }
.btn-ghost:hover, .btn-ghost:focus-visible { background: var(--bs-tertiary-bg); color: var(--bs-body-color); }
.takip-btn.takipte, .takip-btn.takipte:hover { color: #f59e0b; }
.yeni-rozet {
  position: absolute; bottom: .65rem; left: .65rem; z-index: 2;
  background: var(--bs-info); color: #fff; font-weight: 600; font-size: .72rem;
  padding: .2rem .55rem; border-radius: 999px; box-shadow: 0 2px 6px rgba(0, 0, 0, .18);
}

/* ---- bakim ekrani */
.bakim-kart .bakim-ikon { font-size: 3rem; color: var(--bs-warning); line-height: 1; }

/* ---- Metis'te olmayan acik rozet renkleri (yoksa rozet yazisi beyaz kalip gorunmuyordu) */
.bg-success-lt { border: 1px solid var(--bs-success-border-subtle); background-color: var(--bs-success-bg-subtle) !important; color: var(--bs-success-text-emphasis) !important; }
.bg-danger-lt { border: 1px solid var(--bs-danger-border-subtle); background-color: var(--bs-danger-bg-subtle) !important; color: var(--bs-danger-text-emphasis) !important; }
.bg-info-lt { border: 1px solid var(--bs-info-border-subtle); background-color: var(--bs-info-bg-subtle) !important; color: var(--bs-info-text-emphasis) !important; }
.bg-warning-lt { border: 1px solid var(--bs-warning-border-subtle); background-color: var(--bs-warning-bg-subtle) !important; color: var(--bs-warning-text-emphasis) !important; }
.bg-primary-lt { border: 1px solid var(--bs-primary-border-subtle); background-color: var(--bs-primary-bg-subtle) !important; color: var(--bs-primary-text-emphasis) !important; }

/* ---- katalog duzeni: sabit genislikte sol suzgec + esnek icerik */
.katalog-duzen { display: flex; flex-direction: column; gap: 1rem; }
.katalog-ana { min-width: 0; }
@media (min-width: 992px) {
  .katalog-duzen { display: grid; grid-template-columns: 250px minmax(0, 1fr); align-items: start; }
}
@media (min-width: 1600px) {
  .katalog-duzen { grid-template-columns: 270px minmax(0, 1fr); }
}
.katalog-suzgec .suzgec-oge { display: flex; align-items: center; gap: .45rem; padding-left: 0; min-height: 1.6rem; margin-bottom: .1rem; cursor: pointer; }
.katalog-suzgec .suzgec-oge .form-check-input { float: none; margin: 0; flex: 0 0 auto; }
.katalog-suzgec .suzgec-oge .form-check-label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.katalog-suzgec .suzgec-sayi { flex: 0 0 auto; font-size: .7rem; line-height: 1.5; padding: 0 .45rem; border-radius: 999px; color: var(--bs-secondary-color); background: var(--bs-tertiary-bg); font-variant-numeric: tabular-nums; }
.katalog-suzgec .suzgec-oge:hover .form-check-label { color: var(--bs-emphasis-color); }

/* ---- duyurular */
.min-w-0 { min-width: 0; }
.hdr-zil { position: relative; }
.hdr-zil .zil-sayac {
  position: absolute; top: -5px; right: -5px; min-width: 20px; height: 20px; padding: 0 5px;
  display: inline-flex; align-items: center; justify-content: center; line-height: 1;
  border-radius: 10px; border: 2px solid var(--bs-body-bg);
  background: var(--bs-danger); color: #fff; font-size: .7rem; font-weight: 700;
}
.zil-sayac[data-adet="0"] { display: none !important; }
.duyuru-sekme .nav-link .badge { background: var(--bs-secondary-bg); color: var(--bs-body-color); }
.duyuru-sekme .nav-link.active .badge { background: rgba(255, 255, 255, .28); color: inherit; }
.duyuru-karti { border-left: 4px solid var(--dy-renk); transition: box-shadow .15s ease, transform .15s ease; }
.duyuru-karti:hover, .duyuru-karti:focus-visible { box-shadow: 0 6px 18px rgba(0, 0, 0, .09); transform: translateY(-1px); }
.duyuru-karti .duyuru-baslik { font-weight: 600; line-height: 1.35; }
.duyuru-karti.yeni .duyuru-baslik { font-weight: 700; }
.duyuru-karti.yeni { background: color-mix(in srgb, var(--dy-renk) 5%, var(--bs-body-bg)); }
.duyuru-devam { color: var(--bs-link-color); font-weight: 600; }
.duyuru-ikon {
  width: 44px; height: 44px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.3rem; color: var(--dy-renk); background: color-mix(in srgb, var(--dy-renk) 14%, transparent);
}
.duyuru-ikon.kucuk { width: 32px; height: 32px; border-radius: 9px; font-size: 1rem; }
.duyuru-kucuk { width: 120px; height: 84px; object-fit: cover; border-radius: 8px; background: var(--bs-tertiary-bg); }
.duyuru-rozet { font-weight: 600; }
.duyuru-ayrinti { border-top: 4px solid var(--dy-renk); }
.duyuru-gorsel { display: block; width: 100%; max-height: 420px; object-fit: contain; border-radius: 10px; background: var(--bs-tertiary-bg); }
.duyuru-icerik { font-size: 1rem; line-height: 1.7; overflow-wrap: anywhere; }
.duyuru-icerik > :last-child { margin-bottom: 0; }
.duyuru-icerik h3 { font-size: 1.3rem; margin: 1.25rem 0 .5rem; }
.duyuru-icerik h4 { font-size: 1.1rem; margin: 1rem 0 .5rem; }
.duyuru-icerik blockquote { border-left: 4px solid var(--dy-renk, var(--bs-border-color)); padding: .5rem 1rem; margin: 0 0 1rem; color: var(--bs-secondary-color); background: var(--bs-tertiary-bg); border-radius: 0 8px 8px 0; }
.duyuru-icerik hr { margin: 1.25rem 0; }

/* ---- banka hesaplari / odeme */
.banka-ikon { width: 40px; height: 40px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.2rem;
  color: var(--bs-link-color); background: color-mix(in srgb, var(--bs-primary) 12%, transparent); flex-shrink: 0; }
.banka-karti .iban { overflow-wrap: anywhere; }