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

<div {{ $attributes->merge(['class' => 'tw-page-header']) }}>
    <div class="min-w-0 flex-1">
        <h1 class="tw-page-title tracking-tight">{{ $title }}</h1>
        @if ($subtitle)
            <p class="mt-1 text-sm text-[var(--color-text-muted)]">{{ $subtitle }}</p>
        @endif
        @isset($subtitleSlot)
            <div class="mt-1 text-sm text-[var(--color-text-muted)]">{{ $subtitleSlot }}</div>
        @endisset
    </div>

    @isset($actions)
        <div class="tw-page-header__actions flex flex-wrap items-center gap-2 w-full sm:w-auto">
            {{ $actions }}
        </div>
    @endisset
</div>