@extends('layouts.app')

@section('title', $programme->title . ' - Roster')

@section('content')
<div class="space-y-6">

    <div class="bg-white p-6 rounded-2xl border border-slate-200 shadow-sm flex flex-col md:flex-row justify-between gap-4">
        <div>
            <a href="{{ route('admin.programmes.index') }}" class="text-xs font-bold text-slate-400 hover:text-slate-600 mb-2 inline-block">
                ← Back to Programmes
            </a>
            <h2 class="text-2xl font-black text-brand-navy">{{ $programme->title }}</h2>
            <p class="text-xs text-slate-500 mt-1">International Delegates Attendance Roster</p>
        </div>

        <div class="flex items-center gap-2">
            <a href="{{ route('admin.programmes.export.csv', $programme->id) }}" class="bg-emerald-600 hover:bg-emerald-700 text-white font-bold px-4 py-2.5 rounded-xl text-xs flex items-center gap-2">
                <i class="fa-solid fa-file-excel"></i> Export Excel/CSV
            </a>
        </div>
    </div>

    <!-- Attendees Table -->
    <div class="bg-white rounded-2xl border border-slate-200 overflow-hidden shadow-sm">
        <table class="w-full text-left text-xs">
            <thead class="bg-slate-50 border-b border-slate-200 text-slate-400 uppercase font-bold text-[10px]">
                <tr>
                    <th class="p-4">Reg Code</th>
                    <th class="p-4">Delegate Name</th>
                    <th class="p-4">Contact</th>
                    <th class="p-4">Checked In At</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-slate-100">
                @forelse($attendees as $delegate)
                <tr class="hover:bg-slate-50 transition">
                    <td class="p-4 font-mono font-bold text-brand-navy">{{ $delegate->registration_code }}</td>
                    <td class="p-4 font-bold text-slate-800">{{ $delegate->full_name }}</td>
                    <td class="p-4 text-slate-500">{{ $delegate->phone }} <br><span class="text-[10px] text-slate-400">{{ $delegate->email }}</span></td>
                    <td class="p-4 font-medium text-emerald-600">{{ $delegate->pivot->checked_in_at }}</td>
                </tr>
                @empty
                <tr>
                    <td colspan="4" class="p-8 text-center text-slate-400">No international delegates registered for this programme yet.</td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>

</div>
@endsection