{% extends "layouts/auth.html" %}
{% block title %}Reset password — IILMP{% endblock %}
{% block content %}

<div class="mb-7">
  <div class="mb-4 inline-flex h-10 w-10 items-center justify-center rounded-full bg-ruforum-primary/10 text-ruforum-primary">
    <svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.75" aria-hidden="true">
      <path stroke-linecap="round" stroke-linejoin="round" d="M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 002.25-2.25v-6.75a2.25 2.25 0 00-2.25-2.25H6.75a2.25 2.25 0 00-2.25 2.25v6.75a2.25 2.25 0 002.25 2.25z"/>
    </svg>
  </div>
  <h1 class="font-display text-xl font-bold text-ruforum-text">Reset password</h1>
  <p class="mt-1 text-xs leading-relaxed text-ruforum-text-muted">Enter your account email and we'll send you a link to set a new password.</p>
</div>

<form method="post" class="space-y-4" novalidate>
  {% csrf_token %}
  {% for field in form %}
    {% include "components/forms/field.html" with field=field %}
  {% endfor %}
  <div class="pt-1">
    <button type="submit" class="btn-primary w-full justify-center">
      Send reset link
      <svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="2" aria-hidden="true">
        <path stroke-linecap="round" stroke-linejoin="round" d="M6 12L3.269 3.126A59.768 59.768 0 0121.485 12 59.77 59.77 0 013.27 20.876L5.999 12zm0 0h7.5"/>
      </svg>
    </button>
  </div>
</form>

<p class="mt-6 border-t border-ruforum-border pt-5 text-center text-xs">
  <a href="{% url 'accounts:login' %}" class="font-medium text-ruforum-primary transition-colors hover:text-ruforum-primary-hover focus:outline-none focus:ring-1 focus:ring-ruforum-primary rounded">
    ← Back to sign in
  </a>
</p>

{% endblock %}