<div>
    <button type="button" class="btn btn-link btn-sm p-0" wire:click="toggle">
        <i class="mdi {{ $expanded ? 'mdi-chevron-up' : 'mdi-chevron-down' }}"></i>
        {{ $expanded ? 'Hide events' : 'Events' }}
    </button>

    @if($expanded && $message)
        <div class="mt-2 text-start">
            @if($message->events->isEmpty())
                <div class="small text-muted">No events recorded yet.</div>
            @else
                <ul class="list-unstyled small mb-0">
                    @foreach($message->events as $event)
                        <li class="mb-1">
                            <span class="badge bg-{{ $event->event_type->color() }}">
                                {{ $event->event_type->label() }}
                            </span>
                            <span class="text-muted">
                                {{ $event->occurred_at?->diffForHumans() }}
                            </span>
                            @if($event->mapped_status)
                                &middot; status → {{ $event->mapped_status->label() }}
                            @endif
                        </li>
                    @endforeach
                </ul>
            @endif
        </div>
    @endif
</div>
