/* =============================================
   SKY BETS — FORGOT PASSWORD
   Black · White · Blue
   ============================================= */

.fp-icon {
  width:60px; height:60px; border-radius:50%;
  background:rgba(239,68,68,0.08); border:2px solid rgba(239,68,68,0.2);
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; color:var(--live);
  margin:0 auto 16px; animation:pop 0.35s ease;
}
.fp-icon--blue  { background:rgba(37,99,235,0.08);  border-color:rgba(37,99,235,0.2);  color:var(--accent-light); }
.fp-icon--green { background:rgba(34,197,94,0.08);  border-color:rgba(34,197,94,0.2);  color:var(--green); }

.otp-inputs { display:flex; gap:8px; justify-content:center; }
.otp-box {
  width:44px; height:52px; background:var(--surface-2);
  border:1.5px solid var(--border-md); border-radius:var(--r-md);
  font-size:1.3rem; font-weight:900; color:var(--t1);
  text-align:center; font-family:inherit; outline:none;
  transition:border-color var(--t), box-shadow var(--t); -webkit-appearance:none;
}
.otp-box:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(37,99,235,0.12); }
.otp-box.filled { border-color:rgba(34,197,94,0.35); background:rgba(34,197,94,0.05); }

.resend-row { display:flex; align-items:center; justify-content:space-between; margin-top:-4px; }
.resend-label { font-size:0.72rem; font-weight:600; color:var(--t3); }
.resend-label b { color:var(--t2); }
.resend-btn { font-size:0.72rem; font-weight:700; color:var(--accent-light); background:none; border:none; font-family:inherit; cursor:pointer; transition:opacity var(--t); }
.resend-btn:disabled { opacity:0.3; cursor:not-allowed; }
.resend-btn:not(:disabled):hover { opacity:0.75; }