<div class="container mx-auto p-4">
    <h1 class="text-2xl font-bold mb-4">Pilih Meja Anda</h1>

    <!--[if BLOCK]><![endif]--><?php if(session()->has('message')): ?>
        <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative mb-4" role="alert">
            <span class="block sm:inline"><?php echo e(session('message')); ?></span>
        </div>
    <?php endif; ?><!--[if ENDBLOCK]><![endif]-->

    
    <div class="relative mb-8">
        <img src="<?php echo e(asset('images/denah-contoh.png')); ?>" alt="Denah Restoran" class="w-full h-auto rounded-lg shadow-lg">
        
        
        <!--[if BLOCK]><![endif]--><?php $__currentLoopData = $availableTables; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $table): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
            <button wire:click="selectTable('<?php echo e($table['id']); ?>')"
                    class="absolute bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded-full shadow-lg"
                    style="top: <?php echo e(rand(10, 80)); ?>%; left: <?php echo e(rand(10, 80)); ?>%;"> 
                <?php echo e($table['name']); ?>

            </button>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><!--[if ENDBLOCK]><![endif]-->
    </div>

    <h2 class="text-xl font-semibold mb-3">Daftar Meja Tersedia:</h2>
    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
        <!--[if BLOCK]><![endif]--><?php $__empty_1 = true; $__currentLoopData = $availableTables; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $table): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
            <div class="bg-white p-4 rounded-lg shadow-md flex justify-between items-center">
                <span class="text-lg font-medium"><?php echo e($table['name']); ?></span>
                <button wire:click="selectTable('<?php echo e($table['id']); ?>')"
                        class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
                    Pilih
                </button>
            </div>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
            <p class="text-gray-500 col-span-full">Tidak ada meja yang tersedia saat ini.</p>
        <?php endif; ?><!--[if ENDBLOCK]><![endif]-->
    </div>
</div>
<?php /**PATH E:\!PROJECT\dfood-website\resources\views/livewire/select-table.blade.php ENDPATH**/ ?>