{% extends "@!FOSUser/Security/login.html.twig" %}

{% trans_default_domain 'FOSUserBundle' %}

{% block title %}Connexion{% endblock %}

{% block fos_user_content %}
    <section class="g-bg-izibrick-light-v5 g-bg-img-hero" style="height: 130%; background-image: url({{ asset('templates/bo/img/bg6.jpg') }});">
        <div class="container g-py-100">
            <div class="row justify-content-center">
                <div class="col-sm-8 col-lg-5">
                    <div class="u-shadow-v21 g-bg-white rounded g-py-40 g-px-30">
                        <header class="text-center mb-4">
                            <h2 class="h2 g-color-black g-font-weight-600">Connexion</h2>
                        </header>
                        {% if app.request.get('from_reset') %}
                            <div class="alert alert-success">
                                Votre mot de passe a bien été modifié.
                            </div>
                        {% endif %}
                        <!-- Form -->
                        <form class="g-py-15" action="{{ path("fos_user_security_check") }}" method="post">
                            {% if error is defined and error is not null %}
                                <div class="alert alert-danger">
                                    {{ error.message }}<br/>
                                    En cas de problème, <a href="{{ path('our-contact', {'subject':1}) }}" class="alert-link">contactez-nous</a>
                                </div>
                            {% endif %}
                            <div class="mb-4">
                                <label class="g-color-gray-dark-v2 g-font-weight-600 g-font-size-13">Email</label>
                                <input type="text"
                                       class="form-control g-color-black g-bg-white g-bg-white--focus g-brd-gray-light-v4 g-brd-primary--hover rounded g-py-15 g-px-15"
                                       placeholder="Email" autofocus id="username"
                                       name="_username">
                            </div>

                            <div class="g-mb-35">
                                <label class="g-color-gray-dark-v2 g-font-weight-600 g-font-size-13">Mot de passe</label>
                                <input type="password"
                                       class="form-control g-color-black g-bg-white g-bg-white--focus g-brd-gray-light-v4 g-brd-primary--hover rounded g-py-15 g-px-15 mb-3"
                                       placeholder="Mot de passe" id="password"
                                       name="_password">
                                <div class="row justify-content-between">
                                    <div class="col align-self-center">
                                        <label class="form-check-inline u-check g-color-gray-dark-v5 g-font-size-12 g-pl-25 mb-0">
                                            <input class="g-hidden-xs-up g-pos-abs g-top-0 g-left-0" type="checkbox">
                                            <div class="u-check-icon-checkbox-v6 g-absolute-centered--y g-left-0">
                                                <i class="fa" data-check-icon="&#xf00c"></i>
                                            </div>
                                            Resté connecté
                                        </label>
                                    </div>
                                    <div class="col align-self-center text-right">
                                        <a class="g-font-size-12" href="{{ path('fos_user_resetting_request') }}">Mot de passe oublié ?</a>
                                    </div>
                                </div>
                            </div>
                            <div class="mb-10">&nbsp;
                                <input type="hidden" name="_csrf_token" value="{{ csrf_token }}"/>
                                <input type="submit" class="btn btn-md u-btn-izibrick rounded g-py-13 g-px-25 pull-right" value="Se connecter"/>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </section>
{% endblock fos_user_content %}