

<?php $__env->startSection('content'); ?>
<div class="bg-white p-6 shadow rounded">
    <h2 class="text-2xl font-bold mb-4">Edit Property</h2>

    <form action="<?php echo e(route('properties.update', $property->id)); ?>" method="POST" enctype="multipart/form-data">
        <?php echo csrf_field(); ?>
        <?php echo method_field('PUT'); ?>

        
        <h3 class="text-lg font-semibold mb-2">Property Info</h3>
        <div x-data="{ selected: '<?php echo e(old('category_name', $property->category_name)); ?>' }">
            <?php
                $creator = auth()->user();
                $permissions = [
                    'sell' => $creator->can_sell,
                    'rent' => $creator->can_rent,
                    'lease' => $creator->can_lease,
                ];
            ?>

            <div class="flex flex-wrap gap-3 sm:flex-nowrap sm:gap-4">
                <?php $__currentLoopData = ['sell', 'rent', 'lease']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $option): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <?php if($permissions[$option]): ?>
                        <label class="cursor-pointer w-full sm:w-auto">
                            <input type="radio" name="category_name" x-model="selected" value="<?php echo e($option); ?>" class="hidden peer">
                            <div class="w-full px-6 py-2 text-center rounded-md border border-gray-300 text-gray-700
                                        peer-checked:bg-blue-600 peer-checked:text-white peer-checked:border-blue-600
                                        transition-all duration-200">
                                <?php echo e(ucfirst($option)); ?>

                            </div>
                        </label>
                    <?php endif; ?>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </div>

            <div class="grid grid-cols-3 md:grid-cols-2 gap-4 pt-4">
                <label for="property_name" class="block text-sm font-medium text-gray-700">
                    Property Name <span class="text-red-500">*</span>
                   <input type="text" name="property_name" placeholder="Property Name" class="w-full mt-2 mb-2 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('property_name', $property->property_name)); ?>" required>
                </label>
                <label for="slug" class="block text-sm font-medium text-gray-700">
                    Slug <span class="text-red-500">*</span>
                   <input type="text" name="slug" placeholder="Slug"
                        class="w-full mt-2 mb-2 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition"
                        value="<?php echo e(old('slug', $property->slug)); ?>">
                </label>
                <label for="price" class="block text-sm font-medium text-gray-700">
                    Price <span class="text-red-500"></span>
                   <input type="text" name="price" placeholder="Price" class="w-full mt-2 mb-2 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('price', $property->price)); ?>" required>
                </label>
                <div x-show="selected === 'lease' || selected === 'rent'" >
                <label for="security_deposit" class="block text-sm font-medium text-gray-700">
                    Security Deposit <span class="text-red-500"></span>
                      <input type="text" name="security_deposit" placeholder="Security Deposit" class="w-full mt-2 mb-2 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('security_deposit', $property->security_deposit)); ?>">
                </label></div>
                <label for="youtube_url" class="block text-sm font-medium text-gray-700">
                    YouTube URL <span class="text-red-500"></span>
                <input type="text" name="youtube_url" placeholder="YouTube URL" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('youtube_url', $property->youtube_url)); ?>">
              </label>
            </div>
            <label for="description" class="block text-sm font-medium text-gray-700">
                    Description <span class="text-red-500"></span>
              <textarea name="description" placeholder="Description" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition"><?php echo e(old('description', $property->description)); ?></textarea>
            </label>
        </div>

        
        <h3 class="text-lg font-semibold mt-4 mb-2">Address</h3>
         <div class="grid grid-cols-3 md:grid-cols-2 gap-4">
            <label for="street" class="block text-sm font-medium text-gray-700">
                    Street <span class="text-red-500"></span>
            <input type="text" name="address[street]" placeholder="Street" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('address.street', $property->address->street ?? '')); ?>">
            </label>
            <label for="city" class="block text-sm font-medium text-gray-700">
                    City <span class="text-red-500"></span>
            <input type="text" name="address[city]" placeholder="City" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('address.city', $property->address->city ?? '')); ?>">
            </label>
            <label for="state" class="block text-sm font-medium text-gray-700">
                    State <span class="text-red-500"></span>
            <input type="text" name="address[state]" placeholder="State" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('address.state', $property->address->state ?? '')); ?>">
            </label>
            <label for="zip_or_postal_code" class="block text-sm font-medium text-gray-700">
                   Zip Code <span class="text-red-500"></span>
            <input type="text" name="address[zip_or_postal_code]" placeholder="Zip Code" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('address.zip_or_postal_code', $property->address->zip_or_postal_code ?? '')); ?>">
            </label>
            <label for="area" class="block text-sm font-medium text-gray-700">
                    Area <span class="text-red-500"></span>
            <input type="text" name="address[area]" placeholder="Area" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('address.area', $property->address->area ?? '')); ?>">
            </label>
            <label for="country" class="block text-sm font-medium text-gray-700">
                    Country <span class="text-red-500"></span>
                <select name="address[country]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Country</option>
                    <option value="<?php echo e($property->address->country); ?>" selected><?php echo e($property->address->country); ?></option>
                    
                </select>
          </label>
         </div>
        
        <h3 class="text-lg font-semibold mt-4 mb-2">Details</h3>
        
        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
            <label for="property_size" class="block text-sm font-medium text-gray-700">
                  Property Size (e.g. 3410 Sq Ft) <span class="text-red-500"></span>
                <input type="text" name="details[property_size]" value="<?php echo e(old('details.property_size', $property->detail->property_size ?? '')); ?>" placeholder="Size (e.g. 3410 Sq Ft)" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
            </label>
            <label for="bedrooms" class="block text-sm font-medium text-gray-700">
                    Bedrooms <span class="text-red-500"></span>
               <select name="details[bedrooms]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Bedrooms</option>
                    <?php for($i = 1; $i <= 10; $i++): ?>
                        <option value="<?php echo e($i); ?>" <?php echo e(old('details.bedrooms', $property->details['bedrooms'] ?? '') == $i ? 'selected' : ''); ?>><?php echo e($i); ?></option>
                    <?php endfor; ?>
                </select>
            </label>
            <label for="bathroom" class="block text-sm font-medium text-gray-700">
                Bathrooms <span class="text-red-500"></span>
                <select name="details[bathroom]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Bathrooms</option>
                    <?php for($i = 1; $i <= 10; $i++): ?>
                        <option value="<?php echo e($i); ?>" <?php echo e(old('details.bathroom', $property->details['bathroom'] ?? '') == $i ? 'selected' : ''); ?>><?php echo e($i); ?></option>
                    <?php endfor; ?>
                </select>
            </label>
            <label for="kitchen" class="block text-sm font-medium text-gray-700">
                    Kitchen <span class="text-red-500"></span>
                <select name="details[kitchen]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled <?php echo e(empty($property->details['kitchen']) ? 'selected' : ''); ?>>Select Kitchen</option>
                    <?php for($i = 1; $i <= 10; $i++): ?>
                        <option value="<?php echo e($i); ?>" <?php echo e((old('details.kitchen', $property->details['kitchen'] ?? '') == $i) ? 'selected' : ''); ?>>
                            <?php echo e($i); ?>

                        </option>
                    <?php endfor; ?>
                </select>
           </label>
            <label for="garage" class="block text-sm font-medium text-gray-700">
                Garage <span class="text-red-500"></span>
                <select name="details[garage]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Garage</option>
                    <?php for($i = 1; $i <= 10; $i++): ?>
                        <option value="<?php echo e($i); ?>" <?php echo e(old('details.garage', $property->details['garage'] ?? '') == $i ? 'selected' : ''); ?>><?php echo e($i); ?></option>
                    <?php endfor; ?>
                </select>
            </label>
            <label for="kitchen" class="block text-sm font-medium text-gray-700">
                    Garage Size (e.g. 320 Sq Ft) <span class="text-red-500"></span>
                <input type="text" name="details[garage_size]" value="<?php echo e(old('details.garage_size', $property->details['garage_size'] ?? '')); ?>" placeholder="Garage Size (e.g. 320 Sq Ft)" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
            </label>
                <label for="car_parking" class="block text-sm font-medium text-gray-700">
                    Car Parking <span class="text-red-500"></span>
                <select name="details[car_parking]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Car Parking</option>
                    <?php for($i = 1; $i <= 10; $i++): ?>
                        <option value="<?php echo e($i); ?>" <?php echo e(old('details.car_parking', $property->details['car_parking'] ?? '') == $i ? 'selected' : ''); ?>><?php echo e($i); ?></option>
                    <?php endfor; ?>
                </select>
            </label>
                <label for="total_floors" class="block text-sm font-medium text-gray-700">
                    Total Floors <span class="text-red-500"></span>
                <select name="details[total_floors]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Total Floors</option>
                    <?php for($i = 1; $i <= 10; $i++): ?>
                        <option value="<?php echo e($i); ?>" <?php echo e(old('details.total_floors', $property->details['total_floors'] ?? '') == $i ? 'selected' : ''); ?>><?php echo e($i); ?></option>
                    <?php endfor; ?>
                </select>
            </label>
            <label for="year_built" class="block text-sm font-medium text-gray-700">
                   Year Built <span class="text-red-500"></span>
                <?php $currentYear = date('Y'); ?>
                <select name="details[year_built]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Year Built</option>
                    <?php for($year = $currentYear; $year >= 1980; $year--): ?>
                        <option value="<?php echo e($year); ?>" <?php echo e(old('details.year_built', $property->details['year_built'] ?? '') == $year ? 'selected' : ''); ?>><?php echo e($year); ?></option>
                    <?php endfor; ?>
                </select>
            </label>
            <label for="property_type" class="block text-sm font-medium text-gray-700">
                    Property Type <span class="text-red-500"></span>
                <select name="details[property_type]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Property Type</option>
                    <?php $__currentLoopData = ['Flats / Apartments', 'Independent / Builder Floors', 'Farm House', 'House & Villa']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $type): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <option value="<?php echo e($type); ?>" <?php echo e(old('details.property_type', $property->details['property_type'] ?? '') == $type ? 'selected' : ''); ?>><?php echo e($type); ?></option>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </select>
            </label>
            <label for="property_status" class="block text-sm font-medium text-gray-700">
                    Property Status <span class="text-red-500"></span>
                <select name="details[property_status]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Property Status</option>
                    <?php $__currentLoopData = ['New Launch', 'Ready to Move', 'Under Construction']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $status): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <option value="<?php echo e($status); ?>" <?php echo e(old('details.property_status', $property->details['property_status'] ?? '') == $status ? 'selected' : ''); ?>><?php echo e($status); ?></option>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </select>
            </label>
            <label for="furnishing" class="block text-sm font-medium text-gray-700">
                    Furnishing <span class="text-red-500"></span>
                <select name="details[furnishing]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Furnishing</option>
                    <?php $__currentLoopData = ['Furnished', 'Semi-Furnished', 'Unfurnished']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $furnishing): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <option value="<?php echo e($furnishing); ?>" <?php echo e(old('details.furnishing', $property->details['furnishing'] ?? '') == $furnishing ? 'selected' : ''); ?>><?php echo e($furnishing); ?></option>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </select>
            </label>
            <label for="Facing" class="block text-sm font-medium text-gray-700">
                    Facing <span class="text-red-500"></span>
                <select name="details[facing]" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
                    <option value="" disabled>Select Facing</option>
                    <?php $__currentLoopData = ['East', 'North', 'North-East', 'North-West', 'South', 'South-East', 'South-West', 'West']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $face): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <option value="<?php echo e($face); ?>" <?php echo e(old('details.facing', $property->details['facing'] ?? '') == $face ? 'selected' : ''); ?>><?php echo e($face); ?></option>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </select>
            </label>
            <label for="Maintenance" class="block text-sm font-medium text-gray-700">
                Maintenance Monthly <span class="text-red-500"></span>
            <input type="text" name="details[maintenance_monthly]" value="<?php echo e(old('details.maintenance_monthly', $property->details['maintenance_monthly'] ?? '')); ?>" placeholder="Maintenance Monthly" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
            </label>
            <label for="project_name" class="block text-sm font-medium text-gray-700">
                    Project Name <span class="text-red-500"></span>
               <input type="text" name="details[project_name]" value="<?php echo e(old('details.project_name', $property->details['project_name'] ?? '')); ?>" placeholder="Project Name" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition">
            </label>
         </div>

        
        
        
        
        <h3 class="text-lg font-semibold mt-4 mb-2">Amenities</h3>
        <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3">
            <?php
                $amenitiesList = [
                    "gymnasium_spa", "security_24_7", "premium_lifts", "cctv_surveillance",
                    "club_house", "mivan_construction", "jogging_track", "rain_water_harvesting",
                    "power_backup", "water_supply_24_7", "swimming_area", "kids_play_area",
                    "yoga_area", "barbeque_area", "co_working_space", "ultra_luxury",
                    "gated_secured_homes", "basket_ball_court", "badminton_court",
                    "table_tennis", "tennis_court", "restaurant_bar", "meditation_area",
                    "stilt_parking", "multipurpose_hall", "fire_protection", "library",
                    "mini_theatre", "garden_park"
                ];
            ?>

            <?php $__currentLoopData = $amenitiesList; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $amenity): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <label class="block">
                    <input type="checkbox" name="amenities[<?php echo e($amenity); ?>]" value="1"
                        class="hidden peer"
                        <?php echo e(!empty($property->amenities->$amenity) ? 'checked' : ''); ?>>
                    
                    <div class="w-full px-4 py-2 text-center border border-gray-300 rounded-md
                                peer-checked:bg-blue-600 peer-checked:text-white
                                peer-checked:border-blue-600 transition-all duration-150 cursor-pointer">
                        <?php echo e(ucwords(str_replace('_', ' ', $amenity))); ?>

                    </div>
                </label>
            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
        </div>

        
        <div x-data="imageUploader('<?php echo e($property->banner_img ? asset('storage/' . $property->banner_img) : ''); ?>')" class="pt-5">
    <h3 class="text-lg font-semibold mt-4 mb-2">Feature Image</h3>

    <!-- Drop Area -->
    <div 
        class="flex flex-col items-center justify-center border-2 border-dashed border-gray-300 rounded-lg p-6 text-center cursor-pointer hover:border-blue-500 transition"
        x-on:dragover.prevent
        x-on:drop.prevent="handleDrop($event)"
        x-on:click="$refs.fileInput.click()"
    >
        <!-- Placeholder -->
        <template x-if="!previewUrl">
            <div>
                <svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" stroke-width="2"
                    viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round"
                        d="M3 16l4-4a4 4 0 015.656 0L21 4M16 21H8a4 4 0 01-4-4V8a4 4 0 014-4h8a4 4 0 014 4v9a4 4 0 01-4 4z"/>
                </svg>
                <p class="mt-2 text-sm text-gray-600">Click or drag an image to upload</p>
                <p class="text-xs text-gray-400">Only image files accepted</p>
            </div>
        </template>

        <!-- Preview -->
        <template x-if="previewUrl">
            <div class="relative w-full max-w-xs">
                <img :src="previewUrl" class="rounded-lg shadow-md">
                <button type="button"
                        class="absolute top-1 right-1 bg-red-600 text-white rounded-full p-1 hover:bg-red-700"
                        x-on:click="removeImage">
                    &times;
                </button>
            </div>
        </template>

        <!-- Hidden File Input -->
        <input type="file" x-ref="fileInput" name="banner_img" accept="image/*"
            class="hidden" x-on:change="handleFile($event)">
    </div>
