@php
    $contactsByHash = $contactsByHash ?? collect();
    $contactIndex = $contactIndex ?? [];
@endphp

<section id="contacts-section-activity" class="scroll-mt-4">
    <h3 class="text-lg font-semibold text-gray-800 mb-3">{{ __('devices.contacts.activity_title') }}</h3>
    @if($events->isEmpty())
        <p class="text-slate-500 text-sm contacts-empty-events py-6 text-center border border-dashed border-slate-200 rounded-lg bg-slate-50/50">
            {{ __('devices.contacts.activity_empty') }}
        </p>
    @else
        <ul id="contacts-events-list" class="divide-y divide-gray-100 border border-gray-200 rounded-lg overflow-hidden">
            @foreach($events as $event)
                @include('admin.devices.partials.contact-event-row', [
                    'event' => $event,
                    'device' => $device,
                    'linkedContact' => \App\Support\ContactResolver::resolveLinkedContact(
                        $device,
                        $event->contact_hash,
                        $event->phone_no ?? $event->after_data['phoneNo'] ?? null,
                        $contactsByHash,
                        $contactIndex,
                    ),
                    'contactIndex' => $contactIndex,
                    'activityHidden' => $loop->index >= 5,
                ])
            @endforeach
        </ul>
        <div id="contacts-activity-more-wrap" class="mt-3 text-center {{ $events->count() <= 5 ? 'hidden' : '' }}">
            <button type="button"
                    id="contacts-load-more"
                    class="inline-flex items-center px-4 py-2 text-sm font-medium text-indigo-700 bg-indigo-50 border border-indigo-200 rounded-lg hover:bg-indigo-100 transition-colors">
                {{ __('devices.contacts.load_more') }}
                <span id="contacts-load-more-count" class="ml-1 text-indigo-500"></span>
            </button>
        </div>
    @endif
</section>

<section id="contacts-section-agenda" class="mt-10 scroll-mt-4">
    <h3 class="text-base font-semibold text-slate-800 mb-3">
        {{ __('devices.contacts.agenda_title') }}
        (<span id="contacts-count">{{ $contacts->count() }}</span>)
    </h3>

    @if($contacts->isEmpty())
        <p class="text-slate-500 text-sm contacts-empty-list py-8 text-center border border-dashed border-slate-200 rounded-lg bg-slate-50/50">
            {{ __('devices.contacts.agenda_empty') }}
        </p>
    @else
        <p id="contacts-no-results" class="hidden text-slate-500 text-sm py-8 text-center border border-dashed border-slate-200 rounded-lg bg-slate-50/50">
            {{ __('devices.contacts.agenda_no_results') }}
        </p>
        <div id="contacts-table-wrap" class="overflow-x-auto border border-slate-200 rounded-lg shadow-sm">
            <table class="min-w-full divide-y divide-slate-200">
                <thead class="bg-slate-50">
                    <tr>
                        <th class="px-4 py-3 text-left text-xs font-semibold text-slate-500 uppercase tracking-wide">{{ __('devices.contacts.col_contact') }}</th>
                        <th class="px-4 py-3 text-left text-xs font-semibold text-slate-500 uppercase tracking-wide">{{ __('devices.contacts.col_phone') }}</th>
                        <th class="px-4 py-3 text-left text-xs font-semibold text-slate-500 uppercase tracking-wide">{{ __('devices.contacts.col_synced') }}</th>
                    </tr>
                </thead>
                <tbody id="contacts-table-body" class="divide-y divide-slate-100 bg-white">
                    @foreach($contacts as $contact)
                        @php
                            $cName = $contact->name ?: __('devices.contacts.no_name');
                            $cWords = preg_split('/\s+/u', trim($cName), -1, PREG_SPLIT_NO_EMPTY) ?: [];
                            $cInitials = '';
                            foreach (array_slice($cWords, 0, 2) as $w) {
                                $cInitials .= mb_strtoupper(mb_substr($w, 0, 1));
                            }
                            if ($cInitials === '') {
                                $cInitials = '?';
                            }
                            $searchKey = mb_strtolower($cName.' '.($contact->phone_no ?? ''));
                            $profileUrl = \App\Support\ContactResolver::profileUrl($device, $contact->phone_no, $contact);
                        @endphp
                        <tr class="contact-row hover:bg-indigo-50/50 transition-colors cursor-pointer"
                            data-contact-id="{{ $contact->id }}"
                            data-search="{{ $searchKey }}"
                            data-href="{{ $profileUrl }}"
                            role="link"
                            tabindex="0">
                            <td class="px-4 py-3">
                                <a href="{{ $profileUrl }}" class="flex items-center gap-3 group">
                                    <div class="w-9 h-9 rounded-full bg-indigo-600 text-white flex items-center justify-center text-xs font-semibold shrink-0" aria-hidden="true">
                                        {{ $cInitials }}
                                    </div>
                                    <span class="text-sm font-medium text-slate-900 group-hover:text-indigo-700">{{ $cName }}</span>
                                </a>
                            </td>
                            <td class="px-4 py-3" onclick="event.stopPropagation()">
                                @if($contact->phone_no)
                                    <a href="tel:{{ preg_replace('/\s+/', '', $contact->phone_no) }}"
                                       class="text-sm font-mono text-indigo-600 hover:text-indigo-800 hover:underline">
                                        {{ $contact->phone_no }}
                                    </a>
                                @else
                                    <span class="text-slate-400 text-sm">—</span>
                                @endif
                            </td>
                            <td class="px-4 py-3 text-xs text-slate-500 whitespace-nowrap"
                                title="{{ $contact->updated_at?->format('d/m/Y H:i:s') }}">
                                {{ $contact->updated_at?->diffForHumans() ?? '—' }}
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    @endif
</section>