/**
 * Solution d'urgence pour corriger l'affichage mobile
 * Ce fichier applique des correctifs directs avec !important
 */

/* Reset complet pour mobile */
@media (max-width: 768px) {
  /* Empêcher tout débordement horizontal */
  html, body {
    width: 100% !important;
    overflow-x: hidden !important;
    max-width: 100% !important;
    position: relative !important;
  }
  
  /* Conteneurs principaux */
  .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  /* Section demande */
  #demande {
    width: 100% !important;
    padding: 20px 0 !important;
  }
  
  #demande .container {
    display: block !important;
    width: 100% !important;
  }
  
  /* Formulaire */
  .form-container {
    display: block !important;
    width: 100% !important;
    grid-template-columns: 1fr !important;
  }
  
  .form-info {
    width: 100% !important;
    margin-bottom: 20px !important;
  }
  
  form {
    width: 100% !important;
    padding: 15px !important;
    box-sizing: border-box !important;
  }
  
  /* Groupes de formulaire */
  .form-group {
    width: 100% !important;
    margin-bottom: 15px !important;
  }
  
  .form-row {
    display: block !important;
    width: 100% !important;
  }
  
  .form-group.half {
    width: 100% !important;
  }
  
  /* Champs de formulaire */
  input, select, textarea {
    width: 100% !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
  }
  
  /* Correction pour les cartes d'info */
  .info-item {
    width: 100% !important;
    margin-bottom: 15px !important;
    box-sizing: border-box !important;
  }
  
  /* Correction pour les sections */
  .form-section {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 !important;
  }
  
  /* Correction pour les étapes */
  .form-steps {
    width: 100% !important;
  }
  
  .form-step {
    width: 100% !important;
    box-sizing: border-box !important;
  }
  
  /* Correction pour les boutons */
  .btn-primary, .btn-secondary {
    width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 10px !important;
    display: block !important;
  }
}

/* Corrections spécifiques pour très petits écrans */
@media (max-width: 375px) {
  .container {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  
  form {
    padding: 10px !important;
  }
  
  input, select, textarea {
    padding: 10px !important;
  }
}