@props([
    'placeholder' => 'Suche nach Aufgaben, Fächern, Themen…',
])

<div class="flex-1 max-w-[480px] flex items-center gap-2 px-3 py-2 rounded-lg bg-bg-soft border border-line text-ink-3 text-sm">
    <x-heroicon-o-magnifying-glass class="w-4 h-4" />
    <span class="flex-1 truncate">{{ $placeholder }}</span>
    <span class="text-xs px-1.5 py-0.5 rounded bg-bg-base text-ink-3 font-mono">⌘ K</span>
</div>