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

{% block title %}VRS - Mot de passe{% endblock %}

{% block body %}
<!-- component -->
<main class="flex items-center justify-center py-10 h-screen">
  <section class="bg-white w-4/12 space-y-3 px-6 py-4 rounded-3xl shadow-lg border flex flex-col">
    <div class="flex justify-between items-center">
      <h3 class="font-semibold">Votre compte</h3>
      <div class="font-extrabold">Changement de votre mot de passe</div>
    </div>
    {{ form_errors(form) }}
    {{ form_start(form) }}
        <div class="text-gray-600 font-light">Ancien mot de passe</div>
        {{ form_widget(form.oldPassword, { 'attr': {'class': 'form-input border rounded', 'disabled': false} }) }}	

        <div class="text-gray-600 font-light"> Nouveau mot de passe :</div>
        {{ form_widget(form.plainPassword, { 'attr': {'class': 'form-input border rounded', 'disabled': false} }) }}

        <div class="text-gray-600 font-light">Nouveau mot de passe (Confirmation):</div>
        {{ form_widget(form.plainPasswordConfirm, { 'attr': {'class': 'form-input border rounded', 'disabled': false} }) }}

    <div class="m-auto text-center pt-5"><a class="bg-gray-800 text-white rounded-xl px-5 mr-2" href='{{ path('app_member_home') }}'>Annuler</a><button type="submit" class="bg-gray-800 text-white rounded-xl px-5">Soumettre ma demande</button></div>
    {{ form_end(form) }}
  </section>
</main>
{% endblock %}