<ul type="none" class="fw-700 f-15 related-blogs clrBlueDark mt-0 ps-0">
    @foreach($recentEvents as $event)
        <li class="mb-2">
            <div class="d-flex p-1 bg-white rounded-3">
                <div class="pe-2 pe-md-3">
                    <a href="{{ route('events.show', $event->Slug) }}">
                        @if(count($event->media))
                            <img src="{{ $event->media[0]->thumbnail_url }}" alt="" class="rounded-3">
                        @else
                            <img src="{{ asset('img/default-event.jpeg') }}" alt="" class="rounded-3">
                        @endif
                    </a>
                </div>
                <div>
                    <span class="rounded-pill mb-2 d-inline-block bgBlueLight clrBlueDark f-11 fw-400 px-2 py-0">
                        {{ $event->EventDate }}
                    </span>
                    <h3 class="fw-500 f-16  mb-0">
                        <a href="{{ route('events.show', $event->Slug) }}" class="clrGrey no-underline blog-link-text mt-0 clr5c">
                            {{ $event->EventName }}
                        </a>
                    </h3>
                </div>
            </div>
        </li>
    @endforeach
</ul>