/* Telefon yan çevrildiğinde (yükseklik 375-412 px) — iki marka ortak (_Layout'ta marka CSS'inden sonra yüklenir).
   02 Kas 2026 denetimi: dikey düzen için yazılmış kurallar kısa ekranda başlığı, menüyü ve ürün kartlarını
   ekrandan uzun bırakıyordu. Yalnız kısa yatay ekranı hedefler; dikey telefon ve masaüstü değişmez. */

@media (orientation: landscape) and (max-height: 500px) {

    /* Üst duyuru çubuğu + başlık ekranın yarısını kaplıyordu (667x375'te 180px) */
    .header-bottom.sticky-bar {
        padding-top: 8px !important; /* marka CSS'indeki 26px !important'ı yalnız burada ezer */
        padding-bottom: 8px !important;
    }

    /* Mobil menü: dikeyde alt görsel sabit kalsın diye yalnız liste kayıyordu; yatayda listeye 68px kalıyor,
       kategoriler görünmüyordu. Kısa ekranda bütün menü tek parça kayar (dikey düzen tbfSite.css'te aynen). */
    /* "body" öneki: mega-menu.css bu dosyadan sonra yüklenip aynı güçteki seçiciyle overflow:hidden veriyor */
    body .mobile-header-wrapper-style .mobile-header-content-area {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    body .mobile-header-wrapper-style .mobile-header-content-area > .mobile-menu-wrap {
        flex: 0 0 auto;
        overflow: visible;
    }

    body .mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area > .mobile-menu-wrap nav {
        height: auto;
        overflow: visible;
    }

    /* Ürün galerisi kare ve ekran genişliğinde: 529px kare 375px ekrana sığmıyordu. Galeri yüksekliği ekrana göre sınırlanır. */
    .detail-gallery {
        max-width: calc(100vh - 60px);
        margin-left: auto;
        margin-right: auto;
    }
}

/* Yatay telefon (560-767 px genişlik): kategori ızgarası 2 sütun, kart ekrandan uzundu (667x375'te 416px); 3 sütun.
   Kutu genişliğine (540px) dokunulmaz: tam genişlik ana sayfa ürün kaydırıcısının kartlarını büyütüyordu. */
@media (orientation: landscape) and (max-height: 500px) and (min-width: 560px) and (max-width: 767.98px) {
    .product-grid-4 > .productBoxMain {
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }
}