{% extends 'base.html.twig' %}

{% block body %}

    <div id="login" class="z-0">

        <div class="container-fluid">

            <div id="login-contenu" class="row p-96">
                <!-- BLOC INTRO-->
                <div id="login-intro" class="col-sm-12 col-md-7 ptb-0 pr-48 pl-0">
                    <div class="bloc-base">
                        <div class="bloc-title">
                            <img class="mb-48" src="{{ asset('img/logo-aeap-login.png') }}" alt=""/>
                            <h1 class="login mb-16">Portail Téléservices de l’Agence
                                <br/>
                                de l’Eau
                                Artois-Picardie</h1>
                            {% if not entete is null and not entete.texte==''%}
                                        {{ entete.texte|raw }}
                            {% else %}

                                <p class="mb-16">Dans le cadre de la réforme de l’Etat, de l’amélioration du Service Public et de la simplification des échanges entre l’administration et ses usagers, l’Agence de l’Eau Artois-Picardie s’est engagée dans la dématérialisation de ses procédures.</p>
                                <p class="mb-16">Le site de télédéclaration de redevance est disponible 24h/24, 7 jours sur 7.</p>
                                <p>Si vous n’êtes pas concernés par les télédéclarations, veuillez vous connecter pour accéder au seul suivi de vos données financières.</p>

                            {% endif %}
                        </div>
                    </div>
                </div>
                <!-- BLOC FORM-->
                <div id="login-form" class="col-sm-12 col-md-5 p-48 background-blue">
                    <div class="bloc-base ptb-48 divider-white-b">
                        <div class="bloc-title">
                            <h2 class="font-color-white pb-16 align-middle">Accéder à mon compte usager</h2>
                        </div>
                        <div class="row m-0">
                            <div class="col-xs-12 p-0">

                                {% if error %}
                                    <div class="alert alert-danger">
                                        Erreur : {{ error.messageKey|trans }}
                                    </div>
                                {% endif %}

                                {% for flashMessage in app.session.flashbag.get('error') %}
                                    <div class="alert alert-danger">
                                       Attention :  {{ flashMessage }}
                                    </div>
                                {% endfor %}

                                {% for flashMessage in app.session.flashbag.get('warning') %}
                                    <div class="alert alert-warning">
                                       Erreur :  {{ flashMessage }}
                                    </div>
                                {% endfor %}

                                {% for flashMessage in app.session.flashbag.get('success') %}
                                    <div class="alert alert-success">
                                        Succès : {{ flashMessage }}
                                    </div>
                                {% endfor %}

                                {{ form_start(form) }}
                                    {#<div class="form-group mb-16">#}
                                        {#<input type="email" class="login ptb-8 plr-16" id="exampleInputEmail1" placeholder="&#xf1fa; &nbsp; Adresse email">#}
                                    {#</div>#}
                                    {{ form_row(form._username) }}
                                    {#<div class="form-group mb-16">#}
                                        {#<input type="password" class="login ptb-8 plr-16" id="exampleInputPassword1" placeholder="&#xf023; &nbsp; Mot de passe">#}
                                    {#</div>#}
                                    {{ form_row(form._password) }}
                                    <div class="form-group mb-16 text-align-r">
                                        <a href="{{ path('send_reset_password') }}" class="form font-color-white">Mot de passe oublié ?</a>
                                    </div>
                                    {#<div class="form-check mb-16">#}
                                        {#<input type="checkbox" class="form-check-input" id="exampleCheck1">#}
                                        {#<label class="form-check-label font-color-white" for="exampleCheck1">Se souvenir de mes identifiants</label>#}
                                    {#</div>#}
                                    <button type="submit" class="button-square-login">Connexion</button>
                                {{ form_end(form) }}
                            </div>
                        </div>
                    </div>
                    <div class="bloc-base ptb-48">
                        <div class="bloc-title">
                            <h2 class="font-color-white pb-16 align-middle">Pas encore inscrit ?</h2>
                        </div>
                        <div class="row m-0">
                            <div class="col-xs-12 p-0">
                                <form class="text-align-l">
                                    <p class="font-color-white mb-16">Pour vous inscrire, vous devez connaître votre identifiant d’abonnement.</p>
                                    <a class="button-square-login" href="{{ path('security_subscribe') }}">S'abonner aux téléservices</a>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>

{% endblock %}