{% extends "admin/base_site.html" %}
{% load admin_urls i18n static %}

{% block extrastyle %}{{ block.super }}<link rel="stylesheet" type="text/css" href="{% static "admin/css/forms.css" %}">{% endblock %}

{% if not is_popup %}
    {% block breadcrumbs %}
        <div class="px-12">
            <div class="container mb-12 mx-auto -my-3">
                <ul class="flex">
                    {% url 'admin:index' as link %}
                    {% trans 'Home' as name %}
                    {% include 'unfold/helpers/breadcrumb_item.html' with link=link name=name %}

                    {% translate 'Change password' as breadcrumb_name %}
                    {% include 'unfold/helpers/breadcrumb_item.html' with link='' name=breadcrumb_name %}
                </ul>
            </div>
        </div>
    {% endblock %}
{% endif %}

{% block content %}
    <div id="content-main">
        <form{% if form_url %} action="{{ form_url }}"{% endif %} method="post" id="{{ opts.model_name }}_form">{% csrf_token %}{% block form_top %}{% endblock %}
            <input type="text" name="username" value="{{ original.get_username }}" class="hidden">

            <div>
                {% if is_popup %}
                    <input type="hidden" name="{{ is_popup_var }}" value="1">
                {% endif %}

                {% include "unfold/helpers/messages/errornote.html" with errors=form.errors %}

                {% translate "Please enter your old password, for security’s sake, and then enter your new password twice so we can verify you typed it in correctly." as message %}

                {% include "unfold/helpers/messages/info.html" with message=message %}

                {% include "unfold/helpers/field.html" with field=form.old_password %}

                {% include "unfold/helpers/field.html" with field=form.new_password1 %}

                {% include "unfold/helpers/field.html" with field=form.new_password2 %}

                <button type="submit" class="bg-primary-600 border border-transparent font-medium px-3 py-2 rounded-md text-sm text-white">
                    {% translate 'Change password' %}
                </button>
            </div>
        </form>
    </div>
{% endblock %}
