@extends('frontend::layouts.master')

@section('content')
    <div class="member-profile bg-light min-vh-100 py-0">
        <div class="container-fluid">
            <div class="row">

                <!-- Sidebar ด้านซ้าย -->
                <div class="col-md-3 col-lg-2 bg-secondary text-white min-vh-100 p-4">
                    <h5 class="fw-bold mb-4">เมนู</h5>
                    <ul class="nav flex-column">
                        <li class="nav-item mb-2">
                            <a class="nav-link text-white px-0" href="{{ route('frontend.member-profile') }}">ข้อมูลสมาชิก</a>
                        </li>
                        <li class="nav-item mb-2">
                            <a class="nav-link text-white px-0" href="{{ route('frontend.member-product-store') }}">ร้านสินค้า</a>
                        </li>
                        <li class="nav-item mb-2">
                            <a class="nav-link text-white px-0" href="{{ route('frontend.member-product-accom') }}">ที่พัก</a>
                        </li>
                        <li class="nav-item mb-2">
                            <a class="nav-link text-white px-0" href="{{ route('frontend.member-product-tour') }}">สถานที่ท่องเที่ยว</a>
                        </li>
                    </ul>
                </div>

                <!-- Content ด้านขวา -->
                <div class="col-md-9 col-lg-10">
                    <div class="container py-5">
                        <div class="member-edit bg-gray-100 min-h-screen p-6">
                            <div class="container mx-auto max-w-5xl bg-white rounded-4 shadow p-6">

                                <!-- หัวข้อ -->
                                <div class="d-flex align-items-center mb-6">
                                    <h3 class="text-2xl fw-semibold text-gray-700 me-auto mt-3">จัดการข้อมูลสถานที่ท่องเที่ยว :
                                        แก้ไขข้อมูลสถานที่ท่องเที่ยว</h3>
                                    <a class="btn btn-primary" href="{{ route('frontend.member-product-tour') }}">
                                        <i class="fas fa-arrow-left me-2"></i> กลับ
                                    </a>
                                </div>

                                <!-- ฟอร์มแก้ไขสมาชิก -->
                                <div class="card-body">
                                    <section class="main-product py-0">
                                        <div class="">
                                            <h3 class="mb-0">รายละเอียดหน้าปก</h3>

                                            <div class="row align-items-center">
                                                <!-- รูปภาพ -->
                                                <div class="col-md-4 text-center mb-3">
                                                    <div class="product-image position-relative">
                                                        <img class="img-fluid rounded shadow-sm mb-3" id="coverImagePreview" src="{{ Module::asset('frontend:images/mockup.jpg') }}" alt="ภาพหน้าปกร้าน" />

                                                        <!-- ปุ่มเปลี่ยน / ลบรูป -->
                                                        <div class="d-flex justify-content-center gap-2">
                                                            <label class="btn btn-outline-primary btn-sm">
                                                                📸 เปลี่ยนรูป
                                                                <input id="coverImageUpload" type="file" accept="image/*" onchange="previewCoverImage()" hidden>
                                                            </label>
                                                            <button class="btn btn-outline-danger btn-sm" type="button" onclick="deleteCoverImage()">🗑️
                                                                ลบรูป</button>
                                                        </div>
                                                    </div>
                                                </div>

                                                <!-- ข้อมูล -->
                                                <div class="col-md-8">
                                                    <div class="product-content">
                                                        <div class="form-group mb-3">
                                                            <label class="fw-bold">สำหรับหน้าปก สถานที่ท่องเที่ยว</label>
                                                            <input class="form-control" id="coverStoreName" type="text" value="ชื่อที่พัก">
                                                        </div>

                                                        <div class="form-group mb-3">
                                                            <label class="fw-bold">คำอธิบายสินค้า / สถานที่ท่องเที่ยว</label>
                                                            <textarea class="form-control" id="coverStoreDesc" rows="3">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, quos.</textarea>
                                                        </div>


                                                        <div class="text-end">

                                                            <button class="btn btn-primary px-4" type="button" onclick="saveCoverData()">💾
                                                                บันทึกข้อมูล</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </section>

                                    <section class="member-edit-section py-0">
                                        <div class="">
                                            <h3>แก้ไขโลโก้สถานที่ท่องเที่ยว</h3>
                                            {{-- ===== ฟอร์มข้อมูลร้านค้า ===== --}}
                                            <form id="memberEditForm" onsubmit="return false;">
                                                <div class="row g-4">
                                                    <div class="col-md-4 text-center">
                                                        <div class="profile-image position-relative">
                                                            <img class="rounded shadow-sm w-100 mb-3" id="previewImage" src="{{ Module::asset('frontend:images/mockup.jpg') }}" alt="รูปภาพร้านค้า" />
                                                            <label class="btn btn-outline-primary btn-sm">
                                                                📸 เปลี่ยนรูปภาพ
                                                                <input id="uploadImage" type="file" accept="image/*" onchange="previewFile()" hidden>
                                                            </label>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="form-group mb-3">
                                                            <label class="fw-bold">ชื่อสถานที่ท่องเที่ยว</label>
                                                            <input class="form-control" id="storeName" type="text" value="ฟาร์มนกใหญ่เมล่อน">
                                                        </div>
                                                        <div class="form-group mb-3">
                                                            <label class="fw-bold">คำอธิบายสถานที่ท่องเที่ยว</label>
                                                            <textarea class="form-control" id="storeDesc" rows="4">จำหน่ายเมล่อนปลอดสาร สดใหม่จากสวนทุกวัน</textarea>
                                                        </div>
                                                        <div class="form-group mb-3">
                                                            <label class="fw-bold">YouTube Video ID</label>
                                                            <input class="form-control" id="youtubeVideoId" name="youtubeVideoId" type="text" value="{{ old('youtubeVideoId', $data->youtubeVideoId ?? '') }}" placeholder="เช่น dQw4w9WgXcQ (จาก URL: https://www.youtube.com/watch?v=dQw4w9WgXcQ)">
                                                            <small class="text-muted">วาง Video ID หรือ URL เต็ม YouTube</small>
                                                        </div>

                                                        <div class="form-group mb-3">
                                                            <button class="btn btn-outline-primary btn-sm" type="button" onclick="updateYouTubePreview()">
                                                                <i class="fab fa-youtube me-1"></i> แสดงตัวอย่างวิดีโอ
                                                            </button>
                                                        </div>

                                                        <div class="col-12 mt-3">
                                                            <div class="youtube-video" id="youtubePreviewWrapper" style="display: none;">
                                                                <label class="fw-bold mb-2">ตัวอย่างวิดีโอ YouTube</label>
                                                                <div class="embed-responsive">
                                                                    <iframe id="youtubeIframe" src="https://www.youtube.com/embed/VIDEO_ID" title="YouTube video player" width="100%" height="400" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
                                                                    </iframe>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </form>
                                            {{-- ===== Product Manager / เพิ่ม ลบ แก้ไข สินค้า ===== --}}
                                            <section class="sec-product-brand py-0">
                                                <div class="container">
                                                    <h3 class="mb-4">สินค้าของสถานที่ท่องเที่ยว ( สูงสุด 10 รายการ )</h3>
                                                    <div class="row g-4" id="productList"></div>
                                                    <div class="text-center mt-3">
                                                        <button class="btn btn-outline-success" id="addProductBtn">➕
                                                            เพิ่มสถานที่ท่องเที่ยว</button>
                                                    </div>
                                                </div>
                                            </section>
                                            {{-- ===== ใบอนุญาต / เอกสารรับรอง ===== --}}
                                            <h3 class="mb-4">ใบอนุญาต / เอกสารรับรอง</h3>
                                            <div class="row">
                                                <!-- ใบทะเบียนวิสาหกิจชุมชน -->
                                                <div class="col-md-6 mb-4">
                                                    <div class="toggle-section border rounded shadow-sm p-3">
                                                        <div class="title-reg-1 d-flex justify-content-between align-items-center" onclick="toggleRegInfo(this)">
                                                            <h5 class="m-0">ใบทะเบียนวิสาหกิจชุมชน</h5>
                                                            <span class="toggle-icon">▶</span>
                                                        </div>

                                                        <div class="toggle-content mt-3">
                                                            <div class="mb-2">
                                                                <label class="form-label">รหัสทะเบียน</label>
                                                                <input class="form-control" type="text" value="1-18-02-06/1-0017">
                                                            </div>
                                                            <div class="mb-2">
                                                                <label class="form-label">ให้ไว้เมื่อวันที่</label>
                                                                <input class="form-control" type="text" value="15 กันยายน 2560">
                                                            </div>

                                                            <!-- แนบไฟล์รูป -->
                                                            <div class="mb-3">
                                                                <label class="form-label fw-bold">แนบไฟล์ใหม่ (รูปภาพ /
                                                                    เอกสาร)</label>
                                                                <div class="d-flex align-items-center gap-2">
                                                                    <label class="btn btn-outline-primary btn-sm mb-0">
                                                                        📸 เปลี่ยนรูป
                                                                        <input id="communityImageUpload" type="file" accept="image/*" onchange="previewCommunityImage()" hidden>
                                                                    </label>
                                                                    <button class="btn btn-outline-danger btn-sm" type="button" onclick="deleteCommunityImage()">🗑️ ลบรูป</button>
                                                                </div>
                                                            </div>

                                                            <div class="text-end">
                                                                <button class="btn btn-sm btn-primary">💾 บันทึก</button>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <!-- แสดงรูปเอกสาร -->
                                                    <div class="detail-reg-1 mt-3 text-center">
                                                        <img class="img-fluid rounded shadow-sm" id="communityImagePreview" src="{{ Module::asset('frontend:images/600x800.jpg') }}" alt="เอกสารแนบ" style="max-height: 500px;">
                                                    </div>
                                                </div>
                                                {{-- ใบทะเบียนพาณิชย์ --}}
                                                <div class="col-md-6 mb-4">
                                                    <div class="toggle-section border rounded shadow-sm p-3">
                                                        <div class="title-reg-1 d-flex justify-content-between align-items-center" onclick="toggleRegInfo(this)">
                                                            <h5 class="m-0">ใบทะเบียนพาณิชย์</h5>
                                                            <span class="toggle-icon">▶</span>
                                                        </div>
                                                        <div class="toggle-content mt-3">
                                                            <div class="mb-2">
                                                                <label class="form-label">เลขที่ทะเบียน</label>
                                                                <input class="form-control" type="text" value="1630400002143">
                                                            </div>
                                                            <div class="mb-2">
                                                                <label class="form-label">เลขที่คำขอจัดตั้ง</label>
                                                                <input class="form-control" type="text" value="1804760000002">
                                                            </div>
                                                            <div class="mb-2">
                                                                <label class="form-label">วันที่จดทะเบียน</label>
                                                                <input class="form-control" type="text" value="15 มีนาคม 2560">
                                                            </div>

                                                            <!-- แนบไฟล์รูป -->
                                                            <div class="mb-3">
                                                                <label class="form-label fw-bold">แนบไฟล์ใหม่ (รูปภาพ /
                                                                    เอกสาร)</label>
                                                                <div class="d-flex align-items-center gap-2">
                                                                    <label class="btn btn-outline-primary btn-sm mb-0">
                                                                        📸 เปลี่ยนรูป
                                                                        <input id="regImageUpload" type="file" accept="image/*" onchange="previewRegImage()" hidden>
                                                                    </label>
                                                                    <button class="btn btn-outline-danger btn-sm" type="button" onclick="deleteRegImage()">🗑️
                                                                        ลบรูป</button>
                                                                </div>
                                                            </div>

                                                            <div class="text-end">
                                                                <button class="btn btn-sm btn-primary">💾 บันทึก</button>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <!-- แสดงรูปเอกสาร -->
                                                    <div class="detail-reg-1 mt-3 text-center">
                                                        <img class="img-fluid rounded shadow-sm" id="regImagePreview" src="{{ Module::asset('frontend:images/600x800.jpg') }}" alt="เอกสารแนบ" style="max-height: 500px;">
                                                    </div>
                                                </div>
                                            </div>
                                            {{-- ===== Othercer Section ===== --}}

                                            <section class="Othercer">
                                                <div class="container">
                                                    <div class="d-flex justify-content-between align-items-center mb-3">
                                                        <h3>ใบรับรองอื่นๆ</h3>
                                                        <button class="btn btn-outline-success btn-sm" onclick="addOthercerImage()">➕ เพิ่มรูป ใบรับรองอื่นๆ</button>
                                                    </div>
                                                    <div class="row" id="OthercerList"></div>
                                                </div>
                                            </section>
                                        </div>
                                    </section>
                                    <div class="text-center mt-5">
                                        <button class="btn btn-success px-5" onclick="alert('✅ ข้อมูลตัวอย่างถูกบันทึกแล้ว (จำลอง)')">
                                            ✅ บันทึกทั้งหมด
                                        </button>
                                    </div>

                                </div>

                            </div>
                        </div>
                    </div>
                </div> <!-- end content -->
            </div>
        </div>
    </div>


    {{-- ===== Script ===== --}}
    <script>
        // ===== ฟังก์ชันแสดงภาพ preview หลังเลือกรูปใหม่ =====
        function previewCoverImage() {
            const input = document.getElementById('coverImageUpload');
            const file = input.files[0];
            const preview = document.getElementById('coverImagePreview');

            if (!file) return;
            const reader = new FileReader();
            reader.onload = function(e) {
                preview.src = e.target.result;
            };
            reader.readAsDataURL(file);
        }

        // ===== ฟังก์ชันลบรูปภาพ (รีเซ็ตกลับเป็น placeholder) =====
        function deleteCoverImage() {
            if (confirm('คุณต้องการลบรูปภาพนี้หรือไม่?')) {
                const preview = document.getElementById('coverImagePreview');
                const input = document.getElementById('coverImageUpload');
                preview.src = "{{ Module::asset('frontend:images/placeholder.jpg') }}";
                input.value = '';
            }
        }

        // ===== ฟังก์ชันบันทึกข้อมูล (จำลอง) =====
        function saveCoverData() {
            const name = document.getElementById('coverStoreName').value.trim();
            const desc = document.getElementById('coverStoreDesc').value.trim();

            if (!name) {
                alert('⚠️ กรุณากรอกชื่อที่พัก');
                return;
            }

            alert(`✅ บันทึกข้อมูลเรียบร้อย (จำลอง)\nชื่อร้าน: ${name}\nคำอธิบาย: ${desc}`);
        }
        // ===== Product Section =====
        let productCount = 0;
        const maxProducts = 10;
        const productList = document.getElementById('productList');
        const addProductBtn = document.getElementById('addProductBtn');

        function createProductCard(index) {
            const col = document.createElement('div');
            col.className = 'col-md-3';
            col.id = 'productCol' + index;
            col.innerHTML = `
        <div class="product-card border rounded shadow-sm p-3">
            <div class="product-image text-center mb-3 position-relative">
                <img id="productImage${index}" src="{{ Module::asset('frontend:images/mockup.jpg') }}" 
                     alt="Product Image" class="img-fluid rounded mb-2" />
                <label class="btn btn-outline-secondary btn-sm position-absolute top-50 start-50 translate-middle-x">
                    📸 เปลี่ยนรูป
                    <input type="file" class="form-control d-none" onchange="previewProductFile(event, ${index})">
                </label>
            </div>
            <div class="product-content">
                <div class="mb-2">
                    <label class="form-label">ชื่อสถานที่ท่องเที่ยว</label>
                    <input type="text" class="form-control" id="productTitle${index}" value="Product Title ${index+1}">
                </div>
                <div class="mb-2">
                    <label class="form-label">คำอธิบาย</label>
                    <textarea class="form-control" rows="2" id="productDesc${index}">คำอธิบายชื่อสถานที่ท่องเที่ยว ${index+1}</textarea>
                </div>
                
                <div class="d-flex justify-content-between mt-2">
                    <button class="btn btn-sm btn-primary" onclick="saveProductData(${index})">💾 บันทึก</button>
                    <button class="btn btn-sm btn-danger" onclick="deleteProduct(${index})">🗑️ ลบ</button>
                </div>
            </div>
        </div>
    `;
            productList.appendChild(col);
        }

        function addProduct() {
            if (productCount >= maxProducts) {
                alert('❌ เพิ่มสินค้าได้สูงสุด 10 รายการเท่านั้น');
                return;
            }
            createProductCard(productCount);
            productCount++;
        }

        function deleteProduct(index) {
            const col = document.getElementById('productCol' + index);
            if (col) {
                col.remove();
                productCount--;
                const remaining = Array.from(productList.children);
                remaining.forEach((c, i) => {
                    c.id = 'productCol' + i;
                    c.querySelector('img').id = 'productImage' + i;
                    c.querySelector('input[id^="productTitle"]').id = 'productTitle' + i;
                    c.querySelector('textarea[id^="productDesc"]').id = 'productDesc' + i;
                    c.querySelector('input[id^="productOriginal"]').id = 'productOriginal' + i;
                    c.querySelector('input[id^="productPrice"]').id = 'productPrice' + i;
                    c.querySelector('button.btn-primary').setAttribute('onclick', 'saveProductData(' + i + ')');
                    c.querySelector('button.btn-danger').setAttribute('onclick', 'deleteProduct(' + i + ')');
                });
            }
        }

        function previewProductFile(event, index) {
            const reader = new FileReader();
            reader.onload = function() {
                document.getElementById('productImage' + index).src = reader.result;
            };
            if (event.target.files[0]) reader.readAsDataURL(event.target.files[0]);
        }

        function saveProductData(index) {
            const title = document.getElementById('productTitle' + index).value;
            const desc = document.getElementById('productDesc' + index).value;
            const original = document.getElementById('productOriginal' + index).value;
            const price = document.getElementById('productPrice' + index).value;

            alert(
                `✅ ข้อมูลสินค้า ${index+1} ถูกบันทึก (จำลอง)\nชื่อ: ${title}\nคำอธิบาย: ${desc}\nราคาปกติ: ${original}\nราคาขาย: ${price}`
            );
        }

        addProductBtn.addEventListener('click', addProduct);
        for (let i = 0; i < 4; i++) {
            addProduct();
        }

        // ===== Othercer Section =====
        let OthercerCount = 0;
        const maxOthercer = 3;
        const OthercerList = document.getElementById('OthercerList');

        function createOthercerCard(index) {
            const col = document.createElement('div');
            col.className = 'col-4 mb-3';
            col.id = 'OthercerCol' + index;
            col.innerHTML = `
        <div class="detail-reg-1 text-center position-relative">
            <img id="OthercerImage${index}" src="{{ Module::asset('frontend:images/600x800.jpg') }}" 
                 alt="Othercer Image ${index+1}" class="img-fluid rounded shadow-sm mb-2">
            <input type="file" class="form-control mb-2" onchange="previewOthercerFile(event, ${index})">
            <button class="btn btn-sm btn-danger" onclick="deleteOthercerImage(${index})">🗑️ ลบ</button>
        </div>
    `;
            OthercerList.appendChild(col);
        }

        function addOthercerImage() {
            if (OthercerCount >= maxOthercer) {
                alert('❌ เพิ่มรูป Othercer ได้สูงสุด 3 รูปเท่านั้น');
                return;
            }
            createOthercerCard(OthercerCount);
            OthercerCount++;
        }

        function deleteOthercerImage(index) {
            const col = document.getElementById('OthercerCol' + index);
            if (col) {
                col.remove();
                OthercerCount--;
                const remaining = Array.from(OthercerList.children);
                remaining.forEach((c, i) => {
                    c.id = 'OthercerCol' + i;
                    const img = c.querySelector('img');
                    img.id = 'OthercerImage' + i;
                    img.alt = `Othercer Image ${i+1}`;
                    c.querySelector('input[type="file"]').setAttribute('onchange', `previewOthercerFile(event, ${i})`);
                    c.querySelector('button.btn-danger').setAttribute('onclick', `deleteOthercerImage(${i})`);
                });
            }
        }

        function previewOthercerFile(event, index) {
            const reader = new FileReader();
            reader.onload = function() {
                const img = document.getElementById('OthercerImage' + index);
                if (img) img.src = reader.result;
            };
            if (event.target.files[0]) reader.readAsDataURL(event.target.files[0]);
        }

        for (let i = 0; i < 3; i++) {
            addOthercerImage();
        }


        // ===== แสดงรูป Preview หลังอัปโหลด =====
        function previewRegImage() {
            const input = document.getElementById('regImageUpload');
            const file = input.files[0];
            const preview = document.getElementById('regImagePreview');

            if (!file) return;
            const reader = new FileReader();
            reader.onload = (e) => {
                preview.src = e.target.result;
            };
            reader.readAsDataURL(file);
        }

        // ===== ลบรูปกลับเป็น placeholder =====
        function deleteRegImage() {
            if (confirm('คุณต้องการลบรูปใบทะเบียนพาณิชย์นี้หรือไม่?')) {
                const preview = document.getElementById('regImagePreview');
                const input = document.getElementById('regImageUpload');
                preview.src = "{{ Module::asset('frontend:images/placeholder-portrait.jpg') }}";
                input.value = '';
            }
        }

        // ===== toggle เปิด/ปิด accordion ของใบทะเบียน =====
        function toggleRegInfo(el) {
            const content = el.parentElement.querySelector('.toggle-content');
            const icon = el.querySelector('.toggle-icon');
            content.classList.toggle('d-none');
            icon.textContent = content.classList.contains('d-none') ? '▶' : '▼';
        }

        function toggleRegInfo(element) {
            const content = element.parentElement.querySelector('.toggle-content');
            const icon = element.querySelector('.toggle-icon');
            content.classList.toggle('d-none');
            icon.textContent = content.classList.contains('d-none') ? '▶' : '▼';
        }

        // ✅ เปลี่ยนรูปใบทะเบียนวิสาหกิจ
        function previewCommunityImage() {
            const input = document.getElementById('communityImageUpload');
            const preview = document.getElementById('communityImagePreview');
            const file = input.files[0];
            if (file) {
                const reader = new FileReader();
                reader.onload = e => preview.src = e.target.result;
                reader.readAsDataURL(file);
            }
        }

        // ✅ ลบรูปใบทะเบียนวิสาหกิจ
        function deleteCommunityImage() {
            const preview = document.getElementById('communityImagePreview');
            preview.src = "{{ Module::asset('frontend:images/placeholder.png') }}"; // ใช้ภาพ placeholder
            document.getElementById('communityImageUpload').value = '';
        }
        // ===== ฟังก์ชันร้านค้าและใบอนุญาต =====
        function toggleRegInfo(element) {
            const content = element.nextElementSibling;
            content.classList.toggle('active');
        }

        function previewFile() {
            const file = document.getElementById('uploadImage').files[0];
            const preview = document.getElementById('previewImage');
            const reader = new FileReader();
            reader.onloadend = () => preview.src = reader.result;
            if (file) reader.readAsDataURL(file);
        }

        function saveMemberData() {
            const name = document.getElementById('storeName').value;
            const desc = document.getElementById('storeDesc').value;
            const contact = document.getElementById('contactInfo').value;
            alert(`ข้อมูลร้านตัวอย่าง\nชื่อร้าน: ${name}\nคำอธิบาย: ${desc}\nติดต่อ: ${contact}`);
        }
        // ====== ฟังก์ชันสลับโหมด ======
        document.querySelectorAll('input[name="contactDisplayType"]').forEach(input => {
            input.addEventListener('change', function() {
                const imageWrapper = document.getElementById('contactImageWrapper');
                const mapWrapper = document.getElementById('contactMapWrapper');

                if (this.value === 'image') {
                    imageWrapper.classList.remove('d-none');
                    mapWrapper.classList.add('d-none');
                } else {
                    mapWrapper.classList.remove('d-none');
                    imageWrapper.classList.add('d-none');
                }
            });
        });

        // ====== ฟังก์ชัน Preview รูป ======
        function previewContactImage() {
            const file = document.getElementById('contactImageUpload').files[0];
            const preview = document.getElementById('contactImagePreview');
            const reader = new FileReader();
            reader.onloadend = () => preview.src = reader.result;
            if (file) reader.readAsDataURL(file);
        }

        // ====== ฟังก์ชันลบรูป ======
        function deleteContactImage() {
            if (confirm('ต้องการลบรูปนี้หรือไม่?')) {
                document.getElementById('contactImagePreview').src = "{{ Module::asset('frontend:images/600x600.jpg') }}";
                document.getElementById('contactImageUpload').value = "";
            }
        }

        // ====== ฟังก์ชันอัปเดต Google Map ======
        function updateMapEmbed() {
            const embedCode = document.getElementById('mapEmbedCode').value.trim();
            const mapPreview = document.getElementById('mapPreview');

            if (embedCode.includes('<iframe')) {
                // ดึงเฉพาะ iframe
                const temp = document.createElement('div');
                temp.innerHTML = embedCode;
                const iframe = temp.querySelector('iframe');
                if (iframe) {
                    iframe.width = "100%";
                    iframe.height = "300";
                    iframe.style.border = "0";
                    mapPreview.innerHTML = "";
                    mapPreview.appendChild(iframe);
                    alert("✅ แสดงแผนที่แล้ว");
                }
            } else {
                alert("⚠️ กรุณาวางโค้ด Embed ของ Google Maps ที่ถูกต้อง (ต้องมี <iframe>)");
            }
        }
    </script>
@endsection