{{--
    Page title, optional subtitle, optional breadcrumb, optional action buttons.

        <x-page-header title="Assets" subtitle="412 records">
            <x-slot:breadcrumbs>
                <li class="breadcrumb-item"><a href="...">Assets</a></li>
                <li class="breadcrumb-item active">AUM-LAP-0042</li>
            </x-slot:breadcrumbs>

            <a href="..." class="btn btn-primary">Add Asset</a>
        </x-page-header>

    Actions are laid out right-aligned in source order, so the primary action
    goes LAST in the slot — it lands on the right edge, where the eye finishes.
    Buttons here are full size, not `btn-sm`: this is the most important control
    on the page and should not be the smallest.
--}}
@props([
    'title',
    'subtitle' => null,
    'breadcrumbs' => null,
])

<div {{ $attributes->merge(['class' => 'ams-page-header']) }}>
    <div class="min-width-0">
        {{--
            The breadcrumb sits inside the header block, above the title it
            belongs to. Rendered before the header — as it was — it became a
            free-floating strip with its own margin, and the title lost its
            connection to it.
        --}}
        @if ($breadcrumbs)
            <nav aria-label="Breadcrumb" class="ams-page-header__crumbs ams-no-print">
                <ol class="breadcrumb">
                    {{ $breadcrumbs }}
                </ol>
            </nav>
        @endif

        <h1>{{ $title }}</h1>

        @if ($subtitle)
            <p>{{ $subtitle }}</p>
        @endif
    </div>

    @if (! $slot->isEmpty())
        <div class="ams-page-header__actions ams-no-print">
            {{ $slot }}
        </div>
    @endif
</div>
