{{-- Small inline toolbar with Core/Dialplan/PJSIP reload buttons --}}
<div
    x-data="{
        async go(kind) {
            try {
                const r = await fetch('{{ route('asterisk.reload') }}', {
                    method: 'POST',
                    headers: {
                        'X-CSRF-TOKEN': document.querySelector('meta[name=csrf-token]')?.getAttribute('content') || '',
                        'Content-Type': 'application/x-www-form-urlencoded'
                    },
                    body: new URLSearchParams({ action: kind })
                });
                if (!r.ok) throw new Error('Reload failed');
                // also clear global pill reason for this kind
                const ls = JSON.parse(localStorage.getItem('pendingReload') || '{}');
                if (ls[kind]) { delete ls[kind]; localStorage.setItem('pendingReload', JSON.stringify(ls)); window.dispatchEvent?.(new StorageEvent('storage', {key:'pendingReload', newValue: JSON.stringify(ls)})); }
                window.dispatchEvent?.(new CustomEvent('toast', { detail: { type: 'success', message: `Asterisk ${kind} reload OK` }}));
            } catch (e) {
                window.dispatchEvent?.(new CustomEvent('toast', { detail: { type: 'error', message: `Reload failed: ${e.message}` }}));
            }
        }
    }"
    class="d-flex align-items-center gap-2"
>
    <button @click="go('core')" class="btn btn-secondary btn-sm d-inline-flex align-items-center gap-1">
        <x-lucide-settings class="w-4 h-4" />
        Core Reload
    </button>
    <button @click="go('dialplan')" class="btn btn-primary btn-sm d-inline-flex align-items-center gap-1">
        <x-lucide-git-branch class="w-4 h-4" />
        Dialplan Reload
    </button>
    <button @click="go('pjsip')" class="btn btn-success btn-sm d-inline-flex align-items-center gap-1">
        <x-lucide-radio class="w-4 h-4" />
        PJSIP Reload
    </button>
</div>