{{--
    Shared: artwork suggestion card for error pages.
    Expects $artwork array: [id, title, author, url, thumb]
--}}
<a href="{{ $artwork['url'] }}" class="group relative rounded-xl overflow-hidden bg-nova-800 border border-white/5 hover:border-sky-500/30 transition-all duration-200 block">
    @if($artwork['thumb'])
    <div class="aspect-video w-full overflow-hidden bg-nova-700">
        <img src="{{ $artwork['thumb'] }}"
             alt="{{ $artwork['title'] }}"
             loading="lazy"
             class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-300 opacity-80 group-hover:opacity-100" />
    </div>
    @else
    <div class="aspect-video w-full bg-gradient-to-br from-nova-700 to-nova-800 flex items-center justify-center">
        <i class="fas fa-image text-white/20 text-3xl" aria-hidden="true"></i>
    </div>
    @endif
    <div class="p-3">
        <p class="text-sm font-semibold text-white truncate">{{ $artwork['title'] }}</p>
        <p class="text-xs text-white/50 truncate mt-0.5">by {{ $artwork['author'] }}</p>
    </div>
</a>