</div>

<!-- Alpine Script -->
<script>
    function imageUploader(existingImage = '') {
        return {
            previewUrl: existingImage || null,

            handleFile(event) {
                const file = event.target.files[0];
                if (file && file.type.startsWith('image/')) {
                    this.previewUrl = URL.createObjectURL(file);
                }
            },

            handleDrop(event) {
                const file = event.dataTransfer.files[0];
                if (file && file.type.startsWith('image/')) {
                    this.$refs.fileInput.files = event.dataTransfer.files;
                    this.previewUrl = URL.createObjectURL(file);
                }
            },

            removeImage() {
                this.$refs.fileInput.value = '';
                this.previewUrl = null;
            }
        }
    }
</script>




<?php
    $existingGalleryImages = $property->galleryImages->pluck('image_path')->map(fn($img) => asset('storage/' . $img));
?>

<div x-data="galleryUploader(<?php echo e(Js::from($existingGalleryImages)); ?>)" class="pt-5">
    <h3 class="text-lg font-semibold mt-4 mb-2">Gallery Images</h3>

    <!-- Drop area -->
    <div
        class="flex flex-col items-center justify-center border-2 border-dashed border-gray-300 rounded-lg p-6 text-center cursor-pointer hover:border-blue-500 transition"
        x-on:dragover.prevent
        x-on:drop.prevent="handleDrop($event)"
        x-on:click="$refs.galleryInput.click()"
    >
        <svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" stroke-width="2"
            viewBox="0 0 24 24">
            <path stroke-linecap="round" stroke-linejoin="round"
                d="M3 16l4-4a4 4 0 015.656 0L21 4M16 21H8a4 4 0 01-4-4V8a4 4 0 014-4h8a4 4 0 014 4v9a4 4 0 01-4 4z"/>
        </svg>
        <p class="mt-2 text-sm text-gray-600">Click or drag multiple images to upload</p>
        <p class="text-xs text-gray-400">Only image files are accepted</p>
    </div>

    <!-- Hidden file input -->
    <input type="file" name="gallery_images[]" accept="image/*" multiple x-ref="galleryInput" class="hidden"
        x-on:change="handleFiles($event)">

    <!-- Preview thumbnails -->
    <div class="grid grid-cols-2 md:grid-cols-3 gap-4 mt-4">
        <template x-for="(image, index) in allImages" :key="index">
            <div class="relative group">
                <img :src="image.url" class="rounded-lg shadow w-full h-32 object-cover">
                <button type="button"
                        class="absolute top-1 right-1 bg-red-600 text-white rounded-full p-1 text-sm hover:bg-red-700"
                        x-on:click="removeImage(index)">
                    &times;
                </button>
                <!-- Hidden input for deleted image tracking (optional) -->
                <template x-if="image.existing && image.markedForDelete">
                    <input type="hidden" name="deleted_gallery_images[]" :value="image.url">
                </template>
            </div>
        </template>
    </div>
