{{-- resources/views/admin/disciplines/_tabel-disciplines.blade.php --}}
<div class="card shadow-sm" style="border-radius: 4px;">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h4 class="card-title fw-bold">Daftar Nomor Pertandingan</h4>
        <a href="{{ route('admin.disciplines.create') }}" class="btn btn-primary btn-sm" style="border-radius: 4px;">
            <i class="fa fa-plus"></i> Tambah Nomor
        </a>
    </div>
    <div class="card-body">
        
        <ul class="nav nav-pills nav-secondary mb-3" id="gender-tab" role="tablist">
            <li class="nav-item">
                <a class="nav-link active" id="pills-male-tab" data-bs-toggle="pill" href="#pills-male" role="tab">
                    <i class="fas fa-mars me-2"></i> Putra
                    <span class="badge bg-white text-primary ms-2">{{ $disciplines->where('gender', 'male')->count() }}</span>
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" id="pills-female-tab" data-bs-toggle="pill" href="#pills-female" role="tab">
                    <i class="fas fa-venus me-2"></i> Putri
                    <span class="badge bg-white text-primary ms-2">{{ $disciplines->where('gender', 'female')->count() }}</span>
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" id="pills-mixed-tab" data-bs-toggle="pill" href="#pills-mixed" role="tab">
                    <i class="fas fa-transgender me-2"></i> Campuran
                    <span class="badge bg-white text-primary ms-2">{{ $disciplines->where('gender', 'mixed')->count() }}</span>
                </a>
            </li>
        </ul>

        <div class="tab-content mt-2 mb-3" id="pills-tabContent">
            
            @foreach(['male', 'female', 'mixed'] as $genderKey)
                @php 
                    $genderData = $disciplines->where('gender', $genderKey); 
                    $isActive = $genderKey == 'male' ? 'show active' : '';
                @endphp

                <div class="tab-pane fade {{ $isActive }}" id="pills-{{ $genderKey }}" role="tabpanel">
                    <div class="table-responsive">
                        <table class="table table-bordered table-striped table-hover align-top">
                            <thead class="bg-light align-middle">
                                <tr>
                                    <th class="text-center" style="width: 5%">No</th>
                                    <th style="width: 45%">Nama Nomor & Detail</th>
                                    <th style="width: 30%">Tipe & Pengukuran</th>
                                    <th class="text-center" style="width: 20%">Aksi</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($genderData as $item)
                                <tr>
                                    <td class="text-center py-3">{{ $loop->iteration }}</td>
                                    
                                    <td class="py-3">
                                        <div class="fw-bold text-dark mb-1" style="font-size: 1rem;">
                                            {{ $item->name }}
                                        </div>
                                        
                                        <div class="small text-muted mb-2">
                                            Code: <span class="font-monospace text-primary bg-light px-1 border rounded">{{ $item->code }}</span>
                                        </div>

                                        @if($item->subcategory)
                                            <span class="badge bg-white text-secondary border">
                                                <i class="fas fa-tag me-1"></i> {{ $item->subcategory }}
                                            </span>
                                        @endif
                                    </td>

                                    <td class="py-3 align-middle">
                                        <div class="mb-2">
                                            @if($item->participation_type == 'individual')
                                                <span class="text-dark"><i class="fas fa-user me-1 text-muted"></i> Individu</span>
                                            @else
                                                <span class="text-dark fw-bold"><i class="fas fa-users me-1 text-primary"></i> Tim/Estafet</span>
                                            @endif
                                        </div>

                                        <div>
                                            @if($item->result_type == 'time')
                                                <span class="badge badge-count bg-light text-dark border">
                                                    <i class="fas fa-stopwatch me-1"></i> Waktu (s)
                                                </span>
                                            @elseif($item->result_type == 'distance')
                                                <span class="badge badge-count bg-light text-dark border">
                                                    <i class="fas fa-ruler-horizontal me-1"></i> Jarak (m)
                                                </span>
                                            @else
                                                <span class="badge badge-count bg-light text-dark border">
                                                    <i class="fas fa-star me-1"></i> Poin (pts)
                                                </span>
                                            @endif
                                        </div>
                                    </td>

                                    <td class="text-center py-3 align-middle">
                                        <div class="d-flex justify-content-center gap-1">
                                            <a href="{{ route('admin.disciplines.edit', $item->id) }}" 
                                               class="btn btn-sm btn-warning text-white" 
                                               data-bs-toggle="tooltip" 
                                               title="Edit"
                                               style="border-radius: 4px;">
                                                <i class="fa fa-edit"></i>
                                            </a>

                                            <form action="{{ route('admin.disciplines.destroy', $item->id) }}" method="POST" class="d-inline delete-form">
                                                @csrf 
                                                @method('DELETE')
                                                <button type="submit" class="btn btn-sm btn-danger" data-bs-toggle="tooltip" title="Hapus" style="border-radius: 4px;">
                                                    <i class="fa fa-trash"></i>
                                                </button>
                                            </form>
                                        </div>
                                    </td>
                                </tr>
                                @empty
                                <tr>
                                    <td colspan="4" class="text-center text-muted p-5">
                                        <div class="mb-2"><i class="fas fa-folder-open fa-2x opacity-50"></i></div>
                                        Tidak ada data nomor pertandingan untuk kategori gender ini.
                                    </td>
                                </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            @endforeach

        </div>
    </div>
</div>