/* Mobil vitrin düzeltmeleri (son yüklenen stil dosyası): yol bandı/kırıntı, açılır arama, ürün sekmeleri, footer akordeonu, alt çubuk boşluğu, ödeme logoları.
   Masaüstü görünümü değişmez; yalnız footer akordeonunun başlık işaretlemesi (summary > b) masaüstünde eski başlık stilini birebir taşır. */

/* ---------- Footer akordeonu: masaüstünde eski başlık görünümü ---------- */
.alt-akordeon>summary{display:block;list-style:none;cursor:default;pointer-events:none}
.alt-akordeon>summary::-webkit-details-marker{display:none}
.alt-izgara>div>.alt-akordeon>summary>b{display:block;color:var(--alt-baslik);font-size:.8rem;text-transform:uppercase;letter-spacing:.09em;margin-bottom:.9rem}
body.ft-minimal .alt-izgara>div>.alt-akordeon>summary>b{margin-bottom:.6rem}
body.ft-kutu .alt-izgara>div>.alt-akordeon>summary>b{padding-bottom:.7rem;border-bottom:2px solid var(--ana);display:inline-block}
body.ft-iki .alt-izgara>div>.alt-akordeon>summary>b{color:var(--alt-baslik);padding-left:.7rem;border-left:3px solid var(--ana)}
@media(min-width:701px){.alt-akordeon::details-content{content-visibility:visible;display:block}}

@keyframes ma-ac{from{opacity:0;transform:translateY(-6px)}}

