/* Forgot Password Page — tiffin web app */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;font-family:'Inter',sans-serif;background:#f7f6f8}
:root{--primary:#4A1594;--primary-dark:#380f73;--red:#ef4444;--green:#16a34a;--border:#e5e7eb;--text:#111827;--muted:#6b7280}

.wrap{min-height:100%;display:flex;flex-direction:column;max-width:480px;margin:0 auto;padding:0 24px 48px}

/* ── Header ───────────────────────────────────────── */
.header{padding:16px 0}
.back-btn{width:40px;height:40px;border-radius:50%;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center}
.back-btn:hover{background:#f1f5f9}

/* ── Icon ─────────────────────────────────────────── */
.icon-wrap{display:flex;justify-content:center;margin:28px 0 24px}
.icon-box{width:96px;height:96px;border-radius:24px;background:rgba(74,21,148,.1);display:flex;align-items:center;justify-content:center}

/* ── Text ─────────────────────────────────────────── */
.page-title{font-size:28px;font-weight:800;color:var(--text);text-align:center;margin-bottom:12px}
.page-sub{font-size:15px;color:var(--muted);text-align:center;line-height:1.5;margin-bottom:30px}

/* ── Field ────────────────────────────────────────── */
.field{margin-bottom:24px}
.field label{display:block;font-size:13px;font-weight:600;color:var(--text);margin-bottom:8px}
.field input{width:100%;height:56px;border-radius:12px;border:1.5px solid var(--border);background:#fff;padding:0 16px;font-size:16px;color:var(--text);font-family:inherit;outline:none;transition:border-color .15s}
.field input:focus{border-color:var(--primary)}
.field input.err{border-color:var(--red)}
.field-err{font-size:12px;color:var(--red);margin-top:4px;margin-left:2px}

/* ── Alert ────────────────────────────────────────── */
.alert{border-radius:12px;padding:14px 16px;font-size:13px;font-weight:500;margin-bottom:18px;display:none;line-height:1.5}
.alert.err{background:#fef2f2;color:var(--red);border:1px solid #fecaca}
.alert.ok{background:#f0fdf4;color:var(--green);border:1px solid #bbf7d0}

/* ── Button ───────────────────────────────────────── */
.submit-btn{width:100%;height:50px;background:var(--primary);color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .15s}
.submit-btn:hover{background:var(--primary-dark)}
.submit-btn:disabled{background:#9ca3af;cursor:not-allowed}
.spinner{width:20px;height:20px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── Back to login ────────────────────────────────── */
.login-link{text-align:center;margin-top:24px;font-size:14px;color:var(--muted)}
.login-link a{color:var(--primary);font-weight:700;text-decoration:none}