/* ══════════════════════════════════════════════════════
   auth_mire.css - Identite COMMUNE aux ecrans de la mire
   d'authentification : connexion, inscription, invitation,
   invitation promo, mot de passe oublie (4 etapes),
   confirmation d'adresse email.

   Ces regles vivaient dans `auth_login.css`, donc sur la
   seule page de connexion : les huit autres ecrans du meme
   parcours restaient sur le fond ardoise plat et le titre
   bleu de `style.css`. On les sort ici pour que les dix
   pages portent la meme marque.

   `auth_login.css` ne garde que ce qui n'appartient qu'a la
   connexion : boutons Google / Microsoft / cle d'acces,
   tuiles-ballons du fond, pyramide Tetris.

   A charger APRES `style.css` (il faut ecraser `.auth-body`
   et `.auth-title`).
   ══════════════════════════════════════════════════════ */

/* ── Fond de page : violet nuit, identique au hero du site vitrine ── */
.auth-body {
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
    background:
        radial-gradient(ellipse 100% 80% at 50% -10%, rgba(108, 92, 231, 0.30) 0%, transparent 60%),
        linear-gradient(180deg, #0d0d1a 0%, #13132a 50%, #0d0d1a 100%);
}

/* ── Titre « MonAssoCompta » : texte en degrade violet ── */
.auth-title {
    background: linear-gradient(135deg, #4f46e5, #7c3aed);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #4f46e5; /* repli si background-clip non supporte */
    font-size: 26px;
    letter-spacing: -0.02em;
}

/* ── Bouton principal : degrade violet (maquette 1) ──
   Deux selecteurs pour un seul geste : `.auth-card` couvre les neuf
   ecrans batis sur la carte commune, `body.accept-body` couvre l'ecran
   d'invitation d'un membre, qui garde sa carte claire heritee de
   `tui.css` et n'aligne QUE la couleur de son bouton (decision de Joe,
   2026-08-04). */
.auth-card .btn-primary,
body.accept-body .btn-tui-primary {
    background: linear-gradient(135deg, #4f46e5, #7c3aed);
    border: 0;
    box-shadow: 0 10px 24px -8px rgba(91, 91, 214, 0.7);
    transition: filter 0.15s, transform 0.15s;
}
.auth-card .btn-primary:hover,
body.accept-body .btn-tui-primary:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
}
.auth-card .btn-primary:active,
body.accept-body .btn-tui-primary:active { transform: translateY(0); }

/* ── Champs : pas de zoom automatique iOS ──
   `.form-group input` (style.css) herite de `--input-size: 13px` pour
   toute l'app. Sous 16 px, iOS zoome la page des qu'on tape dans un
   champ et ne dezoome jamais. On ne releve que les ecrans de la mire,
   et seulement en dessous de 900 px. (Lot C, /audit-responsive,
   2026-07-27 - deplace ici le 2026-08-04 pour valoir sur les dix
   ecrans et non sur la seule connexion.) */
@media (max-width: 900px) {
    body.auth-body .form-group input,
    body.auth-body .form-group select,
    body.auth-body .form-group textarea { font-size: 16px; }
}