{% extends "accounts/login.html" %}
{% load static %}
{% block account_title %}
<title>MK Aquarium | Account - Recovery</title>
{% endblock account_title %} 

{% block accountContent %}
<main class="content-wrapper">
  <!-- Left Section: Form -->
  <div class="form-section">
      <div class="form-container">
          <header class="navbar px-0 pb-4 mt-n2 mt-sm-0">
              <a href="{% url 'site_home' %}" class="navbar-brand pt-0">
                  <img src="{% static 'site_assets/img/home/grocery/logo.png' %}" alt="Logo" style="max-width: 100%; height: auto;">
              </a>
          </header>
          <h1 class="h2 mt-auto">Forgot password?</h1>
          <p class="pb-2 pb-md-3">Enter the email address you used when you joined and we’ll send you instructions to reset your password</p>

          <form class="needs-validation pb-4 mb-3 mb-lg-4" novalidate="" method="post" action="">
            {% csrf_token %}
            <div class="position-relative mb-4">
              <i class="ci-mail position-absolute top-50 start-0 translate-middle-y fs-lg ms-3"></i>
              <input type="email" name="email" class="form-control form-control-lg form-icon-start" placeholder="Email address" required="">
              <div class="invalid-tooltip bg-transparent py-0">Please enter a vaild email address!</div>
            </div>
            <button type="submit" class="btn btn-lg btn-primary w-100">Reset password</button>
          </form>

          <footer class="mt-auto">
            <p class="fs-xs mb-0">
              © All rights reserved. Made by <span class="animate-underline"><a class="animate-target text-dark-emphasis text-decoration-none" href="https://geegatechnologies.com/" target="_blank" rel="noreferrer">Geega Technologies</a></span>
            </p>
          </footer>
      </div>
  </div>
</main>
{% endblock accountContent %}