/* forgotPassword.css - used by forgotPassword.jsp, verifyOtp.jsp, resetPassword.jsp (loads after base.css) */
.topbar{height:72px;background:#122da5;border-bottom:1px solid #0a1a40;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 12px rgba(11,31,77,.35)}
.topbar-title{font-size:23px;font-weight:800;letter-spacing:.4px;color:#fff;text-transform:uppercase}

.auth-wrap{display:flex;justify-content:center;padding-top:40px}
.auth-card{width:100%;max-width:440px;background:#fff;border-radius:12px;border-top:4px solid var(--accent);box-shadow:0 4px 14px rgba(20,30,70,.15);padding:28px 30px 24px;text-align:center}
.auth-card.blue{--accent:#2f6bf2;--accent-bg:#e8effe}
.auth-card.purple{--accent:#7b3fe4;--accent-bg:#f0e9fd}
.auth-card.green{--accent:#1f9d55;--accent-bg:#e6f7ec}
.auth-icon{width:64px;height:64px;border-radius:50%;background:var(--accent-bg);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin:0 auto 14px}
.auth-card h1{font-size:1.4rem;font-weight:800;color:#0b1f4d;margin-bottom:6px}
.auth-card .sub{font-size:.9rem;color:#8a92ab;line-height:1.5;margin-bottom:18px}
.auth-card .sub b{color:#1b2559}

.field{text-align:left;margin-bottom:14px}
.field label{display:block;font-size:.88rem;font-weight:700;color:#1b2559;margin-bottom:6px}
.field input{width:100%;padding:.65rem .8rem;border:1.5px solid #d9deee;border-radius:8px;font-size:.95rem;color:#1b2559;background:#fbfcff;outline:none;transition:border-color .15s,box-shadow .15s}
.field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(47,107,242,.15);background:#fff}
.field input.otp-input{text-align:center;font-size:1.8rem;font-weight:800;letter-spacing:.6rem;padding:.5rem}

.btn{width:100%;padding:.75rem 1rem;border-radius:8px;border:1.5px solid transparent;font-size:.98rem;font-weight:700;cursor:pointer;background:var(--accent);color:#fff;transition:opacity .15s}
.btn:hover{opacity:.9}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-link{background:none;border:none;color:#2f6bf2;font-weight:700;font-size:.9rem;cursor:pointer;margin-top:12px;width:auto}
.back-link{display:inline-block;margin-top:14px;font-size:.9rem;color:#2f6bf2;font-weight:600}

.alert{padding:10px 12px;border-radius:8px;font-size:.88rem;font-weight:600;margin-bottom:14px;text-align:left}
.alert.error{background:#fbe8e8;border:1px solid #e34848;color:#b42323}
.alert.success{background:#e6f7ec;border:1px solid #1f9d55;color:#146c3a}

.timer{font-size:.9rem;font-weight:700;color:#1b2559;margin-bottom:14px}
.timer.expired{color:#e34848}
.match-msg{font-size:.84rem;font-weight:700;min-height:18px;margin:-6px 0 12px;text-align:left}
.match-msg.bad{color:#e34848}
.match-msg.ok{color:#1f9d55}

/* OTP pop-up (modal) */
.modal-overlay{position:fixed;inset:0;background:rgba(1,19,59,.78);display:flex;align-items:center;justify-content:center;z-index:2000;padding:16px}
.modal-card{position:relative;animation:pop .2s ease}
@keyframes pop{from{opacity:0;transform:translateY(-12px) scale(.97)}to{opacity:1;transform:none}}
.modal-close-form{position:absolute;top:10px;right:12px}
.modal-close{width:32px;height:32px;border:none;border-radius:50%;background:#eef1fb;color:#1b2559;font-size:1.2rem;font-weight:700;cursor:pointer;line-height:1}
.modal-close:hover{background:#e34848;color:#fff}
