{% extends "base.html" %}

{% block title %}Central - Change Password{% endblock %}

{% block content %}
<div class="auth-card card">
    <h1>Change Password</h1>

    {% if error %}
    <div class="flash flash-error" role="alert">{{ error }}</div>
    {% endif %}

    <form action="/change-password" method="post">
        <input type="hidden" name="csrf_token" value="{{ csrf_token }}">

        <label for="current_password">Current Password</label>
        <input type="password" id="current_password" name="current_password" required
               autocomplete="current-password" autofocus>

        <label for="new_password" style="margin-top: 12px;">New Password</label>
        <input type="password" id="new_password" name="new_password" required
               autocomplete="new-password" minlength="8">
        <small>Minimum 8 characters</small>

        <label for="confirm_password" style="margin-top: 12px;">Confirm New Password</label>
        <input type="password" id="confirm_password" name="confirm_password" required
               autocomplete="new-password">

        <button type="submit" style="width: 100%; margin-top: 18px;">Change Password</button>
    </form>
</div>
{% endblock %}