/* ====================== 700 px ve altı: yol bandı, sekmeler, footer ====================== */
@media(max-width:700px){
  /* --- Yol satırı (kırıntı): tek satır, sola yaslı, yatay kaydırılabilir; son öğe (aktif sayfa) görünür --- */
  html body .yol-kap .kirinti{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:center;max-width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scroll-padding-inline:16px;font-size:.84rem;line-height:1.35;text-align:left}
  html body .yol-kap .kirinti::-webkit-scrollbar{display:none}
  html body .yol-kap .kirinti>*{flex:none;max-width:44vw;overflow:hidden;text-overflow:ellipsis}
  html body .yol-kap .kirinti>span[aria-current]{max-width:62vw}
  html body .yol-kap .kirinti>a{display:inline-flex;align-items:center;min-height:32px}
  html body .yol-kap .kirinti>a.yol-ev{max-width:none;padding-inline:.35rem}
  html body .yol-kap .kirinti>a.yol-ev svg{display:block;width:1.15em;height:1.15em;fill:currentColor}
  html body .yol-kap .kirinti>a.yol-ev-ik{font-size:0;max-width:none;padding-inline:.2rem}
  html body .yol-kap .kirinti>a.yol-ev-ik::before{font-size:.9rem;margin-right:0}
  html body .yol-kap .kirinti.yol-tasar{--ms:0px;--md:0px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--ms),#000 calc(100% - var(--md)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 var(--ms),#000 calc(100% - var(--md)),transparent 100%)}
  html body .yol-kap .kirinti.yol-sol{--ms:26px}
  html body .yol-kap .kirinti.yol-sag{--md:26px}
  html body .yol-kap .yol-nav-ici{min-width:0;max-width:100%}
  /* --- Başlık bandı: ince, başlık en çok 2 satır --- */
  html body:not(.yl-bant-ici) .yol-kap:not(.yb-yer-serit):not(.yb-konum-ic) .yol-bant-ic{min-height:0;padding-top:12px;padding-bottom:12px;gap:8px 10px}
  html body .yol-kap .yol-bant-ic{padding-left:16px;padding-right:16px}
  html body .yol-kap.yb-geri-kenar .yol-bant-ic{padding-left:calc(12px + 46px)}
  html body .yol-kap .yol-baslik{font-size:clamp(1.05rem,5vw,1.35rem);line-height:1.2;min-width:0;max-width:100%;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
  html body .yol-kap .yol-geri{width:40px;height:40px;margin-left:-4px}
  html body .yol-kap .yol-geri .ik{font-size:1.5rem}

  /* --- Ürün sekmeleri: tek satır yatay kaydırılabilir şerit --- */
  html body .urun-sekmeler .sekme-liste{position:relative;display:flex;flex-wrap:nowrap;gap:6px;padding:6px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-padding-inline:12px;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  html body .urun-sekmeler .sekme-liste::-webkit-scrollbar{display:none}
  html body .urun-sekmeler .sekme{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;height:44px;min-height:44px;padding:0 .95rem;white-space:nowrap;text-align:center;font-size:.9rem;line-height:1;scroll-snap-align:center;border-radius:12px}
  html body .urun-sekmeler .sekme-liste .sekme:only-child,html body .urun-sekmeler .sekme-liste .sekme:last-child:nth-child(odd){grid-column:auto}
  html body .urun-sekmeler .sekme-liste.kay-tasar{--ms:0px;--md:0px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--ms),#000 calc(100% - var(--md)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 var(--ms),#000 calc(100% - var(--md)),transparent 100%)}
  html body .urun-sekmeler .sekme-liste.kay-sol{--ms:26px}
  html body .urun-sekmeler .sekme-liste.kay-sag{--md:26px}
  html body .urun-sekmeler .sekme-panel{border-radius:16px}

  /* --- Footer --- */
  html body .alt{font-size:.94rem}
  html body .alt-guven .alt-guven-ic{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;padding-top:14px;padding-bottom:14px}
  html body .alt-guven .alt-guven-ic>div{padding:4px 10px}
  html body .alt-guven-ic b{font-size:.88rem}
  html body .alt-guven-ic span{display:none}
  html body .alt-izgara{display:grid;grid-template-columns:minmax(0,1fr);gap:0;padding-top:20px;padding-bottom:6px;text-align:left}
  html body .alt-izgara>.alt-marka{padding:0 0 16px}
  html body .alt-logo{display:block;font-size:1.35rem;line-height:1.2;margin-bottom:.2rem}
  html body .alt-marka p{margin:.3rem 0;font-size:.94rem;line-height:1.45;max-width:none}
  html body .alt-marka p.alt-iletisim{margin:0;min-height:36px;display:flex;align-items:center;gap:.35em;padding:.3rem 0;line-height:1.4;white-space:normal;overflow-wrap:anywhere}
  html body .alt-marka p.alt-iletisim a{display:inline-block;line-height:1.4;padding:.35rem 0}
  html body .alt-izgara>div:not(.alt-marka),html body .alt-izgara>div:not(.alt-marka):hover{background:none;border:0;border-top:1px solid var(--alt-kenar);border-radius:0;padding:0;transform:none;box-shadow:none}
  html body .alt-izgara>.alt-gezilen[hidden]{display:none}
  html body .alt-akordeon>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:0 4px;cursor:pointer;pointer-events:auto;-webkit-tap-highlight-color:transparent}
  html body .alt-izgara>div>.alt-akordeon>summary>b{display:block;margin:0;padding:0;border:0;color:var(--alt-baslik);font-size:.82rem;letter-spacing:.08em}
  html body .alt-akordeon>summary::after{content:"";flex:none;width:9px;height:9px;margin-right:6px;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-2px) rotate(45deg);opacity:.75;transition:transform .2s}
  html body .alt-akordeon[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
  html body .alt-akordeon>summary:focus-visible{outline:2px solid var(--ana);outline-offset:-2px;border-radius:8px}
  html body .alt-akordeon>ul{padding:0 4px 10px}
  html body .alt-izgara .alt-akordeon>ul>li{margin:0}
  html body .alt-izgara .alt-akordeon>ul>li>a{display:flex;align-items:center;min-height:44px;padding:0 4px;font-size:1rem;line-height:1.3}
  /* Sosyal medya: yan yana düğmeler */
  html body .alt-izgara>.alt-sosyal{padding:12px 4px 14px}
  html body .alt-izgara>.alt-sosyal>b{display:block;margin:0 0 8px;font-size:.82rem;letter-spacing:.08em}
  html body .alt-izgara>.alt-sosyal ul{display:flex;flex-wrap:wrap;gap:8px}
  html body .alt-izgara>.alt-sosyal li{margin:0}
  html body .alt-izgara>.alt-sosyal li a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--alt-kenar);border-radius:99px;font-size:.95rem}
  /* Son incelenen ürünler: akordeon içinde yatay kaydırılabilir küçük kart şeridi */
  html body .alt-izgara .alt-gezilen-liste{display:flex;gap:10px;margin:0 -4px;padding:2px 4px 14px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  html body .alt-izgara .alt-gezilen-liste::-webkit-scrollbar{display:none}
  html body .alt-izgara .alt-gezilen-liste li{flex:0 0 138px;scroll-snap-align:start;margin:0}
  html body .alt-izgara .alt-gezilen-liste .alt-gezilen-oge{display:flex;flex-direction:column;align-items:stretch;gap:6px;height:100%;padding:8px;border:1px solid var(--alt-kenar);border-radius:14px;background:color-mix(in srgb,var(--alt-baslik) 7%,transparent)}
  html body .alt-izgara .alt-gezilen-liste .alt-gezilen-oge img{width:100%;height:auto;aspect-ratio:1/1;max-height:none;padding:6px;object-fit:contain;box-sizing:border-box;border-radius:10px}
  html body .alt-izgara .alt-gezilen-liste .alt-gezilen-oge strong{font-size:.84rem;line-height:1.25}
  html body .alt-izgara .alt-gezilen-liste .alt-gezilen-oge small{font-size:.8rem}
  html body .alt-izgara .alt-gezilen-bos{padding:0 4px 12px}
  /* Alt şerit: ödeme logoları tek satır, çipler, telif */
  html body .alt-son .kap{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;align-content:flex-start;justify-content:flex-start;gap:12px;padding-top:16px;padding-bottom:16px;text-align:left}
  html body .alt-son .kart-logolar{order:1;flex:0 0 100%;display:flex;flex-wrap:nowrap;gap:6px;width:100%;overflow-x:auto;scrollbar-width:none}
  html body .alt-son .kart-logolar::-webkit-scrollbar{display:none}
  html body .alt-son .kart-logolar img[src]{flex:1 1 0;min-width:40px;width:auto;max-width:none;height:30px;padding:3px 5px;object-fit:contain;border-radius:7px;box-sizing:border-box}
  html body .alt-son .kart-logolar img[src*="troy"]{padding:0;object-fit:contain}
  html body .alt-son .odeme-rozetleri{order:2;flex:0 0 100%;display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;scrollbar-width:none}
  html body .alt-son .odeme-rozetleri i{flex:none;white-space:nowrap;font-size:.74rem;line-height:1.4;padding:.15rem .6rem}
  html body .alt-son .kap>span:first-child:not(.kart-logolar):not(.odeme-rozetleri){order:3;flex:1 1 auto;min-width:0;font-size:.82rem;opacity:.9}
  html body .alt-son .yukari{order:4;flex:none;display:inline-flex;align-items:center;min-height:44px;font-size:.9rem}
  html body:has(.wa-yuzen) .alt-son .kap>span:first-child:not(.kart-logolar):not(.odeme-rozetleri){padding-right:4px}
}

