@extends('guest.layout.main')
@section('body_main_guests')
    <section class="section py-5 bg-light text-center">
    <div class="container">
        <div class="card shadow-lg p-4 mx-auto" style="max-width: 600px;">
            <div class="mb-4">
                <img src="{{ asset('gambar/success.svg') }}" alt="Success" style="width: 100px;">
            </div>
            <h3 class="text-success mb-3">Pesanan Anda Berhasil!</h3>
            <p class="lead">Terima kasih atas pesanan Anda. Kami akan segera menyiapkannya dan menghubungi Anda jika diperlukan.</p>
            <hr class="my-4">
            <p class="text-muted">Silakan cek status pesanan secara berkala atau hubungi kami jika ada pertanyaan.</p>
            <p>No Order : <strong>{{ $no_order }}</strong>
                <button class="btn btn-sm btn-outline-secondary ms-2" onclick="copyNoOrder()">
                    <i class="fa fa-copy"></i> Salin
                </button>
            </p>
            <a href="/" class="btn btn-success mt-3"><i class="fa fa-home me-1"></i> Kembali ke Beranda</a>
        </div>
    </div>
</section>
@endsection
<script>
    document.addEventListener('DOMContentLoaded', () => {
        $("#cartButton").addClass('d-none');
    })
    function copyNoOrder() {
        const text = document.getElementById('noOrderText').innerText;
        navigator.clipboard.writeText(text).then(() => {
            alert("Nomor order berhasil disalin: " + text);
        }).catch(err => {
            console.error('Gagal menyalin: ', err);
            alert("Gagal menyalin teks.");
        });
    }
</script>