/* =====================================================================
   HAUSTIER — tema düzeltmeleri ve yeni bileşenler
   Bu dosya tüm tema CSS'lerinden SONRA yüklenir (temaheader.php).
   Yeni bileşenler "hst-" ön ekiyle yazıldı; eski tema sınıflarına dokunmaz.
   ===================================================================== */

:root {
	--hst-murekkep: #1f1f1f;
	--hst-sari: #F5C518;
	--hst-zemin: #f4f5f7;
	--hst-beyaz: #ffffff;
	--hst-metin: #1f1f1f;
	--hst-soluk: #5f646b;
	--hst-cizgi: #e3e5e8;
	--hst-yesil: #1e7b34;
	--hst-yesil-zemin: #eaf6ee;
	--hst-kirmizi: #b42318;
	--hst-radius: 12px;
	--hst-golge: 0 1px 2px rgba(20, 20, 20, .06), 0 1px 1px rgba(20, 20, 20, .03);
}

/* ---------- Genel tema düzeltmeleri ---------- */
body { background: var(--hst-zemin); color: var(--hst-metin); -webkit-text-size-adjust: 100%; }
.page-wrapper { background: var(--hst-zemin); overflow-x: hidden; }
.container { width: 100%; max-width: 1440px; padding-left: 16px; padding-right: 16px; }
@media (min-width: 992px) { .container { padding-left: 32px; padding-right: 32px; } }
img { max-width: 100%; height: auto; }

/* Eski "zoomContainer: fixed" kuralı ürün sayfasında büyüteç katmanını
   ekrana sabitleyip "Sepete Ekle" butonunun üstüne bindiriyordu. */
.zoomContainer { position: absolute !important; }
@media (max-width: 991px) { .zoomContainer { display: none !important; } }

