{% extends 'base.html.twig' %}

{% block title %}Profilvideos pruefen | Wanted{% endblock %}
{% block header %}{% endblock %}
{% block main_class %}stitch-page{% endblock %}

{% block body %}
<div class="max-w-3xl mx-auto px-4 py-10 text-white">
    <h1 class="text-2xl font-bold mb-2">Profilvideos (Freigabe)</h1>
    <p class="text-neutral-400 text-sm mb-8">Ausstehende Anbieter-Profilvideos aus Registrierung oder Profilbearbeitung.</p>

    {% for message in app.flashes('success') %}
        <p class="mb-4 text-emerald-400 text-sm">{{ message }}</p>
    {% endfor %}
    {% for message in app.flashes('error') %}
        <p class="mb-4 text-red-400 text-sm">{{ message }}</p>
    {% endfor %}

    {% if pendingVideos is empty %}
        <p class="text-neutral-500">Keine offenen Eintraege.</p>
    {% else %}
        <ul class="space-y-8">
            {% for video in pendingVideos %}
                <li class="rounded-xl bg-neutral-900 border border-neutral-800 p-4">
                    <div class="flex flex-col sm:flex-row gap-4">
                        {% if video.playbackUrl %}
                            <video class="w-full sm:w-64 aspect-video rounded-lg bg-black object-cover" src="{{ video.playbackUrl }}" controls playsinline preload="metadata"></video>
                        {% endif %}
                        <div class="flex-1 min-w-0">
                            <p class="font-semibold">{{ video.company ? video.company.name : 'Unbekannt' }}</p>
                            <p class="text-xs text-neutral-500 mt-1">{{ video.createdAt|date('d.m.Y H:i') }}</p>
                            <p class="text-sm text-neutral-400 mt-2 truncate">{{ video.playbackUrl }}</p>
                            <div class="flex flex-wrap gap-2 mt-4">
                                <form method="post" action="{{ path('app_team_profile_video_approve', {id: video.id}) }}">
                                    <input type="hidden" name="_token" value="{{ csrf_token('team_profile_video_' ~ video.id) }}">
                                    <button type="submit" class="px-4 py-2 rounded-lg bg-emerald-600 hover:bg-emerald-500 text-sm font-bold">Freigeben</button>
                                </form>
                                <form method="post" action="{{ path('app_team_profile_video_reject', {id: video.id}) }}" onsubmit="return confirm('Profilvideo wirklich ablehnen und loeschen?');">
                                    <input type="hidden" name="_token" value="{{ csrf_token('team_profile_video_' ~ video.id) }}">
                                    <button type="submit" class="px-4 py-2 rounded-lg bg-red-900/80 hover:bg-red-800 text-sm font-bold">Ablehnen</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </li>
            {% endfor %}
        </ul>
    {% endif %}

    <nav class="mt-10 text-neutral-600 text-xs flex flex-wrap gap-3 justify-center" aria-label="Weitere Seiten">
        <a href="{{ path('app_feed') }}" class="text-neutral-400 underline hover:text-neutral-200">Feed</a>
        <a href="{{ path('app_faq') }}" class="text-neutral-400 underline hover:text-neutral-200">FAQ</a>
        <a href="{{ path('app_imprint') }}" class="text-neutral-400 underline hover:text-neutral-200">Impressum</a>
        <a href="{{ path('app_privacy') }}" class="text-neutral-400 underline hover:text-neutral-200">Datenschutz</a>
        <a href="{{ path('app_terms') }}" class="text-neutral-400 underline hover:text-neutral-200">AGB</a>
    </nav>
</div>
{% endblock %}