/* ============================================================
   AUTH — écrans des comptes (APP.AuthUI)
   modules/auth/auth.css · codia-modules (paquet « auth »)
   ============================================================
   Mise en page par défaut des vues du module : sobre, entièrement en
   tokens (aucune couleur en dur, aucun :root). Un site qui garde son
   apparence remplace les vues (auth.project.js) et ajoute auth.project.css.
   ============================================================ */
.auth-form { display: grid; gap: 14px; max-width: 440px; }
.auth-title { margin: 0; font-family: var(--f-display, inherit); color: var(--c-primary, inherit); font-size: 1.5rem; line-height: 1.2; }
.auth-subtitle { margin: 0 0 8px; font-family: var(--f-display, inherit); color: var(--c-primary, inherit); font-size: 1.15rem; }
.auth-lede, .auth-help { margin: 0; color: var(--c-mute, inherit); }
.auth-help { font-size: .875rem; }
.auth-field input { width: 100%; }
.auth-actions { margin: 4px 0 0; }
.auth-links { margin: 0; font-size: .9rem; }
.auth-link { font: inherit; }
.auth-error {
  margin: 0; padding: 10px 12px; border-radius: var(--r-sm, 6px);
  background: var(--c-danger-soft, transparent); color: var(--c-danger-ink, var(--c-danger, inherit));
  border: 1px solid var(--c-danger, currentColor);
}
.auth-done {
  margin: 0; padding: 10px 12px; border-radius: var(--r-sm, 6px);
  background: var(--c-success-soft, transparent); color: var(--c-success-ink, var(--c-success, inherit));
  border: 1px solid var(--c-success, currentColor);
}
/* Piège anti-robots : hors de l'écran, jamais affiché. */
.auth-trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

/* Règles du mot de passe, cochées pendant la frappe. */
.auth-rules { display: flex; flex-wrap: wrap; gap: 6px; margin: -6px 0 0; padding: 0; list-style: none; font-size: .8rem; }
.auth-rules li {
  padding: 3px 9px; border-radius: 999px;
  border: 1px solid var(--c-line, currentColor); color: var(--c-mute, inherit);
}
.auth-rules li.ok { border-color: var(--c-success, currentColor); color: var(--c-success-ink, var(--c-success, inherit)); background: var(--c-success-soft, transparent); }
.auth-rules li.ok::before { content: '✓ '; }

/* Double authentification. */
.auth-steps { margin: 0; padding-left: 20px; }
.auth-qr { display: flex; justify-content: center; min-height: 180px; align-items: center; }
.auth-qr img { background: var(--c-paper, transparent); padding: 8px; border: 1px solid var(--c-line, currentColor); border-radius: var(--r-sm, 6px); }
.auth-secret { margin: 0; font-size: .875rem; color: var(--c-mute, inherit); overflow-wrap: anywhere; }
.auth-secret code { font-size: .95rem; color: var(--c-ink, inherit); letter-spacing: .05em; }
.auth-form input[name="code"] { font-size: 1.4rem; letter-spacing: .3em; text-align: center; max-width: 220px; }
.auth-manage p { margin: 0 0 8px; }
.auth-factors { margin: 0 0 8px; padding: 0; list-style: none; display: grid; gap: 6px; }
.auth-factors li { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.auth-mode { color: var(--c-mute, inherit); font-size: .875rem; }
.auth-modal { padding: 4px 0; }
/* Fenêtres du module (porte de la double authentification) : jamais plus hautes que l'écran. */
.auth-overlay .app-modal { max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); overflow-y: auto; }
.auth-modal .auth-form { gap: 10px; }
.auth-modal .auth-qr { min-height: 0; }