.hst-ikon { display: inline-block; vertical-align: middle; flex: none; }
.hst-gizli { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Butonlar ---------- */
.hst-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 44px; padding: 0 18px; border-radius: 10px; border: 1px solid transparent;
	font: 600 14px/1.2 Poppins, sans-serif; letter-spacing: 0; text-transform: none;
	cursor: pointer; text-decoration: none !important; transition: background .15s, border-color .15s, color .15s;
}
.hst-btn--koyu { background: var(--hst-murekkep); color: #fff !important; }
.hst-btn--koyu:hover, .hst-btn--koyu:focus { background: #000; color: #fff !important; }
.hst-btn--koyu .hst-ikon { color: var(--hst-sari); }
.hst-btn--cizgi { background: #fff; color: var(--hst-murekkep) !important; border-color: #cfd3d8; font-weight: 500; }
.hst-btn--cizgi:hover { border-color: var(--hst-murekkep); }
.hst-btn--yesil { background: #1a8f45; color: #fff !important; }
.hst-btn--yesil:hover { background: #157a3a; }
.hst-btn--blok { width: 100%; }
.hst-btn--buyuk { min-height: 52px; font-size: 15px; border-radius: 12px; }
.hst-btn[disabled], .hst-btn--pasif { background: #e9eaec !important; color: #8a8f96 !important; cursor: not-allowed; }
.hst-link { color: var(--hst-murekkep); font-weight: 500; border-bottom: 2px solid var(--hst-sari); }
.hst-link:hover { color: #000; }

/* ---------- Rozetler, yıldız, stok, fiyat ---------- */
.hst-rozet { display: inline-block; font: 700 11px/1 Poppins, sans-serif; padding: 4px 8px; border-radius: 6px; }
.hst-rozet--indirim { background: var(--hst-sari); color: var(--hst-murekkep); }
.hst-rozet--yeni { background: #2e7d32; color: #fff; font-weight: 600; }
.hst-rozet--outlet { background: #b10000; color: #fff; }
.hst-yildiz { position: relative; display: inline-block; width: 68px; height: 13px; vertical-align: -1px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 13'%3E%3Cg fill='%23dcdfe3'%3E%3Cpath id='s' d='M6.5 0l1.9 4.1 4.5.5-3.3 3 .9 4.4-4-2.3-4 2.3.9-4.4L.1 4.6l4.5-.5z'/%3E%3Cuse href='%23s' x='13.8'/%3E%3Cuse href='%23s' x='27.6'/%3E%3Cuse href='%23s' x='41.4'/%3E%3Cuse href='%23s' x='55.2'/%3E%3C/g%3E%3C/svg%3E") no-repeat; }
.hst-yildiz__dolu { position: absolute; left: 0; top: 0; bottom: 0; overflow: hidden;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 13'%3E%3Cg fill='%23e0a400'%3E%3Cpath id='s' d='M6.5 0l1.9 4.1 4.5.5-3.3 3 .9 4.4-4-2.3-4 2.3.9-4.4L.1 4.6l4.5-.5z'/%3E%3Cuse href='%23s' x='13.8'/%3E%3Cuse href='%23s' x='27.6'/%3E%3Cuse href='%23s' x='41.4'/%3E%3Cuse href='%23s' x='55.2'/%3E%3C/g%3E%3C/svg%3E") no-repeat; background-size: 68px 13px; }
.hst-yildiz__sayi { font-size: 11.5px; color: var(--hst-soluk); margin-left: 4px; }
.hst-stok { font-size: 12px; font-weight: 500; display: flex; align-items: center; gap: 6px; }
.hst-stok::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.hst-stok--var { color: var(--hst-yesil); }
.hst-stok--yok { color: var(--hst-kirmizi); }
.hst-fiyat { font-weight: 700; color: var(--hst-murekkep); letter-spacing: -.01em; }
.hst-fiyat-eski { color: #8a8f96; font-size: .78em; text-decoration: line-through; }

/* ---------- HEADER ---------- */
.hst-header { position: relative; z-index: 60; background: #fff; font-family: Poppins, sans-serif; }
.hst-ust { background: var(--hst-murekkep); color: #fff; font-size: 12.5px; }
.hst-ust .container { min-height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hst-ust a { color: #fff; display: inline-flex; align-items: center; gap: 6px; }
.hst-ust a:hover { color: var(--hst-sari); }
.hst-ust__kargo { color: var(--hst-sari); font-weight: 500; }
.hst-ust__linkler { display: flex; gap: 20px; }
.hst-orta .container { display: flex; align-items: center; gap: 28px; padding-top: 16px; padding-bottom: 16px; }
.hst-logo img { height: 40px; width: auto; display: block; }
.hst-arama { flex: 1 1 360px; position: relative; display: flex; }
.hst-arama input {
	width: 100%; height: 48px; border: 1px solid #dfe2e6; border-radius: 24px; background: #f8f9fa;
	padding: 0 52px 0 20px; font: 400 14px Poppins, sans-serif; color: var(--hst-metin); outline: none;
}
.hst-arama input:focus { border-color: var(--hst-murekkep); background: #fff; }
.hst-arama button { position: absolute; right: 4px; top: 4px; width: 40px; height: 40px; border: 0; border-radius: 20px; background: var(--hst-murekkep); color: #fff; display: flex; align-items: center; justify-content: center; }
.hst-eylemler { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.hst-eylem { position: relative; min-width: 64px; height: 52px; padding: 0 6px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-size: 11.5px; color: #4a4f56; border-radius: 10px; }
.hst-eylem:hover { background: var(--hst-zemin); color: var(--hst-murekkep); }
.hst-eylem .hst-ikon { color: var(--hst-murekkep); }
.hst-sayac { position: absolute; top: 4px; right: 10px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--hst-sari); color: var(--hst-murekkep); font: 700 10.5px/18px Poppins, sans-serif; text-align: center; }
.hst-sepet-btn { height: 48px; padding: 0 18px; margin-left: 6px; border-radius: 24px; background: var(--hst-murekkep); color: #fff !important; display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 13.5px; }
.hst-sepet-btn .hst-ikon { color: var(--hst-sari); }
.hst-sepet-btn span.hst-sepet-btn__sayi { background: var(--hst-sari); color: var(--hst-murekkep); border-radius: 10px; padding: 0 7px; font-size: 12px; line-height: 20px; }
.hst-sepet-btn:hover { background: #000; }
.hst-menu-btn { display: none; width: 44px; height: 44px; border: 0; background: none; align-items: center; justify-content: center; color: var(--hst-murekkep); padding: 0; }
.hst-arama-mobil { display: none; }

.hst-nav { border-top: 1px solid #eceef1; border-bottom: 1px solid #eceef1; background: #fff; }
.hst-nav .main-nav { display: flex; justify-content: center; }
.hst-nav .menu > li > a { font: 500 14px Poppins, sans-serif; color: var(--hst-murekkep); padding-top: 14px; padding-bottom: 14px; text-transform: none; letter-spacing: 0; }
.hst-nav .menu > li > a:hover, .hst-nav .menu > li.show > a { color: #000; box-shadow: inset 0 -2px 0 var(--hst-sari); }
.hst-cipler { display: none; }

@media (max-width: 991px) {
	.hst-ust__linkler, .hst-ust__kargo-uzun { display: none; }
	.hst-ust .container { min-height: 32px; font-size: 11.5px; }
	.hst-orta .container { gap: 2px; padding: 8px 8px; }
	.hst-menu-btn { display: inline-flex; }
	.hst-logo { flex: 1; display: flex; justify-content: center; }
	.hst-logo img { height: 30px; }
	.hst-orta .hst-arama, .hst-eylem--masaustu, .hst-sepet-btn { display: none; }
	.hst-eylem { min-width: 44px; height: 44px; padding: 0; }
	.hst-eylem__yazi { display: none; }
	.hst-sayac { top: 3px; right: 1px; }
	.hst-arama-mobil { display: block; padding: 0 16px 12px; }
	.hst-arama-mobil .hst-arama input { height: 44px; border-radius: 22px; font-size: 16px; }
	.hst-arama-mobil .hst-arama button { width: 36px; height: 36px; border-radius: 18px; }
	.hst-nav .main-nav { display: none; }
	.hst-nav { border-top: 0; }
	.hst-cipler { display: flex; gap: 8px; overflow-x: auto; padding: 0 16px 12px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.hst-cipler::-webkit-scrollbar { display: none; }
	.hst-cip { flex: none; height: 34px; padding: 0 14px; border-radius: 17px; background: #f1f2f4; display: flex; align-items: center; font-weight: 500; font-size: 12.5px; color: var(--hst-murekkep); white-space: nowrap; }
	.hst-cip--aktif { background: var(--hst-murekkep); color: #fff; }
}

/* ---------- Bölüm başlıkları ---------- */
.hst-bolum { padding: 32px 0 8px; }
.hst-bolum__bas { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.hst-bolum__bas h1, .hst-bolum__bas h2 { margin: 0; font: 600 26px/1.2 Poppins, sans-serif; letter-spacing: -.02em; color: var(--hst-murekkep); }
@media (max-width: 767px) {
	.hst-bolum { padding: 22px 0 4px; }
	.hst-bolum__bas { margin-bottom: 12px; }
	.hst-bolum__bas h1, .hst-bolum__bas h2 { font-size: 19px; }
	.hst-bolum__bas .hst-link { font-size: 12.5px; }
}

/* ---------- Slider ---------- */
.intro-slider-container, .intro-slide { height: auto !important; background: transparent !important; }
.intro-slide { display: block; }
.intro-slide .intro-content, .sliderim { margin: 0 !important; padding: 0 !important; max-width: 100% !important; width: 100% !important; }
.intro-slide .row { margin: 0; display: block; }
.intro-slide a { display: block; }
.intro-slide img, .intro-slide picture img { width: 100% !important; height: auto !important; object-fit: contain; display: block; }
.hst-slider .owl-dots { position: absolute; left: 0; right: 0; bottom: 12px !important; }
.hst-slider .owl-dots .owl-dot span { border-color: #fff !important; background: rgba(255,255,255,.55) !important; }
.hst-slider .owl-dots .owl-dot.active span { background: #fff !important; width: 22px !important; }
@media (max-width: 767px) {
	.hst-slider { padding: 12px 16px 0; }
	.hst-slider .intro-slider { border-radius: 14px; overflow: hidden; }
	.hst-slider .owl-dots { position: static; padding-top: 8px; }
	.hst-slider .owl-dots .owl-dot span { border-color: #c9ccd1 !important; background: #c9ccd1 !important; width: 6px !important; height: 6px !important; margin: 4px 3px !important; }
	.hst-slider .owl-dots .owl-dot.active span { background: var(--hst-murekkep) !important; border-color: var(--hst-murekkep) !important; width: 18px !important; }
}

/* ---------- Güven şeridi ---------- */
.hst-guven { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: #fff; border-radius: 14px; margin-top: 24px; box-shadow: var(--hst-golge); }
.hst-guven__oge { display: flex; align-items: center; gap: 14px; padding: 18px 22px; }
.hst-guven__oge .hst-ikon { color: var(--hst-murekkep); }
.hst-guven__oge strong { display: block; font: 600 14px Poppins, sans-serif; color: var(--hst-murekkep); }
.hst-guven__oge span { display: block; font-size: 12.5px; color: var(--hst-soluk); line-height: 1.4; }
@media (max-width: 991px) {
	.hst-guven { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; background: transparent; box-shadow: none; margin-top: 14px; }
	.hst-guven__oge { background: #fff; border-radius: 12px; padding: 10px 12px; gap: 10px; }
	.hst-guven__oge .hst-ikon { width: 22px; height: 22px; }
	.hst-guven__oge strong { font-size: 12px; }
	.hst-guven__oge span { font-size: 11px; }
}

/* ---------- Ürün kartı ---------- */
.hst-kart { background: #fff; border-radius: var(--hst-radius); overflow: hidden; display: flex; flex-direction: column; box-shadow: var(--hst-golge); height: 100%; font-family: Poppins, sans-serif; }
.hst-kart__gorsel { position: relative; aspect-ratio: 1 / 1; background: #fff; display: flex; align-items: center; justify-content: center; padding: 12px; }
.hst-kart__gorsel-link { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; }
.hst-kart__gorsel img { max-width: 100%; max-height: 100%; width: auto !important; height: auto !important; object-fit: contain; }
.hst-kart__etiketler { position: absolute; top: 10px; left: 10px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.hst-kart__fav { position: absolute; top: 6px; right: 6px; width: 38px; height: 38px; border-radius: 19px; background: rgba(255,255,255,.92); display: flex; align-items: center; justify-content: center; color: var(--hst-murekkep); }
.hst-kart__fav:hover { color: #d92d20; }
.hst-kart__govde { padding: 12px 14px 14px; border-top: 1px solid #f1f2f4; display: flex; flex-direction: column; gap: 5px; flex: 1; }
.hst-kart__kod { font-size: 11px; color: #6b7078; }
.hst-kart__baslik { margin: 0; font: 500 13.5px/1.4 Poppins, sans-serif; letter-spacing: 0; height: 38px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.hst-kart__baslik a { color: var(--hst-murekkep); }
.hst-kart__fiyat { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; margin-top: 2px; }
.hst-kart__fiyat .hst-fiyat { font-size: 18px; }
.hst-kart .hst-btn, .hst-kart__form { margin-top: auto; }
.hst-kart__form { margin-bottom: 0; }
.hst-kart .hst-stok { margin-bottom: 6px; }
@media (max-width: 767px) {
	.hst-kart__gorsel { padding: 8px; }
	.hst-kart__etiketler { top: 8px; left: 8px; }
	.hst-kart__govde { padding: 10px 10px 12px; gap: 4px; }
	.hst-kart__baslik { font-size: 12.5px; height: 35px; }
	.hst-kart__fiyat .hst-fiyat { font-size: 15.5px; }
	.hst-kart .hst-btn { min-height: 40px; font-size: 12.5px; padding: 0 8px; }
	.hst-kart__puan .hst-yildiz { width: 56px; background-size: 56px 11px; height: 11px; }
	.hst-kart__puan .hst-yildiz__dolu { background-size: 56px 11px; }
}

/* Ürün ızgarası ve yatay ürün sırası */
.hst-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; }
.hst-satir-sar { position: relative; }
.hst-satir { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 60px) / 4); gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px 2px 8px; }
.hst-satir::-webkit-scrollbar { display: none; }
.hst-satir > * { scroll-snap-align: start; }
.hst-satir-ok { position: absolute; top: 40%; z-index: 3; width: 44px; height: 44px; border-radius: 22px; border: 1px solid var(--hst-cizgi); background: #fff; color: var(--hst-murekkep); display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.hst-satir-ok--sol { left: -18px; }
.hst-satir-ok--sag { right: -18px; }
.hst-satir-ok[hidden] { display: none; }
@media (max-width: 1199px) { .hst-satir { grid-auto-columns: calc((100% - 40px) / 3); } }
@media (max-width: 767px) {
	.hst-izgara, .hst-satir--mobil-izgara { display: grid; grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-columns: auto; gap: 12px; overflow: visible; }
	.hst-satir:not(.hst-satir--mobil-izgara) { grid-auto-columns: 46%; gap: 12px; }
	.hst-satir-ok { display: none !important; }
}

/* Anasayfa kategori bölümü: yan banner + ürün sırası */
.hst-kat-bolum__duzen { display: flex; gap: 20px; align-items: stretch; }
.hst-kat-bolum__banner { flex: 0 0 210px; border-radius: 14px; overflow: hidden; display: block; background: #e9eaec; }
.hst-kat-bolum__banner img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hst-kat-bolum__urunler { flex: 1; min-width: 0; }
@media (max-width: 1199px) { .hst-kat-bolum__banner { display: none; } }

/* Fırsat kutuları */
.deal { border-radius: 14px; overflow: hidden; }

/* ---------- Ürün detay ---------- */
.hst-urun { padding: 8px 0 32px; }
.hst-urun .breadcrumb-nav { background: transparent; border: 0; margin-bottom: 0; }
.hst-urun__duzen { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 32px; background: #fff; border-radius: 16px; padding: 24px; box-shadow: var(--hst-golge); }
.hst-urun .product-gallery { margin: 0; }
.hst-urun .product-main-image { position: relative; margin: 0 0 12px; background: #fff; border-radius: 12px; display: flex; align-items: center; justify-content: center; min-height: 320px; }
.hst-urun .product-main-image img { max-height: 560px; width: auto; margin: 0 auto; }
.hst-urun .product-image-gallery { display: flex; gap: 8px; flex-wrap: wrap; margin: 0; padding: 0; width: auto; }
.hst-urun .product-gallery-item { width: 68px; height: 68px; flex: none; border: 1px solid var(--hst-cizgi); border-radius: 10px; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #fff; padding: 4px; margin: 0; max-width: none; }
.hst-urun .product-gallery-item:before { display: none !important; }
.hst-urun .product-gallery-item.active { border: 2px solid var(--hst-murekkep); }
.hst-urun .product-gallery-item img { max-height: 100%; width: auto; }
.hst-urun .btn-product-gallery { position: absolute; right: 10px; bottom: 10px; width: 40px; height: 40px; border-radius: 20px; background: #fff; border: 1px solid var(--hst-cizgi); color: var(--hst-murekkep); display: flex; align-items: center; justify-content: center; }
.hst-urun .product-label { z-index: 5; }
.hst-urun__kod { font-size: 12px; color: #6b7078; }
.hst-urun__baslik { margin: 2px 0 8px; font: 600 24px/1.3 Poppins, sans-serif; letter-spacing: -.01em; color: var(--hst-murekkep); }
.hst-urun__puan { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--hst-soluk); }
.hst-urun__puan a { color: var(--hst-soluk); text-decoration: underline; }
.hst-urun__fiyat { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; margin-top: 14px; }
.hst-urun__fiyat #sonfiyat { font: 700 30px/1.1 Poppins, sans-serif; color: var(--hst-murekkep); letter-spacing: -.02em; }
.hst-urun__fiyat .hst-fiyat-eski { font-size: 16px; }
.hst-urun__havale { font-size: 13px; color: var(--hst-soluk); margin-top: 4px; }
.hst-urun__kisa { color: #4a4f56; font-size: 14px; margin: 14px 0 0; line-height: 1.6; }
.hst-urun__kisa p { color: inherit; font-size: inherit; margin-bottom: 8px; }
.hst-urun__rozetler { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.hst-bilgi-rozet { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 500; padding: 7px 11px; border-radius: 8px; background: #f1f2f4; color: var(--hst-murekkep); }
.hst-bilgi-rozet--yesil { background: var(--hst-yesil-zemin); color: var(--hst-yesil); }
.hst-bilgi-rozet--sari { background: #fff7d6; color: #7a5b00; }
.hst-bolme { border: 0; border-top: 1px solid #eceef1; margin: 18px 0; }
.hst-secenek { margin-bottom: 16px; border: 0; padding: 0; }
.hst-secenek__bas { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; margin-bottom: 8px; }
.hst-secenek__bas legend, .hst-secenek__bas label { font-weight: 600; color: var(--hst-murekkep); margin: 0; font-size: 14px; width: auto; }
.hst-secenek__secilen { color: var(--hst-soluk); font-size: 13px; }
.hst-secenek__liste { display: flex; flex-wrap: wrap; gap: 8px; }
.hst-hap { position: relative; margin: 0; cursor: pointer; }
.hst-hap input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hst-hap span { display: flex; align-items: center; min-height: 44px; min-width: 76px; justify-content: center; padding: 0 14px; border-radius: 10px; border: 1px solid #cfd3d8; background: #fff; font-size: 13px; font-weight: 500; color: var(--hst-murekkep); transition: border-color .15s, background .15s; }
.hst-hap input:checked + span { border: 2px solid var(--hst-murekkep); background: #fffbe6; font-weight: 600; }
.hst-hap input:focus-visible + span { outline: 2px solid var(--hst-sari); outline-offset: 2px; }
.hst-hap input:disabled + span { border-style: dashed; color: #9aa0a6; background: #f6f7f8; text-decoration: line-through; cursor: not-allowed; }
.hst-secenek select { height: 46px; border-radius: 10px; border: 1px solid #cfd3d8; font-size: 14px; padding: 0 12px; width: 100%; max-width: 420px; background-color: #fff; }
.hst-secenek--hata .hst-hap span, .hst-secenek--hata select { border-color: #d92d20; }
.hst-secenek__hata { display: none; color: var(--hst-kirmizi); font-size: 12.5px; font-weight: 500; margin-top: 6px; }
.hst-secenek--hata .hst-secenek__hata { display: block; }
.hst-modeller { display: flex; gap: 8px; flex-wrap: wrap; }
.hst-modeller a { width: 60px; height: 60px; border-radius: 10px; border: 1px solid var(--hst-cizgi); padding: 4px; display: flex; align-items: center; justify-content: center; background: #fff; }
.hst-modeller a.aktif { border: 2px solid var(--hst-murekkep); }
.hst-modeller img { max-height: 100%; width: auto; }

.hst-adet { display: inline-flex; align-items: center; border: 1px solid #d4d7dc; border-radius: 10px; height: 46px; background: #fff; }
.hst-adet button { width: 44px; height: 44px; border: 0; background: none; color: var(--hst-murekkep); display: flex; align-items: center; justify-content: center; padding: 0; }
.hst-adet input { width: 44px; height: 44px; border: 0; text-align: center; font: 600 15px Poppins, sans-serif; background: transparent; padding: 0; -moz-appearance: textfield; }
.hst-adet input::-webkit-outer-spin-button, .hst-adet input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.hst-adet--kucuk { height: 38px; border-radius: 9px; }
.hst-adet--kucuk button, .hst-adet--kucuk input { width: 36px; height: 36px; font-size: 14px; }

.hst-satin-al { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 4px; }
.hst-satin-al__btn { flex: 1 1 220px; }
.hst-satin-al__toplam { display: none; }
.hst-ikincil { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 14px; font-size: 13px; }
.hst-ikincil a { color: var(--hst-soluk); display: inline-flex; align-items: center; gap: 6px; }
.hst-ikincil a:hover { color: var(--hst-murekkep); }
.hst-iletisim-btnler { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px; margin-top: 14px; }

.hst-urun .product-details-tab { background: #fff; border-radius: 16px; padding: 20px 24px; margin-top: 20px; box-shadow: var(--hst-golge); }
.hst-urun .product-details-tab .nav.nav-pills { justify-content: flex-start !important; gap: 20px; border-bottom: 1px solid #eceef1; flex-wrap: nowrap; overflow-x: auto; }
.hst-urun .product-details-tab .nav-pills .nav-link { font: 500 14px Poppins, sans-serif; text-transform: none; letter-spacing: 0; color: var(--hst-soluk); padding: 10px 0; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; white-space: nowrap; }
.hst-urun .product-details-tab .nav-pills .nav-link.active { color: var(--hst-murekkep); border-bottom-color: var(--hst-murekkep); }
.hst-urun .product-details-tab .tab-content { border: 0; padding: 18px 0 0; }
.hst-urun .product-desc-content img { height: auto !important; }

@media (max-width: 991px) {
	.hst-urun { padding-bottom: 90px; }
	.hst-urun__duzen { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 12px; border-radius: 0; margin: 0 -16px; box-shadow: none; }
	.hst-urun .product-main-image { min-height: 260px; }
	.hst-urun .product-main-image img { max-height: 340px; }
	.hst-urun .product-image-gallery { flex-wrap: nowrap; overflow-x: auto; }
	.hst-urun .product-gallery-item { width: 56px; height: 56px; }
	.hst-urun__baslik { font-size: 18px; }
	.hst-urun__fiyat #sonfiyat { font-size: 26px; }
	.hst-urun .product-details-tab { margin: 12px -16px 0; border-radius: 0; padding: 14px 16px; }
	/* Mobilde sepete ekle çubuğu ekranın altına sabitlenir */
	.hst-satin-al--yapisik { position: fixed; left: 0; right: 0; bottom: 0; z-index: 120; margin: 0; background: #fff; border-top: 1px solid #e6e8eb; box-shadow: 0 -6px 18px rgba(0,0,0,.07); padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); flex-wrap: nowrap; }
	.hst-satin-al--yapisik .hst-satin-al__toplam { display: block; flex: none; }
	.hst-satin-al--yapisik .hst-satin-al__toplam small { display: block; font-size: 11px; color: var(--hst-soluk); line-height: 1.2; }
	.hst-satin-al--yapisik .hst-satin-al__toplam b { font-size: 17px; font-weight: 700; color: var(--hst-murekkep); white-space: nowrap; }
	.hst-satin-al--yapisik .hst-satin-al__btn { flex: 1; min-width: 0; }
	body:has(.hst-satin-al--yapisik) .hst-altbar { display: none !important; }
	body:has(.hst-satin-al--yapisik) #scroll-top { display: none !important; }
}

/* ---------- Sepet sayfası ---------- */
.hst-sepet { padding: 8px 0 40px; }
.hst-sepet__duzen { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
.hst-sepet__liste { background: #fff; border-radius: 16px; box-shadow: var(--hst-golge); }
.hst-sepet-satir { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; gap: 16px; padding: 18px 20px; border-bottom: 1px solid #f0f1f3; align-items: center; }
.hst-sepet-satir:last-child { border-bottom: 0; }
.hst-sepet-satir__gorsel { width: 96px; height: 96px; border-radius: 12px; border: 1px solid #f0f1f3; display: flex; align-items: center; justify-content: center; padding: 6px; background: #fff; }
.hst-sepet-satir__gorsel img { max-height: 100%; width: auto; }
.hst-sepet-satir__ad { font: 500 14px/1.4 Poppins, sans-serif; color: var(--hst-murekkep); display: block; }
.hst-sepet-satir__secenek { font-size: 12px; color: var(--hst-soluk); margin-top: 2px; }
.hst-sepet-satir__birim { font-size: 12px; color: var(--hst-soluk); margin-top: 4px; }
.hst-sepet-satir__rozetler { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.hst-sepet-satir__sag { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.hst-sepet-satir__tutar { font: 700 16px Poppins, sans-serif; color: var(--hst-murekkep); white-space: nowrap; }
.hst-sepet-satir__alt { display: flex; align-items: center; gap: 10px; }
.hst-sil-btn { width: 38px; height: 38px; border-radius: 9px; border: 1px solid var(--hst-cizgi); background: #fff; color: var(--hst-soluk); display: flex; align-items: center; justify-content: center; padding: 0; }
.hst-sil-btn:hover { color: var(--hst-kirmizi); border-color: var(--hst-kirmizi); }
.hst-ozet { background: #fff; border-radius: 16px; padding: 20px; box-shadow: var(--hst-golge); position: sticky; top: 16px; }
.hst-ozet h2 { font: 600 17px Poppins, sans-serif; margin: 0 0 12px; color: var(--hst-murekkep); }
.hst-ozet__satir { display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px; padding: 6px 0; color: #4a4f56; }
.hst-ozet__satir--indirim { color: var(--hst-kirmizi); }
.hst-ozet__satir a { font-size: 11.5px; color: var(--hst-kirmizi); text-decoration: underline; margin-left: 6px; }
.hst-ozet__toplam { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px solid #eceef1; margin-top: 8px; padding-top: 12px; font-weight: 600; color: var(--hst-murekkep); }
.hst-ozet__toplam b { font-size: 22px; letter-spacing: -.02em; }
.hst-ozet__kargo-ipucu { font-size: 12.5px; background: #fff7d6; color: #7a5b00; border-radius: 8px; padding: 8px 10px; margin: 8px 0 4px; }
.hst-kupon { display: flex; gap: 8px; margin: 12px 0; }
.hst-kupon input, .hst-ozet select { flex: 1; height: 44px; border: 1px solid #d4d7dc; border-radius: 10px; padding: 0 12px; font-size: 14px; min-width: 0; background: #fff; }
.hst-kupon .hst-btn { min-height: 44px; padding: 0 14px; }
.hst-bos { background: #fff; border-radius: 16px; padding: 56px 20px; text-align: center; box-shadow: var(--hst-golge); }
.hst-bos h2 { font: 600 20px Poppins, sans-serif; color: var(--hst-murekkep); margin: 12px 0 6px; }
.hst-bos p { color: var(--hst-soluk); margin-bottom: 18px; }
.hst-mobil-odeme { display: none; }
@media (max-width: 991px) {
	.hst-sepet { padding-bottom: 150px; }
	.hst-sepet__duzen { grid-template-columns: minmax(0, 1fr); gap: 14px; }
	.hst-sepet-satir { grid-template-columns: 72px minmax(0, 1fr); gap: 12px; padding: 14px; }
	.hst-sepet-satir__gorsel { width: 72px; height: 72px; }
	.hst-sepet-satir__sag { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center; }
	.hst-ozet { position: static; }
	.hst-mobil-odeme { display: flex; position: fixed; left: 0; right: 0; bottom: 64px; z-index: 97; background: #fff; border-top: 1px solid #e6e8eb; box-shadow: 0 -6px 18px rgba(0,0,0,.06); padding: 10px 16px; align-items: center; gap: 12px; }
	.hst-mobil-odeme small { display: block; font-size: 11px; color: var(--hst-soluk); }
	.hst-mobil-odeme b { font-size: 17px; color: var(--hst-murekkep); white-space: nowrap; }
	.hst-mobil-odeme .hst-btn { flex: 1; }
}

/* ---------- Kategori / arama ---------- */
.hst-liste { padding: 8px 0 40px; }
.hst-liste__bas { background: #fff; border-radius: 16px; padding: 20px 24px; box-shadow: var(--hst-golge); margin-bottom: 16px; position: relative; overflow: hidden; }
.hst-liste__bas--gorselli { color: #fff; min-height: 140px; display: flex; flex-direction: column; justify-content: flex-end; background-size: cover; background-position: center; }
.hst-liste__bas--gorselli::before { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.55), rgba(0,0,0,0) 70%); }
.hst-liste__bas > * { position: relative; }
.hst-liste__bas h1 { font: 600 26px/1.2 Poppins, sans-serif; margin: 0; letter-spacing: -.02em; color: inherit; }
.hst-liste__bas--gorselli h1 { color: #fff; }
.hst-kirinti { display: flex; flex-wrap: wrap; gap: 6px; font-size: 12.5px; color: var(--hst-soluk); margin-bottom: 6px; padding: 0; list-style: none; }
.hst-kirinti a { color: inherit; }
.hst-kirinti li + li::before { content: "›"; margin-right: 6px; }
.hst-liste__bas--gorselli .hst-kirinti { color: rgba(255,255,255,.85); }
.hst-liste__duzen { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 20px; align-items: start; }
.hst-liste__duzen--tam { grid-template-columns: minmax(0, 1fr); }
.hst-arac { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.hst-arac__sayi { font-size: 13px; color: var(--hst-soluk); }
.hst-arac__sag { display: flex; gap: 8px; align-items: center; }
.hst-arac select { height: 42px; border: 1px solid #d4d7dc; border-radius: 10px; padding: 0 34px 0 12px; font: 500 13px Poppins, sans-serif; background-color: #fff; color: var(--hst-murekkep); }
.hst-filtre-ac { display: none; }
.hst-filtre { background: #fff; border-radius: 16px; padding: 6px 18px 18px; box-shadow: var(--hst-golge); }
.hst-filtre details { border-bottom: 1px solid #f0f1f3; padding: 12px 0; }
.hst-filtre summary { font: 600 14px Poppins, sans-serif; color: var(--hst-murekkep); cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.hst-filtre summary::-webkit-details-marker { display: none; }
.hst-filtre summary::after { content: "+"; font-weight: 400; font-size: 18px; }
.hst-filtre details[open] summary::after { content: "–"; }
.hst-filtre__secenekler { display: flex; flex-direction: column; gap: 2px; margin-top: 8px; max-height: 260px; overflow: auto; }
.hst-filtre label.hst-onay { display: flex; align-items: center; gap: 10px; min-height: 36px; font-size: 13.5px; color: #3b3f45; cursor: pointer; margin: 0; }
.hst-filtre .hst-onay input { width: 18px; height: 18px; accent-color: var(--hst-murekkep); margin: 0; flex: none; }
.hst-filtre__alt { display: flex; gap: 8px; margin-top: 14px; }
.hst-filtre__alt .hst-btn { flex: 1; }
.hst-filtre__bas { display: none; }
.hst-bos-sonuc { background: #fff; border-radius: 14px; padding: 40px 20px; text-align: center; color: var(--hst-soluk); grid-column: 1 / -1; }
.hst-sayfalama { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin-top: 28px; }
.hst-sayfalama a, .hst-sayfalama span { min-width: 42px; height: 42px; padding: 0 10px; border-radius: 10px; background: #fff; border: 1px solid var(--hst-cizgi); display: flex; align-items: center; justify-content: center; font-weight: 500; color: var(--hst-murekkep); }
.hst-sayfalama span[aria-current] { background: var(--hst-murekkep); color: #fff; border-color: var(--hst-murekkep); }
.hst-sayfalama .hst-sayfalama__bosluk { border: 0; background: none; min-width: 20px; }
@media (max-width: 991px) {
	.hst-liste__bas { padding: 16px; border-radius: 14px; }
	.hst-liste__bas h1 { font-size: 20px; }
	.hst-liste__duzen { grid-template-columns: minmax(0, 1fr); }
	.hst-filtre-ac { display: inline-flex; }
	.hst-filtre { display: none; position: fixed; inset: 0; z-index: 1002; border-radius: 0; overflow: auto; padding: 0 16px 90px; }
	.hst-filtre.acik { display: block; }
	.hst-filtre__bas { display: flex; position: sticky; top: 0; background: #fff; z-index: 2; justify-content: space-between; align-items: center; padding: 14px 0; border-bottom: 1px solid #eceef1; font: 600 16px Poppins, sans-serif; }
	.hst-filtre__bas button { width: 44px; height: 44px; border: 0; background: none; display: flex; align-items: center; justify-content: center; }
	.hst-filtre__alt { position: fixed; left: 0; right: 0; bottom: 0; background: #fff; padding: 12px 16px; border-top: 1px solid #eceef1; margin: 0; }
	.hst-arac select { max-width: 190px; }
}

/* ---------- Mobil alt menü ---------- */
.hst-altbar { display: none; }
@media (max-width: 991px) {
	.hst-altbar { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); position: fixed; left: 0; right: 0; bottom: 0; z-index: 98; height: calc(64px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); background: #fff; border-top: 1px solid #e6e8eb; box-shadow: 0 -4px 14px rgba(0,0,0,.05); }
	.hst-altbar a, .hst-altbar button { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font: 500 10.5px Poppins, sans-serif; color: #5f646b; background: none; border: 0; padding: 0; }
	.hst-altbar .aktif { color: var(--hst-murekkep); font-weight: 600; }
	.hst-altbar .hst-altbar__destek { color: var(--hst-yesil); }
	.hst-altbar .hst-sayac { top: 8px; right: auto; left: 50%; margin-left: 6px; }
	body { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
	#scroll-top { bottom: 80px !important; }
	.footer { padding-bottom: 0; }
}

/* ---------- Sepete eklendi bildirimi ---------- */
.hst-bildirim { position: fixed; z-index: 100000; top: 16px; right: 16px; width: 380px; max-width: calc(100vw - 24px); background: #fff; border-radius: 16px; box-shadow: 0 18px 50px rgba(0,0,0,.22); padding: 16px; font-family: Poppins, sans-serif; animation: hstGir .25s ease-out; }
.hst-bildirim__bas { display: flex; align-items: center; gap: 10px; font: 600 15px Poppins, sans-serif; color: var(--hst-murekkep); margin-bottom: 12px; }
.hst-bildirim__tik { width: 26px; height: 26px; border-radius: 13px; background: #2e9e4f; color: #fff; display: flex; align-items: center; justify-content: center; }
.hst-bildirim__kapat { margin-left: auto; width: 36px; height: 36px; border: 0; background: none; color: var(--hst-soluk); display: flex; align-items: center; justify-content: center; padding: 0; }
.hst-bildirim__urun { display: flex; gap: 12px; align-items: center; }
.hst-bildirim__urun img { width: 64px; height: 64px; object-fit: contain; border: 1px solid #f0f1f3; border-radius: 10px; padding: 4px; flex: none; }
.hst-bildirim__ad { font-size: 13px; font-weight: 500; color: var(--hst-murekkep); line-height: 1.35; }
.hst-bildirim__ek { font-size: 12px; color: var(--hst-soluk); }
.hst-bildirim__butonlar { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
@keyframes hstGir { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@media (max-width: 767px) {
	.hst-bildirim { top: auto; bottom: calc(76px + env(safe-area-inset-bottom)); left: 12px; right: 12px; width: auto; max-width: none; animation-name: hstGirAlt; }
	@keyframes hstGirAlt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
}
#toast-container > div { opacity: 1; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.18); font-family: Poppins, sans-serif; }
@media (max-width: 767px) {
	#toast-container.toast-top-right { top: auto; bottom: calc(80px + env(safe-area-inset-bottom)); right: 12px; left: 12px; }
	#toast-container > div { width: auto !important; }
}

/* ---------- Footer ---------- */
.footer .footer-middle { padding-top: 40px; }
@media (max-width: 767px) {
	.footer .cta-title { font-size: 20px; }
	.footer .cta-desc { font-size: 13px; }
	.footer-bottom .container { flex-direction: column; gap: 10px; text-align: center; }
	.Etiketalani { margin-top: 0; }
}

/* Eski sabit genişlikler (mobilde taşma yapıyordu) */
@media (max-width: 767px) {
	#newsletter-popup { margin: 40px 12px !important; padding: 0 !important; width: auto !important; min-height: 0 !important; }
	#newsletter-popup img { width: 100% !important; height: auto !important; }
	.popup-container .popup-box { width: calc(100vw - 24px) !important; }
}