@props([
    /** Überschrift (bereits übersetzt übergeben) */
    'title' => '',

    /** Erläuternder Text unter der Überschrift */
    'subtitle' => '',

    /** Icon-Farbvariante: default | warm (gefilterte Leerzustände) | err */
    'variant' => 'default',
])

{{--
    Zentrierter Leerzustand für Tabellen/Listen. Ersetzt den mehrfach kopierten
    empty-stage-Block. Slots:
      <x-slot:icon>    – Icon (flux:icon.* oder inline-<svg>) im runden Rahmen
      <x-slot:actions> – optionale Buttons unter dem Text
--}}
<div class="empty-stage">
    <div @class(['empty-ico', 'warm' => $variant === 'warm', 'err' => $variant === 'err'])>
        {{ $icon ?? '' }}
    </div>

    @if (filled($title))
        <h3 class="empty-title">{{ $title }}</h3>
    @endif

    @if (filled($subtitle))
        <p class="empty-sub">{{ $subtitle }}</p>
    @endif

    @isset($actions)
        <div class="flex items-center gap-2.5 mt-6">
            {{ $actions }}
        </div>
    @endisset

    {{-- Optionaler Zusatzinhalt unter den Aktionen (z. B. Onboarding-Schritte) --}}
    {{ $slot }}
</div>