html,
body {
  height: 100%;
}

.form-signin {
  max-width: 330px;
  padding: 1rem;
}

.form-signin .form-floating:focus-within {
  z-index: 2;
}

.form-signin input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

/* Bouton en mode grille pour superposer label et spinner */
#login-submit {
  position: relative;
  display: inline-grid;    /* superpose les enfants */
  place-items: center;     /* centre horizontal + vertical */
  min-width: 10rem;        /* évite le rétrécissement */
}

/* Les deux éléments partagent la même zone de grille */
#login-submit .btn-label,
#login-submit .spinner {
  grid-area: 1 / 1;        /* même cellule */
}

/* Spinner par défaut : caché, sans marge */
#login-submit .spinner {
  display: none;
  width: 1em;
  height: 1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  /* important: pas de margin-left ici */
}

/* État "loading" */
#login-submit.is-loading .spinner { display: inline-block; }
#login-submit.is-loading .btn-label { opacity: 0; } /* garde la place du label */

/* Optionnel: pour éviter qu’un changement de font-size fasse bouger le bouton */
#login-submit { line-height: 1; }

@keyframes spin { to { transform: rotate(360deg); } }