/* ======================================================
   FORM FIELDS RESPONSIVE (mobile / tablette / desktop)
   ====================================================== */

/* Base */
.form-field {
  box-sizing: border-box;
  font-size: 16px;        /* évite le zoom mobile */
  padding: 10px 12px;
  border-radius: 8px;
  width: 100%;
}

/* ===== Types de champs ===== */

/* Champ ÉTROIT : n° mandat, n° facture, références */
.field-small {
  width: 100%;
}

/* Champ NORMAL : adresse, nom, texte */
.field-normal {
  width: 100%;
}

/* ===== TABLETTE ===== */
@media (min-width: 600px) {

  .field-small {
    width: clamp(180px, 25vw, 260px);
  }

  .field-normal {
    width: clamp(420px, 65vw, 720px);
  }
}

/* ===== DESKTOP ===== */
@media (min-width: 900px) {

  .field-small {
    width: 220px;     /* largeur exacte et stable */
  }

  .field-normal {
    width: 640px;     /* largeur lisible */
  }
}

/* Optionnel : centrer les champs */
.form-center {
  margin-left: auto;
  margin-right: auto;
  display: block;
}