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

{% block title %}Kursteilnehmer – Fit wie ein Fisch{% endblock %}
{% block header_title %}<i class="fas fa-users me-2"></i>Kursteilnehmer{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link href="{{ asset('css/fisch-admin.css') }}" rel="stylesheet">
{% endblock %}

{% block content %}
{% set actions %}
    <a href="{{ path('admin_fisch_course_participants_export', {id: course.id}) }}" class="btn btn-outline-success btn-sm">
        <i class="fas fa-file-csv me-1"></i> CSV
    </a>
    <span class="badge rounded-pill" style="background: var(--fisch-admin-primary);">{{ booked }}/{{ course.maxCapacity }}</span>
{% endset %}
{% include 'admin/fisch/_fisch_page_header.html.twig' with {
    title: course.pool.name ~ ' · ' ~ course.startTimeFormatted,
    icon: 'users',
    subtitle: course.ageGroupLabel ~ ' — Teilnehmer dieses Kurs-Slots',
    breadcrumb_current: 'Kursteilnehmer',
    actions_html: actions
} %}

{% include 'admin/fisch/_fisch_demo_banner.html.twig' %}

<div class="mb-3">
    <a href="{{ path('admin_fisch_courses_index') }}" class="btn btn-outline-secondary btn-sm">
        <i class="fas fa-arrow-left me-1"></i> Zur Kursübersicht
    </a>
</div>

<div class="fisch-table-wrap">
    <div class="table-responsive">
        <table class="table table-fisch mb-0">
            <thead>
                <tr>
                    <th>Kind</th>
                    <th>Geburtsdatum</th>
                    <th>Erziehungsberechtigte</th>
                    <th>Kontakt</th>
                    <th>Adresse</th>
                    <th>Status</th>
                    <th class="text-end">Details</th>
                </tr>
            </thead>
            <tbody>
                {% for p in participants %}
                    <tr>
                        <td class="fw-semibold">
                            <button type="button" class="btn btn-link p-0 text-decoration-none fw-semibold js-fisch-participant-details"
                                    data-id="{{ p.id }}" title="Details anzeigen">
                                {{ p.childFirstName }} {{ p.childLastName }}
                            </button>
                            {% if p.institutionName %}
                                <div class="small text-muted">{{ p.institutionName }}</div>
                            {% endif %}
                        </td>
                        <td>{{ p.birthDate|date('d.m.Y') }}</td>
                        <td>{{ p.guardianName }}</td>
                        <td>
                            <a href="mailto:{{ p.parentEmail }}">{{ p.parentEmail }}</a>
                            <div class="small text-muted">{{ p.phone ?: 'kein Telefon' }}</div>
                        </td>
                        <td class="small">{{ p.address|nl2br }}</td>
                        <td>
                            {% if p.status == 'pending' %}
                                <span class="badge bg-warning text-dark">{{ p.statusLabel }}</span>
                                {% if p.pendingUntil %}
                                    <div class="small text-muted">bis {{ p.pendingUntil|date('d.m.Y H:i') }}</div>
                                {% endif %}
                            {% else %}
                                <span class="badge bg-success">{{ p.statusLabel }}</span>
                            {% endif %}
                            {% if p.hasHealthRestrictions %}
                                <div class="small text-danger">
                                    <i class="fas fa-notes-medical me-1"></i>{{ p.healthRestrictions }}
                                </div>
                            {% endif %}
                        </td>
                        <td class="text-end">
                            <button type="button" class="btn btn-sm btn-info js-fisch-participant-details"
                                    data-id="{{ p.id }}" title="Details">
                                <i class="fas fa-eye"></i>
                            </button>
                        </td>
                    </tr>
                {% else %}
                    <tr><td colspan="7" class="text-muted text-center py-4">Noch keine Teilnehmer in diesem Kurs.</td></tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>

{% include 'admin/fisch/_participant_details_modal.html.twig' %}
{% endblock %}

{% block javascripts %}
{{ parent() }}
<script src="{{ asset('js/admin/fisch-participant-details.js') }}"></script>
{% endblock %}