/* Ecran d'inscription : meme habillage que la connexion (voir connexion.css).

   Il reutilise les classes de cet ecran (fond vivant, halos, carte en verre) et
   n'ajoute que ce qui lui est propre : la zone de texte, le texte d'aide sous un
   champ et le lien vers la connexion. Deux feuilles plutot qu'une parce que la
   connexion n'a pas de `<textarea>` : melanger les deux rendrait la feuille de
   connexion responsable de champs qu'elle n'affiche jamais. */

.connexion-champ textarea {
  width: 100%;
  padding: 0.8rem 0.95rem;
  font: inherit;
  font-size: 0.95rem;
  color: var(--connexion-texte);
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 12px;
  resize: vertical;
  min-height: 5rem;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.connexion-champ textarea:focus {
  outline: none;
  border-color: var(--vert);
  background: rgba(0, 0, 0, 0.35);
  box-shadow: 0 0 0 4px rgba(52, 211, 153, 0.18);
}

.connexion-aide {
  margin: -0.4rem 0 1.1rem;
  color: var(--connexion-doux);
  font-size: 0.8rem;
}

.connexion-aide code { color: var(--connexion-texte); }

/* Le bouton de la confirmation est un lien, pas un bouton de formulaire : il
   reprend l'apparence de `.connexion-bouton`, qui suppose un `<button>` et ne
   prend donc pas toute la largeur sur un `<a>`. */
a.connexion-bouton {
  display: block;
  text-align: center;
  text-decoration: none;
}