{{--
    Monitoring — Preset Bar (shared partial)
    Included by both My Queue and All Orders tabs.
    Presets are page-wide (they save/restore All Orders filter state).
--}}
<div class="monitoring-preset-bar">

    {{-- Active preset pill --}}
    @if ($activePresetId)
        @php $activePreset = collect($this->userPresets)->firstWhere('id', $activePresetId); @endphp
        @if ($activePreset)
            <span class="preset-active-pill">
                <svg style="width:12px;height:12px;" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 5a2 2 0 012-2h10a2 2 0 012 2v16l-7-3.5L5 21V5z"/></svg>
                {{ $activePreset->name }}
                <button wire:click="clearPreset" class="preset-close" title="Clear preset">&times;</button>
            </span>
        @endif
    @endif

    {{-- Presets dropdown (Alpine.js) --}}
    <div x-data="{ open: false }" style="position:relative;">
        <button @click="open = !open" class="preset-dropdown-btn">
            <svg style="width:14px;height:14px;" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 5a2 2 0 012-2h10a2 2 0 012 2v16l-7-3.5L5 21V5z"/></svg>
            My Presets
            <svg style="width:12px;height:12px;" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/></svg>
        </button>

        <div x-show="open"
             @click.away="open = false"
             x-transition:enter="transition ease-out duration-100"
             x-transition:enter-start="opacity-0 scale-95"
             x-transition:enter-end="opacity-100 scale-100"
             x-transition:leave="transition ease-in duration-75"
             x-transition:leave-start="opacity-100 scale-100"
             x-transition:leave-end="opacity-0 scale-95"
             class="preset-dropdown-menu"
             style="display: none;">

            @forelse ($this->userPresets as $preset)
                <div class="preset-dropdown-item">
                    <button @click="open = false"
                        wire:click="loadPreset({{ $preset->id }})"
                        class="preset-load">
                        {{ $preset->name }}
                        @if ($preset->is_default)
                            <span class="preset-star" title="Default preset">&#9733;</span>
                        @endif
                        @if ($activePresetId == $preset->id)
                            <span class="preset-check">&#10003;</span>
                        @endif
                    </button>
                    <button wire:click="deletePreset({{ $preset->id }})"
                        wire:confirm="Delete preset '{{ addslashes($preset->name) }}'?"
                        class="preset-delete"
                        title="Delete preset">&times;</button>
                </div>
            @empty
                <p style="padding:8px 12px;font-size:12px;color:#adb5bd;font-style:italic;">No saved presets yet.</p>
            @endforelse

            <div class="preset-dropdown-footer">
                <button @click="open = false; $wire.set('showSavePresetModal', true)">
                    + Save Current Filters as Preset
                </button>
            </div>

        </div>
    </div>

</div>