{% extends "base.html" %}
{% block title %}Change Password{% endblock %}

{% block content %}
<div class="page-header">
    <h1 class="page-title">Change Password</h1>
</div>

<div class="panel" style="max-width: 500px;">
    <form method="post">
        {% csrf_token %}
        <div class="form-group">
            <label for="id_old_password">Current Password</label>
            <input type="password" name="old_password" id="id_old_password" class="eeg-input" required>
            {{ form.old_password.errors }}
        </div>
        <div class="form-group">
            <label for="id_new_password1">New Password</label>
            <input type="password" name="new_password1" id="id_new_password1" class="eeg-input" required>
            {{ form.new_password1.errors }}
        </div>
        <div class="form-group">
            <label for="id_new_password2">Confirm New Password</label>
            <input type="password" name="new_password2" id="id_new_password2" class="eeg-input" required>
            {{ form.new_password2.errors }}
        </div>
        <div style="display: flex; gap: 0.5rem;">
            <button type="submit" class="btn btn-primary">Change Password</button>
            <a href="{% url 'accounts:profile' %}" class="btn btn-secondary">Cancel</a>
        </div>
    </form>
</div>
{% endblock %}