{% extends 'base.html' %}
{% load crispy_forms_tags i18n %}

{% block head_title %}{% trans "Log In" %}{% endblock %}

{% block content %}
<div class="container mx-auto max-w-md mt-6">
  <h1 class="text-3xl font-bold text-center mb-6">{% trans "Log In" %}</h1>
  <form method="post" action="{% url 'account_login' %}" class="space-y-4">
    {% csrf_token %}
    {{ form.non_field_errors }}
    <div>
      <label for="{{ form.login.id_for_label }}" class="block font-medium text-gray-700">{{ form.login.label }}</label>
      {{ form.login }}
      {{ form.login.errors }}
    </div>
    <div>
      <label for="{{ form.password.id_for_label }}" class="block font-medium text-gray-700">{{ form.password.label }}</label>
      {{ form.password }}
      {{ form.password.errors }}
    </div>
    {% if form.remember %}
    <div class="flex items-center">
      {{ form.remember }}
      <label for="{{ form.remember.id_for_label }}" class="ml-2">{% trans "Remember Me" %}</label>
    </div>
    {% endif %}
    <button type="submit" class="btn btn-primary w-full">{% trans "Log In" %}</button>
  </form>
  <div class="mt-4 text-center">
    <a href="{% url 'account_request_login_code' %}" class="text-primary underline">{% trans "Login by Code" %}</a> | <a href="{% url 'account_reset_password' %}" class="text-primary underline">{% trans "Forgot Password?" %}</a>
  </div>
</div>
{% endblock %}