/* Pages hors application, sans utilisateur connecté ou à connexion forcée :
   connexion et changement de mot de passe obligatoire
   (src/Views/layouts/auth.php, auth/login.php, profile/force-password.php). */

.auth-body {
  display: flex;
  min-height: 100vh;
  align-items: center;
  justify-content: center;
  padding: 0 1rem;
  background: var(--page-bg);
  color: var(--text-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.auth-box {
  width: 100%;
  max-width: 28rem;
}

/* --- En-tête : pastille « CF », titre, sous-titre --- */
.auth-brand {
  margin-bottom: 2rem;
  text-align: center;
}

.auth-brand__logo {
  display: flex;
  width: 3.5rem;
  height: 3.5rem;
  margin: 0 auto 1rem;
  align-items: center;
  justify-content: center;
  border-radius: 1rem;
  background: rgb(var(--accent-600));
  font-size: 1.25rem;
  font-weight: 700;
  color: #fff;
}

.auth-brand__title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
}

.auth-brand__subtitle {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: var(--text-subtle);
}

/* --- Carte du formulaire --- */
.auth-card {
  padding: 1.5rem;
}
@media (min-width: 640px) {
  .auth-card {
    padding: 2rem;
  }
}
/* L'espacement vient du gap de .form-card : neutralise la marge propre des
   bandeaux. */
.auth-card .form-error,
.auth-card .notice {
  margin-bottom: 0;
}

/* --- Champ mot de passe avec œil « afficher » (assets/js/password-toggle.js) --- */
.auth-password {
  position: relative;
}

.auth-password__input {
  padding-right: 2.5rem;
}

.auth-password__toggle {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  padding: 0 0.75rem;
  color: var(--text-faint);
}
.auth-password__toggle:hover {
  color: var(--text-muted);
}

.auth-password__icon {
  width: 1.25rem;
  height: 1.25rem;
}

/* --- Pied : lien de déconnexion --- */
.auth-footer {
  margin-top: 1rem;
  text-align: center;
  font-size: 0.875rem;
}
/* Déconnexion = formulaire POST : le bouton reprend l'allure du lien. */
.auth-footer__button {
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  cursor: pointer;
}