<div class="modal fade text-left" id="default" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"
    aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
        <div class="modal-content">

            <div class="modal-header">
                <h5 class="modal-title" id="myModalLabel1">Detail Pesanan Foto</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>s
            </div>

            <div class="modal-body">
                <div class="row">

                    <div class="col-12 col-md-7">

                        <h6 class="mb-3 fw-bold">Rincian Pesanan</h6>
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted">Tanggal Booking</span>
                            <span class="fw-semibold">Kamis 10 Juni 2025</span>
                        </div>
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted">Waktu Booking</span>
                            <span class="fw-semibold">10.00</span>
                        </div>
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted">Paket Foto</span>
                            <span class="fw-semibold">Single</span>
                        </div>
                        <div class="d-flex justify-content-between mb-4">
                            <span class="text-muted">Additional yang Dipilih</span>
                            <div class="text-end">
                                <span class="d-block fw-semibold">Kostum boneka</span>
                                <small class="text-muted">x1</small>
                            </div>
                        </div>

                        <h6 class="mb-3 fw-bold">Informasi Pemesan</h6>
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted">Nama Lengkap</span>
                            <span class="fw-semibold">Budi Susanto</span>
                        </div>
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted">Nomor WhatsApp</span>
                            <span class="fw-semibold">089673665678</span>
                        </div>
                    </div>

                    <div class="col-12 col-md-5 mt-4 mt-md-0">
                        <h6 class="mb-3 fw-bold">Pembayaran</h6>

                        <div class="p-3 bg-light rounded">
                            <div class="d-flex justify-content-between align-items-center mb-2">
                                <span class="text-muted">Status Pesanan</span>
                                <span
                                    class="badge bg-success-subtle text-success px-3 py-2 rounded-pill">Terbayar</span>
                            </div>
                            <div class="d-flex justify-content-between align-items-center mb-3">
                                <span class="text-muted">Total</span>
                                <span class="fw-bold fs-6">Rp 150.000</span>
                            </div>

                            <div class="mb-2">
                                <span class="text-muted d-block mb-2">Bukti Pembayaran</span>
                                <div class="text-center border rounded p-2 bg-white">
                                    <img src="{{ asset('path/to/bukti-transfer.jpg') }}" alt="Bukti Transfer"
                                        class="img-fluid rounded" style="max-height: 200px;">
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>

            <div class="modal-footer border-top-0 justify-content-end pt-0 pb-4 pe-4">
                <button type="button" class="btn btn-danger px-4" data-bs-dismiss="modal">
                    Tolak Pesanan
                </button>
                <button type="button" class="btn btn-success ms-2 px-4">
                    Terima Pesanan
                </button>
            </div>

        </div>
    </div>
</div>