/* Ürün sayfası, "yapışkan satın alma çubuğu" düzeni (al-satir sabit): 86 px (alt gezinmeyle 150 px) boşluk footer'ın içinde */
@media(max-width:820px){
  html body.sayfa-urun.ur-cubuk{padding-bottom:0}
  html body.sayfa-urun.ur-cubuk .alt{padding-bottom:calc(86px + env(safe-area-inset-bottom,0px))}
  html body.sayfa-urun.ur-cubuk.alt-nav-var{padding-bottom:0}
  html body.sayfa-urun.ur-cubuk.alt-nav-var .alt{padding-bottom:calc(150px + env(safe-area-inset-bottom,0px))}
}

/* ====================== 860 px ve altı: alt çubuk boşluğu, mobil arama ====================== */
@media(max-width:860px),(max-height:520px) and (max-width:1000px){
  /* Alt gezinme çubuğu için ayrılan boşluk body yerine footer'ın içine alınır: footer rengi çubuğun altına kadar iner */
  html body.alt-nav-var:not(.ur-cubuk):not(:has(.urun-cubuk)){padding-bottom:0}
  html body.alt-nav-var:not(.ur-cubuk):not(:has(.urun-cubuk)) .alt{padding-bottom:calc(66px + env(safe-area-inset-bottom,0px))}
  /* Ürün sayfası (sabit satın alma çubuğu .urun-cubuk): çubuğun ayırdığı boşluk da footer'ın içine alınır; body altında açık boşluk kalmaz */
  html body:not(.ur-cubuk):has(.urun-cubuk){padding-bottom:0}
  html body:not(.ur-cubuk):has(.urun-cubuk) .alt{padding-bottom:calc(var(--uc-yuk,113px) + env(safe-area-inset-bottom,0px))}
  /* WhatsApp yüzen düğmesi son satırlarla çakışmasın */
  html body.alt-nav-var:has(.wa-yuzen) .alt-son .yukari{margin-right:68px}
  html body.alt-nav-var:has(.wa-yuzen) .alt-son .kap>span:first-child:not(.kart-logolar):not(.odeme-rozetleri){padding-right:68px}

  /* Mobil arama çubuğu: açılır ve kapanır / kaydırınca gizle (ayar: Tasarım Seçenekleri > Mobil Arama Çubuğu) */
  html body.ma-acilir .ust:not(.ara-acik) .arama,html body.ma-gizle .ust.ara-gizle .arama{display:none}
  html body.ma-acilir .ust.ara-acik .arama,html body.ma-gizle .ust:not(.ara-gizle) .arama{animation:ma-ac .2s ease both}
  html body.ma-acilir .ust.ara-acik .hesap-menu .ust-ara-ikon{background:var(--ana);color:var(--ana-yazi,#fff)}
}
@media(max-width:860px) and (prefers-reduced-motion:reduce),(max-height:520px) and (max-width:1000px) and (prefers-reduced-motion:reduce){
  html body .ust .arama{animation:none!important}
}

/* mobil: yazi boyutu 16 px altindaki girdiye odaklaninca Android/iOS tarayicilar sayfayi otomatik yakinlastirir (giris/uye formundan sonra sayfa buyuk ve sagdan kesik kalir).
   Girdilerde 16 px tabani; sayfa yakinlastirma (erisilebilirlik) KISITLANMAZ. */
@media(max-width:900px){
  html body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]):not([type=hidden]),select,textarea){font-size:16px}
}

