/* ═══════════════════════════════════════════════════════════════
   MOBIL RESPONSIVE — İç sayfa hero alanları + Form düzeni
   Tüm site boyunca mobil cihazlarda tutarlı gösterim sağlar
   ═══════════════════════════════════════════════════════════════ */

/* Konteynır güvenlik marjı - side scroll önlem */
@media (max-width: 768px){
  html, body { overflow-x: hidden; max-width: 100vw; }
  .container { padding-left: 14px !important; padding-right: 14px !important; }
}

/* ═══════════════════════════════════════════════════════════════
   HERO BANNER — Tüm sayfa hero'ları için mobil kompakt
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px){
  /* Kategoriler Hero (catx-*) */
  .catx-hero{ min-height:auto !important; padding:40px 0 32px !important; }
  .catx-hero-in{ padding:0 14px !important }
  .catx-hero-icon-wrap{ width:72px !important; height:72px !important; margin-bottom:14px !important }
  .catx-hero-icon{ width:58px !important; height:58px !important; border-radius:16px !important }
  .catx-anim-svg{ width:40px !important; height:40px !important }
  .catx-hero-title{ font-size:26px !important; line-height:1.15 !important; margin-bottom:10px !important; letter-spacing:-.5px !important }
  .catx-hero-desc{ font-size:13px !important; line-height:1.55 !important; padding:0 8px !important; margin-bottom:18px !important }
  .catx-hero-badge{ font-size:10px !important; padding:5px 12px !important; margin-bottom:12px !important }
  .catx-hero-stats{ flex-wrap:wrap !important; justify-content:center !important; gap:6px !important; margin-bottom:16px !important }
  .catx-hero-stat{ min-width:0 !important; flex:1 !important; padding:8px 10px !important }
  .catx-hero-stat strong{ font-size:17px !important }
  .catx-hero-stat small{ font-size:10px !important }
  .catx-search-input{ height:46px !important; font-size:13px !important; padding:0 44px !important }
  .catx-hero-scroll-hint{ display:none !important }

  /* İstatistikler Hero (stx-*) */
  .stx-hero{ padding:40px 0 32px !important }
  .stx-hero-in{ padding:0 14px !important }
  .stx-hero-title{ font-size:28px !important; gap:8px !important; letter-spacing:-.5px !important }
  .stx-hero-amp{ font-size:.6em !important }
  .stx-hero-desc{ font-size:13px !important; padding:0 8px !important; margin-bottom:22px !important }
  .stx-hero-badge-pill{ font-size:10px !important; padding:5px 12px !important }

  /* İletişim Hero (ct-*) */
  .ct-hero{ padding:30px 0 34px !important }
  .ct-hero h1{ font-size:26px !important; margin:6px 0 !important }
  .ct-hero p{ font-size:13px !important }
  .ct-badge{ font-size:10px !important; padding:5px 12px !important }

  /* Mezata Koy Hero (mz-*) */
  .mz-hero{ padding:24px 0 28px !important }
  .mz-hero-in{ flex-direction:column !important; text-align:center !important; gap:12px !important; padding:0 14px !important }
  .mz-hero h1{ font-size:26px !important; margin:4px 0 !important }
  .mz-hero p{ font-size:13px !important; max-width:100% !important; white-space:normal !important }
  .mz-badge{ font-size:10px !important; padding:4px 10px !important }
  .mz-hero-icon{ width:60px !important; height:60px !important; font-size:28px !important; border-radius:16px !important }

  /* Blog Hero (blog.php) */
  .blog-hero-banner{ padding:28px 14px 22px !important }
  .blog-hero-banner h1{ font-size:24px !important; margin-bottom:8px !important }
  .blog-hero-banner p{ font-size:13px !important }
  .blog-hero-badge{ font-size:10px !important; padding:5px 12px !important; margin-bottom:12px !important }

  /* Genel section padding */
  .section{ padding:36px 0 !important }
  .section-head{ margin-bottom:18px !important }
  .section-title{ font-size:20px !important }
}

