{{-- MODAL DELETE PANDUAN --}}
<div class="panduan-modal" id="deletePanduanModal" aria-hidden="true">
    <div class="panduan-modal-overlay"></div>

    <div class="panduan-modal-dialog" role="dialog" aria-modal="true">
        {{-- HEADER --}}
        <div class="panduan-modal-header">
            <div class="panduan-modal-header-left">
                <div class="modal-title-icon" style="background: #fee2e2; color: #dc2626;">
                    <i class="fa-solid fa-trash"></i>
                </div>
                <div>
                    <h2>Hapus Panduan</h2>
                    <p>Konfirmasi tindakan penghapusan data.</p>
                </div>
            </div>
            <button type="button" class="modal-close-button" id="closeDeletePanduanModal" aria-label="Tutup">
                <i class="fa-solid fa-xmark"></i>
            </button>
        </div>

        {{-- FORM DELETE --}}
        <form id="formDeletePanduan" action="" method="POST">
            @csrf
            @method('DELETE')

            <div class="panduan-modal-body" style="padding: 1.5rem; text-align: center;">
                <p style="font-size: 1.05rem; color: #374151;">
                    Apakah Anda yakin ingin menghapus panduan <strong id="deletePanduanJudul"></strong>?
                </p>
                <p style="font-size: 0.875rem; color: #6b7280; margin-top: 0.5rem;">
                    Tindakan ini tidak dapat dibatalkan dan file terkait akan dihapus secara permanen.
                </p>
            </div>

            {{-- FOOTER --}}
            <div class="panduan-modal-footer">
                <button type="button" class="modal-btn-cancel" id="cancelDeletePanduanModal">
                    <i class="fa-solid fa-xmark"></i> Batal
                </button>
                <button type="submit" class="modal-btn-submit" style="background-color: #dc2626; color: #fff;">
                    <i class="fa-solid fa-trash"></i> Ya, Hapus
                </button>
            </div>
        </form>
    </div>
</div>