{% extends 'template.html' %}

{% block css %}
<link rel="stylesheet" href="{{ url_for('static', filename='f_contact/form.css') }}">
<link rel="stylesheet" href="{{ url_for( 'static', filename='g_login/login.css' ) }}">
{% endblock css %}

{% block navbar %}
{% include 'z_comps/navbar.html' %}
{% endblock navbar %}

{% block body %}

<style>
  main{
    place-items: center;
}
</style>

<div class="form-container" data-aos="fade-up" data-aos-delay="0" data-aos-duration="800" data-aos-easing="ease-in-out">

  <div class="form-header">
    <h2 class="form-title">Recuperar Contraseña</h2>
    <p class="form-subtitle">Ingresa tu email de usuario para recibir una contraseña temporal.</p>
  </div>
  
  <form method="POST" class="login-form" action="{{ url_for('recover_pswd') }}" >
    {{ form.hidden_tag() }}
    <!-- {# {{ form.csrf_token }} #} -->
    
    <div class="form-row">
      <!-- {{ form.email.label(class="form-label") }} -->
      {{ form.email(class="form-control", placeholder="usuario@email.com", type="email") }}
    </div>
    
    <button type="submit" class="btn btn-primary w-100 py-2 mb-3">
      Recuperar Contraseña
    </button>

    <div class="form-footer">
      <a href="{{ url_for('login') }}" class="forgot-password">
        <i class="bi bi-arrow-left me-1"></i> Regresar al Login
      </a>
    </div>
  
    
    
  </form>

</div>



{% endblock body %}

{% block js %}

<!-- {# if flash #} -->
{% include 'z_comps/if_flash.html' %}


<!-- {# aos script #} -->
{% include 'z_comps/aos_script.html' %}

{% endblock js %}