{% extends "base.html" %}
{% block title %}Forgot password — allowthem{% endblock %}
{% block body %}
<div class="flex min-h-screen items-center justify-center px-4">
<div class="w-full max-w-sm">
<h1 class="text-2xl font-bold text-center text-gray-900 mb-8">
Reset your password
</h1>
{% if success %}
<div class="bg-green-50 border border-green-200 text-green-800 px-4 py-3 rounded mb-6">
If an account with that email exists, a password reset link has been sent.
</div>
{% else %}
{% if error %}
<div class="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded mb-6" role="alert">
{{ error }}
</div>
{% endif %}
<p class="text-sm text-gray-600 mb-6">
Enter your email address and we'll send you a link to reset your password.
</p>
<form method="post" action="/forgot-password" class="space-y-4">
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
<div>
<label for="email" class="block text-sm font-medium text-gray-700 mb-1">
Email
</label>
<input type="email" id="email" name="email"
required autocomplete="email"
class="w-full rounded border border-gray-300 px-3 py-2 at-input-focus">
</div>
<button type="submit"
class="at-btn-primary w-full rounded px-4 py-2 text-white font-medium
focus:outline-none focus:ring-2 focus:ring-offset-2">
Send reset link
</button>
</form>
{% endif %}
<p class="mt-6 text-center text-sm text-gray-600">
Remember your password?
<a href="/login" class="at-link">Log in</a>
</p>
</div>
</div>
{% endblock %}