@php
    $record = $getRecord();
    /*
        'id' => $player_id,
        'name' => $val['player_name'],
        'preferred_foot' => $val['preferred_foot'],
        'player_position' => $player_position,
        'player_color' => $player_color,
        'timed_color' => $timed_color,
        'events_played' => $events_played,
        'everage_minutes' => $everage_minutes,
        style="opacity:0.25 !important;"
    */
@endphp
@if ($record['active'])
    <div draggable="false"
        class="border dark:border-gray-600 border-gray-200 w-full text-xs mt-1 p-1 select-none rounded transition-colors flex justify-end content-center items-center gap-1">
        <div class="w-86 text-[11px] min-w-86 text-center grid grid-cols-11 content-center items-center gap-1">
            <div>{{ $record['gls'] }}</div>
            <div>{{ $record['crn'] }}</div>
            <div>{{ $record['fls'] }}</div>
            <div>{{ $record['ofs'] }}</div>
            <div>{{ $record['snt'] }}</div>
            <div>{{ $record['tsh'] }}</div>
            <div>{{ $record['crd'] }}</div>
            <div>{{ $record['preferred_foot'] }}</div>
            <div>{{ $record['events_played'] }}</div>
            <div>{{ $record['everage_minutes'] }}</div>
            <div class="bg-black text-white  rounded font-bold">{{ $record['position'] }}</div>
        </div>
        <div class="w-18 font-stretch-ultra-condensed">
            <x-filament::badge size="sm" color="{{ $record['player_color'] }}">
                {{ ucfirst($record['player_position']) }}
            </x-filament::badge>
        </div>
        <div class="text-left font-bold tracking-tight flex-1 text-red-500">
            {{ $record['name'] }}
        </div>
        <div class="w-8 flex justify-end">
        </div>
    </div>
@else
    <div draggable="true"
        x-on:dragstart="e => {
        e.dataTransfer.effectAllowed = 'copy';
        e.dataTransfer.setData('text/plain', JSON.stringify({ id: {{ $record['id'] }} }));
    }"
        class="border dark:border-gray-600 border-gray-200 w-full text-xs mt-1 p-1 select-none cursor-grab active:cursor-grabbing rounded transition-colors flex justify-end content-center items-center gap-1">
        <div class="w-86 text-[11px] min-w-86 text-center grid grid-cols-11 content-center items-center gap-1">
            <div>{{ $record['gls'] }}</div>
            <div>{{ $record['crn'] }}</div>
            <div>{{ $record['fls'] }}</div>
            <div>{{ $record['ofs'] }}</div>
            <div>{{ $record['snt'] }}</div>
            <div>{{ $record['tsh'] }}</div>
            <div>{{ $record['crd'] }}</div>
            <div>{{ $record['preferred_foot'] }}</div>
            <div>{{ $record['events_played'] }}</div>
            <div>{{ $record['everage_minutes'] }}</div>
            <div class="bg-black text-white rounded font-bold">{{ $record['position'] }}</div>
        </div>
        <div class="w-18 font-stretch-ultra-condensed">
            <x-filament::badge size="sm" color="{{ $record['player_color'] }}">
                {{ ucfirst($record['player_position']) }}
            </x-filament::badge>
        </div>
        <div class="text-left font-bold tracking-tight flex-1">
            {{ $record['name'] }}
        </div>
        <div class="w-8 flex justify-end">
            <x-phosphor-dots-six-vertical class="h-5 w-5" />
        </div>
    </div>
@endif