<?php $__env->startSection('title', 'Dashboard - Créer un Hôtel'); ?>

<?php $__env->startPush('styles'); ?>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<style>
    :root {
        --primary-color: #020548;
        --secondary-color: #3b5de7;
        --accent-color: #ff6b6b;
        --light-bg: #f8f9fa;
    }

    .form-container {
        max-width: 1000px;
        margin: 0 auto;
        padding: 2rem;
    }

    .form-header {
        background-color: var(--primary-color);
        color: white;
        padding: 1.5rem;
        border-radius: 10px 10px 0 0;
        margin-bottom: 0;
    }

    .form-card {
        border: none;
        border-radius: 10px;
        box-shadow: 0 10px 30px rgba(2, 5, 72, 0.1);
        overflow: hidden;
    }

    .form-body {
        padding: 2rem;
        background-color: white;
    }

    .form-label {
        font-weight: 600;
        color: var(--primary-color);
        margin-bottom: 0.5rem;
    }

    .form-control, .form-select, .form-check-input {
        border: 2px solid #e0e0e0;
        border-radius: 8px;
        padding: 12px 15px;
        transition: all 0.3s;
    }

    .form-control:focus, .form-select:focus {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 3px rgba(59, 93, 231, 0.1);
    }

    .input-group-text {
        background-color: var(--light-bg);
        color: var(--primary-color);
        font-weight: 500;
    }

    .form-check-input {
        width: 1.2em;
        height: 1.2em;
        margin-top: 0.2em;
    }

    .form-check-label {
        margin-left: 0.5rem;
    }

    .form-switch .form-check-input {
        width: 2.5em;
    }

    .btn-submit {
        background-color: var(--primary-color);
        border: none;
        padding: 12px 30px;
        font-weight: 600;
        letter-spacing: 0.5px;
        transition: all 0.3s;
    }

    .btn-submit:hover {
        background-color: var(--secondary-color);
        transform: translateY(-2px);
    }

    /* Style amélioré pour le champ fichier */
    .file-upload-wrapper {
        position: relative;
        margin-bottom: 1.5rem;
    }

    .file-upload-label {
        display: block;
        padding: 12px;
        border: 2px dashed #e0e0e0;
        border-radius: 8px;
        text-align: center;
        cursor: pointer;
        transition: all 0.3s;
    }

    .file-upload-label:hover {
        border-color: var(--secondary-color);
        background-color: rgba(59, 93, 231, 0.05);
    }

    .file-upload-input {
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        width: 100%;
        height: 100%;
        cursor: pointer;
    }

    .file-upload-icon {
        font-size: 2rem;
        color: var(--secondary-color);
        margin-bottom: 0.5rem;
    }

    .file-upload-text {
        color: var(--primary-color);
        font-weight: 500;
    }

    .file-upload-hint {
        color: #6c757d;
        font-size: 0.85rem;
    }

    /* Preview des images */
    .image-preview-container {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 15px;
    }

    .image-preview-item {
        position: relative;
        width: 100px;
        height: 100px;
        border-radius: 8px;
        overflow: hidden;
        border: 1px solid #e0e0e0;
    }

    .image-preview-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* Breadcrumb personnalisé */
    .custom-breadcrumb {
        background-color: transparent;
        padding: 0;
    }

    .custom-breadcrumb .breadcrumb-item a {
        color: var(--secondary-color);
        text-decoration: none;
    }

    .custom-breadcrumb .breadcrumb-item.active {
        color: var(--primary-color);
        font-weight: 500;
    }

    /* Section options */
    .option-section {
        padding: 1.5rem;
        border-radius: 8px;
        background-color: var(--light-bg);
        margin-bottom: 1.5rem;
    }

    .option-title {
        color: var(--primary-color);
        font-weight: 600;
        margin-bottom: 1rem;
        display: flex;
        align-items: center;
    }

    .option-title i {
        margin-right: 10px;
        font-size: 1.2rem;
    }
