{{-- Confirm-delete modal in CluPilot glass style. --}}
<div class="clu-modal-card">
    <div class="clu-modal-head">
        <div class="clu-modal-ico">
            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
                <path d="M10.3 3.86l-8.55 14.83A2 2 0 0 0 3.46 22h17.08a2 2 0 0 0 1.71-3.31L13.7 3.86a2 2 0 0 0-3.4 0z"/>
                <path d="M12 9v4M12 17h.01"/>
            </svg>
        </div>
        <div>
            <h2 class="clu-modal-title">{{ $title }}</h2>
            <p class="clu-modal-msg">{{ $message }}</p>
        </div>
    </div>

    <div class="clu-modal-foot">
        <button type="button" class="clu-ghost-btn" wire:click="closeModal">{{ $cancelLabel }}</button>
        <button type="button" class="clu-btn-primary clu-btn-danger" wire:click="confirm">
            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true">
                <path d="M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2M6 6l1 14a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-14"/>
            </svg>
            {{ $confirmLabel }}
        </button>
    </div>
</div>