/* ============================================================
   mobile.css — Aircraft2Sell v5
   Responsive complémentaire à styles.css (qui gère déjà la nav,
   le footer, les grilles et les formulaires). Ce fichier ne
   contient que les adaptations spécifiques aux pages.
   Breakpoints : 1024 · 768 · 480 · 360
   ============================================================ */

/* Empêche le zoom iOS sur focus */
@media (max-width: 768px) { input, select, textarea { font-size: 16px !important; } }

/* ══ TABLETTE LARGE (≤1024px) ═══════════════════════════════ */
@media (max-width: 1024px) {
  .hero { padding: 3rem 1.5rem 0; }
  .search-layout { grid-template-columns: 220px 1fr; gap: 1rem; }
  .results-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
  .plans-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .kpi-strip { gap: .75rem; }
  .ov-grid { grid-template-columns: 1fr 1fr; }
  .listing-wrap { grid-template-columns: 1fr 320px; }
  .guide-wrap { grid-template-columns: 200px 1fr; }
  .contact-wrap { grid-template-columns: 1fr 1fr; }
  .selector-grid { grid-template-columns: 1fr 1fr; }
  .checkout-wrap { grid-template-columns: 1fr 1.2fr; }
}

/* ══ TABLETTE / MOBILE (≤768px) ═════════════════════════════ */
@media (max-width: 768px) {

  /* Accueil */
  .hero { padding: 2.5rem 1rem 0; }
  .stats-strip { gap: 1.5rem; flex-wrap: wrap; padding-top: 1.5rem; }
  .cat-pills { gap: .3rem; overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; padding-bottom: .25rem; scrollbar-width: none; }
  .cat-pills::-webkit-scrollbar { display: none; }
  .cat-pills .pill, .cat-pills .qpill { white-space: nowrap; flex-shrink: 0; }
  .section-head { flex-wrap: wrap; gap: .5rem; }
  .cat-grid { grid-template-columns: repeat(2, 1fr) !important; gap: .6rem; }

  /* Modales */
  .modal-overlay, .modal-bg { align-items: flex-end !important; padding: 0 !important; }
  .modal-content, .modal { width: 100% !important; max-width: 100% !important; border-radius: 16px 16px 0 0 !important; max-height: 92vh; overflow-y: auto; }

  /* Recherche */
  .search-layout { grid-template-columns: 1fr !important; }
  .filters-sidebar, .search-layout .sidebar { display: none; }
  .filters-sidebar.open, .search-layout .sidebar.open { display: block !important; }
  .filter-toggle-btn, .mob-filter-btn { display: inline-flex !important; width: 100%; justify-content: center; }
  .sh-inner { flex-wrap: wrap; gap: .5rem; }
  .view-btns { display: none; }
  .results-grid { grid-template-columns: 1fr !important; gap: .75rem; }
  .sort-select { width: 100%; }

  /* Fiche annonce */
  .listing-wrap { grid-template-columns: 1fr !important; gap: 1rem; }
  .gallery-main { height: 240px; }
  .specs-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .seller-head { flex-wrap: wrap; }
  .listing-actions {
    position: fixed !important; bottom: 0; left: 0; right: 0;
    padding: .75rem 1rem; background: #fff; border-top: 1px solid #E4E8EF;
    box-shadow: 0 -6px 20px rgba(11,37,69,.08); z-index: 200; display: flex; gap: .6rem;
  }
  .listing-actions .btn-cta, .listing-actions .btn-primary { flex: 1; }
  .listing-content, #mainCol { padding-bottom: 90px; }

  /* Connexion */
  .auth-layout { grid-template-columns: 1fr !important; }
  .auth-visual { display: none !important; }
  .fld-row { grid-template-columns: 1fr !important; }

  /* Tableau de bord */
  .dash-body { flex-direction: column; }
  .dash-sidebar, .sidebar.dash-sidebar {
    width: 100% !important; border-right: none !important; border-bottom: 1px solid #E4E8EF;
    flex-direction: row !important; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
    padding: .5rem !important; background: #fff; position: sticky; top: var(--nav-h, 60px); z-index: 100;
  }
  .dash-sidebar::-webkit-scrollbar { display: none; }
  .sb-section { display: contents; }
  .sb-label { display: none; }
  .nav-tab { white-space: nowrap; flex-shrink: 0; padding: .5rem .85rem !important; font-size: .8rem; }
  .kpi-strip { grid-template-columns: repeat(2, 1fr); gap: .5rem; }
  .ov-grid { grid-template-columns: 1fr !important; }
  .ov-btns, .li-acts, .dc-head { flex-wrap: wrap; }
  .listing-item { flex-wrap: wrap; gap: .5rem; }
  .li-acts { width: 100%; justify-content: flex-start; }
  .upgrade-banner { flex-direction: column; text-align: center; }
  .ub-btns { justify-content: center; }

  /* Dépôt d'annonce */
  .post-layout { grid-template-columns: 1fr !important; }
  .preview-sticky { display: none !important; }
  .form-grid, .form-grid.col2 { grid-template-columns: 1fr !important; }
  .form-grid.col3 { grid-template-columns: 1fr 1fr !important; }
  .mm-selects { grid-template-columns: 1fr !important; }
  .photo-upload-grid, .photo-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .price-row { flex-direction: column; }
  .page-header { flex-wrap: wrap; padding: 1rem !important; }

  /* Tarifs */
  .plans-grid { grid-template-columns: 1fr !important; max-width: 440px; margin: 0 auto; }
  .addon-row { flex-wrap: wrap; gap: .5rem; }

  /* Vendeur */
  .page-wrap { grid-template-columns: 1fr !important; }
  .profile-card { position: static !important; }
  .cat-tabs { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; padding-bottom: .25rem; }
  .cat-tab { white-space: nowrap; flex-shrink: 0; }
  .lcard { grid-template-columns: 100px 1fr !important; }
  .lcard-img { height: 70px !important; }

  /* Messages */
  .msg-layout { grid-template-columns: 1fr !important; }
  .msg-sidebar { max-height: 220px; border-right: none !important; border-bottom: 1px solid #E4E8EF; }
  .chat-area { min-height: 400px; }
  .chat-header { padding: .75rem 1rem !important; }
  .chat-input-wrap { padding: .75rem 1rem; }

  /* Paiement */
  .checkout-wrap { grid-template-columns: 1fr !important; }
  .order-summary { order: -1; }
  .form-row { grid-template-columns: 1fr !important; }

  /* Guides / blog */
  .guide-wrap { grid-template-columns: 1fr !important; }
  .guide-sidebar, .guide-toc { display: none !important; }
  .guide-chips { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; }
  .cards-grid { grid-template-columns: 1fr !important; }
  .section-header { flex-direction: column; gap: .75rem; }

  /* Contact */
  .contact-wrap { grid-template-columns: 1fr !important; }
  .social-grid { grid-template-columns: 1fr 1fr !important; }

  /* Comparateur / carte */
  .selector-grid { grid-template-columns: 1fr !important; }
  .mini-specs { grid-template-columns: 1fr 1fr !important; }
  .map-filters { flex-wrap: wrap; }

  /* FAQ */
  .faq-cats { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: .25rem; }
  .faq-cta-btns { flex-direction: column; align-items: center; }

  /* 404 */
  .search-404 { flex-direction: column; }
  .search-404 button { width: 100%; }
  .err-btns { flex-direction: column; align-items: center; }

  /* Admin */
  .sb { position: fixed !important; z-index: 400; transform: translateX(-100%); transition: transform .25s; height: 100vh; width: 260px !important; }
  .sb.open { transform: translateX(0); }
  .admin-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 399; }
  .admin-overlay.open { display: block; }
  .krow { grid-template-columns: 1fr 1fr !important; gap: .5rem; }
  .g2, .g3 { grid-template-columns: 1fr !important; }
  .tbl-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .tbl { min-width: 500px; }
  .content-wrap { padding: 12px; }
  .topbar { padding: 0 12px; gap: 8px; }
}

