@props([
    'icon' => 'inbox',
    'title' => 'No data found',
    'description' => null,
    'action' => null,
    'actionUrl' => null,
])

<div {{ $attributes->merge(['class' => 'text-center py-12']) }}>
    <div class="w-16 h-16 mx-auto bg-gray-100 dark:bg-gray-700 rounded-full flex items-center justify-center mb-4">
        <i class="fas fa-{{ $icon }} text-2xl text-gray-400 dark:text-gray-500"></i>
    </div>
    <h3 class="text-lg font-medium text-gray-900 dark:text-white mb-1">{{ $title }}</h3>
    @if($description)
        <p class="text-gray-500 dark:text-gray-400 mb-4">{{ $description }}</p>
    @endif
    @if($action && $actionUrl)
        <a href="{{ $actionUrl }}" class="inline-flex items-center px-4 py-2 bg-indigo-600 hover:bg-indigo-700 text-white text-sm font-medium rounded-lg transition">
            <i class="fas fa-plus me-2"></i>
            {{ $action }}
        </a>
    @endif
</div>