/* =====================================================================
   Jeebna — Global Mobil Responsive Güvenlik Ağı
   ---------------------------------------------------------------------
   Mevcut sayfa/navbar responsive CSS'ini BOZMADAN, mobilde sık görülen
   taşma sorunlarına karşı düşük-özgüllüklü (element seçicili) güvenli
   kurallar. Footer'da (geç) yüklenir; sınıf-tabanlı sayfa kuralları
   bunları ezer, bu net yalnızca boşlukları kapatır.
   ===================================================================== */

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

/* Medya hiçbir zaman kabını taşırmasın (sınıflı/inline boyutlu görseller kendi kuralıyla kalır) */
img,
svg,
video,
iframe,
embed,
object {
    max-width: 100%;
}

img {
    height: auto;
}

/* Geniş tablolar mobilde yatay kaydırılabilir olsun */
@media (max-width: 600px) {
    table:not(.no-responsive) {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* Uzun kelime/URL'ler taşmasın */
@media (max-width: 600px) {
    p,
    h1, h2, h3, h4, h5,
    a,
    li,
    td,
    span,
    .jeebna-foot-copy {
        overflow-wrap: break-word;
        word-wrap: break-word;
    }

    pre {
        overflow-x: auto;
        white-space: pre-wrap;
        word-wrap: break-word;
    }
}

/* Çok küçük ekranlarda Bootstrap kapsayıcı iç boşluğu rahatlat */
@media (max-width: 400px) {
    .container,
    .container-fluid,
    .container-lg,
    .container-md,
    .container-sm {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* Dokunmatik hedefleri minimum erişilebilir boyutta tut (yalnızca çok küçük olanlar) */
@media (hover: none) and (pointer: coarse) {
    button.btn-sm,
    .btn-sm {
        min-height: 38px;
    }
}

/* =====================================================================
   Navbar mobil — Sepet ikonu görünürlüğü
   Sepet sayacı ikonun üzerini kapatmasın; ikon glifi net renkte olsun.
   (footer'da geç yüklendiği için navbar inline mavilerini güvenle ezer.)
   ===================================================================== */
@media (max-width: 991.98px) {
    .jeebna-navbar .user-actions .nav-link i {
        color: #c95b0b !important;
    }
    .jeebna-navbar .user-actions .nav-link[href*="sepet"] .badge {
        top: 1px !important;
        inset-inline-start: 23px !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;
        min-width: 17px !important;
        height: 17px !important;
        padding: 0 4px !important;
        font-size: .58rem !important;
        line-height: 1 !important;
        border: 2px solid #fff !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
    }
}

/* ---------------------------------------------------------------------
   İnline grid'ler (profilim vb.) mobilde tek sütuna düşsün.
   Boşluklu/boşluksuz inline yazımları kapsar.
   --------------------------------------------------------------------- */
@media (max-width: 640px) {
    [style*="grid-template-columns:1fr 1fr"],
    [style*="grid-template-columns: 1fr 1fr"],
    [style*="grid-template-columns:repeat(3,1fr)"],
    [style*="grid-template-columns: repeat(3, 1fr)"] {
        grid-template-columns: 1fr !important;
    }
}

/* Sayfalama — minimum dokunma hedefi (44px) */
.pagination .page-link {
    min-height: 44px;
}

/* tum-urunler: mobil filtre paneli (offcanvas çekmece) */
@media (max-width: 991.98px) {
    #filterCanvas.offcanvas-lg { --bs-offcanvas-width: min(340px, 88vw); }
    /* Çekmece içinde sticky/gölge gereksiz; düz aksın */
    #filterCanvas .filter-sidebar {
        position: static !important;
        top: auto !important;
        box-shadow: none !important;
    }
}

/* =====================================================================
   ANASAYFA (index.php) — Mobil iyileştirmeler
   ---------------------------------------------------------------------
   Anasayfa tamamen .jeebna-* bileşenlerini kullanır (jeebna-theme.css).
   Bu dosya footer'da EN SON yüklendiği için buradaki kurallar aynı
   özgüllükteki tema kurallarını güvenle ezer. Sadece küçük ekran
   deneyimini iyileştirir; masaüstü düzeni etkilenmez.
   ===================================================================== */

/* ---------- Telefon (≤ 640px) ---------- */
@media (max-width: 640px) {
    /* Sayfa çerçevesi biraz daralsın, dikey boşluk azalsın */
    .jeebna-home-page { padding: 18px 0 52px; }
    .jeebna-shell { padding-inline: 15px; }

    /* Bölüm başlıkları mobilde daha ölçekli */
    .jeebna-section-head { margin-bottom: 14px; }
    .jeebna-section-title { font-size: 20px; }
    .jeebna-section-sub { font-size: 12.5px; }
    .jeebna-section-link { font-size: 13px; }

    /* HERO — kompakt, okunaklı */
    .jeebna-hero { border-radius: 20px; min-height: 0; }
    .jeebna-hero-body { padding: 26px 20px; gap: 15px; }
    .jeebna-hero-eyebrow { font-size: 11px; padding: 6px 12px; }
    .jeebna-hero-title { font-size: clamp(26px, 8vw, 34px); }
    .jeebna-hero-text { font-size: 14.5px; }
    .jeebna-hero-media { min-height: 190px; }
    .jeebna-hero-stats { font-size: 12.5px; gap: 12px; }

    /* GÜVEN ÇUBUĞU — 3'lü + sarkan yerine düzgün 2×2 ızgara */
    .jeebna-trust { grid-template-columns: repeat(2, 1fr); }
    .jeebna-trust-item {
        padding: 14px 14px;
        gap: 10px;
        border-right: 1px solid #EDE8E2;
        border-bottom: 1px solid #EDE8E2;
    }
    .jeebna-trust-item:nth-child(2n) { border-right: none; }
    .jeebna-trust-item:nth-child(3),
    .jeebna-trust-item:nth-child(4) { border-bottom: none; }
    .jeebna-trust-item .ico svg { width: 22px; height: 22px; }
    .jeebna-trust-item .t { font-size: 13px; }
    .jeebna-trust-item .d { font-size: 11.5px; }

    /* KATEGORİLER — 3 sütunda sıkışıyordu; okunaklı 2 sütun + kompakt kart */
    .jeebna-cat-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .jeebna-cat-card { padding: 12px; gap: 11px; }
    .jeebna-cat-card .thumb { width: 46px; height: 46px; }
    .jeebna-cat-card .thumb--icon i { font-size: 20px; }
    .jeebna-cat-card .name { font-size: 13.5px; }
    .jeebna-cat-card .go { font-size: 11px; }

    /* ÜRÜN SATIRLARI — mobilde yatay kaydırmalı şerit (Trendyol/HB tarzı).
       Dikey yorgunluğu azaltır; kartlar ekran kenarından kenarına akar,
       3. kartın ucu görünerek kaydırılabilir olduğunu belli eder. */
    .jeebna-prod-grid,
    .jeebna-prod-grid--5 {
        display: flex;
        grid-template-columns: none;   /* grid'i iptal et */
        flex-wrap: nowrap;
        gap: 12px;
        overflow-x: auto;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;         /* Firefox */
        /* Tam-genişlik: shell iç boşluğunu iptal edip kenara taşı */
        margin-inline: -15px;
        padding: 2px 15px 8px;
        scroll-padding-inline: 15px;
    }
    .jeebna-prod-grid::-webkit-scrollbar,
    .jeebna-prod-grid--5::-webkit-scrollbar { display: none; } /* WebKit */
    .jeebna-prod-card {
        flex: 0 0 44%;                 /* ~2 kart + 3. kartın ucu */
        min-width: 150px;
        scroll-snap-align: start;
    }
    .jeebna-prod-body { padding: 11px 11px 13px; gap: 5px; }
    .jeebna-prod-brand { font-size: 10px; }
    .jeebna-prod-name { font-size: 13px; min-height: 34px; }
    .jeebna-prod-price { font-size: 16px; }
    .jeebna-prod-price .cur { font-size: 12px; }
    .jeebna-prod-old { font-size: 12px; }
    .jeebna-prod-cart .jeebna-cart-btn { padding: 11px 10px; font-size: 12.5px; }
    .jeebna-fav { width: 34px; height: 34px; top: 8px; inset-inline-end: 8px; }
    .jeebna-badge { font-size: 11px; padding: 4px 8px; }

    /* PROMO — mobilde taşırmayan padding ve ölçekli tipografi */
    .jeebna-promo { padding: 26px 22px; min-height: 180px; }
    .jeebna-promo h3 { font-size: 21px; margin: 12px 0 6px; }
    .jeebna-promo p { font-size: 13px; margin: 0 0 14px; }
    .jeebna-promo .jeebna-promo-cta { padding: 11px 18px; font-size: 13px; }
}

/* ---------- Küçük telefon (≤ 430px) ---------- */
@media (max-width: 430px) {
    .jeebna-shell { padding-inline: 13px; }
    .jeebna-hero-body { padding: 22px 16px; }
    .jeebna-hero-title { font-size: clamp(23px, 7.4vw, 30px); }
    .jeebna-prod-grid,
    .jeebna-prod-grid--5 { gap: 10px; margin-inline: -13px; padding-inline: 13px; scroll-padding-inline: 13px; }
    .jeebna-prod-card { flex-basis: 46%; }
    .jeebna-prod-name { font-size: 12.5px; }
    .jeebna-cat-card .go { display: none; } /* çok dar ekranda alanı ürün adına bırak */
}