@props(['title'])
<div class="sticky top-0 z-10 flex items-center justify-between border-b border-neutral-200 bg-white/90 px-6 py-4 backdrop-blur dark:border-neutral-700 dark:bg-neutral-900/90">
    <div>
        <h2
            id="modalGenresLabel"
            class="text-xl font-semibold text-neutral-900 dark:text-white"
        >
            {{ $title }} 
        </h2>
    </div>

    <button
        type="button"
        data-te-modal-dismiss
        class="rounded-lg p-2 text-neutral-500 transition hover:bg-neutral-100 hover:text-black dark:hover:bg-neutral-800 dark:hover:text-white"
    >
        ✕
    </button>
</div>