{% load cotton %}

<!-- Featured Rides Grid -->
{% for ride in featured_rides %}
    <c-ride_card :ride="ride" url_variant="global" class="h-full" />
{% empty %}
<div class="col-span-full text-center py-12">
    <svg class="w-16 h-16 text-muted-foreground mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
    </svg>
    <h3 class="text-lg font-semibold mb-2">No Featured Rides</h3>
    <p class="text-muted-foreground">Check back soon for featured thrilling rides!</p>
</div>
{% endfor %}