{{-- resources/views/admin/athletes/_table.blade.php --}}
<div class="table-responsive">
    <table class="table table-bordered table-striped table-hover align-middle mb-0">
        <thead class="table-light">
            <tr class="small text-center text-dark">
                <th width="2%">No</th>
                <th width="6%">Foto</th>
                <th width="32%" class="text-start">Identitas Personal</th>
                <th width="5%">Gender</th>
                <th width="35%" class="text-start">Kategori & Spesialisasi Lomba</th>
                <th width="5%">Aksi</th>
            </tr>
        </thead>
        <tbody>
            @forelse($athleteCollection as $index => $athlete)
            <tr>
                <td class="text-center text-muted">{{ $loop->iteration }}</td>
                
                <td class="text-center">
                    <div style="width: 75px; height: 75px; margin: 0 auto; {{ $athlete->status == 'inactive' ? 'filter: grayscale(100%);' : '' }}">
                        <img src="{{ $athlete->photo_url }}" class="rounded border" style="width: 100%; height: 100%; object-fit: cover; object-position: top;" alt="Foto">
                    </div>
                </td>
                
                <td>
                    <div class="mb-1 d-flex align-items-center flex-wrap gap-1">
                        <a href="{{ route('admin.athletes.edit.profile', $athlete->id) }}" class="fw-bold text-dark text-decoration-none text-uppercase" style="font-size: 14px;">
                            {{ $athlete->name }}
                        </a>
                        <span class="small fw-bold {{ $athlete->status == 'active' ? 'text-success' : 'text-danger' }}" style="font-size: 11px;">
                            [{{ $athlete->status == 'active' ? 'Aktif' : 'Nonaktif' }}]
                        </span>
                    </div>
                    
                    <div class="small text-dark mb-1" style="font-size: 13px;">
                        <i class="far fa-calendar-alt text-muted me-1"></i> 
                        {{ $athlete->date_of_birth ? $athlete->date_of_birth->format('d M Y') : '-' }} 
                        @if($athlete->date_of_birth)
                            <span class="text-muted">({{ $athlete->date_of_birth->age }} Thn)</span>
                        @endif
                    </div>

                    <div class="small text-dark mb-1" style="font-size: 13px;">
                        <i class="fas fa-map-marker-alt text-muted me-1"></i> {{ $athlete->province_name ?? '-' }} 
                        <span class="text-muted mx-1">|</span>
                        <i class="fas fa-running text-muted me-1"></i> {{ $athlete->training_origin ?? 'Non Pelatnas' }}
                    </div>

                    <div class="small text-muted" style="font-size: 12px;">
                        @php
                            $cats = is_string($athlete->age_category) ? json_decode($athlete->age_category, true) : $athlete->age_category;
                        @endphp
                        @if(is_array($cats))
                            <strong>Kategori Usia:</strong> {{ implode(', ', $cats) }}
                        @endif
                    </div>
                </td>
                
                <td class="text-center small text-dark fw-medium">
                    @if($athlete->gender == 'male')
                        Putra
                    @elseif($athlete->gender == 'female')
                        Putri
                    @else
                        Campuran
                    @endif
                </td>
                
                <td>
                    @php
                        $requestedCategory = request('specialty_category');
                        $performancesToDisplay = $athlete->performances;
                        
                        if ($requestedCategory) {
                            $performancesToDisplay = $performancesToDisplay->filter(function($perf) use ($requestedCategory) {
                                return ($perf->discipline->competition_category_id ?? null) == $requestedCategory;
                            });
                        }
                    @endphp

                    @if($performancesToDisplay->isEmpty())
                        <span class="text-muted fst-italic small">Belum ada spesialisasi.</span>
                    @else
                        <ul class="list-unstyled mb-0 small" style="font-size: 13px;">
                        @foreach($performancesToDisplay->groupBy(fn($i) => $i->discipline->category->name ?? 'Lainnya') as $categoryName => $performances)
                            <li class="mb-1">
                                <span class="fw-bold text-dark">{{ $categoryName }}:</span><br>
                                <span class="text-muted">
                                    {{ $performances->map(function($p) { return $p->discipline->name; })->implode(', ') }}
                                </span>
                            </li>
                        @endforeach
                        </ul>
                    @endif
                </td>
                
                <td class="text-center align-middle">
                    <div class="d-flex justify-content-center gap-1">
                        <a href="{{ route('admin.athletes.edit.grafik', $athlete->id) }}" class="btn btn-sm btn-outline-dark" title="Dashboard Atlet"><i class="fas fa-chart-line"></i></a>
                        
                        <form action="{{ route('admin.athletes.destroy', $athlete->id) }}" method="POST" class="d-inline delete-form" onsubmit="return confirm('Apakah Anda yakin ingin menghapus data atlet ini?');">
                            @csrf @method('DELETE')
                            <button type="submit" class="btn btn-sm btn-outline-danger" title="Hapus Data"><i class="fa fa-trash"></i></button>
                        </form>
                    </div>
                </td>
            </tr>
            @empty
            <tr>
                <td colspan="6" class="text-center py-5">
                    <div class="d-flex flex-column align-items-center text-muted">
                        @if(request('search') || request('specialty_category'))
                            <i class="fas fa-search fa-2x mb-2 opacity-50"></i>
                            <span class="small">Pencarian tidak ditemukan</span>
                        @else
                            <i class="fas fa-inbox fa-2x mb-2 opacity-50"></i>
                            <span class="small">{{ $emptyMessage ?? 'Belum ada data' }}</span>
                        @endif
                    </div>
                </td>
            </tr>
            @endforelse
        </tbody>
    </table>
</div>