/* ==========================================================================
   HailPOS — Forgot & Reset Password Styles
   Extend dari login.css — pakai variabel & class yang sama
   (--primary, --ink, --border, --radius, .login-card, .field, .btn, dst).
   Load bareng login.css di halaman ini.
   ========================================================================== */

/* ── Link "Lupa password?" di form login ────────────────────────────────── */
.login-forgot-link {
    display: block;
    text-align: right;
    font-size: 13px;
    color: var(--primary);
    text-decoration: none;
    margin-top: -10px;
    margin-bottom: 22px;
}

.login-forgot-link:hover {
    text-decoration: underline;
}

/* ── Kotak info status (sukses / info / error) ──────────────────────────── */
.auth-info {
    font-size: 13.5px;
    line-height: 1.6;
    padding: 14px 16px;
    border-radius: var(--radius);
    margin-bottom: 24px;
}

.auth-info--info {
    background: #EFF6FF;
    border: 1px solid #BFDBFE;
    color: #1E40AF;
}

.auth-info--success {
    background: #F0FDF4;
    border: 1px solid #BBF7D0;
    color: #166534;
}

.auth-info--error {
    background: #FEF2F2;
    border: 1px solid #FECACA;
    color: #991B1B;
}

/* ── Link "kembali ke login" di bawah form ──────────────────────────────── */
.auth-link-back {
    display: block;
    text-align: center;
    margin-top: 18px;
    font-size: 13.5px;
    color: var(--ink-soft);
    text-decoration: none;
}

.auth-link-back:hover {
    color: var(--primary);
    text-decoration: underline;
}

/* ── Subtitle di bawah judul card (dipakai forgot/reset password) ──────── */
.login-card__hint {
    /* sudah ada di login.css, dipakai ulang tanpa perubahan */
}