{% extends "base.html" %}
{% block title %}تفاصيل الحملة - {{ ad_camp.name }}{% endblock %}
{% block content %}
<div class="max-w-5xl mx-auto px-4 py-12">
    <div class="flex items-center justify-between mb-8">
        <h1 class="text-2xl font-serif font-bold text-white">{{ ad_camp.name }}</h1>
        <a href="{{ url_for('admin.ad_review') }}" class="text-sm text-slate-400 hover:text-gold-400">&#8592; قائمة الحملات</a>
    </div>

    <!-- Status Badge -->
    <div class="mb-6">
        <span class="text-sm px-4 py-2 rounded-full
            {% if ad_camp.status == 'pending_approval' %}bg-yellow-500/20 text-yellow-400
            {% elif ad_camp.status == 'active' %}bg-emerald-500/20 text-emerald-400
            {% elif ad_camp.status == 'rejected' %}bg-red-500/20 text-red-400
            {% elif ad_camp.status == 'paused' %}bg-orange-500/20 text-orange-400
            {% else %}bg-slate-500/20 text-slate-400{% endif %}">
            {% if ad_camp.status == 'pending_approval' %}في انتظار المراجعة
            {% elif ad_camp.status == 'approved' %}معتمدة
            {% elif ad_camp.status == 'active' %}نشطة
            {% elif ad_camp.status == 'paused' %}متوقفة
            {% elif ad_camp.status == 'completed' %}مكتملة
            {% elif ad_camp.status == 'rejected' %}مرفوضة
            {% else %}{{ ad_camp.status }}{% endif %}
        </span>
    </div>

    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-8">
        <!-- Campaign Info -->
        <div class="glass p-6 rounded-2xl">
            <h2 class="text-lg font-bold text-white mb-4">معلومات الحملة</h2>
            <div class="space-y-3 text-sm">
                <div class="flex justify-between"><span class="text-slate-400">المستخدم</span><span class="text-white">{{ ad_camp.user.name if ad_camp.user else 'N/A' }}</span></div>
                <div class="flex justify-between"><span class="text-slate-400">البريد</span><span class="text-white">{{ ad_camp.user.email if ad_camp.user else '' }}</span></div>
                <div class="flex justify-between"><span class="text-slate-400">الميزانية</span><span class="text-gold-400 font-bold">${{ "%.2f"|format(ad_camp.budget_amount) }}</span></div>
                <div class="flex justify-between"><span class="text-slate-400">الميزانية اليومية</span><span class="text-white">${{ "%.2f"|format(ad_camp.daily_budget) }}</span></div>
                <div class="flex justify-between"><span class="text-slate-400">المدة</span><span class="text-white">{{ ad_camp.duration_days }} يوم</span></div>
                <div class="flex justify-between"><span class="text-slate-400">تاريخ الإنشاء</span><span class="text-white">{{ ad_camp.created_at.strftime('%Y-%m-%d %H:%M') }}</span></div>
                <div class="flex justify-between"><span class="text-slate-400">المنصات</span>
                    <div class="flex gap-1">
                        {% for p in ad_camp.platforms_list %}<span class="text-xs px-2 py-0.5 rounded bg-white/10 text-slate-300">{{ p }}</span>{% endfor %}
                    </div>
                </div>
                {% if ad_camp.ad_caption %}
                <div><span class="text-slate-400 block mb-1">نص الإعلان</span><span class="text-white text-xs">{{ ad_camp.ad_caption }}</span></div>
                {% endif %}
                {% if ad_camp.ad_cta %}
                <div class="flex justify-between"><span class="text-slate-400">CTA</span><span class="text-white">{{ ad_camp.ad_cta }}</span></div>
                {% endif %}
            </div>
        </div>

        <!-- Targeting -->
        <div class="glass p-6 rounded-2xl">
            <h2 class="text-lg font-bold text-white mb-4">الاستهداف</h2>
            {% if ad_camp.targeting_json %}
            <div class="space-y-3 text-sm">
                {% set t = ad_camp.targeting_json %}
                <div class="flex justify-between"><span class="text-slate-400">العمر</span><span class="text-white">{{ t.get('age_min', '?') }} - {{ t.get('age_max', '?') }}</span></div>
                <div class="flex justify-between"><span class="text-slate-400">الجنس</span><span class="text-white">{{ t.get('gender', 'all') }}</span></div>
                <div><span class="text-slate-400 block mb-1">المناطق</span>
                    <div class="flex flex-wrap gap-1">{% for loc in t.get('locations', []) %}<span class="text-xs px-2 py-0.5 rounded bg-blue-500/20 text-blue-400">{{ loc }}</span>{% endfor %}</div>
                </div>
                <div><span class="text-slate-400 block mb-1">الاهتمامات</span>
                    <div class="flex flex-wrap gap-1">{% for i in t.get('interests', []) %}<span class="text-xs px-2 py-0.5 rounded bg-purple-500/20 text-purple-400">{{ i }}</span>{% endfor %}</div>
                </div>
                {% if t.get('budget_split') %}
                <div><span class="text-slate-400 block mb-1">توزيع الميزانية</span>
                    {% for plat, pct in t.get('budget_split', {}).items() %}
                    <div class="flex justify-between text-xs mt-1"><span class="text-white">{{ plat }}</span><span class="text-gold-400">{{ pct }}%</span></div>
                    {% endfor %}
                </div>
                {% endif %}
            </div>
            {% else %}
            <p class="text-slate-400 text-sm">لا يوجد استهداف محدد</p>
            {% endif %}

            {% if ad_camp.ai_suggestions_json %}
            <div class="mt-4 p-3 bg-blue-500/10 border border-blue-500/20 rounded-lg">
                <div class="text-xs text-blue-400 font-bold mb-1">اقتراحات AI</div>
                {% if ad_camp.ai_suggestions_json.get('reasoning') %}
                <p class="text-xs text-slate-300">{{ ad_camp.ai_suggestions_json.reasoning }}</p>
                {% endif %}
                {% for w in ad_camp.ai_suggestions_json.get('warnings', []) %}
                <p class="text-xs text-yellow-400 mt-1">&#9888; {{ w }}</p>
                {% endfor %}
            </div>
            {% endif %}
        </div>
    </div>

    <!-- Video Preview -->
    {% if ad_camp.campaign and ad_camp.campaign.video_url %}
    <div class="glass p-6 rounded-2xl mb-8">
        <h2 class="text-lg font-bold text-white mb-4">الفيديو</h2>
        <video controls class="w-full max-w-lg mx-auto rounded-xl" src="{{ ad_camp.campaign.video_url }}"></video>
    </div>
    {% endif %}

    <!-- Admin Actions -->
    {% if ad_camp.status == 'pending_approval' %}
    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-8">
        <!-- Modify Form -->
        <div class="glass p-6 rounded-2xl">
            <h2 class="text-lg font-bold text-white mb-4">تعديل قبل الاعتماد</h2>
            <form method="POST" action="{{ url_for('admin.modify_ad_campaign', ad_campaign_id=ad_camp.id) }}" class="space-y-3">
                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                <div>
                    <label class="block text-xs text-slate-400 mb-1">الميزانية ($)</label>
                    <input type="number" step="0.01" name="budget_amount" value="{{ ad_camp.budget_amount }}" class="w-full bg-black/20 border border-white/10 rounded-lg px-3 py-2 text-white text-sm">
                </div>
                <div>
                    <label class="block text-xs text-slate-400 mb-1">الميزانية اليومية ($)</label>
                    <input type="number" step="0.01" name="daily_budget" value="{{ ad_camp.daily_budget }}" class="w-full bg-black/20 border border-white/10 rounded-lg px-3 py-2 text-white text-sm">
                </div>
                <div>
                    <label class="block text-xs text-slate-400 mb-1">المدة (أيام)</label>
                    <input type="number" name="duration_days" value="{{ ad_camp.duration_days }}" class="w-full bg-black/20 border border-white/10 rounded-lg px-3 py-2 text-white text-sm">
                </div>
                <div>
                    <label class="block text-xs text-slate-400 mb-1">الاستهداف (JSON)</label>
                    <textarea name="targeting_json" rows="4" class="w-full bg-black/20 border border-white/10 rounded-lg px-3 py-2 text-white text-xs font-mono">{{ ad_camp.targeting_json | tojson(indent=2) if ad_camp.targeting_json else '{}' }}</textarea>
                </div>
                <div>
                    <label class="block text-xs text-slate-400 mb-1">ملاحظات المدير</label>
                    <textarea name="admin_notes" rows="2" class="w-full bg-black/20 border border-white/10 rounded-lg px-3 py-2 text-white text-sm">{{ ad_camp.admin_notes or '' }}</textarea>
                </div>
                <button type="submit" class="w-full bg-blue-500/20 text-blue-400 py-2 rounded-lg font-bold hover:bg-blue-500/30 transition">حفظ التعديلات</button>
            </form>
        </div>

        <!-- Approve / Reject -->
        <div class="space-y-4">
            <div class="glass p-6 rounded-2xl">
                <h2 class="text-lg font-bold text-emerald-400 mb-4">&#10003; اعتماد الحملة</h2>
                <form method="POST" action="{{ url_for('admin.approve_ad_campaign', ad_campaign_id=ad_camp.id) }}" class="space-y-3">
                    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                    <div>
                        <label class="block text-xs text-slate-400 mb-1">ملاحظات (اختياري)</label>
                        <textarea name="admin_notes" rows="2" class="w-full bg-black/20 border border-white/10 rounded-lg px-3 py-2 text-white text-sm"></textarea>
                    </div>
                    <button type="submit" class="w-full bg-emerald-500 text-black py-3 rounded-lg font-bold hover:bg-emerald-400 transition">اعتماد وإطلاق الحملة</button>
                </form>
            </div>

            <div class="glass p-6 rounded-2xl">
                <h2 class="text-lg font-bold text-red-400 mb-4">&#10005; رفض الحملة</h2>
                <form method="POST" action="{{ url_for('admin.reject_ad_campaign', ad_campaign_id=ad_camp.id) }}" class="space-y-3">
                    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                    <div>
                        <label class="block text-xs text-slate-400 mb-1">سبب الرفض</label>
                        <textarea name="rejection_reason" rows="2" required class="w-full bg-black/20 border border-white/10 rounded-lg px-3 py-2 text-white text-sm" placeholder="اذكر سبب الرفض..."></textarea>
                    </div>
                    <button type="submit" class="w-full bg-red-500/20 text-red-400 py-3 rounded-lg font-bold hover:bg-red-500/30 transition">رفض الحملة</button>
                </form>
            </div>
        </div>
    </div>
    {% endif %}

    {% if ad_camp.status == 'rejected' and ad_camp.rejection_reason %}
    <div class="glass p-6 rounded-2xl mb-8 border border-red-500/20">
        <h2 class="text-lg font-bold text-red-400 mb-2">سبب الرفض</h2>
        <p class="text-white text-sm">{{ ad_camp.rejection_reason }}</p>
        {% if ad_camp.reviewer %}
        <p class="text-xs text-slate-400 mt-2">بواسطة: {{ ad_camp.reviewer.name }} | {{ ad_camp.reviewed_at.strftime('%Y-%m-%d %H:%M') if ad_camp.reviewed_at else '' }}</p>
        {% endif %}
    </div>
    {% endif %}

    <!-- Audit Log -->
    <div class="glass p-6 rounded-2xl">
        <h2 class="text-lg font-bold text-white mb-4">سجل العمليات</h2>
        <div class="space-y-2">
            {% for log in ad_camp.audit_logs.order_by(ad_camp.audit_logs._entity_zero().entity.audit_logs.property.mapper.class_.created_at.desc()) if false %}
            {% endfor %}
            {% for log in ad_camp.audit_logs %}
            <div class="flex items-center gap-3 text-sm p-2 bg-black/20 rounded-lg">
                <span class="text-xs px-2 py-0.5 rounded
                    {% if log.action == 'approved' %}bg-emerald-500/20 text-emerald-400
                    {% elif log.action == 'rejected' %}bg-red-500/20 text-red-400
                    {% elif log.action == 'modified' %}bg-blue-500/20 text-blue-400
                    {% elif log.action == 'paused' %}bg-orange-500/20 text-orange-400
                    {% else %}bg-slate-500/20 text-slate-400{% endif %}">{{ log.action }}</span>
                <span class="text-slate-400 text-xs">{{ log.created_at.strftime('%Y-%m-%d %H:%M') }}</span>
                {% if log.admin %}<span class="text-xs text-slate-500">بواسطة: {{ log.admin.name }}</span>{% endif %}
            </div>
            {% else %}
            <p class="text-slate-400 text-sm">لا توجد عمليات مسجلة</p>
            {% endfor %}
        </div>
    </div>
</div>
{% endblock %}