@php
    $isOnline = false;
    if($user->last_login) {
        try {
            $isOnline = \Carbon\Carbon::parse($user->last_login)->diffInMinutes(now()) < 10;
        } catch (\Exception $e) {
            $isOnline = false;
        }
    }
@endphp
@php
    $smartScore = isset($user->smart_score) ? (float) $user->smart_score : null;
    $scoreLabel = '';
    $scoreClass = '';
    if ($smartScore !== null) {
        if ($smartScore >= 75) {
            $scoreLabel = 'توافق ممتاز';
            $scoreClass = 'score-excellent';
        } elseif ($smartScore >= 50) {
            $scoreLabel = 'توافق جيد';
            $scoreClass = 'score-good';
        } else {
            $scoreLabel = 'توافق مقبول';
            $scoreClass = 'score-fair';
        }
    }
@endphp
<div class="freelancer-item {{ $isOnline ? 'active' : '' }} freelancer-selection-item" 
     data-id="{{ $user->id }}" 
     data-search="{{ strtolower($user->name . ' ' . $user->username . ' ' . ($user->description ?? '')) }}"
     data-smart-score="{{ $smartScore ?? 0 }}"
     style="position: relative; cursor: pointer; width: 100%; margin-bottom: 0;">
    <!-- Hidden checkbox for form submission -->
    <input type="checkbox" class="freelancer-checkbox" value="{{ $user->id }}" style="display: none;">
    
    <!-- View Profile Icon -->
    <a href="{{route('freelancers.details',$user->username)}}" 
       target="_blank" 
       class="view-profile-icon" 
       title="عرض الملف الشخصي في صفحة جديدة"
       style="position: absolute; top: 15px; left: 15px; z-index: 10; background-color: #60d049; color: white; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; box-shadow: 0 2px 5px rgba(0,0,0,0.1);"
       onclick="event.stopPropagation();">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
            <path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path>
            <polyline points="15 3 21 3 21 9"></polyline>
            <line x1="10" y1="14" x2="21" y2="3"></line>
        </svg>
    </a>

    @if($smartScore !== null)
    <!-- Smart Match Badge -->
    <span class="invite-score-badge {{ $scoreClass }}" title="نسبة التوافق مع المشروع">
        <svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="currentColor" style="margin-left: 3px; flex-shrink: 0;">
            <path d="M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm1 14.93V18a1 1 0 0 1-2 0v-1.07A8 8 0 0 1 4.07 11H5a1 1 0 0 1 0 2H4.07A8 8 0 0 1 11 19.93V20a1 1 0 0 1-2 0v-.07A8 8 0 0 1 4.07 13H3a1 1 0 0 1 0-2h1.07A8 8 0 0 1 11 4.07V3a1 1 0 0 1 2 0v1.07A8 8 0 0 1 19.93 11H21a1 1 0 0 1 0 2h-1.07A8 8 0 0 1 13 19.93z"/>
        </svg>
        {{ $scoreLabel }} {{ $smartScore }}%
    </span>
    @endif
    
    <div class="freelancer-img">
        <a href="{{route('freelancers.details',$user->username)}}" class="freelancer-img-link" onclick="event.stopPropagation();">
            <img src="{{ $user->avatar_thumb_url }}" class="img-fluid" loading="lazy" decoding="async" width="70" height="70">
        </a>
        <span class="status" title="{{ $isOnline ? 'متصل الآن' : 'غير متصل' }}"></span>
    </div>
    <div class="freelancer-info">
        <div class="freelancer-head">
            <div>    
                <a href="{{route('freelancers.details',$user->username)}}" class="freelancer-name" onclick="event.stopPropagation();">
                    {{$user->name}}
                </a>
                @if($user->identity_verified_at)
                <span class="verified-badge" title="هوية موثقة">
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none">
                        <path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" stroke="#60d049" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                    </svg>
                    موثق
                </span>
                @endif
            </div>
        </div>
        <div class="freelancer-sec-head">
            <div class="rating">
                <span class="@if($user->rating > 0) active @endif">
                    <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677" viewBox="0 0 17.554 16.677">
                        <path id="Icon_material-star" data-name="Icon material-star" d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z" transform="translate(-3 -3)" />
                    </svg>
                </span>
                <span class="@if($user->rating > 1) active @endif">
                    <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677" viewBox="0 0 17.554 16.677">
                        <path id="Icon_material-star" data-name="Icon material-star" d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z" transform="translate(-3 -3)" />
                    </svg>
                </span>
                <span class="@if($user->rating > 2) active @endif ">
                    <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677" viewBox="0 0 17.554 16.677">
                        <path id="Icon_material-star" data-name="Icon material-star" d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z" transform="translate(-3 -3)" />
                    </svg>
                </span>
                <span class="@if($user->rating > 3) active @endif">
                    <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677" viewBox="0 0 17.554 16.677">
                        <path id="Icon_material-star" data-name="Icon material-star" d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z" transform="translate(-3 -3)" />
                    </svg>
                </span>
                <span class="@if($user->rating > 3) active @endif">
                    <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677" viewBox="0 0 17.554 16.677">
                        <path id="Icon_material-star" data-name="Icon material-star" d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z" transform="translate(-3 -3)" />
                    </svg>
                </span>
            </div>
            <div class="feats">
                <span>
                    <svg xmlns="http://www.w3.org/2000/svg" width="18.167" height="13.167" viewBox="0 0 18.167 18.167">
                        <path data-name="Icon awesome-medal" d="M7.939 4.639 5.486.551A1.135 1.135 0 0 0 4.513 0H.569A.568.568 0 0 0 .1.893l3.948 5.64a7.343 7.343 0 0 1 3.891-1.894zM17.6 0h-3.946a1.135 1.135 0 0 0-.974.551l-2.452 4.088a7.345 7.345 0 0 1 3.887 1.894l3.948-5.64A.568.568 0 0 0 17.6 0zM9.083 5.677a6.245 6.245 0 1 0 6.245 6.245 6.245 6.245 0 0 0-6.245-6.245zm3.283 5.58-1.346 1.311.318 1.853a.407.407 0 0 1-.591.429l-1.664-.875-1.664.875a.407.407 0 0 1-.591-.429l.318-1.853L5.8 11.257a.408.408 0 0 1 .225-.7l1.86-.271.833-1.686a.408.408 0 0 1 .731 0l.831 1.686 1.86.271a.408.408 0 0 1 .225.7z" />
                    </svg>
                    {{ $user->completedProjectsRate() }}% إكمال المشاريع
                </span>
                <span>
                    <svg xmlns="http://www.w3.org/2000/svg" width="12.937" height="13.136" viewBox="0 0 12.937 18.136">
                        <g data-name="Group 4286">
                            <path data-name="Path 16126" d="M-404.21-152.987a6.546 6.546 0 0 1 6.3 5.109 7.12 7.12 0 0 1-.584 4.69 18.3 18.3 0 0 1-2.08 3.273c-.912 1.215-1.864 2.4-2.665 3.7-.229.37-.437.753-.651 1.132-.073.129-.153.24-.32.237a.345.345 0 0 1-.3-.233 32.12 32.12 0 0 0-2.814-4.251 28.75 28.75 0 0 1-2.3-3.426 8.194 8.194 0 0 1-1-2.991 6.3 6.3 0 0 1 .975-4.214 6.368 6.368 0 0 1 4.417-2.915c.332-.065.677-.077 1.022-.111zm3.4 6.5a3.4 3.4 0 0 0-3.384-3.4 3.408 3.408 0 0 0-3.4 3.388 3.407 3.407 0 0 0 3.386 3.4 3.4 3.4 0 0 0 3.394-3.384z" transform="translate(410.68 152.987)" />
                        </g>
                    </svg>
                    {{$user->country?->name}}
                </span>
            </div>
        </div>
        <div class="freelancer-summary">
            @if($user->description && trim($user->description) !== '')
                {!! format_text($user->description) !!}
            @else
                <span>لم يكتب نبذة بعد</span>
            @endif
        </div>
        @if($user->category)
            <span class="freelancer-job">
                {{$user->category?->name}}
            </span>
        @endif
    </div>
</div>