<div class="rounded-xl overflow-hidden shadow bg-white">
    <img src="{{ $course->thumbnail_url ?? '/images/default-course.jpg' }}"
         alt="{{ $course->name }}"
         class="w-full h-40 object-cover">

    <div class="p-4">
        <h3 class="font-semibold text-gray-900">{{ $course->name }}</h3>
        <p class="text-gray-600 text-sm mb-3">{{ $course->description }}</p>
        <a href="{{ route('student.courses.show', $course->id) }}"
           class="inline-block text-blue-600 font-semibold hover:underline">
           View Course →
        </a>
    </div>
</div>