@props([
    'title',
    'subtitle' => null,
])

<div {{ $attributes->merge(['class' => 'bg-white rounded-xl border border-gray-200 shadow-sm p-5 flex flex-col']) }}>
    <div class="flex items-start justify-between gap-3">
        <div>
            <h3 class="text-base font-semibold text-gray-900">
                {{ $title }}
            </h3>
            @if($subtitle)
                <p class="mt-0.5 text-xs text-gray-500">
                    {{ $subtitle }}
                </p>
            @endif
        </div>

        @isset($icon)
            <div class="text-gray-400">
                {{ $icon }}
            </div>
        @endisset
    </div>

    <div class="mt-4 text-sm text-gray-700 flex-1">
        {{ $slot }}
    </div>

    @isset($actions)
        <div class="mt-4">
            {{ $actions }}
        </div>
    @endisset
</div>