{{--
    "Aujourd'hui"'s inline quick-add — click, type, Enter. Creates a
    project-less task due today (see Today::createQuickTask()) and
    immediately refocuses an empty field, Todoist-style.

    The `wire:key` is deliberately tied to the current task count: it
    changes every time a task is added, so Livewire treats the input as a
    brand-new DOM node — needed for the refocus below to reliably re-target
    it after the round-trip, since a node left in place wouldn't regain
    focus on its own.

    Refocus itself listens for `quick-task-added` (dispatched by
    `Today::createQuickTask()`) rather than using a plain `x-init`: `x-init`
    runs on *every* mount, including the page's very first paint — which
    silently stole keyboard focus (and drew the browser's native focus
    outline) the instant the page loaded, before anyone had touched
    anything. Scoping it to the dispatch means it only fires as a direct
    consequence of actually adding a task.
--}}
<div class="flex items-center gap-3 border-b border-gray-100 px-3 md:px-6 py-3 dark:border-white/5">
    <span class="flex h-5 w-5 shrink-0 items-center justify-center text-primary-600 dark:text-primary-500">
        <x-filament::icon icon="heroicon-o-plus" class="h-4 w-4" />
    </span>
    <input
        type="text"
        wire:model="newTaskTitle"
        wire:keydown.enter="createQuickTask"
        wire:key="quick-add-today-{{ $this->todaysTasks()->count() }}"
        x-on:quick-task-added.window="$nextTick(() => $el.focus())"
        placeholder="Ajouter une tâche pour aujourd'hui…"
        class="min-w-0 flex-1 border-0 bg-transparent px-0 py-0.5 text-xs md:text-sm text-gray-900 placeholder:text-gray-400 focus:placeholder:text-transparent focus:outline-none focus:ring-0 dark:text-gray-100 dark:placeholder:text-gray-500"
    />
</div>