</style>
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>
<div class="container-fluid">
    <!-- En-tête de page -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center">
                <h2 class="fw-bold mb-0" style="color: var(--primary-color);">
                    <i class="fas fa-hotel me-2"></i>Création d'Hôtel
                </h2>
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb custom-breadcrumb">
                        <li class="breadcrumb-item"><a href="<?php echo e(route('dashboard')); ?>">Dashboard</a></li>
                        <li class="breadcrumb-item active">Nouvel Hôtel</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>

    <!-- Carte de formulaire -->
    <div class="row justify-content-center">
        <div class="col-lg-10">
            <div class="form-card">
                <h4 class="form-header">
                    <i class="fas fa-plus-circle me-2"></i>Ajouter un nouvel hôtel
                </h4>

                <div class="form-body">
                    <form action="<?php echo e(route('formHotel.submit')); ?>" method="POST" enctype="multipart/form-data">
                        <?php echo csrf_field(); ?>

                        <!-- 1. Informations de base -->
                        <div class="mb-4">
                            <label for="name" class="form-label">Nom de l'hôtel <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="name" name="name" value="<?php echo e(old('name')); ?>" placeholder="Ex: Hôtel Ivoire" required>
                            <?php $__errorArgs = ['name'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <div class="text-danger mt-2"><?php echo e($message); ?></div>
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>

                        <!-- 2. Images -->
                        <div class="mb-4">
                            <label class="form-label">Images de l'hôtel <span class="text-danger">*</span></label>
                            <div class="file-upload-wrapper">
                                <label for="images" class="file-upload-label">
                                    <div class="file-upload-icon">
                                        <i class="fas fa-cloud-upload-alt"></i>
                                    </div>
                                    <div class="file-upload-text">Glissez-déposez vos fichiers ou cliquez pour parcourir</div>
                                    <div class="file-upload-hint">Formats acceptés : JPG, PNG (Max 2MB par fichier)</div>
                                </label>
                                <input type="file" id="images" name="images[]" multiple accept="image/*" class="file-upload-input" required>
                            </div>

                            <!-- Aperçu des images -->
                            <div class="image-preview-container" id="imagePreview"></div>

                            <?php $__errorArgs = ['images'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <div class="text-danger mt-2"><?php echo e($message); ?></div>
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            <?php $__errorArgs = ['images.*'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <div class="text-danger mt-2"><?php echo e($message); ?></div>
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>

                        <!-- 3. Descriptions -->
                        <div class="row mb-4">
                            <div class="col-md-6">
                                <label for="description_fr" class="form-label">Description (français)</label>
                                <textarea class="form-control" id="description_fr" name="description_fr" rows="4"><?php echo e(old('description_fr')); ?></textarea>
                            </div>
                            <div class="col-md-6">
                                <label for="description_en" class="form-label">Description (anglais)</label>
                                <textarea class="form-control" id="description_en" name="description_en" rows="4"><?php echo e(old('description_en')); ?></textarea>
                            </div>
                        </div>

                        <!-- 4. Services -->
                        <div class="option-section">
                            <h5 class="option-title"><i class="fas fa-concierge-bell"></i> Services</h5>

                            <!-- Service de ménage -->
                            <div class="form-check form-switch mb-3">
                                <input class="form-check-input" type="checkbox" id="has_cleaning" name="has_cleaning" value="1" <?php echo e(old('has_cleaning') ? 'checked' : ''); ?>>
                                <label class="form-check-label" for="has_cleaning">Service de ménage</label>
                                <small class="text-muted d-block mt-1">Cocher si l'hôtel propose un service de ménage quotidien</small>
                            </div>

                            <!-- Wi-Fi -->
                            <div class="mb-3">
                                <label class="form-label d-block">Wi-Fi inclus</label>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="has_wifi" id="has_wifi_oui" value="1" <?php echo e(old('has_wifi', 0) == 1 ? 'checked' : ''); ?>>
                                    <label class="form-check-label" for="has_wifi_oui">Oui</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="has_wifi" id="has_wifi_non" value="0" <?php echo e(old('has_wifi', 0) == 0 ? 'checked' : ''); ?>>
                                    <label class="form-check-label" for="has_wifi_non">Non</label>
                                </div>
                            </div>

                            <!-- Petit-déjeuner -->
                            <div class="mb-3">
                                <label class="form-label d-block">Petit-déjeuner inclus</label>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="has_breakfast" id="has_breakfast_oui" value="1" <?php echo e(old('has_breakfast', 0) == 1 ? 'checked' : ''); ?>>
                                    <label class="form-check-label" for="has_breakfast_oui">Oui</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="has_breakfast" id="has_breakfast_non" value="0" <?php echo e(old('has_breakfast', 0) == 0 ? 'checked' : ''); ?>>
                                    <label class="form-check-label" for="has_breakfast_non">Non</label>
                                </div>
                            </div>
                        </div>

                        <!-- 5. Localisation -->
<div class="option-section">
    <h5 class="option-title"><i class="fas fa-map-marker-alt"></i> Localisation</h5>

    <div class="row">
        <div class="col-md-6 mb-3">
            <label for="city" class="form-label">Ville <span class="text-danger">*</span></label>
            <select class="form-select" id="city" name="city" required>
                <option value="" disabled <?php echo e(old('city') ? '' : 'selected'); ?>>Sélectionnez une ville</option>
                <option value="Yopougon" <?php echo e(old('city') == 'Yopougon' ? 'selected' : ''); ?>>Yopougon</option>
                <option value="Cocody" <?php echo e(old('city') == 'Cocody' ? 'selected' : ''); ?>>Cocody</option>
                <option value="Marcory" <?php echo e(old('city') == 'Marcory' ? 'selected' : ''); ?>>Marcory</option>
                <option value="Treichville" <?php echo e(old('city') == 'Treichville' ? 'selected' : ''); ?>>Treichville</option>
                <option value="Port-Bouët" <?php echo e(old('city') == 'Port-Bouët' ? 'selected' : ''); ?>>Port-Bouët</option>
                <option value="Adjamé" <?php echo e(old('city') == 'Adjamé' ? 'selected' : ''); ?>>Adjamé</option>
                <option value="Plateau (centre-ville)" <?php echo e(old('city') == 'Plateau (centre-ville)' ? 'selected' : ''); ?>>Plateau (centre-ville)</option>
                <option value="Yamoussoukro" <?php echo e(old('city') == 'Yamoussoukro' ? 'selected' : ''); ?>>Yamoussoukro</option>
            </select>
        </div>

        <div class="col-md-6 mb-3">
            <label for="emplacement" class="form-label">Emplacement précis <span class="text-danger">*</span></label>
            <input type="text" class="form-control" id="emplacement" name="emplacement" value="<?php echo e(old('emplacement')); ?>" placeholder="Ex: Rue des Jardins, près du marché" required>
        </div>
    </div>

    <div class="row">
        <div class="col-md-6 mb-3">
            <label for="lat" class="form-label">Latitude <span class="text-danger">*</span></label>
            <input type="number" step="any" class="form-control" id="lat" name="lat" value="<?php echo e(old('lat')); ?>" placeholder="Ex: 5.1234" required>
        </div>

        <div class="col-md-6 mb-3">
            <label for="longi" class="form-label">Longitude <span class="text-danger">*</span></label>
            <input type="number" step="any" class="form-control" id="longi" name="longi" value="<?php echo e(old('longi')); ?>" placeholder="Ex: -4.5678" required>
        </div>
    </div>
</div>

                        <!-- 6. Capacités -->
                        <div class="option-section">
                            <h5 class="option-title"><i class="fas fa-bed"></i> Capacités</h5>

                            <div class="row">
                                <div class="col-md-4 mb-3">
                                    <label for="number_of_beds" class="form-label">Nombre de lits <span class="text-danger">*</span></label>
                                    <input type="number" class="form-control" id="number_of_beds" name="number_of_beds" min="1" value="<?php echo e(old('number_of_beds', 1)); ?>" required>
                                    <?php $__errorArgs = ['number_of_beds'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                        <div class="text-danger mt-2"><?php echo e($message); ?></div>
                                    <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label for="number_of_bathrooms" class="form-label">Salles de bain <span class="text-danger">*</span></label>
                                    <input type="number" class="form-control" id="number_of_bathrooms" name="number_of_bathrooms" min="1" value="<?php echo e(old('number_of_bathrooms', 1)); ?>" required>
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label for="number_of_ac" class="form-label">Climatiseurs <span class="text-danger">*</span></label>
                                    <input type="number" class="form-control" id="number_of_ac" name="number_of_ac" min="1" value="<?php echo e(old('number_of_ac', 1)); ?>" required>
                                    <?php $__errorArgs = ['number_of_ac'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                        <div class="text-danger mt-2"><?php echo e($message); ?></div>
                                    <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                                </div>
                            </div>
                        </div>

                        <!-- 7. Détails -->
                        <div class="option-section">
                            <h5 class="option-title"><i class="fas fa-info-circle"></i> Détails supplémentaires</h5>

                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label for="details_fr" class="form-label">Détails (français)</label>
                                    <input type="text" class="form-control" id="details_fr" name="details_fr" value="<?php echo e(old('details_fr')); ?>" placeholder="Ex: Piscine, salle de sport...">
                                </div>

                                <div class="col-md-6 mb-3">
                                    <label for="details_en" class="form-label">Détails (anglais)</label>
                                    <input type="text" class="form-control" id="details_en" name="details_en" value="<?php echo e(old('details_en')); ?>" placeholder="Ex: Swimming pool, gym...">
                                </div>
                            </div>
                        </div>

                        <!-- 8. Tarifs -->
                        <div class="option-section">
                            <h5 class="option-title"><i class="fas fa-tags"></i> Tarifs (FCFA/nuit)</h5>

                            <div class="row">
                                <div class="col-md-4 mb-3">
                                    <label for="price_standard" class="form-label">Chambre standard <span class="text-danger">*</span></label>
                                    <div class="input-group">
                                        <input type="number" class="form-control" id="price_standard" name="price_standard" min="10000" step="500" value="<?php echo e(old('price_standard', 35000)); ?>" required>
                                        <span class="input-group-text">FCFA</span>
                                    </div>
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label for="price_premium" class="form-label">Chambre premium <span class="text-danger">*</span></label>
                                    <div class="input-group">
                                        <input type="number" class="form-control" id="price_premium" name="price_premium" min="10000" step="500" value="<?php echo e(old('price_premium', 50000)); ?>" required>
                                        <span class="input-group-text">FCFA</span>
                                    </div>
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label for="price_suite" class="form-label">Suite <span class="text-danger">*</span></label>
                                    <div class="input-group">
                                        <input type="number" class="form-control" id="price_suite" name="price_suite" min="10000" step="500" value="<?php echo e(old('price_suite', 75000)); ?>" required>
                                        <span class="input-group-text">FCFA</span>
                                    </div>
                                    <?php $__errorArgs = ['price_suite'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                        <div class="text-danger mt-2"><?php echo e($message); ?></div>
                                    <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                                </div>
                            </div>
                        </div>

                        <!-- Bouton de soumission -->
                        <div class="d-flex justify-content-center mt-5">
                            <button type="submit" class="btn btn-submit">
                                <i class="fas fa-save me-2"></i>Enregistrer l'hôtel
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
    $(document).ready(function() {
        // Initialiser Select2 pour les selects
        $('#city').select2({
            width: '100%',
            placeholder: "Sélectionnez une ville",
            allowClear: true
        });

        // Aperçu des images avant upload
        $('#images').change(function() {
            $('#imagePreview').empty();
            if (this.files) {
                $.each(this.files, function(i, file) {
                    var reader = new FileReader();
                    reader.onload = function(e) {
                        $('#imagePreview').append(
                            '<div class="image-preview-item">' +
                                '<img src="' + e.target.result + '" alt="Preview">' +
                            '</div>'
                        );
                    }
                    reader.readAsDataURL(file);
                });
            }
        });

        // Validation des prix
        $('#price_premium').on('change', function() {
            if (parseInt($(this).val()) < parseInt($('#price_standard').val())) {
                alert('Le prix premium doit être supérieur au prix standard');
                $(this).val(parseInt($('#price_standard').val()) + 5000);
            }
        });

        $('#price_suite').on('change', function() {
            if (parseInt($(this).val()) < parseInt($('#price_premium').val())) {
                alert('Le prix suite doit être supérieur au prix premium');
                $(this).val(parseInt($('#price_premium').val()) + 5000);
            }
        });
    });
</script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH C:\Users\LENOVO\Documents\voyagedifiantDashboard\resources\views/page/formHotel.blade.php ENDPATH**/ ?>