@props(['heading' => null, 'subtitle' => null, 'padding' => true])

<div class="overflow-hidden rounded-2xl border border-slate-100 bg-white shadow-sm shadow-slate-900/[0.03]">
    @if ($heading)
        <div class="flex items-center justify-between gap-3 border-b border-slate-100 px-5 py-4">
            <div>
                <h2 class="font-display text-sm font-bold text-slate-900">{{ $heading }}</h2>
                @if ($subtitle)
                    <p class="mt-0.5 text-xs text-slate-400">{{ $subtitle }}</p>
                @endif
            </div>
            @isset($actions)
                <div class="shrink-0">{{ $actions }}</div>
            @endisset
        </div>
    @endif
    <div class="{{ $padding ? 'p-5' : '' }}">{{ $slot }}</div>
</div>