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

{% block title %}Réinitialiser votre mot de passe{% endblock %}
{% block asset_css %}
    <style>
        #title-inscription{
            color: #007b31;
        }
        .input{
            border: 1px solid gray;
        }
        .input:focus{
            box-shadow: 2px 3px  5px #007b31;
        }
        .section-reinitialiser{
            background-color:#f6f6f6;
        }
        .btn-reinitialiser{
            color:white;
            background-color:#007b31;
        }
        .btn-reinitialiser:hover{
            color:white;
            background-color:#007b31;
        }
        .liste-commandes{
            background-color:#f6f6f6 !important;
        }
    </style>
{% endblock %}
{% block body %}
      <!-- section -->
    <section class="liste-commandes">
        <!-- banner -->
        <div class="container-fluid">
            <div class="row">
                <div class="col-12 col-sm12 col-md-12 col-lg-12 col-xl-12 p-0">
                    <img src="{{ asset('assets/images/banner/banner-5.png') }}" alt="banner-5" class="w-100">
                </div>
            </div>
        </div>
        
        <!-- container-fluid -->
        <div class="container-fluid mt-5  pt-3 pb-5 section-reinitialiser">
            <div class="row bg-white p-4 mt-4 col-10 mx-auto shadow-sm">
                <div class="col-12 col-sm-12 col-md-6 col-lg-6   mx-auto">
                     <center><img src="{{ asset('assets/images/forgot-password.gif') }}" class="img-fluid" width="60%"/></center>
                </div>
                <div class="col-12 col-sm-12 col-md-6 col-lg-6 pt-4">
                    <div class="mt-4 p-5">
                        {% for flash_error in app.flashes('reset_password_error') %}
                            <div class="alert alert-danger" role="alert">{{ flash_error }}</div>
                        {% endfor %}
                        <h2 class="mb-4" id="title-inscription">Réinitialiser votre mot de passe</h2>
                        {{ form_start(requestForm) }}
                        <label>Adresse email</label>
                        {{ form_row(requestForm.mail,  {'label' : false, 'attr' :{'class' : 'form-control input'}}) }}
                        <div class="mt-3">
                            <p>
                                Veuillez entrer votre adresse email et nous vous enverrons un lien pour réinitialiser votre mot de passe. 
                            </p>
                        </div>

                        <button class="btn btn-reinitialiser mt-4 shadow-sm">Envoyer</button>
                    {{ form_end(requestForm) }}
                    </div>
                </div>
                
            </div>
        </div>
        <!-- container-fluid -->
    </section>
    
{% endblock %}