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

{#{% block title %}Reset your password{% endblock %}#}

{#{% block body %}#}
{#    {% for flash_error in app.flashes('reset_password_error') %}#}
{#        <div class="alert alert-danger" role="alert">{{ flash_error }}</div>#}
{#    {% endfor %}#}
{#    <h1>Reset your password</h1>#}

{#    {{ form_start(requestForm) }}#}
{#        {{ form_row(requestForm.email) }}#}
{#        <div>#}
{#            <small>#}
{#                Enter your email address, and we will send you a#}
{#                link to reset your password.#}
{#            </small>#}
{#        </div>#}

{#        <button class="btn btn-primary">Send password reset email</button>#}
{#    {{ form_end(requestForm) }}#}
{#{% endblock %}#}

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

{% block title %}Réinitialisation du mot de passe - Archive Bac Sénégal{% endblock %}

{% block body %}
    <main class="flex-grow border-t flex items-center justify-center px-6 py-12">
        <div class="w-full max-w-sm space-y-10">
            <div class="text-center">
                <img class="mx-auto h-10 w-auto" src="https://tailwindcss.com/plus-assets/img/logos/mark.svg?color=indigo&shade=600" alt="Logo" />
                <h2 class="mt-6 text-2xl font-bold text-gray-900">Réinitialiser votre mot de passe</h2>
            </div>

            {# Affichage des erreurs flash #}
            {% for flash_error in app.flashes('reset_password_error') %}
                <div class="rounded-md bg-red-50 p-4">
                    <div class="flex">
                        <div class="flex-shrink-0">
                            <svg class="h-5 w-5 text-red-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                                <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z" clip-rule="evenodd" />
                            </svg>
                        </div>
                        <div class="ml-3">
                            <h3 class="text-sm font-medium text-red-800">Erreur</h3>
                            <div class="mt-2 text-sm text-red-700">
                                <p>{{ flash_error }}</p>
                            </div>
                        </div>
                    </div>
                </div>
            {% endfor %}

            {{ form_start(requestForm, {'attr': {'class': 'space-y-6'}}) }}
            <div>
                {{ form_label(requestForm.email, null, {'label_attr': {'class': 'block text-sm font-medium text-gray-700'}}) }}
                {{ form_widget(requestForm.email, {'attr': {
                    'class': 'mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm',
                    'autocomplete': 'email'
                }}) }}
                {{ form_errors(requestForm.email) }}
            </div>

            <div class="text-sm text-gray-600">
                <p>Entrez votre adresse email et nous vous enverrons un lien pour réinitialiser votre mot de passe.</p>
            </div>

            <div>
                <button type="submit"
                        class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-500 focus:outline-none focus:ring-2 focus:ring-indigo-500">
                    Envoyer l'email de réinitialisation
                </button>
            </div>
            {{ form_end(requestForm) }}
        </div>
    </main>
{% endblock %}

{% block footer %}{% endblock %}
{% block header %}{% endblock %}