{% extends "helpdesk/base.html" %}

{% load i18n static %}

{% block helpdesk_title %}
  {% translate "Helpdesk Login" %}
{% endblock helpdesk_title %}

{% block body %}
  {% if request.user.is_authenticated %}
    <meta http-equiv="REFRESH" content="0;url={% url 'helpdesk:home' %}" />
  {% endif %}
  <div class="container-fluid">
    <div class="row align-items-center vh-100">
      <div class="col-12 col-md-6 col-lg-3 mx-auto">
        <div class="text-center mb-4">
          <img src="{% static "helpdesk/img/icon.svg" %}" alt="Django helpdesk logo" width="48" height="48" />
        </div>
        <div class="card">
          <div class="card-body m-3">
            <h5 class="text-center py-3">{% translate "Log in to your account" %}</h5>
            <form role="form" method="post">
              {% csrf_token %}
              {% if form.errors %}
                <div class="alert alert-danger">{% translate "Your username and password didn't match. Please try again." %}</div>
              {% endif %}
              <div class="mb-3">
                <label class="form-label" for="username">{% translate "Username" %}</label>
                <input type="text"
                       id="username"
                       name="username"
                       class="form-control"
                       placeholder="{% translate "Your username" %}"
                       required="required"
                       autofocus="autofocus" />
              </div>
              <div class="mb-3">
                <label class="form-label" for="password">{% translate "Password" %}</label>
                <input type="password"
                       id="password"
                       name="password"
                       class="form-control"
                       placeholder="{% translate "Your Password" %}"
                       required="required" />
                {% if helpdesk_settings.HELPDESK_ENABLE_PASSWORD_RESET %}
                  <div class="form-text text-end">
                    <a href="{% url 'helpdesk:password_reset' %}">{% translate "Forgot password?" %}</a>
                  </div>
                {% endif %}
              </div>
              <div class="mb-3">
                <div class="form-check checkbox">
                  <input class="form-check-input" type="checkbox" id="checkRemember" value="remember-me" />
                  <label class="form-check-label" for="checkRemember">{% translate "Remember me" %}</label>
                </div>
              </div>
              <div class="d-grid gap-2 py-3">
                <button class="btn btn-primary" type="submit">{% translate "Login" %}</button>
              </div>
              {% if next %}
                <input type="hidden" name="next" value="{{ next }}" />
              {% endif %}
            </form>
          </div>
        </div>
        <div class="d-flex justify-content-center text-sm py-3">
          <a href="{% url 'helpdesk:home' %}" class="link-secondary">{% translate "Take me back" %}</a>
        </div>
      </div>
    </div>
  </div>
{% endblock body %}