/* MFA screens share the customer's theme. */
.mfa-card{max-width:680px!important;margin:0 auto}.mfa-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .8rem;border-radius:99px;background:var(--soft,#ede9fe);color:var(--primary,#6244c5);font-weight:700;font-size:.9rem}.mfa-card h2{margin-top:1rem}.mfa-card form,.mfa-account form{max-width:560px}.mfa-steps{padding-left:1.5rem;line-height:1.8}.mfa-qr{width:min(240px,100%);margin:1.5rem auto;background:white;border:1px solid #dbe1e9;border-radius:16px;padding:8px}.mfa-qr svg{width:100%;display:block;shape-rendering:crispEdges}.mfa-secret{display:block;overflow-wrap:anywhere;letter-spacing:.12em;padding:1rem;background:#f1f5f9;color:#172033;border-radius:12px;margin:1rem 0}.mfa-card details,.mfa-account details{padding:1rem;border:1px solid #dbe1e9;border-radius:14px;margin:1rem 0}.mfa-card summary,.mfa-account summary{cursor:pointer;font-weight:700}.mfa-cancel{margin-top:1rem}.mfa-recovery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin:1.5rem 0}.mfa-recovery code{display:block;text-align:center;padding:.8rem .4rem;border-radius:10px;background:#f1f5f9;color:#172033;font-size:1rem}.mfa-account{margin-top:1.5rem}@media(max-width:480px){.mfa-recovery{grid-template-columns:1fr}.mfa-card{padding:1rem}}

/* A short, visible guide avoids leaving the user to find their authenticator. */
.mfa-guidance{margin:1.2rem 0;padding:1rem 1.1rem;background:var(--soft,#f3efff);border:1px solid #ddd4f5;border-radius:16px;color:var(--text,#243047)}.mfa-guidance-heading{display:flex;align-items:center;gap:.6rem}.mfa-guidance-heading>span{font-size:1.3rem}.mfa-guidance .mfa-phone-label{margin:.75rem 0 .6rem;font-size:.9rem}.mfa-phone-steps{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}.mfa-phone-steps li{display:flex;align-items:flex-start;gap:.65rem;line-height:1.5;font-size:.93rem}.mfa-phone-steps li>span{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border-radius:50%;background:white;color:var(--primary,#6244c5);font-weight:800;font-size:.8rem}.mfa-card .mfa-other-app{margin:.9rem 0 0;padding:.7rem 0 0;border:0;border-top:1px solid #dcd5eb;border-radius:0}.mfa-other-app summary{font-size:.86rem}.mfa-other-app p{font-size:.9rem;overflow-wrap:anywhere}.mfa-card .mfa-guidance p{line-height:1.5}

/* Centre les cartes MFA dans le conteneur de connexion, y compris sur mobile. */
.auth-page .card.narrow.mfa-card{width:100%;box-sizing:border-box;margin:24px auto 0}
.auth-page .mfa-card form{max-width:none}