/* form ızgaraları: `1fr` içeriğin asgari genişliğine (girdi 16 px) göre esnediği için iki alanlı satır ekrandan geniş olup sayfayı yana taşıyordu */
html body .iki-alan{grid-template-columns:repeat(2,minmax(0,1fr))}
html body .iki-alan>*,html body .alan{min-width:0}
html body .alan :is(input:not([type=checkbox]):not([type=radio]),select,textarea){min-width:0;max-width:100%}
html body .iki-sutun-vitrin{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){html body .iki-sutun-vitrin{grid-template-columns:minmax(0,1fr)}}
/* Telefon ana sayfa: header ile kategori vitrini ve vitrin ile banner arası boşluklar daraltıldı (yalnız ana sayfa); yana kayan vitrinde seçili yuvarlağın halkası üstten kesilmez */
@media (max-width:700px){
  html body.sayfa-anasayfa .kap.yerlesim{padding-top:4px}
  html body.sayfa-anasayfa .ab-kategori{margin-bottom:8px}
  html body.sayfa-anasayfa .ab-kategori .kategori-izgara{padding-top:7px;padding-bottom:3px} /* üstte 7px: dokunulan yuvarlağın halkası (3px) + yukarı kalkışı (2px) kesilmesin */
}
/* Telefon: breadcrumb ile içerik (ürün görseli / liste başlığı) arası boşluk daraltıldı (toplam ~46 px -> ~16 px) */
@media (max-width:700px){
  html body.sayfa-urun .yol-nav,html body.sayfa-liste .yol-nav{padding-top:10px;padding-bottom:2px}
  html body.sayfa-urun .yol-nav .yol-tasar,html body.sayfa-liste .yol-nav .yol-tasar{margin-bottom:4px}
  html body.sayfa-urun .kap.yerlesim,html body.sayfa-liste .kap.yerlesim{padding-top:10px}
}
/* Telefon, izgara menüde alt kategoriler: iki eşit sütun, eşit yükseklik, uzun adlar en çok 2 satır; "Tümünü Gör" tam genişlik (hizasız çip yığını yok) */
@media (max-width:860px),(max-height:520px) and (max-width:1000px){
  html body.mm-izgara .mm-liste details ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:4px 12px 14px}
  html body.mm-izgara .mm-liste details ul li{display:block;min-width:0}
  html body.mm-izgara .mm-liste details ul li:first-child{grid-column:1 / -1}
  html body.mm-izgara .mm-liste details ul a{display:flex;align-items:center;justify-content:space-between;gap:6px;box-sizing:border-box;width:100%;height:100%;min-height:46px;padding:.5rem .8rem;border-radius:12px;font-size:.86rem;font-weight:600;line-height:1.25;text-align:left}
  html body.mm-izgara .mm-liste details ul a .mm-ad{flex:1 1 auto;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
  html body.mm-izgara .mm-liste details ul a .mm-say{flex:none;margin-left:auto}
  html body.mm-izgara .mm-liste details ul li:first-child a{justify-content:center;text-align:center;color:var(--ana-ok,var(--ana));background:color-mix(in srgb,var(--ana) 9%,var(--kart-zemin,#fff));border-color:color-mix(in srgb,var(--ana) 30%,var(--kenar))}
}

/* Alt gezinme çubuğu ile footer arasında beyaz boşluk kalmasın: gövde boşluğu yerine footer çubuğun altına uzar (koyu zemin devam eder) */
@media(max-width:860px),(max-height:520px) and (max-width:1000px){
  html body.alt-nav-var:not(.sayfa-urun){padding-bottom:0}
  html body.alt-nav-var:not(.sayfa-urun) .alt{padding-bottom:calc(60px + env(safe-area-inset-bottom,0px))}
}

/* ---- mobil ana sayfa bandı: başlık üstte, açıklama iki satıra kadar sarar, düğme açıklamanın altında (içeriğe göre kendini ayarlar); oklara taşmaz ---- */
@media(max-width:700px){
  html body .banner-kaydirici:not(.mz-ana) .banner-metin{margin-left:42px;margin-right:54px;width:auto;max-width:none;box-sizing:border-box}
  html body .banner-kaydirici:not(.mz-ana) .banner:not(.bn-panel) .banner-metin{padding:14px 0}
  html body .banner-kaydirici:not(.mz-ana) .banner-metin h2{margin:0 0 .4rem;font-size:1.2rem;line-height:1.2}
  html body .banner-kaydirici:not(.mz-ana) .banner-metin p{margin:0 0 .8rem;font-size:.92rem;line-height:1.35;min-height:calc(2 * 1.35em);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  html body .banner-kaydirici:not(.mz-ana) .banner-metin .dugme{display:inline-flex;align-items:center;white-space:nowrap;max-width:100%;font-size:.95rem;padding:.6rem 1.15rem;line-height:1.2}
}