/* css/sayfa/ana-sayfa-mobil.css — ana sayfanın TELEFON davranışı (5d.1, 2026-10-05).
   İçerik/kartlar/footer/renkler bilgisayar görünümüyle AYNI; sadece çalışma mantığı
   butimor/mobil-gorunum/index.html'deki gibi: üstte sabit logo + arama satırı, yana kayan kategori
   çubuğu, slider altında yana kayan kategoriler, iki sıra halinde yana kayan ürün/mağaza listeleri,
   alttaki 5'li menü + çekmeceler (genel/partials/ana-sayfa-mobil.blade.php).
   Bütün kurallar 767px ve altında; bilgisayar görünümüne dokunmaz. */

@media(max-width:767px){
  /* Üst kısmın (logo + arama + kategori çubuğu) telefon kuralları: css/ortak/site-header.css */

  /* ----- Slider ----- */
  .hero-blok{padding:10px 0 4px}
  .slide{min-height:200px}
  .slide-icerik{padding:22px 20px}
  .slide-icerik h1{font-size:1.35rem;margin-bottom:6px}
  .slide-icerik p{font-size:.82rem;margin-bottom:12px}
  .slide-icerik .btn{padding:8px 16px;font-size:.8rem}
  .slider-ok{display:none}

  /* ----- Ortak: tek sıra yana kayan listeler ----- */
  .hero-yan,.kampanya-grid,.guven-grid,.kat-ikon-grid,.marka-grid,.blog-grid,.insta-grid{
    display:flex;gap:10px;overflow-x:auto;margin:0 -16px;padding:2px 16px 6px;
    scroll-snap-type:x proximity;scroll-padding-inline:16px;scrollbar-width:none}
  .hero-yan::-webkit-scrollbar,.kampanya-grid::-webkit-scrollbar,.guven-grid::-webkit-scrollbar,.kat-ikon-grid::-webkit-scrollbar,
  .marka-grid::-webkit-scrollbar,.blog-grid::-webkit-scrollbar,.insta-grid::-webkit-scrollbar,.kat-nav::-webkit-scrollbar{display:none}
  .hero-yan>*,.kampanya-grid>*,.guven-grid>*,.kat-ikon-grid>*,.marka-grid>*,.blog-grid>*,.insta-grid>*{flex:none;scroll-snap-align:start}
  .hero-yan{margin-top:10px}
  .hero-yan>*{width:62%;min-height:84px}
  .kampanya-grid>*{width:72%}
  .guven-grid>*{width:96px}
  .marka-grid>*{width:128px}
  .blog-grid>*{width:72%}
  .insta-grid>*{width:110px}

  /* ----- Slider altındaki kategoriler: bizim renklerimiz, yana kayar ----- */
  .kat-ikonlar{padding:16px 0 10px}
  .kat-ikon-grid>*{width:88px}
  .kat-ikon-kart{padding:12px 6px}
  .kat-ikon-kart .isim{font-size:.74rem;text-align:center;line-height:1.2}
  .kat-alt-panel{display:none}

  /* ----- Ürün ve mağaza listeleri: iki AYRI sıra, her sıra kendi başına yana kayar (sağda bir sonraki kart
     görünür). Kartları iki sıraya bölen JS: genel/partials/ana-sayfa-mobil.blade.php ----- */
  .urun-grid.mm-ikisira,.magaza-grid.mm-ikisira{display:flex;flex-direction:column;gap:10px;margin:0 -16px}
  .mm-sira{display:flex;gap:10px;overflow-x:auto;padding:2px 16px 6px;scroll-snap-type:x proximity;scroll-padding-inline:16px;scrollbar-width:none}
  .mm-sira::-webkit-scrollbar{display:none}
  .mm-sira:empty{display:none}
  .mm-sira>*{flex:0 0 calc((100% - 30px)/2);min-width:0;scroll-snap-align:start}

  /* ----- Bölüm aralıkları ----- */
  .sec{padding:20px 0}
  .sec-baslik{margin-bottom:10px;flex-wrap:nowrap}
  .sec-baslik h2{font-size:1.05rem}
  .sec-baslik a{white-space:nowrap;font-size:.8rem}

  /* ----- "Ürün sepete eklendi" bildirimi: tek satır, ince şerit, alt menünün hemen üstünde (2026-10-05) ----- */
  .toast-sepet{left:12px;right:12px;bottom:calc(72px + env(safe-area-inset-bottom));transform:translateY(16px);
    padding:7px 7px 7px 10px;border-radius:14px;gap:10px;font-size:.8rem;box-shadow:0 6px 18px rgba(26,26,46,.22)}
  .toast-sepet.show{transform:none}
  .toast-sepet svg{width:22px;height:22px;padding:4px;border-radius:50%;background:#22a565;stroke-width:3.5}
  .toast-sepet #toastSepetText{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .toast-sepet .toast-sepet-action{padding:7px 12px;border-radius:10px;font-size:.74rem}
  .toast-sepet .toast-sepet-action:empty{display:none}

  /* Alttaki 5'li menü ve çekmeceler: css/ortak/mobil-menu-5li.css */
}