@forelse($events as $event)
<div class="event-item" data-event-type="{{ $event->event_type }}" data-color="{{ $event->color_style }}">
    <div class="event-icon">
        <i class="bi bi-calendar-event"></i>
    </div>
    <div class="event-info">
        <div class="event-title">{{ $event->title }}</div>
        <div class="event-date">
            <i class="bi bi-calendar3"></i>
            {{ $event->start_date->format('d M') }}
            @if($event->start_date->format('Y-m-d') != $event->end_date->format('Y-m-d'))
            - {{ $event->end_date->format('d M Y') }}
            @else
            {{ $event->start_date->format('Y') }}
            @endif
        </div>
    </div>
    <span class="event-type-badge" style="background: {{ $event->color_style }};">
        {{ $eventTypes[$event->event_type] ?? $event->event_type }}
    </span>
</div>
@empty
<div class="event-empty">
    <i class="bi bi-calendar-x"></i>
    <p>Tidak ada upcoming events dalam 14 hari ke depan</p>
</div>
@endforelse