{% extends "base.html" %}
{% block title %}{% trans %}Verify Your Email{% endtrans %} – OnlineConvert{% endblock %}
{% block content %}
<div class="min-h-[70vh] flex items-center justify-center px-4 py-12">
    <div class="w-full max-w-md text-center">

        <div class="w-20 h-20 rounded-full bg-yellow-50 dark:bg-yellow-900/20 flex items-center justify-center mx-auto mb-6 border-2 border-yellow-200 dark:border-yellow-700">
            <i class="fa fa-envelope-open-text text-3xl text-yellow-500"></i>
        </div>

        <h1 class="text-2xl font-bold text-gray-900 dark:text-white mb-2">{% trans %}Check your inbox{% endtrans %}</h1>
        <p class="text-gray-500 dark:text-gray-400 mb-1">
            {% trans %}We sent a verification link to{% endtrans %}
        </p>
        <p class="font-semibold text-gray-900 dark:text-white mb-6">{{ email }}</p>

        {% with messages = get_flashed_messages(with_categories=true) %}{% for cat, msg in messages %}<script>window._oc_flash=window._oc_flash||[];window._oc_flash.push({cat:{{ cat|tojson }},msg:{{ msg|tojson }}});</script>{% endfor %}{% endwith %}

        <div class="bg-white dark:bg-gray-900 rounded-2xl border border-gray-200 dark:border-gray-700 p-6 mb-6 text-left">
            <p class="text-sm text-gray-600 dark:text-gray-400 mb-4">
                {% trans %}To complete sign-in, please click the verification link in the email we sent. If you don't see it, check your spam folder.{% endtrans %}
            </p>
            <form method="POST" action="{{ full_url('/resend-verification-pending') }}">
                <button type="submit" class="w-full py-2.5 rounded-xl border border-primary text-primary dark:text-primary-light dark:border-primary-light font-semibold text-sm hover:bg-primary/5 dark:hover:bg-primary/10 transition-all">
                    <i class="fa fa-paper-plane mr-2"></i>{% trans %}Resend verification email{% endtrans %}
                </button>
            </form>
        </div>

        <p class="text-sm text-gray-400 dark:text-gray-500">
            {% trans %}Not your account?{% endtrans %}
            <a href="{{ full_url('/login') }}" class="text-primary dark:text-primary-light hover:underline font-medium">{% trans %}Sign in with a different account{% endtrans %}</a>
        </p>
    </div>
</div>
{% endblock %}