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

{% block topbar_actions %}
<a href="{{ url_for('settings.index') }}" class="btn btn-sm btn-outline-secondary me-1" style="font-size:12px;"><i class="bi bi-arrow-left me-1"></i>Settings</a>
{% endblock %}

{% block content %}
<div class="row justify-content-center">
<div class="col-12 col-md-7 col-lg-5">
<div class="pcard">
    <form method="POST" novalidate>
        {{ form.hidden_tag() }}

        <div class="mb-3">
            {{ form.current_password.label(class="form-label fw-medium", style="font-size:13px;") }}
            {{ form.current_password(class="form-control" + (" is-invalid" if form.current_password.errors else "")) }}
            {% for e in form.current_password.errors %}<div class="invalid-feedback">{{ e }}</div>{% endfor %}
        </div>
        <div class="mb-3">
            {{ form.new_password.label(class="form-label fw-medium", style="font-size:13px;") }}
            {{ form.new_password(class="form-control" + (" is-invalid" if form.new_password.errors else "")) }}
            {% for e in form.new_password.errors %}<div class="invalid-feedback">{{ e }}</div>{% endfor %}
            <small class="text-muted" style="font-size:11px;">Minimum 6 characters.</small>
        </div>
        <div class="mb-4">
            {{ form.confirm_password.label(class="form-label fw-medium", style="font-size:13px;") }}
            {{ form.confirm_password(class="form-control" + (" is-invalid" if form.confirm_password.errors else "")) }}
            {% for e in form.confirm_password.errors %}<div class="invalid-feedback">{{ e }}</div>{% endfor %}
        </div>
        <div class="d-flex gap-2">
            {{ form.submit(class="btn btn-primary") }}
            <a href="{{ url_for('settings.profile') }}" class="btn btn-outline-secondary">Cancel</a>
        </div>
    </form>
</div>
</div>
</div>
{% endblock %}