{% extends "base.html" %}
{% block title %}تم إنشاء الحساب بنجاح - Jadwa AI{% endblock %}
{% block content %}
<div class="min-h-screen bg-slate-900 flex items-center justify-center py-12 px-4">
    <!-- Background Decor -->
    <div class="absolute bottom-0 right-0 w-[600px] h-[600px] bg-emerald-500/5 rounded-full blur-[120px] -z-10 animate-pulse-slow"></div>
    <div class="absolute top-0 left-0 w-[600px] h-[600px] bg-gold-500/5 rounded-full blur-[120px] -z-10 animate-pulse-slow"></div>

    <div class="max-w-md w-full bg-slate-900/70 backdrop-blur-xl p-10 rounded-3xl border border-slate-700 shadow-2xl relative text-center">
        <!-- Success Icon -->
        <div class="w-24 h-24 mx-auto mb-6 rounded-full bg-emerald-500/20 flex items-center justify-center">
            <svg class="w-16 h-16 text-emerald-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M5 13l4 4L19 7"/>
            </svg>
        </div>

        <!-- Progress -->
        <div class="flex items-center justify-center mb-6">
            <div class="flex gap-2 items-center">
                <div class="w-6 h-6 rounded-full bg-emerald-500 flex items-center justify-center text-white text-xs">
                    <span class="font-bold">1</span>
                </div>
                <div class="w-6 h-0.5 bg-emerald-500 rounded-full"></div>
                <div class="w-6 h-0.5 bg-emerald-500 rounded-full"></div>
                <div class="w-6 h-6 rounded-full bg-emerald-500 flex items-center justify-center text-white text-xs">
                    <span class="font-bold">2</span>
                </div>
                <div class="w-6 h-0.5 bg-emerald-500 rounded-full"></div>
                <div class="w-6 h-0.5 bg-emerald-500 rounded-full"></div>
                <div class="w-6 h-6 rounded-full bg-emerald-500 flex items-center justify-center text-white text-xs">
                    <span class="font-bold">3</span>
                </div>
            </div>
        </div>

        <h1 class="text-3xl font-bold text-white mb-4">
            تم إنشاء حسابك بنجاح!
        </h1>

        <p class="text-slate-400 mb-8">
            مرحباً بك في منصة Jadwa AI. يمكنك الآن البدء في استكشاف جميع ميزات المنصة.
        </p>

        {% with messages = get_flashed_messages(with_categories=true) %}
            {% if messages %}
                {% for category, message in messages %}
                <div class="mb-4 p-4 rounded-xl {% if category == 'error' %}bg-red-500/20 border-red-500/50{% else %}bg-emerald-500/20 border-emerald-500/50{% endif %} text-sm text-white">
                    {{ message }}
                </div>
                {% endfor %}
            {% endif %}
        {% endwith %}

        <a href="{{ url_for('dashboard.index') if current_user.is_authenticated else url_for('auth.login') }}" class="w-full py-4 px-6 border border-transparent text-sm font-bold rounded-xl text-white bg-gradient-to-r from-emerald-400 to-emerald-600 hover:from-emerald-300 hover:to-emerald-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500 transition duration-300 shadow-[0_0_20px_rgba(16,185,129,0.3)] hover:shadow-[0_0_30px_rgba(16,185,129,0.5)] hover:-translate-y-0.5 inline-flex items-center justify-center">
            الذهاب إلى لوحة التحكم
        </a>
    </div>
</div>
{% endblock %}