{% extends "jobs/base.html" %}
{% block content %}
<div class="container py-5 text-center">
    <div class="card border-0 shadow-lg rounded-4 p-5 mx-auto" style="max-width: 500px;">
        <div class="mb-4">
            <div class="display-1 text-success">
                <i class="fas fa-check-circle anim-bounce"></i>
            </div>
        </div>
        
        <h2 class="fw-bold text-dark">Password Badal Gaya!</h2>
        <p class="text-muted mt-3">
            Bhai, aapka naya password successfully set ho chuka hai. Ab aap maze se login kar sakte hain.
        </p>

        <div class="d-grid gap-2 mt-4">
            <a href="{% url 'account_login' %}" class="btn btn-warning fw-bold py-2 rounded-pill shadow text-uppercase">
                Chalo Login Karein <i class="fas fa-sign-in-alt ms-2"></i>
            </a>
        </div>
    </div>
</div>

<style>
    .anim-bounce {
        animation: bounce 1s ease infinite;
    }
    @keyframes bounce {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-10px); }
    }
</style>
{% endblock %}