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

<div {{ $attributes->merge(['class' => "bg-white shadow-md rounded-lg $class"]) }}>
    {{-- 🔹 Encabezado --}}
    @if ($title)
        <div class="border-b px-4 py-3">
            <h3 class="text-lg font-semibold text-gray-800">
                {{ $title }}
            </h3>
        </div>
    @endif

    {{-- 🔹 Contenido principal --}}
    <div class="p-4">
        {{ $slot }}
    </div>

    {{-- 🔹 Pie de tarjeta --}}
    @if ($footer)
        <div class="border-t px-4 py-3 text-sm text-gray-600">
            {{ $footer }}
        </div>
    @endif
</div>