@php
    use App\Enums\TaskPriority;

    $priorityColor = match ($record->priority) {
        TaskPriority::High => 'danger',
        TaskPriority::Medium => 'warning',
        default => 'gray',
    };

    $canOpenTaskModal = method_exists($this, 'viewAction');
@endphp

<div
    wire:key="kanban-record-{{ $record->getKey() }}"
    id="{{ $record->getKey() }}"
    @if ($canOpenTaskModal)
        x-data="{ startX: 0, startY: 0 }"
        x-on:pointerdown="startX = $event.clientX; startY = $event.clientY"
        x-on:click="
            if (Math.hypot($event.clientX - startX, $event.clientY - startY) < 8) {
                $wire.mountAction('view', { record: {{ $record->getKey() }} })
            }
        "
    @endif
    class="record cursor-grab rounded-lg border border-gray-200 bg-white px-4 py-3 shadow-sm dark:border-gray-600 dark:bg-gray-700"
>
    <p class="mb-2 text-sm font-semibold leading-5 text-gray-900 dark:text-gray-100">
        {{ $record->title }}
    </p>

    @if ($record->project)
        <p class="mb-2 text-xs text-gray-500 dark:text-gray-400">
            {{ $record->project->name }}
        </p>
    @endif

    <div class="mb-2 flex flex-wrap gap-1">
        @foreach ($record->assignees as $assignee)
            <span
                class="inline-block max-w-full truncate rounded-full bg-primary-50 px-2 py-0.5 text-xs font-medium text-primary-700 dark:bg-primary-500/10 dark:text-primary-300"
                title="{{ $assignee->name }}"
            >
                {{ $assignee->name }}
            </span>
        @endforeach
    </div>

    <div class="flex items-center justify-between gap-2 text-xs">
        <span @class([
            'inline-flex rounded-md px-2 py-0.5 font-medium',
            'bg-danger-50 text-danger-700 dark:bg-danger-500/10 dark:text-danger-300' => $priorityColor === 'danger',
            'bg-warning-50 text-warning-700 dark:bg-warning-500/10 dark:text-warning-300' => $priorityColor === 'warning',
            'bg-gray-50 text-gray-700 dark:bg-gray-500/10 dark:text-gray-300' => $priorityColor === 'gray',
        ])>
            {{ $record->priority->getLabel() }}
        </span>

        <span class="shrink-0 whitespace-nowrap text-gray-500 dark:text-gray-400">
            {{ $record->due_date?->translatedFormat('Y-m-d') ?? '—' }}
        </span>
    </div>
</div>