{% extends "authentication/_base.html" %}
{% load i18n %}
{% load static %}
{% load widget_tweaks %}
{% block heading %}
    {% translate "Authentication" %}
{% endblock heading %}
{% block content %}
    <form method="post">
        {% csrf_token %}
        {% if form.errors %}
            <div class="bg-red-100 border-l-4 border-red-500 text-red-700 px-4 py-3 mb-5"
                 role="alert">
                <p>
                    {% translate "The password is incorrect." %} {% translate "Please try again." %}
                </p>
            </div>
        {% endif %}
        <div class="mb-6">
            <p>
                {% translate "Please authenticate to change security related settings" %}
            </p>
        </div>
        <div class="mb-4">
            <label class="block text-gray-600 text-sm font-bold mb-2"
                   for="{{ form.password.id_for_label }}">
                {{ form.password.label }}
            </label>
            {% translate "Enter your password here" as password_placeholder %}
            {% render_field form.password|add_error_class:"border-red-500" placeholder=password_placeholder class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-600 leading-tight focus:outline-none focus:shadow-outline" %}
        </div>
        <div class="flex items-center justify-between">
            <button class="btn w-full">
                {% translate "Log in" %}
            </button>
        </div>
    </form>
{% endblock content %}
