{% extends "base_minimal.html" %}
{% import "bootstrap/wtf.html" as wtf%}
{% from "security/_macros.html" import render_field_with_errors, render_field %}

{% block content %}
{% include "security/_messages.html" %}
<link rel="stylesheet" type="text/css" href="/static/css/login.css">
<div class="container">
    <div class="d-flex justify-content-center h-100">
      <div class="card">
        <div class="card-header justify-content-center text-center">
          <h3>{{ _('Login') }}</h3>
        </div>
        <div class="card-body justify-content-center">
          <div class="row justify-content-center">
              <div class="col col-md-12 justify-content-center text-center">
                <form action="/login" method="POST" name="login_user_form">
                  <div class="input-group form-group ">
                      {{  wtf.form_errors(login_user_form, hiddens="only") }}
                      {{ login_user_form.hidden_tag() }}
                  </div>
                  <div class="input-group form-group justify-content-center", style="font-size:20px">
                    {{ wtf.form_field(login_user_form.email,  class="form-control input-lg", placeholder="email", style="font-size:16px") }}
                  </div>
                  <div class="input-group form-group justify-content-center", style="font-size:20px">
                    {{ wtf.form_field(login_user_form.password,  class="form-control", placeholder="password", style="font-size:16px") }}
                  </div>
                  <div class="input-group form-group justify-content-center", style="font-size:20px">
                    {{ wtf.form_field(login_user_form.remember,  class="form-control",
                    title="REMEMBER ME", style="font-size:20px") }}
                  </div>
                  <div class="form-group">
                    {{ wtf.form_field(login_user_form.submit, class="btn login_btn btn-block", style="font-size:20px", value="Submit") }}
                  </div>
                </form>
              </div>
          </div>
        </div>
        <div class="card-footer">
          <div class="d-flex justify-content-center links">
            Don't have an account?<a href="/register">Sign Up</a>
          </div>
        </div>
      </div>
    </div>
  </div>
{% endblock %}