/* widget-divider */
.elementor-widget-divider{--divider-border-style:none;--divider-border-width:1px;--divider-color:#0c0d0e;--divider-icon-size:20px;--divider-element-spacing:10px;--divider-pattern-height:24px;--divider-pattern-size:20px;--divider-pattern-url:none;--divider-pattern-repeat:repeat-x}.elementor-widget-divider .elementor-divider{display:flex}.elementor-widget-divider .elementor-divider__text{font-size:15px;line-height:1;max-width:95%}.elementor-widget-divider .elementor-divider__element{flex-shrink:0;margin:0 var(--divider-element-spacing)}.elementor-widget-divider .elementor-icon{font-size:var(--divider-icon-size)}.elementor-widget-divider .elementor-divider-separator{direction:ltr;display:flex;margin:0}.elementor-widget-divider--view-line_icon .elementor-divider-separator,.elementor-widget-divider--view-line_text .elementor-divider-separator{align-items:center}.elementor-widget-divider--view-line_icon .elementor-divider-separator:after,.elementor-widget-divider--view-line_icon .elementor-divider-separator:before,.elementor-widget-divider--view-line_text .elementor-divider-separator:after,.elementor-widget-divider--view-line_text .elementor-divider-separator:before{border-block-end:0;border-block-start:var(--divider-border-width) var(--divider-border-style) var(--divider-color);content:"";display:block;flex-grow:1}.elementor-widget-divider--element-align-left .elementor-divider .elementor-divider-separator>.elementor-divider__svg:first-of-type{flex-grow:0;flex-shrink:100}.elementor-widget-divider--element-align-left .elementor-divider-separator:before{content:none}.elementor-widget-divider--element-align-left .elementor-divider__element{margin-left:0}.elementor-widget-divider--element-align-right .elementor-divider .elementor-divider-separator>.elementor-divider__svg:last-of-type{flex-grow:0;flex-shrink:100}.elementor-widget-divider--element-align-right .elementor-divider-separator:after{content:none}.elementor-widget-divider--element-align-right .elementor-divider__element{margin-right:0}.elementor-widget-divider--element-align-start .elementor-divider .elementor-divider-separator>.elementor-divider__svg:first-of-type{flex-grow:0;flex-shrink:100}.elementor-widget-divider--element-align-start .elementor-divider-separator:before{content:none}.elementor-widget-divider--element-align-start .elementor-divider__element{margin-inline-start:0}.elementor-widget-divider--element-align-end .elementor-divider .elementor-divider-separator>.elementor-divider__svg:last-of-type{flex-grow:0;flex-shrink:100}.elementor-widget-divider--element-align-end .elementor-divider-separator:after{content:none}.elementor-widget-divider--element-align-end .elementor-divider__element{margin-inline-end:0}.elementor-widget-divider:not(.elementor-widget-divider--view-line_text):not(.elementor-widget-divider--view-line_icon) .elementor-divider-separator{border-block-start:var(--divider-border-width) var(--divider-border-style) var(--divider-color)}.elementor-widget-divider--separator-type-pattern{--divider-border-style:none}.elementor-widget-divider--separator-type-pattern.elementor-widget-divider--view-line .elementor-divider-separator,.elementor-widget-divider--separator-type-pattern:not(.elementor-widget-divider--view-line) .elementor-divider-separator:after,.elementor-widget-divider--separator-type-pattern:not(.elementor-widget-divider--view-line) .elementor-divider-separator:before,.elementor-widget-divider--separator-type-pattern:not([class*=elementor-widget-divider--view]) .elementor-divider-separator{background-color:var(--divider-color);-webkit-mask-image:var(--divider-pattern-url);mask-image:var(--divider-pattern-url);-webkit-mask-repeat:var(--divider-pattern-repeat);mask-repeat:var(--divider-pattern-repeat);-webkit-mask-size:var(--divider-pattern-size) 100%;mask-size:var(--divider-pattern-size) 100%;min-height:var(--divider-pattern-height);width:100%}.elementor-widget-divider--no-spacing{--divider-pattern-size:auto}.elementor-widget-divider--bg-round{--divider-pattern-repeat:round}.rtl .elementor-widget-divider .elementor-divider__text{direction:rtl}.e-con-inner>.elementor-widget-divider,.e-con>.elementor-widget-divider{width:var(--container-widget-width,100%);--flex-grow:var( --container-widget-flex-grow )}
/* widget-heading */
.elementor-widget-heading .elementor-heading-title[class*=elementor-size-]>a{color:inherit;font-size:inherit;line-height:inherit}.elementor-widget-heading .elementor-heading-title.elementor-size-small{font-size:15px}.elementor-widget-heading .elementor-heading-title.elementor-size-medium{font-size:19px}.elementor-widget-heading .elementor-heading-title.elementor-size-large{font-size:29px}.elementor-widget-heading .elementor-heading-title.elementor-size-xl{font-size:39px}.elementor-widget-heading .elementor-heading-title.elementor-size-xxl{font-size:59px}
/* hb-liste */
/*
 * HetzonBuilder — liste sayfası parçaları (Widget\Liste\*). Temel görünüm düşük özgüllükle (tek / çift sınıf): temanın
 * etiket kurallarını geçer, liste şablonundaki tasarım ayarları ({{WRAPPER}} …) her zaman ezer. Yalnız kullanılan sayfada.
 */

/* ── Başlık ───────────────────────────────────────────────────────────────────────────────────── */
.hb-lb { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.hb-lb-satir { display: flex; flex-wrap: wrap; align-items: baseline; gap: .45em; }
.hb-lb .hb-lb-baslik { margin: 0; font-size: 26px; font-weight: 700; line-height: 1.2; }
.hb-lb-sayi { font-size: 14px; opacity: .6; }
.hb-lb-iz { display: flex; flex-wrap: wrap; align-items: center; gap: .4em; font-size: 12px; opacity: .75; }
.hb-lb-iz a { color: inherit; text-decoration: none; }
.hb-lb-iz a:hover { text-decoration: underline; }
.hb-lb .hb-lb-aciklama { margin: 0; max-width: 760px; font-size: 14px; line-height: 1.55; opacity: .8; }

/* ── Alt kategoriler ──────────────────────────────────────────────────────────────────────────── */
.hb-lak { display: flex; flex-wrap: wrap; gap: 8px; }
.hb-lak--kaydir { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 2px; }
.hb-lak--kaydir::-webkit-scrollbar { display: none; }
.hb-lak .hb-lak-oge { flex: none; display: inline-flex; align-items: center; padding: 7px 14px; border: 1px solid #d4d4d8; border-radius: 999px;
    color: inherit; text-decoration: none; font-size: 13px; line-height: 1.2; white-space: nowrap; transition: background-color .15s, color .15s, border-color .15s; }
.hb-lak .hb-lak-oge.is-aktif { background: #111; border-color: #111; color: #fff; }
.hb-lak--cizgi .hb-lak-oge { border: 0; border-bottom: 2px solid transparent; border-radius: 0; padding: 6px 2px; margin-right: 14px; }
.hb-lak--cizgi .hb-lak-oge.is-aktif { background: transparent; color: inherit; border-bottom-color: currentColor; }
.hb-lak--duz .hb-lak-oge { border: 0; padding: 4px 0; margin-right: 16px; }
.hb-lak--duz .hb-lak-oge.is-aktif { background: transparent; color: inherit; font-weight: 700; }
/* Görselli kutular (Mejuri): görsel + ad, kutu genişliği --hb-lak-g */
.hb-lak--gorsel { gap: 12px; }
.hb-lak.hb-lak--gorsel .hb-lak-oge { flex-direction: column; align-items: stretch; gap: 8px; width: var(--hb-lak-g, 150px); padding: 0; border: 0; border-radius: 0; background: none; color: inherit; text-align: center; }
.hb-lak--gorsel .hb-lak-gorsel { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: #f4f4f5; }
.hb-lak--gorsel .hb-lak-gorsel img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.hb-lak--gorsel .hb-lak-oge:hover .hb-lak-gorsel img { transform: scale(1.04); }
.hb-lak.hb-lak--gorsel .hb-lak-oge.is-aktif { background: none; color: inherit; }
.hb-lak--gorsel .hb-lak-oge.is-aktif .hb-lak-ad { text-decoration: underline; text-underline-offset: .25em; }
.hb-lak--ad-ic .hb-lak-oge { position: relative; }
.hb-lak--ad-ic .hb-lak-ad { position: absolute; left: 10px; right: 10px; bottom: 8px; text-align: left; }
@media (prefers-reduced-motion: reduce) { .hb-lak--gorsel .hb-lak-gorsel img { transition: none; } }

/* ── Filtre ───────────────────────────────────────────────────────────────────────────────────── */
.hb-lf { --hb-lf-vurgu: #111; }
.hb-lf .hb-lf-dugme { display: inline-flex; align-items: center; gap: .45em; padding: .55em 1em; border: 1px solid #d4d4d8; background: #fff; color: inherit;
    font: inherit; font-size: 14px; cursor: pointer; }
.hb-lf .hb-lf-dugme svg { width: 1.1em; height: 1.1em; }
.hb-lf-dugme-sayi { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5em; height: 1.5em; padding: 0 .35em; border-radius: 999px;
    background: var(--hb-lf-vurgu); color: #fff; font-size: .75em; font-weight: 700; }
.hb-lf-cekmece { position: fixed; inset: 0; z-index: 100000; }
.hb-lf-cekmece[hidden] { display: none; }
.hb-lf-perde { position: absolute; inset: 0; background: rgba(0, 0, 0, .4); opacity: 0; transition: opacity .25s ease; }
.hb-lf-cekmece .hb-lf-panel { position: absolute; top: 0; bottom: 0; right: 0; width: min(380px, 92vw); overflow-y: auto; overscroll-behavior: contain;
    transform: translateX(100%); transition: transform .3s ease; box-shadow: -8px 0 30px rgba(0, 0, 0, .12); }
.hb-lf-cekmece--sol .hb-lf-panel { right: auto; left: 0; transform: translateX(-100%); }
.hb-lf-cekmece.is-acik .hb-lf-perde { opacity: 1; }
.hb-lf-cekmece.is-acik .hb-lf-panel { transform: translateX(0); }
.hb-lf .hb-lf-panel { background: #fff; color: #111; display: flex; flex-direction: column; }
.hb-lf-baslik { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; font-weight: 700; font-size: 16px;
    border-bottom: 1px solid #eee; }
.hb-lf--kenar .hb-lf-baslik { padding: 0 0 12px; }
.hb-lf .hb-lf-kapat { border: 0; background: none; font-size: 26px; line-height: 1; cursor: pointer; color: inherit; padding: 0 4px; }
.hb-lf-form { display: flex; flex-direction: column; flex: 1; }
.hb-lf-cekmece .hb-lf-form { padding: 0 20px; }
.hb-lf .hb-lf-grup { border-bottom: 1px solid #eee; padding: 14px 0; }
.hb-lf .hb-lf-grup > summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; font-weight: 600; font-size: 14px; }
.hb-lf .hb-lf-grup > summary::-webkit-details-marker { display: none; }
.hb-lf .hb-lf-grup > summary::after { content: '+'; font-weight: 400; font-size: 18px; line-height: 1; }
.hb-lf .hb-lf-grup[open] > summary::after { content: '−'; }
.hb-lf-liste { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.hb-lf-fazla { display: flex; flex-direction: column; gap: 8px; }
.hb-lf-fazla[hidden] { display: none; }
.hb-lf .hb-lf-secenek { display: flex; align-items: center; gap: 9px; margin: 0; font-size: 14px; cursor: pointer; line-height: 1.3; }
.hb-lf .hb-lf-secenek input { width: 16px; height: 16px; margin: 0; accent-color: var(--hb-lf-vurgu); flex: none; }
.hb-lf-sayi { opacity: .55; font-size: .9em; }
.hb-lf-benek { width: 16px; height: 16px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .18); flex: none; }
.hb-lf .hb-lf-fazla-dugme { border: 0; background: none; padding: 4px 0 0; color: inherit; text-decoration: underline; font-size: 13px; cursor: pointer; align-self: flex-start; }
.hb-lf-fiyat { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.hb-lf .hb-lf-fiyat input { width: 100%; min-width: 0; padding: 8px 10px; border: 1px solid #d4d4d8; font: inherit; font-size: 14px; }
.hb-lf-alt { display: flex; align-items: center; gap: 14px; padding: 16px 0; margin-top: auto; }
.hb-lf-cekmece .hb-lf-alt { position: sticky; bottom: 0; background: inherit; border-top: 1px solid #eee; }
.hb-lf .hb-lf-uygula { flex: 1; padding: 12px 16px; border: 0; background: var(--hb-lf-vurgu); color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
.hb-lf .hb-lf-uygula.is-sayiyor { opacity: .7; }
.hb-lf .hb-lf-temizle { color: inherit; font-size: 13px; text-decoration: underline; }
.hb-lf--kenar[data-aninda] .hb-lf-uygula, .hb-lf--kenar .hb-lf-form[data-hb-aninda] .hb-lf-uygula { display: none; }
html.hb-lf-kilit { overflow: hidden; }

/* ── Sıralama ─────────────────────────────────────────────────────────────────────────────────── */
.hb-ls { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; max-width: 100%; }
.hb-ls label { display: inline-flex; align-items: center; gap: 8px; margin: 0; min-width: 0; max-width: 100%; }
/* Dar kapta (telefonda araç çubuğu) taşmasın: liste kutusu daralır, uzun seçenek kesilir */
.hb-ls select { padding: 7px 28px 7px 10px; border: 1px solid #d4d4d8; background-color: #fff; font: inherit; color: inherit; cursor: pointer; min-width: 0; max-width: 100%; text-overflow: ellipsis; }
.hb-ls-etiket { white-space: nowrap; }
/* Metin + açılır menü (<details>) */
.hb-ls--menu { position: relative; display: inline-block; }
.hb-ls--menu > summary { display: inline-flex; align-items: center; gap: 6px; list-style: none; cursor: pointer; white-space: nowrap; }
.hb-ls--menu > summary::-webkit-details-marker { display: none; }
.hb-ls--menu > summary svg { transition: transform .2s; }
.hb-ls--menu[open] > summary svg { transform: rotate(180deg); }
.hb-ls-menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 30; display: flex; flex-direction: column; min-width: 200px; padding: 8px 0;
    background: #fff; color: #111; box-shadow: 0 12px 32px rgba(0, 0, 0, .12); }
.hb-ls--menu-sol .hb-ls-menu { right: auto; left: 0; }
.hb-ls-menu .hb-ls-secenek { padding: 9px 16px; color: inherit; text-decoration: none; white-space: nowrap; opacity: 1; }
.hb-ls-menu .hb-ls-secenek:hover { background: rgba(0, 0, 0, .04); }
.hb-ls-menu .hb-ls-secenek.is-aktif { font-weight: 600; text-decoration: none; }
.hb-ls--metin { flex-wrap: wrap; gap: 4px 14px; }
.hb-ls .hb-ls-secenek { color: inherit; text-decoration: none; opacity: .6; }
.hb-ls .hb-ls-secenek.is-aktif { opacity: 1; text-decoration: underline; }
.hb-ls-etiket { opacity: .7; }
.hb-ls--hap { gap: 8px; }
.hb-ls--hap .hb-ls-secenek { padding: 7px 14px; border: 1px solid #d4d4d8; border-radius: 999px; opacity: 1; font-size: 13px; }
.hb-ls--hap .hb-ls-secenek.is-aktif { text-decoration: none; background: #111; border-color: #111; color: #fff; }
@media (max-width: 767px) { .hb-ls--hap { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; padding-bottom: 4px; } .hb-ls--hap .hb-ls-secenek { flex: none; } }

/* ── Yoğunluk ─────────────────────────────────────────────────────────────────────────────────── */
.hb-ly { display: inline-flex; align-items: center; gap: 4px; }
.hb-ly-masa, .hb-ly-mobil { display: inline-flex; gap: 2px; }
.hb-ly-mobil { display: none; }
@media (max-width: 767px) { .hb-ly-masa { display: none; } .hb-ly-mobil { display: inline-flex; } }
.hb-ly button { display: inline-flex; padding: 4px; border: 0; background: none; color: inherit; opacity: .35; cursor: pointer; }
.hb-ly button[aria-pressed="true"] { opacity: 1; }
.hb-ly svg { width: 20px; height: 20px; }
.hb-ly-etiket { font-size: 13px; opacity: .7; margin-right: 4px; }
/* Kaydırıcı görünümü (Koton): ince çizgi + yuvarlak tutamaç, rengi yazı rengi */
.hb-ly--kaydirici { gap: 12px; }
.hb-ly-aralik { width: 140px; height: 18px; margin: 0; background: none; -webkit-appearance: none; appearance: none; cursor: pointer; color: inherit; }
.hb-ly-aralik::-webkit-slider-runnable-track { height: 2px; background: currentColor; opacity: .9; }
.hb-ly-aralik::-moz-range-track { height: 2px; background: currentColor; }
.hb-ly-aralik::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; margin-top: -7px; border: 1.5px solid currentColor; border-radius: 50%; background: #fff; }
.hb-ly-aralik::-moz-range-thumb { width: 14px; height: 14px; border: 1.5px solid currentColor; border-radius: 50%; background: #fff; }
.hb-ly-aralik:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* ── Etkin filtreler ──────────────────────────────────────────────────────────────────────────── */
.hb-laf { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.hb-laf .hb-laf-oge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; background: #f1f1f2; color: inherit;
    text-decoration: none; font-size: 13px; }
.hb-laf .hb-laf-oge span { opacity: .6; font-size: 1.1em; line-height: 1; }
.hb-laf .hb-laf-temizle { font-size: 13px; color: inherit; text-decoration: underline; }

/* ── Ürünler: sayfalama / daha fazla ──────────────────────────────────────────────────────────── */
.hb-lu-sayfalama { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px; margin-top: 36px; }
.hb-liste-urunler .hb-lu-sayfa { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 10px;
    border: 1px solid #e4e4e7; color: inherit; text-decoration: none; font-size: 14px; }
.hb-liste-urunler .hb-lu-sayfa.is-aktif { background: #111; border-color: #111; color: #fff; }
.hb-lu-bosluk { padding: 0 4px; opacity: .5; }
.hb-lu-daha { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 36px; }
.hb-lu-sayac { font-size: 13px; opacity: .65; }
.hb-liste-urunler .hb-lu-daha-dugme { min-width: 220px; height: 46px; padding: 0 24px; font-weight: 600; }
.hb-liste-urunler .hb-lu-daha-dugme.is-yukleniyor { opacity: .5; pointer-events: none; }
.hb-liste-urunler[data-sayfalama="sonsuz"] .hb-lu-daha-dugme { visibility: hidden; }
.hb-liste-urunler--bos { padding: 48px 0; text-align: center; }

/* ── Filtre değer görünümleri (ListeFiltresi): çip, ızgara (beden / ölçü), renk dairesi / karesi, aranabilir, anahtar ── */
.hb-lf-liste--cip, .hb-lf-liste--izgara, .hb-lf-liste--daire, .hb-lf-liste--kare { flex-direction: row; flex-wrap: wrap; gap: 8px; }
:is(.hb-lf-liste--cip, .hb-lf-liste--izgara, .hb-lf-liste--daire, .hb-lf-liste--kare) .hb-lf-fazla:not([hidden]) { display: contents; }
:is(.hb-lf-liste--cip, .hb-lf-liste--izgara, .hb-lf-liste--daire, .hb-lf-liste--kare) .hb-lf-secenek { position: relative; }
:is(.hb-lf-liste--cip, .hb-lf-liste--izgara, .hb-lf-liste--daire, .hb-lf-liste--kare) .hb-lf-secenek input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.hb-lf .hb-lf-liste--cip .hb-lf-secenek { padding: 6px 12px; border: 1px solid #d4d4d8; border-radius: 999px; font-size: 13px; }
.hb-lf .hb-lf-liste--izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(52px, 1fr)); }
.hb-lf .hb-lf-liste--izgara .hb-lf-secenek { justify-content: center; min-height: 42px; padding: 6px; border: 1px solid #d4d4d8; font-size: 13px; text-align: center; }
.hb-lf .hb-lf-liste--izgara .hb-lf-sayi { display: none; }
:is(.hb-lf-liste--cip, .hb-lf-liste--izgara) .hb-lf-secenek:has(input:checked) { border-color: var(--hb-lf-vurgu); background: var(--hb-lf-vurgu); color: #fff; }
:is(.hb-lf-liste--cip, .hb-lf-liste--izgara, .hb-lf-liste--daire, .hb-lf-liste--kare) .hb-lf-secenek:has(input:focus-visible) { outline: 2px solid var(--hb-lf-vurgu); outline-offset: 2px; }
/* Renk dairesi / karesi: yalnız benek (ad ekran okuyucuda ve ipucunda) */
.hb-lf .hb-lf-liste--daire .hb-lf-benek, .hb-lf .hb-lf-liste--kare .hb-lf-benek { width: 32px; height: 32px; }
.hb-lf .hb-lf-liste--kare .hb-lf-benek { border-radius: 4px; }
:is(.hb-lf-liste--daire, .hb-lf-liste--kare) .hb-lf-renk > span:not(.hb-lf-benek) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:is(.hb-lf-liste--daire, .hb-lf-liste--kare) .hb-lf-renk:has(input:checked) .hb-lf-benek { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--hb-lf-vurgu); }
.hb-lf .hb-lf-ara { width: 100%; margin-top: 12px; padding: 8px 10px; border: 1px solid #d4d4d8; font: inherit; font-size: 14px; }
.hb-lf-secenek.is-gizli { display: none !important; }
/* Anahtar (yalnız stoktakiler) */
.hb-lf-anahtar-satir { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; font-size: 14px; font-weight: 600; cursor: pointer; }
.hb-lf-anahtar-satir input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hb-lf-anahtar-satir i { position: relative; flex: none; width: 40px; height: 22px; border-radius: 999px; background: #d4d4d8; transition: background .2s; }
.hb-lf-anahtar-satir i::after { content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .2s; }
.hb-lf-anahtar-satir input:checked + i { background: var(--hb-lf-vurgu); }
.hb-lf-anahtar-satir input:checked + i::after { transform: translateX(18px); }
.hb-lf-anahtar-satir input:focus-visible + i { outline: 2px solid var(--hb-lf-vurgu); outline-offset: 2px; }
/* Segment (Tükenenler: Göster / Gizle) — aynı stokta parametresi, iki düğmeli */
.hb-lf-segment .hb-lf-anahtar-satir { cursor: default; }
.hb-lf-segment-dugmeler { display: inline-flex; flex: none; padding: 3px; border-radius: 999px; background: #f4f4f5; }
.hb-lf-segment-dugmeler label { position: relative; margin: 0; cursor: pointer; }
.hb-lf-segment-dugmeler span { display: block; padding: 5px 12px; border-radius: 999px; font-size: 13px; font-weight: 600; color: #52525b; transition: background .2s, color .2s; }
.hb-lf-segment-dugmeler input:checked + span { background: #fff; color: var(--hb-lf-vurgu); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.hb-lf-segment-dugmeler input:focus-visible + span { outline: 2px solid var(--hb-lf-vurgu); outline-offset: 1px; }
/* Yatay çubuk: gruplar hap, içerik açılır kutu */
.hb-lf--cubuk .hb-lf-form { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; }
.hb-lf--cubuk .hb-lf-grup { position: relative; padding: 0; border: 0; }
.hb-lf--cubuk .hb-lf-grup > summary { gap: 8px; padding: 8px 14px; border: 1px solid #d4d4d8; border-radius: 999px; font-size: 13px; background: #fff; }
.hb-lf--cubuk .hb-lf-grup > summary::after { content: ''; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translate(-2px, -2px); }
.hb-lf--cubuk .hb-lf-grup[open] > summary::after { content: ''; transform: rotate(-135deg); }
.hb-lf--cubuk .hb-lf-grup:has(input:checked) > summary { border-color: var(--hb-lf-vurgu); }
.hb-lf--cubuk .hb-lf-icerik { position: absolute; top: calc(100% + 8px); left: 0; z-index: 30; min-width: 260px; max-width: min(420px, 90vw); max-height: 380px; overflow-y: auto;
    padding: 4px 16px 16px; background: #fff; color: #111; border-radius: 12px; box-shadow: 0 14px 40px rgba(0, 0, 0, .14); }
.hb-lf--cubuk .hb-lf-anahtar { padding: 8px 14px; border: 1px solid #d4d4d8; border-radius: 999px; }
.hb-lf--cubuk .hb-lf-anahtar-satir { font-size: 13px; }
.hb-lf--cubuk .hb-lf-alt { margin: 0; padding: 0; gap: 10px; }
.hb-lf--cubuk .hb-lf-uygula { flex: none; padding: 9px 16px; border-radius: 999px; font-size: 13px; }
.hb-lf--cubuk .hb-lf-form[data-hb-aninda] .hb-lf-uygula { display: none; }
@media (max-width: 767px) { .hb-lf--cubuk .hb-lf-form { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; } .hb-lf--cubuk .hb-lf-icerik { position: fixed; left: 16px; right: 16px; top: auto; max-width: none; } }

/* ── Ürün listesi: ilerleme çubuğu (daha fazla) ve liste görünümü (yatay kart) ── */
.hb-lu-ilerleme { display: block; width: min(320px, 100%); height: 3px; background: rgba(0, 0, 0, .1); border-radius: 2px; overflow: hidden; }
.hb-lu-ilerleme i { display: block; height: 100%; background: currentColor; transition: width .3s ease; }
/* Kartın kök kutusu (kart şablonu .elementor sarmalayıcısında): yatay; ilk öğe (görsel) solda sabit genişlik */
.hb-dongu--liste > .e-loop-item > :is(.elementor, .e-con) > .e-con, .hb-dongu--liste > .e-loop-item > .e-con { flex-direction: row !important; flex-wrap: nowrap; align-items: center; gap: 20px; }
.hb-dongu--liste > .e-loop-item :is(.elementor, .e-loop-item) > .e-con > :first-child { flex: 0 0 min(32%, 260px) !important; max-width: min(32%, 260px); width: auto !important; }
.hb-dongu--liste > .e-loop-item :is(.elementor, .e-loop-item) > .e-con > :not(:first-child) { flex: 1 1 0 !important; min-width: 0; }

/* Fiyat kaydırıcısı (çift tutamaç): iki range üst üste, yalnız tutamaçlar tıklanır */
.hb-lf-kaydir { display: flex; flex-direction: column; gap: 10px; padding: 6px 2px 2px; }
.hb-lf-kaydir-iz { position: relative; height: 22px; }
.hb-lf-kaydir-iz::before, .hb-lf-kaydir-dolu { content: ""; position: absolute; top: 50%; height: 4px; margin-top: -2px; border-radius: 999px; }
.hb-lf-kaydir-iz::before { left: 0; right: 0; background: rgba(0,0,0,.12); }
.hb-lf-kaydir-dolu { background: var(--hb-lf-vurgu, #111); }
.hb-lf-kaydir input[type="range"] { position: absolute; inset: 0; width: 100%; height: 22px; margin: 0; background: none; pointer-events: none; -webkit-appearance: none; appearance: none; }
.hb-lf-kaydir input[type="range"]::-webkit-slider-runnable-track { background: none; border: 0; }
.hb-lf-kaydir input[type="range"]::-moz-range-track { background: none; border: 0; }
.hb-lf-kaydir input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; border: 2px solid var(--hb-lf-vurgu, #111); border-radius: 50%;
    background: #fff; cursor: grab; pointer-events: auto; }
.hb-lf-kaydir input[type="range"]::-moz-range-thumb { width: 16px; height: 16px; border: 2px solid var(--hb-lf-vurgu, #111); border-radius: 50%; background: #fff; cursor: grab; pointer-events: auto; }
.hb-lf-kaydir input[type="range"]:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--hb-lf-vurgu, #111); outline-offset: 2px; }
.hb-lf-kaydir-deger { display: flex; justify-content: space-between; font-size: 13px; font-variant-numeric: tabular-nums; }

/* Tam genişlik panel: düğme + sayfada açılan panel, gruplar sütunlarda */
.hb-lf--panel { --hb-lf-sutun: 4; position: relative; }
.hb-lf-tam { position: absolute; top: calc(100% + 10px); left: 0; z-index: 40; width: min(100vw - 32px, 1200px); max-height: 75vh; overflow: auto; padding: 24px;
    border: 1px solid rgba(0,0,0,.08); border-radius: 12px; background: #fff; color: #111; box-shadow: 0 18px 50px rgba(0,0,0,.16); }
.hb-lf-tam .hb-lf-form { display: grid; grid-template-columns: repeat(var(--hb-lf-sutun), minmax(0, 1fr)); gap: 16px 28px; align-items: start; }
.hb-lf-tam .hb-lf-alt { grid-column: 1 / -1; display: flex; align-items: center; gap: 16px; padding-top: 12px; border-top: 1px solid rgba(0,0,0,.08); }
.hb-lf-tam .hb-lf-grup > summary { pointer-events: none; list-style: none; }
.hb-lf-tam .hb-lf-grup > summary::-webkit-details-marker { display: none; }
@media (max-width: 1024px) { .hb-lf-tam .hb-lf-form { grid-template-columns: repeat(min(var(--hb-lf-sutun), 2), minmax(0, 1fr)); } }
@media (max-width: 767px) { .hb-lf-tam .hb-lf-form { grid-template-columns: minmax(0, 1fr); } }
.hb-lf-tam .hb-lf-grup > summary::after, .hb-lf-tam .hb-lf-grup > summary::before { display: none; }

/* Görsel kaynağı geçişi (ListeGorselKaynagi): hap düğmeler */
.hb-lg { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; }
.hb-lg-etiket { opacity: .7; }
.hb-lg button { padding: 5px 12px; border: 1px solid transparent; border-radius: 999px; background: none; color: inherit; font: inherit; cursor: pointer; opacity: .65; }
.hb-lg button[aria-pressed="true"] { border-color: currentColor; opacity: 1; font-weight: 600; }

/* Kategori ağacı (Alt kategoriler "agac" — kenar sütunu): satır = bağlantı + (alt dal varsa) ok; alt dal kapalı, bulunulan yol açık */
.hb-lak.hb-lak--agac { display: block; overflow: visible; }
.hb-lak-agac { list-style: none; margin: 0; padding: 0; }
.hb-lak-agac .hb-lak-agac { display: none; padding-left: 14px; }
.hb-lak-dal { display: flex; flex-wrap: wrap; align-items: center; margin: 0; }
.hb-lak-dal.is-acik > .hb-lak-agac { display: block; flex-basis: 100%; }
.hb-lak--agac .hb-lak-oge { flex: 1; min-width: 0; padding: 8px 5px 8px 0; border: 0; border-radius: 0; background: none; font-size: inherit; line-height: 1.4;
    white-space: normal; opacity: .75; }
.hb-lak--agac .hb-lak-oge:hover { opacity: 1; }
.hb-lak--agac .hb-lak-oge.is-aktif { background: none; color: inherit; font-weight: 600; opacity: 1; }
.hb-lak--agac .hb-lak-ac { flex: none; display: inline-grid; place-items: center; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%;
    background: none; color: inherit; opacity: .45; cursor: pointer; transition: transform .2s, opacity .2s; }
.hb-lak--agac .hb-lak-ac:hover { opacity: .8; }
.hb-lak-dal.is-acik > .hb-lak-ac { transform: rotate(180deg); }

/* Sonuç sayısı (ListeSonuc) ve sayfa başına (ListeAdet) — araç çubuğu metinleri */
.hb-lsn { margin: 0; }
.hb-lad { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0; }
.hb-lad-etiket { margin-right: 6px; font-weight: 600; }
.hb-lad-oge { padding: 0 7px; color: inherit; text-decoration: none; opacity: .75; }
.hb-lad-oge:hover { opacity: 1; }
.hb-lad-oge.is-aktif { font-weight: 600; opacity: 1; }
.hb-lad-ayirici { opacity: .5; }

/* Liste başlığı: "İz yolu net" — solukluk yok, renkler ayarlandığı gibi */
.hb-lb-iz-net-yes .hb-lb-iz { opacity: 1; }
/* Filtre kenarda, gruplar sabit (katla kapalı): başlıkta + / – yok, tıklanmaz */
.hb-lf--sabit .hb-lf-grup > summary { cursor: default; pointer-events: none; }
.hb-lf--sabit .hb-lf-grup > summary::after { content: none; }
/* İnce kaydırıcı (WooCommerce deseni): 2px iz, dikdörtgen tutamaç; altında "Fiyat: a — b" ve düğme */
.hb-lf-kaydir--woo .hb-lf-kaydir-iz::before, .hb-lf-kaydir--woo .hb-lf-kaydir-dolu { height: 2px; margin-top: -1px; border-radius: 0; }
.hb-lf-kaydir--woo input[type="range"]::-webkit-slider-thumb { width: 6px; height: 16px; border: 0; border-radius: 0; background: var(--hb-lf-vurgu, #111); }
.hb-lf-kaydir--woo input[type="range"]::-moz-range-thumb { width: 6px; height: 16px; border: 0; border-radius: 0; background: var(--hb-lf-vurgu, #111); }
.hb-lf-kaydir--woo .hb-lf-kaydir-deger { align-items: center; gap: 10px; margin-top: 10px; font-size: inherit; }
.hb-lf-kaydir--woo output { font-weight: 600; color: var(--e-global-color-primary, #242424); }
.hb-lf .hb-lf-uygula.hb-lf-uygula--satir { flex: none; padding: 5px 14px; min-height: 36px; border-radius: 35px; background: #333; font-size: 12px; }
.hb-lf-form--tek-fiyat > .hb-lf-alt > .hb-lf-uygula { display: none; }
.hb-lf-form--tek-fiyat > .hb-lf-alt:not(:has(.hb-lf-temizle)) { display: none; }
.hb-lf--sabit .hb-lf-grup[open] > summary::after { content: none; }
/* Kitin form alanı stili (.elementor-kit-N input:not(…), 0,3,1) aralık girdisine işlemesin — kalın beyaz kutu oluyordu */
.hb-lf .hb-lf-kaydir input[type="range"][data-uc] { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; min-height: 0; }
.hb-lf-kaydir--woo .hb-lf-fiyat-metin { font-size: 16px; }
/* Sayfa başına: kitin bağlantı rengi seçeneklere işlemesin (renk widget'tan) */
.hb-lad .hb-lad-oge { color: inherit; }
/* Yoğunluk düğmeleri: kitin düğme stili (.elementor-kit-N button) işlemesin — dolu yuvarlak düğme oluyordu */
.hb-ly button[data-sutun] { border: 0; border-radius: 0; background: none; box-shadow: none; min-height: 0; }
/* Nokta ızgarası: soluklaştırma yok, seçili / seçilmemiş rengi widget'tan (Renk / Seçili) */
.hb-ly--nokta { gap: 14px; }
.hb-ly--nokta button { opacity: 1; padding: 0; }
.hb-ly--nokta svg { width: 29px; height: 29px; }
/* Filtre kenarda, gruplar sabit: grup alt çizgisi yok (ayırıcı sayfa düzeninde) */
.hb-lf--sabit .hb-lf-grup { border-bottom: 0; padding-top: 0; }
/* Sıralama "Telefonda yalnız simge": masaüstünde simge yok; telefonda kutu simgenin üstünde saydam */
.hb-ls-simge { display: none; }
@media (max-width: 767px) {
    .hb-ls--mobil-simge label { position: relative; }
    .hb-ls--mobil-simge .hb-ls-simge { display: inline-flex; }
    .hb-ls--mobil-simge .hb-ls-etiket { display: none; }
    .hb-ls--mobil-simge select { position: absolute; inset: 0; width: 100% !important; height: 100% !important; opacity: 0; cursor: pointer; }
}
/* KİT DÜĞME KALKANI (ust.css ile aynı ilke): zeminsiz simge / metin düğmeleri her hâlde zeminsiz */
button:is(.hb-lak-ac.hb-lak-ac, .hb-lf-kapat.hb-lf-kapat, .hb-lf-fazla-dugme.hb-lf-fazla-dugme),
button:is(.hb-lak-ac.hb-lak-ac, .hb-lf-kapat.hb-lf-kapat, .hb-lf-fazla-dugme.hb-lf-fazla-dugme):is(:hover, :focus, :focus-visible, :active) {
    background: none; border-color: transparent; box-shadow: none; color: inherit; }
.hb-ly button[data-sutun]:is(:hover, :focus, :focus-visible, :active) { background: none; border-color: transparent; box-shadow: none; }
.hb-ly button[data-sutun]:is(:hover, :focus) { color: inherit; }
.hb-ly button[data-sutun]:focus-visible, .hb-lak-ac.hb-lak-ac:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* Sayfa yenilemeden süzgeç (liste.js gezin): istek sürerken ürünler soluk, tıklanmaz */
.hb-liste-yukleniyor .hb-liste-urunler { opacity: .45; pointer-events: none; transition: opacity .15s; }
.hb-liste-yukleniyor body { cursor: progress; }
/* Alt kategori kutuları (ızgaranın başında — WooCommerce "alt kategoriler ve ürünler"); biçem ayarları üstüne yazar */
.hb-luk { position: relative; display: block; box-sizing: border-box; padding: 15px; border-radius: 16px; background: #F7F7F7; color: #fff; text-decoration: none; }
.hb-luk-gorsel { position: relative; display: block; aspect-ratio: 1; overflow: hidden; border-radius: 16px; background: rgba(0, 0, 0, .06); }
.hb-luk-gorsel img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.hb-luk:is(:hover, :focus-visible) .hb-luk-gorsel img { transform: scale(1.04); }
.hb-luk-ad { position: absolute; left: calc(15px + var(--hb-luk-ad-kenar, 20px)); right: calc(15px + var(--hb-luk-ad-kenar, 20px)); bottom: calc(15px + var(--hb-luk-ad-kenar, 16px));
    color: #fff; font-size: 20px; font-weight: 500; line-height: 1.3; text-transform: uppercase; }

/* hb-kart */
/*
 * HetzonBuilder — ürün kartı parçaları (Widget\Kart\*) ve Ürün Döngüsü (Widget\Dongu). Temel görünüm burada düşük
 * özgüllükle (tek / çift sınıf): temanın h3 / img / button kurallarını geçer, kart şablonundaki tasarım ayarları
 * ({{WRAPPER}} .hb-…, en az üç sınıf) her zaman ezer. Yalnız kullanılan sayfada yüklenir.
 */

/* ── Ürün görseli: oran kutusu, ikinci görsel (solma / kayma), yakınlaşma ─────────────────────────── */
.hb-kg { position: relative; display: block; overflow: hidden; aspect-ratio: 1 / 1; background: #f4f4f5; --hb-kg-sure: 450ms; }
.hb-kg .hb-kg-ana, .hb-kg .hb-kg-iki { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; max-width: none;
    transition: opacity var(--hb-kg-sure) ease, transform var(--hb-kg-sure) ease; }
.hb-kg .hb-kg-iki { position: absolute; inset: 0; opacity: 0; }
.hb-kg--kayma .hb-kg-iki { opacity: 1; transform: translateX(100%); }
:where(.e-loop-item:hover, .elementor-widget-hb-kart-gorsel:hover) .hb-kg--solma.hb-kg--cift .hb-kg-iki { opacity: 1; }
:where(.e-loop-item:hover, .elementor-widget-hb-kart-gorsel:hover) .hb-kg--kayma.hb-kg--cift .hb-kg-iki { transform: translateX(0); }
:where(.e-loop-item:hover, .elementor-widget-hb-kart-gorsel:hover) .hb-kg--kayma.hb-kg--cift .hb-kg-ana { transform: translateX(-30%); }
:where(.e-loop-item:hover, .elementor-widget-hb-kart-gorsel:hover) .hb-kg--yakin .hb-kg-ana { transform: scale(1.06); }
@media (prefers-reduced-motion: reduce) { .hb-kg .hb-kg-ana, .hb-kg .hb-kg-iki { transition: none; } }

/* ── Ad ──────────────────────────────────────────────────────────────────────────────────────── */
.hb-ka { margin: 0; font-size: 15px; font-weight: 500; line-height: 1.35; }
/* Kitin bağlantı rengi (.elementor-kit-N a, a:hover) adı boyamasın — ad, parçanın Renk ayarını izler */
.hb-ka a, .elementor-widget-hb-kart-ad .hb-ka a, .elementor-widget-hb-kart-ad .hb-ka a:hover { color: inherit; text-decoration: none; }

/* ── Fiyat ───────────────────────────────────────────────────────────────────────────────────── */
.hb-kf { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5em; line-height: 1.3; }
.hb-kf-guncel { font-weight: 700; }
.hb-kf-eski { opacity: .55; text-decoration: line-through; font-size: .9em; }
.hb-kf-oran { font-size: .8em; font-weight: 700; color: #c62828; }
.hb-kf-bf { flex-basis: 100%; font-size: .75em; font-weight: 400; opacity: .7; }

/* ── Sepete ekle / favori ─────────────────────────────────────────────────────────────────────── */
.hb-ks { display: inline-flex; align-items: center; justify-content: center; gap: .45em; padding: .65em 1.15em; border: 0;
    background: #111; color: #fff; font: inherit; font-size: 14px; font-weight: 600; line-height: 1.2; cursor: pointer;
    transition: opacity .2s ease, background-color .2s ease, color .2s ease; }
.hb-ks svg { width: 1.15em; height: 1.15em; flex: none; }
.hb-ks--simge { padding: .6em; }
.hb-kfv { display: inline-flex; align-items: center; gap: .35em; padding: .3em; border: 0; background: transparent; color: inherit;
    font: inherit; cursor: pointer; transition: opacity .2s ease, color .2s ease; }
.hb-kfv svg { width: 1.3em; height: 1.3em; flex: none; }
/* Karşılaştır (KartKarsilastir) — favoriyle aynı taban */
.hb-kkr { display: inline-flex; align-items: center; gap: .35em; padding: .3em; border: 0; background: transparent; color: inherit;
    font: inherit; cursor: pointer; transition: opacity .2s ease, color .2s ease; }
.hb-kkr svg { width: 1.25em; height: 1.25em; flex: none; }
/* Hızlı bakış (KartHizliBakis) — favoriyle aynı taban */
.hb-khb { display: inline-flex; align-items: center; justify-content: center; gap: .35em; padding: .4em; border: 0; border-radius: 50%; background: #fff;
    color: inherit; font: inherit; line-height: 1; cursor: pointer; box-shadow: 0 2px 10px rgba(0, 0, 0, .1); transition: opacity .2s ease, background-color .2s ease, color .2s ease; }
.hb-khb:has(span) { border-radius: 999px; padding: .5em .9em; }
.hb-khb svg { width: 1.2em; height: 1.2em; flex: none; }
.hb-ks--uzerine, .hb-kfv--uzerine, .hb-khb--uzerine, .hb-kkr--uzerine { opacity: 0; }
:where(.e-loop-item:hover, .e-loop-item:focus-within) .hb-ks--uzerine, :where(.e-loop-item:hover, .e-loop-item:focus-within) .hb-kfv--uzerine,
:where(.e-loop-item:hover, .e-loop-item:focus-within) .hb-khb--uzerine, :where(.e-loop-item:hover, .e-loop-item:focus-within) .hb-kkr--uzerine { opacity: 1; }
@media (hover: none) { .hb-ks--uzerine, .hb-kfv--uzerine, .hb-khb--uzerine, .hb-kkr--uzerine { opacity: 1; } }
/* Fiyatın yerine (KartSepet gosterim=takas): aynı kaptaki fiyatla yer değiştirir — fareli ekranda, üzerine gelince kayarak.
   Dokunmatikte ve editörde (seçilebilsin) fiyatın altında durur. */
@media (hover: hover) {
    body:not(.elementor-editor-active) .e-con:has(> .elementor-widget-hb-kart-sepet .hb-ks--takas) { position: relative; overflow: clip; }
    body:not(.elementor-editor-active) .elementor-widget-hb-kart-sepet:has(.hb-ks--takas) { position: absolute; inset-inline-start: 0; top: 100%; margin: 0; }
    body:not(.elementor-editor-active) .e-con:has(> .elementor-widget-hb-kart-sepet .hb-ks--takas) > :is(.elementor-widget-hb-kart-fiyat, .elementor-widget-hb-kart-sepet) {
        transition: transform .3s ease; }
    body:not(.elementor-editor-active) :where(.e-loop-item:hover, .e-loop-item:focus-within) .e-con:has(> .elementor-widget-hb-kart-sepet .hb-ks--takas)
        > :is(.elementor-widget-hb-kart-fiyat, .elementor-widget-hb-kart-sepet) { transform: translateY(-100%); }
}

/* ── Rozetler ────────────────────────────────────────────────────────────────────────────────── */
.hb-kr { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.hb-kr span { display: inline-block; padding: 3px 8px; background: #111; color: #fff; font-size: 11px; font-weight: 700;
    line-height: 1.25; letter-spacing: .02em; border-radius: 2px; }
.hb-kr .hb-kr-indirim { background: #c62828; }
.hb-kr .hb-kr-tukendi { background: #6b7280; }
.hb-kr .hb-kr-yakinda { background: #0f766e; }
.hb-kr .hb-kr-kampanya { background: #6d28d9; }
.hb-kr .hb-kr-geri { background: #b45309; font-variant-numeric: tabular-nums; }
/* Bant: tam genişlik şerit; kayan: şerit içinde sürekli kayan yazı (iz iki kez, -50%) */
.hb-kr--bant, .hb-kr--kayan { display: flex; flex-direction: row; width: 100%; gap: 0; }
.hb-kr--bant span { flex: 1 1 auto; text-align: center; border-radius: 0; }
.hb-kr--kayan { overflow: hidden; background: #111; }
.hb-kr--kayan .hb-kr-iz { display: flex; width: max-content; animation: hb-kr-kay var(--hb-kr-sure, 12s) linear infinite; }
.hb-kr--kayan .hb-kr-tur { display: flex; flex: none; }
.hb-kr--kayan span { border-radius: 0; padding-left: 14px; padding-right: 14px; }
@keyframes hb-kr-kay { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .hb-kr--kayan .hb-kr-iz { animation: none; } }

/* ── Renk seçenekleri ─────────────────────────────────────────────────────────────────────────── */
.hb-kre { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; --hb-kre-boyut: 14px; }
.hb-kre-benek { display: inline-block; width: var(--hb-kre-boyut); height: var(--hb-kre-boyut); border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, .18); box-sizing: border-box; }
.hb-kre-benek[data-gorsel] { cursor: pointer; }
.hb-kre-benek--gorsel { background-size: cover; background-position: center; }
.hb-kre-sayi { font-size: 12px; opacity: .75; }
.hb-kre-ad { margin-inline-start: 4px; min-width: 0; font-size: 12px; opacity: .8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── Ürün Döngüsü: ızgara ─────────────────────────────────────────────────────────────────────── */
.hb-dongu { --hb-d-sutun: 4; --hb-d-sutun-aralik: 20px; --hb-d-satir-aralik: 32px; --hb-d-tasma: 0px; }
@media (max-width: 1024px) { .hb-dongu { --hb-d-sutun: 3; } }
@media (max-width: 767px) { .hb-dongu { --hb-d-sutun: 2; } }
.hb-dongu--izgara { display: grid; grid-template-columns: repeat(var(--hb-d-sutun), minmax(0, 1fr));
    column-gap: var(--hb-d-sutun-aralik); row-gap: var(--hb-d-satir-aralik); }
.hb-dongu > .e-loop-item { min-width: 0; }
/* Kart belgesi satır yüksekliğini taşısın: kökü "En az yükseklik 100%" olan kart eşit boyda olur (fiyat altta). Yalnız sarmalayıcı — tek başına görünümü değiştirmez */
.hb-dongu > .e-loop-item > .elementor { height: 100%; }
.hb-dongu--izgara > .hb-dongu-ara { grid-column: span var(--hb-d-yay, 1); grid-row: span var(--hb-d-yay-s, 1); }
@media (max-width: 1024px) { .hb-dongu--izgara > .hb-dongu-ara { grid-column: 1 / -1; grid-row: auto; } }
.hb-dongu-bos { padding: 24px 0; opacity: .7; text-align: center; }

/* ── Ürün Döngüsü: karusel (kaydırarak; oklar kart.js) ────────────────────────────────────────── */
.hb-dongu--karusel { display: grid; grid-auto-flow: column; column-gap: var(--hb-d-sutun-aralik);
    grid-auto-columns: calc((100% - (var(--hb-d-sutun) - 1) * var(--hb-d-sutun-aralik) - var(--hb-d-tasma)) / var(--hb-d-sutun));
    overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.hb-dongu--karusel::-webkit-scrollbar { display: none; }
.hb-dongu--karusel > .e-loop-item { scroll-snap-align: start; }
.hb-dongu-kap { position: relative; }
.hb-dongu-oklar { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 14px; }
.hb-dongu-ok { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0;
    border: 0; border-radius: 50%; background: #f1f1f1; color: #111; cursor: pointer; transition: opacity .2s ease; }
.hb-dongu-ok svg { width: 45%; height: 45%; }
.hb-dongu-ok[disabled] { opacity: .35; cursor: default; }
.hb-dongu-kap--kenar .hb-dongu-oklar { margin: 0; }
.hb-dongu-kap--kenar .hb-dongu-ok { position: absolute; top: 40%; z-index: 2; transform: translateY(-50%); box-shadow: 0 2px 10px rgba(0,0,0,.12); background: #fff; }
.hb-dongu-kap--kenar .hb-dongu-ok--geri { left: 8px; }
.hb-dongu-kap--kenar .hb-dongu-ok--ileri { right: 8px; }
/* Alt şerit: ilerleme çubuğu (+ "altta" kipinde iki yanında oklar) */
.hb-dongu-alt { display: flex; align-items: center; gap: 12px; margin-top: 18px; }
.hb-dongu-alt .hb-dongu-ok { flex: none; }
.hb-dongu-alt-bosluk { flex: 1 1 auto; }
.hb-dongu-ilerleme { --hb-di-g: 25%; --hb-di-x: 0%; flex: 1 1 auto; position: relative; height: 2px; overflow: hidden; background: var(--hb-di-zemin, rgba(0, 0, 0, .12)); }
.hb-dongu-ilerleme[hidden] { display: none; }
.hb-dongu-ilerleme-dolu { position: absolute; inset: 0 auto 0 0; width: var(--hb-di-g); transform: translateX(var(--hb-di-x)); background: var(--hb-di-renk, currentColor); transition: transform .15s linear; }
@media (prefers-reduced-motion: reduce) { .hb-dongu-ilerleme-dolu { transition: none; } }
[dir="rtl"] .hb-dongu-ok svg { transform: scaleX(-1); }

/* ── Editörde kart şablonu önizlemesi: kart genişliğinde ──────────────────────────────────────── */
.hb-kart-onizleme { margin: 40px auto; padding: 0 16px; box-sizing: content-box; }

/* ── Kategori Döngüsü: şablonsuz basit kutu ───────────────────────────────────────────────────── */
.hb-kd { display: flex; flex-direction: column; gap: 10px; color: inherit; text-decoration: none; }
.hb-kd .hb-kd-gorsel { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: #f4f4f5; }
.hb-kd .hb-kd-gorsel img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.hb-kd:hover .hb-kd-gorsel img { transform: scale(1.04); }
.hb-kd .hb-kd-ad { font-size: 15px; font-weight: 600; text-align: center; }
.hb-kd .hb-kd-sayi { font-weight: 400; opacity: .6; }

/* ── Kart içi görsel kaydırıcı ────────────────────────────────────────────────────────────────── */
.hb-kg--kaydirici .hb-kg-iz { display: flex; width: 100%; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.hb-kg--kaydirici .hb-kg-iz::-webkit-scrollbar { display: none; }
.hb-kg--kaydirici .hb-kg-kare { flex: 0 0 100%; height: 100%; scroll-snap-align: start; }
.hb-kg .hb-kg-diger { display: block; width: 100%; height: 100%; object-fit: cover; max-width: none; }
.hb-kg-noktalar { position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: center; gap: 5px; pointer-events: none; z-index: 2; }
.hb-kg-noktalar i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255, 255, 255, .55); box-shadow: 0 0 0 1px rgba(0, 0, 0, .08); transition: background .2s, width .2s; }
.hb-kg-noktalar--cizgi i { width: 14px; height: 2px; border-radius: 1px; }
.hb-kg-noktalar i.is-aktif { background: #fff; }
.hb-kg-noktalar--nokta i.is-aktif { width: 14px; border-radius: 3px; }
.hb-kg .hb-kg-ok { position: absolute; top: 50%; z-index: 2; width: 30px; height: 30px; margin-top: -15px; padding: 0; border: 0; border-radius: 50%;
    background: rgba(255, 255, 255, .9); color: #111; font-size: 20px; line-height: 1; cursor: pointer; opacity: 0; transition: opacity .2s; }
.hb-kg .hb-kg-ok--geri { left: 8px; }
.hb-kg .hb-kg-ok--ileri { right: 8px; }
.hb-kg--kaydirici:hover .hb-kg-ok, .hb-kg--kaydirici:focus-within .hb-kg-ok { opacity: 1; }
@media (hover: none) { .hb-kg .hb-kg-ok { display: none; } }
.hb-ks.hb-ks--tukendi { opacity: .5; cursor: not-allowed; }
.hb-ks.is-bekliyor { opacity: .7; pointer-events: none; }
.hb-ks.is-eklendi { pointer-events: none; }
/* Temanın mini sepeti açılacak: karttan eklerken mağazanın ara penceresi görünmez (kart.js) */
html.hb-ks-ekleniyor #addToCart, html.hb-ks-ekleniyor .modal-backdrop { opacity: 0 !important; pointer-events: none !important; }

/* Bilgi satırı (Widget\Kart\KartOzellikleri): "🎂 7+ · 📦 551 parça" */
.hb-ko { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; font-size: 12px; line-height: 1.4; opacity: .85; }
.hb-ko-o { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.hb-ko-ikon { font-size: 1.15em; line-height: 1; }
.hb-ko-ayirici { opacity: .5; }
.hb-ko--cip { gap: 4px; }
.hb-ko--cip .hb-ko-o { padding: 2px 8px; border-radius: 999px; background: rgba(0,0,0,.05); }

/* Kart fiyatı para biçimi (Urun\FiyatBicimi parçalı işaretleme — ürün fiyatıyla ortak) */
.hb-kf .hb-f { white-space: nowrap; }
.hb-kf-kurus-ust-yes .hb-kf .hb-f-kurus { font-size: .55em; position: relative; top: -.75em; line-height: 0; margin-left: .05em; }

/* Seçenek özeti (Widget\Kart\KartSecenekleri): "3 renk · 12 seçenek" ya da varyant türü çipleri */
.hb-kv { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; font-size: 12px; line-height: 1.4; opacity: .8; }
.hb-kv-cip { padding: 2px 8px; border: 1px solid rgba(0,0,0,.14); border-radius: 999px; }
.hb-kv-ayirici { opacity: .5; }

/* Görsel kaynağı "Model" (liste parçası ListeGorselKaynagi — kökte hb-gorsel-iki): ikinci görsel öne; üzerine gelince kart görseli */
.hb-gorsel-iki .hb-kg--solma.hb-kg--cift .hb-kg-iki { opacity: 1; }
.hb-gorsel-iki :where(.e-loop-item:hover, .elementor-widget-hb-kart-gorsel:hover) .hb-kg--solma.hb-kg--cift .hb-kg-iki { opacity: 0; }
.hb-gorsel-iki .hb-kg--kayma.hb-kg--cift .hb-kg-iki { transform: translateX(0); }

/* ── Beden sekmeli raf (Dongu sekme_ozellik) */
.hb-dongu-sekmeler { --hb-ds-renk: #6b7280; --hb-ds-etkin: #111; display: flex; gap: 8px; margin-bottom: 16px; overflow-x: auto; scrollbar-width: none; }
.hb-dongu-sekmeler::-webkit-scrollbar { display: none; }
.hb-dongu-sekme { flex: none; min-width: 44px; min-height: 40px; margin: 0; padding: 0 14px; border: 1px solid currentColor; border-radius: 999px; background: none;
    color: var(--hb-ds-renk); font-size: 14px; font-weight: 600; cursor: pointer; transition: color .2s, background-color .2s, border-color .2s; }
.hb-dongu-sekme[aria-selected="true"] { border-color: var(--hb-ds-etkin); background: var(--hb-ds-etkin); color: #fff; }
.hb-dongu-sekme:hover:not([aria-selected="true"]) { color: var(--hb-ds-etkin); }
.hb-dongu-sekme:focus-visible { outline: 2px solid var(--hb-ds-etkin); outline-offset: 2px; }

/* ── Sosyal kanıt (KartSosyalKanit): hap ya da düz metin */
.hb-kso { display: inline-flex; align-items: center; gap: .35em; max-width: 100%; font-size: 12px; font-weight: 500; line-height: 1.3; color: #3f3f46; }
.hb-kso-hap .hb-kso { padding: .3em .7em; border-radius: 999px; background: #f4f4f5; }
.hb-kso b { font-weight: 700; color: #111; }
.hb-kso-simge { flex: none; width: 1.15em; height: 1.15em; color: #e11d48; }
.hb-kso--sira .hb-kso-simge { color: #d97706; }
.hb-kso--satilan .hb-kso-simge { color: #ea580c; }
.hb-kso > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Görünecek bir şeyi olmayan widget (rozetsiz kart parçası, boş liste parçası…) esnek kutuda aralık kadar yer kaplamasın — ürün
 * sayfasının stilindeki (urun.css) kuralın genel kısmı; kartlı / listeli sayfalar artık urun.css'i yüklemiyor (22 Ekim 2026).
 * Harmony düzeninin akışında boş kutu zaten yer kaplamaz — gizlemek zararsız */
.e-con > .elementor-widget:empty,
.e-con > .e-con-inner > .elementor-widget:empty { display: none; }