@media (max-width: 480px){
  .catx-hero{ padding:32px 0 26px !important }
  .catx-hero-title{ font-size:23px !important }
  .catx-hero-desc{ font-size:12.5px !important }
  .catx-hero-stat{ padding:7px 8px !important }
  .catx-hero-stat strong{ font-size:15px !important }
  .catx-hero-stat small{ font-size:9.5px !important }

  .stx-hero-title{ font-size:24px !important }
  .stx-hero-amp{ display:none !important }

  .ct-hero h1, .mz-hero h1, .blog-hero-banner h1{ font-size:22px !important }
  .ct-hero p, .mz-hero p, .blog-hero-banner p{ font-size:12.5px !important }

  .mz-hero-icon{ width:52px !important; height:52px !important; font-size:24px !important }
}

/* ═══════════════════════════════════════════════════════════════
   İLAN-EKLE HERO (ie-hero) — Mobil kompakt
   ═══════════════════════════════════════════════════════════════ */
@media(max-width:768px){
  .ie-hero{ padding:20px 0 24px !important }
  .ie-hero-in{ flex-direction:column !important; gap:12px !important; align-items:flex-start !important; padding:0 14px !important }
  .ie-hero-left h1{ font-size:24px !important; margin:4px 0 !important }
  .ie-hero-left p{ font-size:13px !important }
  .ie-badge{ font-size:10px !important; padding:4px 10px !important }
  .ie-hero-stats{ width:100% !important; display:grid !important; grid-template-columns:1fr 1fr !important; gap:8px !important }
  .ie-hero-stats > div{ padding:8px 12px !important; text-align:center !important }
  .ie-hero-stats span{ font-size:16px !important }
  .ie-hero-stats small{ font-size:10px !important }
  /* Layout grid tek kolon */
  .ie-layout{ grid-template-columns:1fr !important }
  /* Breadcrumb mobil kompakt */
  .breadcrumb{ padding:8px 0 !important }
  .breadcrumb-in{ flex-direction:column !important; align-items:flex-start !important; gap:4px !important; padding:0 14px !important }
  .breadcrumb-in ul{ flex-wrap:wrap !important; font-size:11.5px !important }
}
@media(max-width:480px){
  .ie-hero-left h1{ font-size:22px !important }
  .ie-hero-stats{ grid-template-columns:1fr !important }
}

