@props([
    'id'    => null,        // shown as "#id" mono badge in the header strip
    'title' => null,        // the H3 line
])

<div {{ $attributes->class(['ds-list-card']) }}>
    @if ($id !== null || isset($badges) || isset($actions))
        <div class="d-flex justify-content-between align-items-start flex-wrap gap-2 mb-1">
            <div class="d-flex align-items-center gap-2 flex-wrap">
                @if ($id !== null)
                    <span class="ds-list-id">#{{ $id }}</span>
                @endif
                @isset($badges) {{ $badges }} @endisset
            </div>

            @isset($actions)
                <div class="d-flex gap-1 align-items-center">{{ $actions }}</div>
            @endisset
        </div>
    @endif

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

    {{ $slot }}
</div>