@props([
    'title' => '데이터가 없습니다',
    'description' => null,
    'ctaLabel' => null,
    'href' => null,
])

<div {{ $attributes->class('empty-state') }}>
    <div class="empty-state-icon">
        @if (trim((string) $slot) !== '')
            {{ $slot }}
        @else
            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" class="c-primary" stroke-width="1.8">
                <rect x="2" y="4" width="20" height="16" rx="2"></rect>
                <path d="M8 4v16M16 4v16M2 10h20M2 16h20"></path>
            </svg>
        @endif
    </div>

    <div class="empty-state-title">{{ $title }}</div>

    @if ($description)
        <div class="empty-state-description">{{ $description }}</div>
    @endif

    @if ($ctaLabel && $href)
        <x-ui.button :href="$href" variant="primary" size="md" class="empty-state-cta">
            {{ $ctaLabel }}
        </x-ui.button>
    @endif
</div>