@props(['title' => null, 'padded' => true])
<div {{ $attributes->merge(['class' => 'bg-white rounded-2xl shadow-[0_1px_3px_rgba(15,23,42,0.04),0_8px_24px_-12px_rgba(15,23,42,0.10)] '.($padded ? '' : 'overflow-hidden')]) }}>
    @if($title)
        <div class="px-5 py-4 border-b border-slate-100 flex items-center justify-between gap-3">
            <h3 class="font-semibold text-slate-800">{{ $title }}</h3>
            @isset($action)<div>{{ $action }}</div>@endisset
        </div>
    @endif
    <div class="{{ $padded ? 'p-5 sm:p-6' : '' }}">{{ $slot }}</div>
</div>