<!DOCTYPE html>
<html lang="<?php echo e(str_replace('_', '-', app()->getLocale())); ?>">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title><?php echo e(config('app.name', 'Lords Restaurant')); ?></title>
    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(file_exists(public_path('build/manifest.json')) || file_exists(public_path('hot'))): ?>
        <?php echo app('Illuminate\Foundation\Vite')(['resources/css/app.css', 'resources/js/app.js']); ?>
    <?php else: ?>
        <script src="https://cdn.tailwindcss.com"></script>
    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
    <link rel="preconnect" href="https://fonts.bunny.net">
    <link href="https://fonts.bunny.net/css?family=instrument-sans:400,500,600,700" rel="stylesheet" />
    <!-- SweetAlert2 -->
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <style>
        body {
            font-family: 'Instrument Sans', sans-serif;
        }
    </style>
</head>
<body class="bg-gray-50 text-gray-900 min-h-screen flex flex-col items-center justify-center py-12 sm:px-6 lg:px-8 relative" style="background-color: #f0fdfa;">
    <!-- Admin Login Link -->
    <a href="/admin" class="absolute top-4 right-4 text-gray-400 hover:text-[#007A5E] transition-colors duration-200" title="Admin Login">
        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
            <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15M12 9l-3 3m0 0l3 3m-3-3h12.75" />
        </svg>
    </a>

    <div class="sm:mx-auto sm:w-full sm:max-w-md text-center">
        <div class="flex justify-center">
            <img src="<?php echo e(asset('images/logo.png')); ?>" alt="Lords Restaurant Logo" class="h-24 w-auto">
        </div>
        <h2 class="mt-4 text-center text-3xl font-extrabold text-[#007A5E]">
            Lords Restaurant – Negombo
        </h2>
        <p class="mt-2 text-center text-sm text-gray-600">
            Please fill in your details below.
        </p>
    </div>

    <div class="mt-8 sm:mx-auto sm:w-full sm:max-w-2xl">
        <div class="bg-white py-8 px-4 shadow-lg border-t-4 border-[#007A5E] sm:rounded-lg sm:px-10">
            
            <form class="space-y-6" action="<?php echo e(route('customers.store')); ?>" method="POST">
                <?php echo csrf_field(); ?>
                <?php
                    $months = [
                        1 => 'January',
                        2 => 'February',
                        3 => 'March',
                        4 => 'April',
                        5 => 'May',
                        6 => 'June',
                        7 => 'July',
                        8 => 'August',
                        9 => 'September',
                        10 => 'October',
                        11 => 'November',
                        12 => 'December',
                    ];
                    $days = range(1, 31);
                ?>

                <!-- Type Selection -->
                <div>
                    <label for="type" class="block text-sm font-medium text-gray-700">
                        I am a...
                    </label>
                    <select id="type" name="type" onchange="toggleTourCompany()" class="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-[#007A5E] focus:border-[#007A5E] sm:text-sm rounded-md border">
                        <option value="loyalty" <?php echo e(old('type') == 'loyalty' ? 'selected' : ''); ?>>Loyalty Customer</option>
                        <option value="guide" <?php echo e(old('type') == 'guide' ? 'selected' : ''); ?>>Tour Guide</option>
                    </select>
                </div>

                <!-- Full Name & Preferred Name -->
                <div class="grid grid-cols-1 gap-y-6 gap-x-4 sm:grid-cols-2">
                    <div>
                        <label for="full_name" class="block text-sm font-medium text-gray-700">Full Name <span class="text-red-500">*</span></label>
                        <div class="mt-1">
                            <input type="text" name="full_name" id="full_name" required value="<?php echo e(old('full_name')); ?>" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                        </div>
                    </div>

                    <div>
                        <label for="preferred_name" class="block text-sm font-medium text-gray-700">Preferred / Known Name</label>
                        <div class="mt-1">
                            <input type="text" name="preferred_name" id="preferred_name" value="<?php echo e(old('preferred_name')); ?>" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                        </div>
                    </div>
                </div>

                <!-- Mobile & Email -->
                <div class="grid grid-cols-1 gap-y-6 gap-x-4 sm:grid-cols-2">
                    <div>
                        <label for="mobile" class="block text-sm font-medium text-gray-700">Mobile Number <span class="text-red-500">*</span></label>
                        <div class="mt-1">
                            <input type="tel" name="mobile" id="mobile" required value="<?php echo e(old('mobile')); ?>" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                        </div>
                    </div>

                    <div>
                        <label for="email" class="block text-sm font-medium text-gray-700">Email Address</label>
                        <div class="mt-1">
                            <input type="email" name="email" id="email" value="<?php echo e(old('email')); ?>" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                        </div>
                    </div>
                </div>

                <!-- DOB & Anniversary -->
                <div class="grid grid-cols-1 gap-y-6 gap-x-4 sm:grid-cols-2">
                    <div>
                        <label class="block text-sm font-medium text-gray-700">Date of Birth</label>
                        <div class="mt-1 grid grid-cols-2 gap-3">
                            <select name="dob_month" id="dob_month" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                                <option value="">Month</option>
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $months; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $number => $label): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <option value="<?php echo e($number); ?>" <?php echo e(old('dob_month') == $number ? 'selected' : ''); ?>><?php echo e($label); ?></option>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </select>
                            <select name="dob_day" id="dob_day" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                                <option value="">Day</option>
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $days; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $day): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <option value="<?php echo e($day); ?>" <?php echo e(old('dob_day') == $day ? 'selected' : ''); ?>><?php echo e($day); ?></option>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </select>
                        </div>
                        <p class="mt-1 text-xs text-gray-500">Year is optional—we only record month and day.</p>
                    </div>

                    <div>
                        <label class="block text-sm font-medium text-gray-700">Date of Anniversary</label>
                        <div class="mt-1 grid grid-cols-2 gap-3">
                            <select name="anniversary_month" id="anniversary_month" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                                <option value="">Month</option>
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $months; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $number => $label): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <option value="<?php echo e($number); ?>" <?php echo e(old('anniversary_month') == $number ? 'selected' : ''); ?>><?php echo e($label); ?></option>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </select>
                            <select name="anniversary_day" id="anniversary_day" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                                <option value="">Day</option>
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $days; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $day): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <option value="<?php echo e($day); ?>" <?php echo e(old('anniversary_day') == $day ? 'selected' : ''); ?>><?php echo e($day); ?></option>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </select>
                        </div>
                        <p class="mt-1 text-xs text-gray-500">Leave blank if you don’t celebrate an anniversary.</p>
                    </div>
                </div>

                <!-- Gender & Country -->
                <div class="grid grid-cols-1 gap-y-6 gap-x-4 sm:grid-cols-2">
                    <div>
                        <label for="gender" class="block text-sm font-medium text-gray-700">Gender</label>
                        <select id="gender" name="gender" class="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-[#007A5E] focus:border-[#007A5E] sm:text-sm rounded-md border">
                            <option value="">Select...</option>
                            <option value="Male" <?php echo e(old('gender') == 'Male' ? 'selected' : ''); ?>>Male</option>
                            <option value="Female" <?php echo e(old('gender') == 'Female' ? 'selected' : ''); ?>>Female</option>
                            <option value="Prefer not to say" <?php echo e(old('gender') == 'Prefer not to say' ? 'selected' : ''); ?>>Prefer not to say</option>
                        </select>
                    </div>

                    <div>
                        <label for="country" class="block text-sm font-medium text-gray-700">Country</label>
                        <div class="mt-1">
                            <input type="text" name="country" id="country" value="<?php echo e(old('country', 'Sri Lanka')); ?>" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                        </div>
                    </div>
                </div>

                <!-- City & Occupation -->
                <div class="grid grid-cols-1 gap-y-6 gap-x-4 sm:grid-cols-2">
                    <div>
                        <label for="city" class="block text-sm font-medium text-gray-700">Home City</label>
                        <div class="mt-1">
                            <input type="text" name="city" id="city" value="<?php echo e(old('city')); ?>" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                        </div>
                    </div>

                    <div>
                        <label for="occupation" class="block text-sm font-medium text-gray-700">Occupation</label>
                        <div class="mt-1">
                            <input type="text" name="occupation" id="occupation" value="<?php echo e(old('occupation')); ?>" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                        </div>
                    </div>
                </div>

                <!-- Preferred Contact Method -->
                <div>
                    <label class="block text-sm font-medium text-gray-700">Preferred Contact Method</label>
                    <div class="mt-2 space-x-4">
                        <label class="inline-flex items-center">
                            <input type="radio" name="preferred_contact_method" value="SMS" <?php echo e(old('preferred_contact_method') == 'SMS' ? 'checked' : ''); ?> class="form-radio h-4 w-4 text-[#007A5E] border-gray-300 focus:ring-[#007A5E]">
                            <span class="ml-2 text-gray-700">SMS</span>
                        </label>
                        <label class="inline-flex items-center">
                            <input type="radio" name="preferred_contact_method" value="Email" <?php echo e(old('preferred_contact_method') == 'Email' ? 'checked' : ''); ?> class="form-radio h-4 w-4 text-[#007A5E] border-gray-300 focus:ring-[#007A5E]">
                            <span class="ml-2 text-gray-700">Email</span>
                        </label>
                        <label class="inline-flex items-center">
                            <input type="radio" name="preferred_contact_method" value="WhatsApp" <?php echo e(old('preferred_contact_method') == 'WhatsApp' ? 'checked' : ''); ?> class="form-radio h-4 w-4 text-[#007A5E] border-gray-300 focus:ring-[#007A5E]">
                            <span class="ml-2 text-gray-700">WhatsApp</span>
                        </label>
                    </div>
                </div>

                <!-- Tour Company Name (Hidden by default) -->
                <div id="tour_company_container" class="hidden">
                    <label for="tour_company_name" class="block text-sm font-medium text-gray-700">Tour Company Name</label>
                    <div class="mt-1">
                        <input type="text" name="tour_company_name" id="tour_company_name" value="<?php echo e(old('tour_company_name')); ?>" class="shadow-sm focus:ring-[#007A5E] focus:border-[#007A5E] block w-full sm:text-sm border-gray-300 rounded-md border p-2">
                    </div>
                </div>

                <!-- Marketing Agreement -->
                <div class="flex items-start">
                    <div class="flex items-center h-5">
                        <input id="is_marketing_agreed" name="is_marketing_agreed" type="checkbox" value="1" <?php echo e(old('is_marketing_agreed') ? 'checked' : ''); ?> class="focus:ring-[#007A5E] h-4 w-4 text-[#007A5E] border-gray-300 rounded">
                    </div>
                    <div class="ml-3 text-sm">
                        <label for="is_marketing_agreed" class="font-medium text-gray-700">I agree to receive offers and updates from Lords Restaurant</label>
                    </div>
                </div>

                <div>
                    <button type="submit" class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-[#007A5E] hover:bg-[#00654e] focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[#007A5E] transition duration-150 ease-in-out">
                        Submit Details
                    </button>
                </div>
            </form>
        </div>
    </div>

    <script>
        function toggleTourCompany() {
            const type = document.getElementById('type').value;
            const container = document.getElementById('tour_company_container');
            if (type === 'guide') {
                container.classList.remove('hidden');
            } else {
                container.classList.add('hidden');
            }
        }

        // Run on load to handle old input
        document.addEventListener('DOMContentLoaded', function() {
            toggleTourCompany();
        });

        // SweetAlert2 for Success Message
        <?php if(session('success')): ?>
            Swal.fire({
                icon: 'success',
                title: 'Success!',
                text: "<?php echo e(session('success')); ?>",
                confirmButtonColor: '#007A5E',
            });
        <?php endif; ?>

        // SweetAlert2 for Validation Errors
        <?php if($errors->any()): ?>
            Swal.fire({
                icon: 'error',
                title: 'Oops...',
                html: `
                    <ul style="text-align: left;">
                        <?php $__currentLoopData = $errors->all(); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $error): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <li><?php echo e($error); ?></li>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </ul>
                `,
                confirmButtonColor: '#007A5E',
            });
        <?php endif; ?>
    </script>
</body>
</html>
<?php /**PATH C:\Users\User\Documents\Laravel\LordsRestaurant\resources\views/customer-form.blade.php ENDPATH**/ ?>