/* DARA AFFILIATION — mot de passe oublie : etapes + saisie du code a 4 chiffres */
.otp-steps{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px;text-align:left}
.otp-steps li{display:flex;align-items:center;gap:12px;color:rgba(255,255,255,.55);font-weight:600;font-size:.95rem}
.otp-steps li b{width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.3);font-size:.85rem}
.otp-steps li.on{color:#fff}
.otp-steps li.on b{background:linear-gradient(135deg,#3b8bff,#1f6bff);border-color:transparent;box-shadow:0 6px 18px rgba(31,107,255,.5)}
.otp{display:flex;justify-content:center;gap:12px;margin:8px 0 22px}
.otp input{width:62px;height:72px;text-align:center;font:800 2rem system-ui,-apple-system,"Segoe UI",sans-serif;border-radius:16px;border:1px solid rgba(120,165,255,.35);background:rgba(2,8,22,.55);color:#fff;transition:border-color .2s,box-shadow .2s,transform .2s;-moz-appearance:textfield}
.otp input:focus{outline:none;border-color:#3b8bff;box-shadow:0 0 0 4px rgba(31,107,255,.28);transform:translateY(-2px)}
.otp input.filled{border-color:#35d0ff}
.otp-resend{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;justify-content:center;margin-top:18px;font-size:.9rem;color:rgba(255,255,255,.7)}
.otp-link{background:none;border:0;padding:6px 4px;color:#35d0ff;font:700 .9rem inherit;font-family:inherit;cursor:pointer;min-height:40px}
.otp-link[disabled]{opacity:.5;cursor:not-allowed}
.auth-subtitle strong{color:#fff;overflow-wrap:anywhere}
@media (max-width:420px){.otp{gap:8px}.otp input{width:54px;height:64px;font-size:1.7rem}}