</div>
<script>
    function galleryUploader(existing = []) {
        return {
            allImages: [],
            fileList: [],

            init() {
                // Push existing images into the preview array
                this.allImages = existing.map(url => ({
                    url,
                    existing: true,
                    markedForDelete: false,
                }));
            },

            handleFiles(event) {
                const files = Array.from(event.target.files);
                this.addNewFiles(files);
            },

            handleDrop(event) {
                const files = Array.from(event.dataTransfer.files);
                this.$refs.galleryInput.files = event.dataTransfer.files;
                this.addNewFiles(files);
            },

            addNewFiles(files) {
                files.forEach(file => {
                    if (file.type.startsWith('image/')) {
                        const reader = new FileReader();
                        reader.onload = e => {
                            this.allImages.push({
                                url: e.target.result,
                                file: file,
                                existing: false
                            });
                            this.fileList.push(file);
                            this.syncFileInput();
                        };
                        reader.readAsDataURL(file);
                    }
                });
            },

            removeImage(index) {
                const image = this.allImages[index];

                if (image.existing) {
                    this.allImages[index].markedForDelete = true;
                } else {
                    this.allImages.splice(index, 1);
                    this.fileList.splice(index - this.existingCount(), 1);
                    this.syncFileInput();
                }
            },

            existingCount() {
                return this.allImages.filter(img => img.existing && !img.markedForDelete).length;
            },

            syncFileInput() {
                const dt = new DataTransfer();
                this.fileList.forEach(file => dt.items.add(file));
                this.$refs.galleryInput.files = dt.files;
            }
        };
    }
</script>

        
        <div class="pt-5">
            <h3 class="text-lg font-semibold mt-4 mb-2">For SEO</h3>
            <label for="meta_title" class="block text-sm font-medium text-gray-700">
                    Meta Title <span class="text-red-500"></span>
                <input type="text" name="meta_title" placeholder="Meta Title" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition" value="<?php echo e(old('meta_title', $property->meta_title)); ?>">
            </label>
            <label for="meta_description" class="block text-sm font-medium text-gray-700">
                    Meta Description <span class="text-red-500"></span>
                <textarea name="meta_description" placeholder="Meta Description" class="w-full mt-2 mb-4 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 shadow-sm transition"><?php echo e(old('meta_description', $property->meta_description)); ?></textarea>
            </label>
            </div>

        <button type="submit" class="mt-4 bg-green-600 text-white px-4 py-2 rounded">Update Property</button>
    </form>
</div>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH E:\Sw_arif\realState\resources\views/backend/admin/properties/edit.blade.php ENDPATH**/ ?>