@if($events->isNotEmpty())
<section class="oric-events-section py-5">
    <div class="container">
        @include('front.new.oric.partials.section-heading', ['title' => 'Upcoming Events'])
        <div class="oric-events-wrapper mt-4">
            <div class="table-responsive">
                <table class="table table-hover align-middle mb-0 oric-events-table">
                    <thead>
                        <tr class="text-center">
                            <th></th>
                            <th>#</th>
                            <th>DATE</th>
                            <th>LEVEL</th>
                            <th>TOPIC</th>
                            <th>RESOURCE PERSON(s)</th>
                            <th>DETAILS</th>
                        </tr>
                    </thead>
                    <tbody>

                        @foreach($events as $event)
                            @php
                                $type = strtolower(optional($event->type)->name);
                                $icon = $eventIcons[$type] ?? 'ri-calendar-event-line';
                            @endphp
                            <tr>
                                <td class="text-center">
                                    <span class="oric-event-icon"><i class="{{ $icon }}"></i></span>
                                </td>
                                <td>{{ $loop->iteration }}</td>
                                <td class="text-center">{{ \Carbon\Carbon::parse($event->e_date)->format('d-M-Y') }}</td>
                                <td class="text-center">{{ optional($event->level)->name ?? '-' }}</td>
                                <td>{{ $event->title }}</td>
                                <td>{{ $event->resource_person }}</td>
                                <td class="text-center">
                                    @if($event->slug)
                                        <a href="{{ route('oric-event-detail', $event->slug) }}" class="oric-event-view">
                                            <i class="ri-arrow-right-up-line"></i>
                                        </a>
                                    @else
                                        <span class="oric-event-view text-muted"><i class="ri-arrow-right-up-line"></i></span>
                                    @endif
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</section>
@endif