{% extends "base.html" %}
{% block title %}مواقعي{% endblock %}
{% block content %}
<div class="max-w-5xl mx-auto px-4 py-12">
    <h1 class="text-3xl font-serif font-bold text-white mb-8 flex items-center gap-3">
        <span class="text-gold-400">&#9670;</span> مواقع المشاريع
    </h1>

    {% if websites %}
    <div class="space-y-4">
        {% for site in websites %}
        <div class="glass p-6 rounded-2xl">
            <div class="flex items-center justify-between mb-4">
                <div>
                    <h3 class="text-lg font-bold text-white">{{ site.report.project_name if site.report else 'N/A' }}</h3>
                    <div class="text-xs text-slate-400 mt-1">
                        {{ site.subdomain }}.jadwaai.com
                        {% if site.custom_domain %} | {{ site.custom_domain }}{% endif %}
                    </div>
                </div>
                <span class="text-xs px-3 py-1 rounded-full {% if site.status == 'active' %}bg-emerald-500/20 text-emerald-400{% else %}bg-yellow-500/20 text-yellow-400{% endif %}">{{ site.status }}</span>
            </div>
            {% if site.status == 'active' and not site.custom_domain %}
            <form method="POST" action="{{ url_for('websites.set_domain', website_id=site.id) }}" class="flex gap-3">
                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                <input type="text" name="domain" placeholder="yourdomain.com" class="flex-1 bg-black/20 border border-white/10 rounded-xl px-4 py-2 text-white text-sm placeholder-slate-600 focus:outline-none focus:border-gold-500/50 transition">
                <button type="submit" class="bg-gold-500 text-black px-4 py-2 rounded-lg text-sm font-bold hover:bg-gold-400 transition">ربط دومين</button>
            </form>
            {% endif %}
        </div>
        {% endfor %}
    </div>
    {% else %}
    <div class="text-center py-16">
        <div class="text-6xl mb-4 opacity-20">&#127760;</div>
        <p class="text-slate-400">لا توجد مواقع بعد. أنشئ دراسة جدوى ثم اضغط "إنشاء موقع".</p>
    </div>
    {% endif %}
</div>
{% endblock %}