{{-- resources/views/admin/competitors/_header_stats.blade.php --}}

<div class="page-header d-flex justify-content-between align-items-center mb-3">
    <h4 class="page-title mb-0">Database Kompetitor</h4>
    <ul class="breadcrumbs mb-0">
        <li class="nav-home"><a href="{{ route('admin.dashboard') }}"><i class="icon-home"></i></a></li>
        <li class="separator"><i class="icon-arrow-right"></i></li>
        <li class="nav-item">Analisis</li>
        <li class="separator"><i class="icon-arrow-right"></i></li>
        <li class="nav-item">Data Pesaing</li>
    </ul>
</div>

@if(isset($competitors))
    @php
        $totalCompetitors = $competitors->count();
        $totalMale = $competitors->where('gender', 'male')->count();
        $totalFemale = $competitors->where('gender', 'female')->count();

        $checkCat = function($comp, $targetAge) {
            $raw = $comp->age_category;
            if (empty($raw)) return false;
            if (is_array($raw)) {
                return in_array($targetAge, $raw) || in_array(str_replace('-', '', $targetAge), $raw);
            }
            $rawString = strtolower((string) $raw);
            return str_contains($rawString, strtolower($targetAge)) || str_contains($rawString, str_replace('-', '', strtolower($targetAge)));
        };

        $statsAge = [
            'U-16'   => $competitors->filter(fn($c) => $checkCat($c, 'U-16'))->count(),
            'U-18'   => $competitors->filter(fn($c) => $checkCat($c, 'U-18'))->count(),
            'U-20'   => $competitors->filter(fn($c) => $checkCat($c, 'U-20'))->count(),
            'Elite'  => $competitors->filter(fn($c) => $checkCat($c, 'Elite'))->count(),
            'Master' => $competitors->filter(fn($c) => $checkCat($c, 'Master'))->count(),
        ];
    @endphp

    <div class="row">
        <div class="col-sm-6 col-md-4">
            <div class="card card-secondary h-100">
                <div class="card-body skew-shadow d-flex align-items-center justify-content-between">
                    <div>
                        <h1 class="fw-bold">{{ $totalCompetitors }}</h1>
                        <h5 class="op-8 mb-0">Total Kompetitor</h5>
                    </div>
                    <div class="pull-right"><h3 class="fw-bold op-8 mb-0"><i class="fas fa-users fa-2x"></i></h3></div>
                </div>
            </div>
        </div>

        <div class="col-sm-6 col-md-4">
            <div class="card card-secondary bg-secondary-gradient h-100">
                <div class="card-body bubble-shadow d-flex align-items-center justify-content-between">
                    <div>
                        <div style="font-size: 1.1rem; margin-bottom: 5px;"><strong>{{ $totalMale }}</strong> <small class="op-8">Putra</small></div>
                        <div style="font-size: 1.1rem;"><strong>{{ $totalFemale }}</strong> <small class="op-8">Putri</small></div>
                    </div>
                    <div class="text-right">
                        <h3 class="fw-bold op-8 mb-0"><i class="fas fa-venus-mars fa-2x"></i></h3>
                        <h5 class="op-8 mt-2 mb-0">Gender</h5>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-sm-6 col-md-4">
            <div class="card card-secondary bg-secondary-gradient h-100">
                <div class="card-body curves-shadow">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h5 class="op-8 mb-0 fw-bold">Kelompok Umur</h5>
                        <i class="fas fa-globe-asia fa-lg op-8"></i>
                    </div>
                    <div class="row g-0 text-center text-sm">
                        <div class="col-3 border-end border-light opacity-75"><div class="fw-bold">{{ $statsAge['U-16'] }}</div><small>U-16</small></div>
                        <div class="col-3 border-end border-light opacity-75"><div class="fw-bold">{{ $statsAge['U-18'] }}</div><small>U-18</small></div>
                        <div class="col-3 border-end border-light opacity-75"><div class="fw-bold">{{ $statsAge['U-20'] }}</div><small>U-20</small></div>
                        <div class="col-3"><div class="fw-bold">{{ $statsAge['Elite'] }}</div><small>Elite</small></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endif

<div class="row mb-4 mt-3">
    <div class="col-md-12">
        <div class="card shadow-none border">
            <div class="card-body py-2">
                <div class="d-flex flex-column flex-md-row align-items-center justify-content-between">
                    <ul class="nav nav-pills nav-secondary">
                        <li class="nav-item">
                            <a class="nav-link {{ Request::routeIs('admin.competitors.index') ? 'active fw-bold' : '' }}" 
                               href="{{ route('admin.competitors.index') }}"
                               style="border-radius: 4px; margin-right: 5px;"> 
                                <i class="fas fa-user-tag me-2"></i> Data Kompetitor
                            </a>
                        </li>
                        
                        <li class="nav-item">
                            <a class="nav-link {{ Request::routeIs('admin.competitors.ranking') ? 'active fw-bold' : '' }}" 
                               href="{{ route('admin.competitors.ranking') }}" 
                               style="border-radius: 4px; margin-right: 5px;">
                                <i class="fas fa-trophy me-2"></i> Peringkat (Ranking)
                            </a>
                        </li>

                        <li class="nav-item">
                            <a class="nav-link {{ Request::routeIs('admin.competitors.national_records') ? 'active fw-bold' : '' }}" 
                               href="{{ route('admin.competitors.national_records') }}" 
                               style="border-radius: 4px;">
                                <i class="fas fa-flag me-2"></i> Rekor Internasional / Luar
                            </a>
                        </li>
                    </ul>
                    <div class="d-flex align-items-center mt-3 mt-md-0 text-muted ms-md-auto">
                        <i class="fas fa-info-circle me-2 text-primary"></i>
                        <small class="mb-0">Database Pesaing Internasional / Luar Daerah</small>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>