/* Champs de saisie : lisibilite et confort.
   Le style d'origine posait une bordure de la meme couleur que le fond du champ
   (#f5f5f7 sur #f5f5f7), sur une page blanche : le champ etait invisible tant
   qu'on ne cliquait pas dedans. Mesure avant correction : 1,09 pour 1 entre le
   champ et la page, la norme demande 3 pour 1. */

input, select, textarea {
  background: #ffffff !important;
  border: 1.5px solid #8e8e93 !important;   /* 3,3 pour 1 contre le blanc */
  box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
  color: #1d1d1f !important;
}

input:hover, select:hover, textarea:hover {
  border-color: #48484a !important;
}

/* l'etat actif d'origine etait deja bon : on le conserve et on l'affirme */
input:focus, select:focus, textarea:focus {
  background: #ffffff !important;
  border-color: #0D6B4F !important;
  box-shadow: 0 0 0 4px rgba(13, 107, 79, .16) !important;
  outline: none;
}

/* le texte d'aide passait a 2,4 pour 1, la norme demande 4,5 */
input::placeholder, textarea::placeholder {
  color: #6e6e73 !important;
  opacity: 1;
}

/* champ invalide apres saisie, jamais avant */
input:not(:placeholder-shown):invalid,
textarea:not(:placeholder-shown):invalid {
  border-color: #c0392b !important;
}

/* le champ actif reste reperable au clavier */
input:focus-visible, select:focus-visible, textarea:focus-visible,
button:focus-visible, a:focus-visible, label:focus-visible {
  outline: 2px solid #0D6B4F;
  outline-offset: 2px;
}

/* cases a cocher et boutons radio : visibles eux aussi */
input[type="checkbox"], input[type="radio"] {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px;
  accent-color: #0D6B4F;
  box-shadow: none;
  border-width: 1.5px !important;
}

/* le champ de recherche des modeles suit la meme regle */
input[type="search"] { -webkit-appearance: none; appearance: none; }

/* zone de texte : hauteur confortable et redimensionnement vertical seul */
textarea { resize: vertical; min-height: 110px; }

/* sur mobile, un corps de 16 px evite le zoom automatique d'iOS a la saisie */
@media (max-width: 860px) {
  input, select, textarea { font-size: 16px !important; }
}
