@php
    // Detect user's actual role from their data
    $userRole = $user->role_slug;
    
    // Get appropriate profile based on detected user role (not global $currentRole)
    
    $profile = ($userRole === 'team') ? $user->teamProfile : $user->athleteProfile;
    $primarySport = $user->sports->first();
    
    // Get location
    $location = '';
    if ($profile) {
        $locationParts = array_filter([
            optional($profile->city)->city_name,
            optional($profile->state)->state_name,
            optional($profile->country)->country_name
        ]);
        $location = implode(', ', $locationParts);
    }
    
    // Get social link icon
    $socialIcon = null;
    if ($user->socialLinks && $user->socialLinks->count() > 0) {
        $firstLink = $user->socialLinks->first();
        switch($firstLink->social_link_type) {
            case 1: $socialIcon = asset('front/assets/images/youtube.png'); break;
            case 2: $socialIcon = asset('front/assets/images/instagram.png'); break;
            case 3: $socialIcon = asset('front/assets/images/facebook.png'); break;
        }
    }
    
    // Get gender icon
    $genderIcon = $userRole === 'athlete' ? ($user->gender == 1 ? asset('front/assets/images/male.svg') : asset('front/assets/images/female.svg')) : '';

    // Get sport info and icon from master_sports (use detected user role, not global currentRole)
    $sportName = '';
    $sportIcon = asset('img/no-image.png'); // Default fallback
    $positionName = '';
    $userTypeBadge = ($userRole === 'team') ? asset('front/assets/images/team.png') : asset('front/assets/images/athelete.png');
    if ($userRole === 'team' && $profile && $profile->sport) {
        $sportName = optional($profile->sport)->title ?? 'Team';
        // Get sport icon from master_sports -> files table (image accessor returns array)
        $sportImageData = $profile->sport->image ?? [];
        if (is_array($sportImageData) && isset($sportImageData['original']) && is_string($sportImageData['original'])) {
            $sportIcon = $sportImageData['original'];
        }
    } elseif ($userRole === 'athlete' && $primarySport && $primarySport->sport) {
        // $primarySport is UserMasterSportMap, need to access ->sport
        $sportName = optional($primarySport->sport)->title ?? '';
        // Get sport icon from master_sports -> files table (image accessor returns array)
        $sportImageData = optional($primarySport->sport)->image ?? [];
        if (is_array($sportImageData) && isset($sportImageData['original']) && is_string($sportImageData['original'])) {
            $sportIcon = $sportImageData['original'];
        }
        if ($profile && $profile->position) {
            $positionName = optional($profile->position)->title ?? '';
        }
    }                        
    $bio = optional($profile)->athlete_bio ?? optional($profile)->team_bio_tagline ?? 'No bio available';
    $schoolClub = optional($user)->school_club_name ?? optional($profile)->team_club_name ?? 'N/A';
    
    // Get active campaign for this user
    $userCampaign = null;
    if (isset($activeCampaigns[$user->id]) && $activeCampaigns[$user->id]->count() > 0) {
        $userCampaign = $activeCampaigns[$user->id]->first();
    }