/* ═══════════════════════════════════════════════════════════════
   STEP INDICATOR — İlan-ekle & Mezat-ekle adım göstergesi
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px){
  /* Mezat adımları yatay scroll + kompakt + sticky */
  .mz-steps, .sp-steps{
    overflow-x:auto !important;
    flex-wrap:nowrap !important;
    padding:10px 4px 12px !important;
    gap:0 !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
    background:var(--white) !important;
    border-bottom:1px solid var(--brd) !important;
    box-shadow:0 2px 6px rgba(0,0,0,.04) !important;
  }
  .mz-steps::-webkit-scrollbar, .sp-steps::-webkit-scrollbar{display:none !important}
  /* Parent container sticky olsun */
  .mz-steps, .sp-steps,
  .ilan-ekle-wrap > .sp-steps,
  .mz-steps-wrap,
  .container > .mz-steps,
  .container > .sp-steps,
  .sp-steps-wrapper{
    position:sticky !important; top:0 !important; z-index:15 !important
  }
  [data-theme="dark"] .mz-steps,
  [data-theme="dark"] .sp-steps{ background:#1e293b !important; border-color:#334155 !important }
  .mz-step, .sp-step{
    flex:0 0 auto !important;
    min-width:72px !important;
    padding:0 4px !important;
  }
  .mz-step-circle, .sp-step-circle{
    width:32px !important; height:32px !important; font-size:12px !important
  }
  .mz-step-lbl, .sp-step-lbl{
    font-size:9.5px !important;
    white-space:nowrap !important;
    max-width:68px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  .mz-step-line, .sp-step-line{
    width:18px !important; top:16px !important; height:2px !important
  }
}
@media (max-width: 480px){
  .mz-step-circle, .sp-step-circle{ width:28px !important; height:28px !important; font-size:11px !important }
  .mz-step-lbl, .sp-step-lbl{ font-size:9px !important; max-width:60px !important }
  .mz-step-line, .sp-step-line{ width:12px !important }
}

/* Step style 6 (Card Steps) mobilde yatay scroll'da kompakt */
@media(max-width:768px){
  body[data-step-style="6"] .mz-step,
  body[data-step-style="6"] .sp-step{
    padding:8px 10px !important; min-width:100px !important; flex-direction:row !important
  }
  body[data-step-style="6"] .mz-step-circle,
  body[data-step-style="6"] .sp-step-circle{ width:26px !important; height:26px !important }
  body[data-step-style="6"] .mz-step-lbl,
  body[data-step-style="6"] .sp-step-lbl{ font-size:10.5px !important; max-width:none !important }
}

/* ═══════════════════════════════════════════════════════════════
   Nav butonları (Previous/Next/Submit) — Mobil sticky bottom
   ═══════════════════════════════════════════════════════════════ */
@media(max-width:768px){
  .mz-nav{
    position:sticky !important;
    bottom:0 !important;
    z-index:10 !important;
    background:var(--white) !important;
    padding:10px 12px !important;
    margin:16px -14px -16px !important;
    border-top:1px solid var(--brd) !important;
    box-shadow:0 -4px 14px rgba(0,0,0,.06) !important;
    gap:8px !important;
  }
  [data-theme="dark"] .mz-nav{ background:#1e293b !important; border-color:#334155 !important }
  .mz-btn-primary, .mz-btn-sec{ padding:12px 16px !important; font-size:13px !important; flex:1 !important }
  .mz-btn-primary{ min-width:0 !important }
  .ilan-ekle-wrap .btn-post,
  .ilan-ekle-wrap #prev-btn,
  .ilan-ekle-wrap #next-btn,
  .ilan-ekle-wrap #submit-btn{
    padding:12px 18px !important; font-size:13px !important
  }
}

/* ═══════════════════════════════════════════════════════════════
   FORM CARDS — İlan/Mezat form alanlarını mobile'da daha ferah yap
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px){
  .mz-card, .form-card{
    padding:18px 16px !important; border-radius:14px !important
  }
  .mz-card h3, .form-card h3{ font-size:16px !important; gap:8px !important; padding-bottom:10px !important; margin-bottom:14px !important }
  .mz-num{ width:28px !important; height:28px !important; font-size:12px !important }
  .mz-grid2, .mz-grid3{ grid-template-columns:1fr !important; gap:10px !important }

  /* Photo / Video bölümü mobilde ferah */
  .sp-media-section{ padding:14px !important; border-radius:12px !important }
  .sp-media-head{ gap:10px !important }
  .sp-media-ic{ width:36px !important; height:36px !important; font-size:15px !important }
  .sp-media-title{ font-size:14px !important }
  .sp-media-sub{ font-size:11.5px !important }
  .sp-media-drop{ padding:22px 14px !important }
  .sp-media-drop-ic{ width:46px !important; height:46px !important; font-size:20px !important }
  .sp-media-drop strong{ font-size:13px !important }

  /* Live summary sidebar mobilde üstte tam genişlik */
  .mz-sidebar, .ie-summary{ position:static !important }
  .mz-wrap{ grid-template-columns:1fr !important }
}

