/* FIX RESPONSIVE GLOBAL - FASE - v3 CLEAN */
/* Date: 18/02/2026 */

/* Reset box-sizing */
*, *::before, *::after {
  box-sizing: border-box;
}

/* Empecher depassement horizontal */
html {
  overflow-x: clip;
}

body {
  overflow-x: clip;
  margin: 0;
  padding: 0;
  min-width: 320px;
}

/* Images responsive */
img {
  max-width: 100%;
  height: auto;
}

/* ===== ZOOM PC 0.75 (BACKUP - aussi dans header.php inline) ===== */
@media (min-width: 901px) {
  body {
    zoom: 0.75 !important;
  }
}

/* Grilles produits responsive */
@media (max-width: 768px) {
  .product-grid, .annonces-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px;
  }
  
  .hero-content-box {
    max-width: 90% !important;
    margin: 0 auto !important;
    padding: 20px 15px !important;
  }
}

@media (max-width: 480px) {
  .product-grid, .annonces-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  
  input, textarea, select {
    font-size: 16px !important; /* Evite zoom auto iOS */
  }
  
  button, .btn {
    min-height: 44px;
  }
}

@media (max-width: 375px) {
  .product-grid-compact {
    grid-template-columns: 1fr !important;
  }
}

/* Affichage conditionnel */
.desktop-only { display: block; }
.mobile-only { display: none; }

@media (max-width: 768px) {
  .desktop-only { display: none !important; }
  .mobile-only { display: block !important; }
}

/* Compensation barre navigation mobile fixe (62px) — évite que le contenu disparaisse sous la nav */
@media (max-width: 900px) and (orientation: portrait) {
  body {
    padding-bottom: max(80px, calc(62px + env(safe-area-inset-bottom, 18px))) !important;
  }
}