@endphp
@if($loop->first || $loop->iteration % 3 == 1)
<div class="grid">
@endif
    <div class="card">
        <div class="card-img-sec">
            <div class="card-img">
                <div class="card-img-banner">
                    <img src="{{ $sportIcon }}" alt="{{ $user->full_name }}" >
                </div>
            </div>
            <div class="card-text">
                <div class="card-t-area">
                    <div class="card-img-thumb"><img src="{{ isset($user->avatar['thumb']) ? $user->avatar['thumb'] : asset('front/assets/images/thumb1.png') }}" alt="{{ $sportName }}" height="61"></div>
                    <div class="small-ath-txt">
                        <div class="name">
                            @if($userRole === 'team')
                                {{ $schoolClub }}
                            @else
                                {{ $user->full_name }} 
                                @if($genderIcon)
                                    <img src="{{ $genderIcon }}" alt="Gender">
                                @endif
                            @endif
                        </div>
                        <div class="sport">
                            @if($sportName)
                                <!-- <img src="{{ $sportIcon }}" class="mr-2"> -->
                                {{ $sportName }}
                                @if($positionName) – {{ $positionName }} @endif
                            @endif
                        </div>
                    </div>
                </div>
            </div>

            @if($socialIcon)
                <div class="icon-athe">
                    <a href="{{ $user->socialLinks->first()->social_link ?? '#' }}" target="_blank">
                        <img src="{{ $socialIcon }}" alt="Social">
                    </a>
                </div>
            @endif
            <div class="badge-team-athe">
                <span class="status-tag status-active">{{ ucfirst($userRole)}}</span>
            </div>
        </div>

        <div class="card-body">
            <div class="label">Short Bio</div>
            <div class="info">{{ Str::limit($bio, 100) }}</div>

            @if($location)
                <div class="info">
                    <svg xmlns="http://www.w3.org/2000/svg" width="11" height="14" viewBox="0 0 11 14" fill="none">
                        <path d="M5.5 0C4.04182 0.00165422 2.64383 0.581654 1.61274 1.61276C0.581648 2.64386 0.00165421 4.04186 0 5.50006C0 10.2064 5 13.7608 5.21313 13.9095C5.2972 13.9684 5.39735 14 5.5 14C5.60265 14 5.7028 13.9684 5.78687 13.9095C6 13.7608 11 10.2064 11 5.50006C10.9983 4.04186 10.4184 2.64386 9.38726 1.61276C8.35617 0.581654 6.95818 0.00165422 5.5 0ZM5.5 3.50004C5.89556 3.50004 6.28224 3.61733 6.61114 3.8371C6.94004 4.05686 7.19638 4.36922 7.34776 4.73468C7.49913 5.10014 7.53874 5.50227 7.46157 5.89024C7.3844 6.27821 7.19392 6.63457 6.91421 6.91428C6.63451 7.19399 6.27814 7.38447 5.89018 7.46165C5.50222 7.53882 5.10009 7.49921 4.73463 7.34783C4.36918 7.19646 4.05682 6.94011 3.83706 6.61121C3.6173 6.2823 3.5 5.89562 3.5 5.50006C3.5 4.96962 3.71071 4.4609 4.08579 4.08583C4.46086 3.71075 4.96957 3.50004 5.5 3.50004Z" fill="#FF972B" />
                    </svg> {{ $location }}
                </div>
            @endif

            <div class="school">
                @if($userRole === 'team')
                <div class="cam-sec">
                    <strong>Team Size</strong>
                    {{$profile->team_size ?? 'N/A'}}
                </div>
                @else
                <img src="{{ asset('front/assets/images/celebration.png') }}">
                
                @endif
            </div>

            @if($userCampaign)
                @php
                    $campaignProgress = $userCampaign->fund_target > 0 ? ($userCampaign->fund_raised / $userCampaign->fund_target) * 100 : 0;
                    $campaignProgress = min(100, max(0, $campaignProgress));
                    $daysLeft = $userCampaign->campaign_finished_at ? now()->diffInDays(\Carbon\Carbon::parse($userCampaign->campaign_finished_at), false) : 0;
                @endphp
                <div class="campaign">
                    <strong>Campaign Summary</strong><br>
                    <span>{{ Str::limit($userCampaign->title ?? $userCampaign->summary ?? 'Active Campaign', 50) }}</span>
                </div>

                <div class="progress-wrap">
                    <div class="progress-text">
                        <div>Raised : {!! \App\Helpers\Helper::price($userCampaign->fund_raised) !!}</div>
                        <div>{{ number_format($campaignProgress, 0) }}%</div>
                    </div>
                    <div class="bar">
                        <div class="fill" style="width:{{ $campaignProgress }}%"></div>
                    </div>
                    <div class="goal">Goal : <strong style="color:#f97316">{!! \App\Helpers\Helper::price($userCampaign->fund_target) !!}</strong></div>
                </div>

                <div class="foot-part">
                    <div class="days">
                        <img src="{{ asset('front/assets/images/Vector.svg') }}"> {{ max(0, round($daysLeft)) }} days left
                    </div>
                    <button class="foot-btn" onclick="window.location.href='{{ route('front.athletes.show', $user->username) }}'">
                        View Profile 
                        <svg xmlns="http://www.w3.org/2000/svg" width="23" height="8" viewBox="0 0 23 8" fill="none">
                            <path d="M22.3536 4.03556C22.5488 3.8403 22.5488 3.52372 22.3536 3.32845L19.1716 0.146473C18.9763 -0.0487892 18.6597 -0.0487892 18.4645 0.146473C18.2692 0.341735 18.2692 0.658318 18.4645 0.85358L21.2929 3.68201L18.4645 6.51043C18.2692 6.7057 18.2692 7.02228 18.4645 7.21754C18.6597 7.4128 18.9763 7.4128 19.1716 7.21754L22.3536 4.03556ZM0 3.68201V4.18201H22V3.68201V3.18201H0V3.68201Z" fill="#3F3F3F"/>
                        </svg>
                    </button>
                </div>
            @else
                <div class="campaign">
                    <strong>Campaign Summary</strong><br>
                    <span style="color: #9ca3af; font-style: italic;">No active campaign</span>
                </div>

                <div class="progress-wrap" style="opacity: 0.5;">
                    <div class="progress-text">
                        <div>Raised : {!! \App\Helpers\Helper::price(0) !!}</div>
                        <div>0%</div>
                    </div>
                    <div class="bar">
                        <div class="fill" style="width:0%"></div>
                    </div>
                    <div class="goal">Goal : <strong style="color:#f97316">{!! \App\Helpers\Helper::price(0) !!}</strong></div>
                </div>

                <div class="foot-part">
                    <div class="days" style="color: #9ca3af;">
                        <img src="{{ asset('front/assets/images/Vector.svg') }}"> No active campaign
                    </div>
                    <button class="foot-btn" onclick="window.location.href='{{ route('front.athletes.show', $user->username) }}'">
                        View Profile 
                        <svg xmlns="http://www.w3.org/2000/svg" width="23" height="8" viewBox="0 0 23 8" fill="none">
                            <path d="M22.3536 4.03556C22.5488 3.8403 22.5488 3.52372 22.3536 3.32845L19.1716 0.146473C18.9763 -0.0487892 18.6597 -0.0487892 18.4645 0.146473C18.2692 0.341735 18.2692 0.658318 18.4645 0.85358L21.2929 3.68201L18.4645 6.51043C18.2692 6.7057 18.2692 7.02228 18.4645 7.21754C18.6597 7.4128 18.9763 7.4128 19.1716 7.21754L22.3536 4.03556ZM0 3.68201V4.18201H22V3.68201V3.18201H0V3.68201Z" fill="#3F3F3F"/>
                        </svg>
                    </button>
                </div>
            @endif
        </div>
    </div>
@if($loop->iteration % 3 == 0 || $loop->last)
</div>
@endif