/* ═══════════════════════════════════════════════════════════════
   Rules banner kompakt
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 600px){
  .mz-rules-banner{ flex-direction:column !important; text-align:center !important; gap:10px !important; padding:12px !important }
  .mz-rules-ic{ margin:0 auto !important }
  .mz-rules-txt strong{ font-size:14px !important }
  .mz-rules-txt span{ font-size:11.5px !important }
  .mz-rules-btn{ width:100% !important; justify-content:center !important }
}

/* ═══════════════════════════════════════════════════════════════
   Giriş/Kayıt sayfası mobile
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 900px){
  .auth-wrapper, .giris-wrap, .auth-container, .auth-split{ padding:0 !important; min-height:auto !important }
  .auth-left, .auth-hero-side, .auth-promo{ display:none !important }
  .auth-right, .auth-form-side{ width:100% !important; min-width:unset !important; padding:16px !important; min-height:auto !important }
  .auth-right-content{ padding:0 !important; max-width:100% !important }
  /* TAB SWITCHER — sticky üstte, her zaman görünsün */
  .auth-tabs-wrap{
    position:sticky !important;
    top:0 !important;
    z-index:20 !important;
    background:var(--white) !important;
    margin:0 -16px 14px !important;
    padding:8px 16px !important;
    border-bottom:1px solid var(--brd) !important;
    box-shadow:0 2px 8px rgba(0,0,0,.04) !important;
  }
  .auth-tabs-wrap .auth-tab{ padding:10px 14px !important; font-size:13px !important }
  [data-theme="dark"] .auth-tabs-wrap{ background:#1e293b !important; border-color:#334155 !important }
}
@media (max-width: 480px){
  .auth-right{ padding:12px !important }
  .auth-tabs-wrap{ margin:0 -12px 10px !important; padding:6px 12px !important }
  .auth-pane h2{ font-size:20px !important }
  .auth-pane .auth-sub,
  .auth-pane p{ font-size:12.5px !important }
  .social-btn{ font-size:13px !important; padding:10px 12px !important }
}

/* ═══════════════════════════════════════════════════════
 * v4.3 Enhancements Mobile Responsive Overrides
 * ═══════════════════════════════════════════════════════ */