/* ══ MOBILE (≤480px) ═════════════════════════════════════════ */
@media (max-width: 480px) {
  .hero { padding: 2rem .75rem 0; }
  .card-body { padding: 1rem; }
  .kpi-strip { grid-template-columns: 1fr 1fr; gap: .4rem; }
  .gallery-main { height: 200px; }
  .specs-grid { grid-template-columns: 1fr 1fr !important; gap: .4rem; }
  .plan-price { font-size: 2rem; }
  .lcard { grid-template-columns: 80px 1fr !important; }
  .profile-stats { grid-template-columns: 1fr 1fr; }
  .social-grid { grid-template-columns: 1fr !important; }
  .krow { grid-template-columns: 1fr 1fr !important; gap: .4rem; }
  .tbl th, .tbl td { padding: 6px 8px; font-size: 11px; }
  .photo-upload-grid, .photo-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ══ PETIT MOBILE (≤360px) ══════════════════════════════════ */
@media (max-width: 360px) {
  .hero { padding: 1.5rem .5rem 0; }
  .kpi-strip { grid-template-columns: 1fr 1fr; }
  .plans-grid { max-width: 100%; }
}

/* ══ SAFE AREA (iPhone) ═════════════════════════════════════ */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .listing-actions { padding-bottom: calc(.75rem + env(safe-area-inset-bottom)) !important; }
}

/* ══ SCROLL HORIZONTAL DE CARTES (mobile) ═══════════════════ */
@media (max-width: 768px) {
  .cards-scroll-wrap { overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; display: flex; gap: .75rem; padding: 0 1rem 1rem; }
  .cards-scroll-wrap::-webkit-scrollbar { display: none; }
  .cards-scroll-wrap .card { flex: 0 0 280px; scroll-snap-align: start; }
}