@php
    /** @var \App\Models\Partnership $p */
    /** @var string $columnStatus */
    $cfg = match ($p->status) {
        \App\Enums\PartnershipStatus::Upcoming => ['dot' => 'bg-accent'],
        \App\Enums\PartnershipStatus::Confirmed => ['dot' => 'bg-success'],
        \App\Enums\PartnershipStatus::Contacted => ['dot' => 'bg-warning'],
        \App\Enums\PartnershipStatus::Completed => ['dot' => 'bg-muted-foreground'],
        \App\Enums\PartnershipStatus::Archived => ['dot' => 'bg-muted-foreground/50'],
    };
    $dateText = $p->humanScheduledLabel();
    $inclusionText = $p->inclusionsLine();
@endphp

@can('update', $p)
    <div
        wire:key="collab-card-{{ $p->id }}"
        class="animate-fade-in cursor-grab select-none active:cursor-grabbing"
        draggable="true"
        role="button"
        tabindex="0"
        aria-label="{{ __('Open :name', ['name' => $p->restaurant_name]) }}"
        x-data="{ blockClickUntil: 0 }"
        x-on:dragstart="
            $event.dataTransfer.setData('text/plain', '{{ $p->id }}');
            $event.dataTransfer.effectAllowed = 'move';
            $el.querySelector('[data-collab-card-surface]')?.classList.add('opacity-60', 'ring-2', 'ring-ring/40');
        "
        x-on:dragend="
            $el.querySelector('[data-collab-card-surface]')?.classList.remove('opacity-60', 'ring-2', 'ring-ring/40');
            blockClickUntil = Date.now() + 350;
        "
        x-on:dragover.prevent="$event.dataTransfer.dropEffect = 'move'"
        x-on:drop.prevent="
            const id = parseInt($event.dataTransfer.getData('text/plain'), 10);
            if (! Number.isFinite(id) || id === {{ $p->id }}) return;
            $event.stopPropagation();
            $wire.moveToStatus(id, @js($columnStatus));
        "
        x-on:click="
            if ($event.target.closest('[data-card-interactive]')) return;
            if (Date.now() < blockClickUntil) return;
            $wire.openEdit({{ $p->id }});
        "
        x-on:keydown.enter.prevent="$wire.openEdit({{ $p->id }})"
        x-on:keydown.space.prevent="$wire.openEdit({{ $p->id }})"
    >
        <div
            data-collab-card-surface
            class="glass-card rounded-xl p-4 motion-safe:transition-[box-shadow,opacity,border-color] motion-safe:duration-200 hover:border-border/80 hover:shadow-md focus-within:border-border/80 focus-within:shadow-md"
        >
            @include('livewire.partials.collab-card-inner', ['p' => $p, 'cfg' => $cfg, 'dateText' => $dateText, 'inclusionText' => $inclusionText])
        </div>
    </div>
@else
    <div
        wire:key="collab-card-{{ $p->id }}"
        class="animate-fade-in"
        x-on:dragover.prevent="$event.dataTransfer.dropEffect = 'move'"
        x-on:drop.prevent="
            const id = parseInt($event.dataTransfer.getData('text/plain'), 10);
            if (! Number.isFinite(id) || id === {{ $p->id }}) return;
            $event.stopPropagation();
            $wire.moveToStatus(id, @js($columnStatus));
        "
    >
        <div
            data-collab-card-surface
            class="glass-card rounded-xl p-4 motion-safe:transition-[box-shadow,border-color] motion-safe:duration-200 hover:border-border/80 hover:shadow-md"
        >
            @include('livewire.partials.collab-card-inner', ['p' => $p, 'cfg' => $cfg, 'dateText' => $dateText, 'inclusionText' => $inclusionText])
        </div>
    </div>
@endcan