/* core/forms.css

   Champs de formulaire et leurs aides.

   Chargé par index.html, dans l'ordre de css/README.md. Ne pas changer cet
   ordre sans relire la section « Ordre de chargement ». */

/* ---------- fields ---------- */

.field { display: block; margin-bottom: 18px; }

.field > span {
  display: block;
  font-size: var(--fs-2);
  font-weight: 500;
  color: var(--muted);
  margin-bottom: 7px;
}

.field input, .field select, .field textarea {
  width: 100%;
  padding: 11px 13px;
  border: 1px solid var(--border);
  border-radius: var(--r);
  background: var(--bg);
  color: var(--text);
}

.field input::placeholder, .field textarea::placeholder { color: var(--muted); }

.field input:focus, .field select:focus, .field textarea:focus {
  border-color: var(--primary);
  outline: none;
}

.field select { appearance: none; cursor: pointer; }

.field textarea { min-height: 160px; font-family: var(--serif); line-height: 1.7; resize: vertical; }

.error-line { color: var(--red); font-size: var(--fs-3); margin: 14px 0 0; }

.hint { font-size: var(--fs-2); color: var(--muted); margin: -8px 0 16px; }

/* Précision discrète accolée à l'intitulé d'un champ. */

.field-hint { color: var(--muted); font-weight: 400; font-size: var(--fs-1); }