@media (max-width: 900px){
  /* İlan detay: Başlık + Dolandırıcılara Dikkat mobilde daha kompakt */
  .ld-title-above-gallery{ padding:12px 14px !important; }
  .ld-title-above-gallery h1{ font-size:17px !important; line-height:1.3 }
  .ld-title-above-gallery .ld-title-meta{ gap:8px; font-size:12px; flex-wrap:wrap }
  .ld-fraud-alert-top{ padding:12px 14px !important; gap:10px !important }
  .ld-fraud-alert-top .fraud-icon{ width:34px !important; height:34px !important; font-size:15px !important }
  .ld-fraud-alert-top h4{ font-size:13px !important }
  .ld-fraud-alert-top p{ font-size:12px !important }

  /* Hesabım stats grid */
  .acc-stats-grid{ grid-template-columns:repeat(2,1fr) !important; gap:10px !important }
  .acc-stat-card{ padding:14px 12px !important }
  .acc-stat-card .stat-value{ font-size:22px !important }
  .acc-stat-card .stat-icon{ width:40px !important; height:40px !important; font-size:16px !important }

  /* Filter sidebar */
  .filter-card{ position:static !important; border-radius:14px !important }
  .filter-head{ padding:12px 14px !important }
  .filter-group{ padding:12px 14px !important }

  /* Auth left panel */
  .auth-left{ min-height:auto !important; padding:24px 16px !important }
  .auth-left-content{ padding:16px 0 !important; max-width:100% !important }
  .auth-brand h1{ font-size:22px !important }

  /* Header account CTA */
  .hdr-account-cta{ padding:7px 12px !important; font-size:11px !important; letter-spacing:.2px !important }

  /* Notif dropdown */
  .sp-notif-dropdown{ min-width:300px !important; max-width:calc(100vw - 20px) !important }
  .notif-dd-actions button{ font-size:11px !important; padding:6px 8px !important }

  /* Listing card - Acil diagonal */
  .listing-card .acil-diagonal{ font-size:10px !important; padding:4px 40px !important; top:12px !important; left:-38px !important }

  /* Similar listings grid mobile */
  .ld-similar-grid{ grid-template-columns:repeat(2,1fr) !important }

  /* Kategori hero */
  .cat-hero-btn{ padding:10px 18px !important; font-size:12px !important; letter-spacing:1px !important }
  .catd-hero-in{ grid-template-columns:1fr !important; text-align:center }
  .catd-hero-actions{ flex-direction:row !important; justify-content:center; flex-wrap:wrap }

  /* No-store CTA */
  .no-store-cta-rotating{ padding:20px 16px !important }
  .no-store-cta-rotating h3{ font-size:16px !important }
  .no-store-cta-rotating p{ font-size:12px !important }

  /* Verify badges */
  .verify-badges-v2 .vb-item{ padding:7px 9px !important; font-size:11.5px !important }
  .verify-badges-v2 .vb-label{ font-size:11.5px !important }
  .verify-badges-v2 .vb-icon{ width:24px !important; height:24px !important; font-size:11px !important }

  /* Hesabım side stats */
  .acc-side-stats-v2{ padding:10px !important; gap:6px !important }
  .acc-side-stats-v2 .side-stat b{ font-size:16px !important }
  .acc-side-stats-v2 .side-stat span{ font-size:10px !important }

  /* Packages heading */
  .pkg-title-grad{ font-size:26px !important }

  /* Contact ad */
  .contact-ad-animated{ padding:18px 14px !important }
  .contact-ad-animated i.big-icon{ font-size:32px !important }
  .contact-ad-animated h3{ font-size:17px !important }

  /* Footer newsletter */
  .nl-icon-rot{ width:52px !important; height:52px !important }
  .nl-title-grad{ font-size:18px !important }

  /* Footer mobile badges */
  .ft-mobile-badges{ justify-content:center; margin-top:12px }
  .ft-mobile-badge{ min-width:0; flex:1 1 140px; max-width:180px }

  /* Step 5 progress bar */
  body[data-step-style="5"] .mz-step-circle,
  body[data-step-style="5"] .sp-step-circle{ width:40px !important; height:40px !important; font-size:14px !important }

  /* Package info rotating */
  .pkg-info-rot{ padding:16px !important }
  .pkg-icon-rot{ width:48px !important; height:48px !important }

  /* Account dropdown */
  .hdr-account-dropdown-v2{ min-width:280px !important }
  .hdr-account-dropdown-v2 .dd-grid{ grid-template-columns:1fr !important }
}

@media (max-width: 480px){
  /* Hesap sayfasındaki istatistikler tek sütun */
  .acc-stats-grid{ grid-template-columns:1fr !important }
  .acc-side-stats-v2{ flex-direction:column !important; gap:8px !important }
  .acc-side-stats-v2 .side-sep{ width:100% !important; height:1px !important }

  /* İlan detay başlık */
  .ld-title-above-gallery h1{ font-size:15px !important }
  .ld-title-above-gallery .ld-title-meta{ font-size:11px !important; gap:6px !important }
  .ld-title-above-gallery .ld-age{ font-size:12px !important }

  /* Similar grid tek sütun */
  .ld-similar-grid{ grid-template-columns:1fr !important }

  /* Seller rich */
  .ld-seller-rich .seller-stats{ grid-template-columns:repeat(3,1fr) !important; gap:6px }
  .ld-seller-rich .seller-stat{ padding:8px 4px !important }

  /* Fraud alert */
  .ld-fraud-alert-top{ flex-direction:row !important; padding:10px 12px !important }
  .ld-fraud-alert-top h4{ font-size:12px !important }
  .ld-fraud-alert-top p{ font-size:11px !important; line-height:1.5 !important }

  /* Kategori hero butonları dikey */
  .catd-hero-actions{ flex-direction:column !important }
  .cat-hero-btn{ width:100% }

  /* Footer newsletter */
  .ft-newsletter-v2 form{ flex-direction:column !important }
}