{% extends "base.html" %}
{% block content %}
<div class="row justify-content-center">
  <div class="col-md-6 col-lg-4">
    <h1 class="mb-4 text-center">{{ _('Login') }}</h1>
    <form method="POST" aria-label="{{ _('Login form') }}" autocomplete="on">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
      <div class="mb-3">
        <label for="username" class="form-label">{{ _('Username') }} <span aria-hidden="true" class="text-danger">*</span></label>
        <input type="text"
               id="username"
               name="username"
               class="form-control"
               required
               autocomplete="username"
               aria-required="true"
               autofocus>
      </div>
      <div class="mb-3">
        <label for="password" class="form-label">{{ _('Password') }} <span aria-hidden="true" class="text-danger">*</span></label>
        <input type="password"
               id="password"
               name="password"
               class="form-control"
               required
               autocomplete="current-password"
               aria-required="true">
      </div>
      <div class="mb-3 form-check">
        <input type="checkbox" class="form-check-input" id="remember_me" name="remember_me" value="true">
        <label class="form-check-label" for="remember_me">{{ _('Remember me') }}</label>
      </div>
      {# Flash messages are handled in base.html, so the specific error block here can be removed #}
      {# {% if error %}
      <div class="alert alert-danger" role="alert">
        {{ error }}
      </div>
      {% endif %} #}

      <button type="submit" class="btn btn-primary w-100 mb-3">{{ _('Login') }}</button>
    </form>

    {% if config.REGISTRATION_ENABLED %}
    <div class="mt-3 text-center">
      <a href="{{ url_for('register') }}">{{ _('No account? Register here!') }}</a>
    </div>
    {% endif %}
  </div>
</div>
{% endblock %}