@php
    $type = $item['type'];
    $at = $item['at'];
    $model = $item['model'];
@endphp

<li class="flex gap-3 p-4 hover:bg-slate-50 transition-colors border-b border-slate-100 last:border-0">
    @if($type !== 'call')
    <div class="flex-shrink-0 w-9 h-9 rounded-full flex items-center justify-center text-xs font-bold text-white"
         style="{{ match($type) {
            'contact_event' => 'background-color:#6366f1',
            default => 'background-color:#64748b',
         } }}">
        {{ match($type) {
            'contact_event' => 'C',
            default => '·',
        } }}
    </div>
    @endif
    <div class="flex-1 min-w-0 w-full">
        @if($type === 'contact_event')
            @include('admin.devices.partials.contact-event-inline', [
                'event' => $model,
                'device' => $device,
                'linkedContact' => $contact,
                'contactIndex' => $contactIndex ?? [],
            ])
        @elseif($type === 'call')
            <div class="flex flex-wrap items-center justify-between gap-2 w-full min-w-0">
                <x-call-type-badge :call="$model" />
                <time class="text-xs text-slate-500 whitespace-nowrap shrink-0"
                      datetime="{{ $at->toIso8601String() }}"
                      title="{{ $at->format('d/m/Y H:i:s') }}">
                    {{ $at->format('d/m/Y H:i') }}
                </time>
            </div>
        @endif
    </div>
</li>