<?php $__env->startSection('content'); ?>        

        <section class="pt-md-4 pb-md-0" style="
                        height: 600px;
                        background: 
                        linear-gradient(
                          rgba(0, 0, 0, 0.6), 
                          rgba(0, 0, 0, 0.6)
                        ),
                        /* bottom, image */
                        url('<?php echo e(asset($banner->data)); ?>');
                        background-size: 100% 100%;
                        background-repeat: no-repeat;">
          <div class="container">
            <div class="row justify-content-between align-items-center">
              <div class="col-lg-8 col-md-9">
                <div class="d-none d-md-block">
                  <br><br><br>
                </div>
                <h4 class="display-3 d-none d-md-block" style="color: white;">La manera más fácil de encontrar un hotel en Guatemala</h4>
                <h4 class="d-block d-md-none" style="color: white;">La manera más fácil de encontrar un hotel en Guatemala</h4>

                <p class="lead"></p>           
              </div>
              <div class="col-md-3 d-none d-md-block">
                <img src="<?php echo e(asset('img/guatehoteles.png')); ?>" style="width: 1000px;" alt="Image">
              </div>
            </div>
            <form action="<?php echo e(asset('/hoteles')); ?>" method="GET">
                <div class="row">
                    <div class="col-12 col-md-2">
                       <label style="margin: 0px; color: white;">Departamento</label>
                       <select class="form-control" name="departamento" id="departamento" required="required">
                           <option value="">Selecciona una opción</option>
                           <?php $__currentLoopData = $departamentos; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <option value="<?php echo e($key->id); ?>"><?php echo e($key->departamento); ?></option>
                           <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                       </select><br>
                    </div>
                    <div class="col-12 col-md-2">
                       <label style="margin: 0px; color: white;">Municipio</label>
                       <select class="form-control" name="municipio" id="municipio">
                           <option value="">Selecciona una opción</option>
                       </select><br>
                    </div>
                    <div class="col-12 col-md-3">
                        <label style="margin: 0px; color: white;">Fecha de llegada</label>
                        <input type="date" name="check_in" class="form-control" required="required"><br>
                    </div>
                    <div class="col-12 col-md-3">
                        <label style="margin: 0px; color: white;">Fecha de salida</label>
                        <input type="date" name="check_out" class="form-control" required="required"><br>
                    </div>
                    <div class="col-12 col-md-1">
                        <label style="margin: 0px; color: white;">Huésped</label>
                        <input type="number" name="huesped" class="form-control" id="huesped" value="1" required="required" min="1"><br>
                    </div>
                    <div class="col-12 col-md-1">
                        <br>
                        <input type="hidden" name="a" value="1" id="form-a">
                        <input type="hidden" name="n" value="0" id="form-n">
                        <center><button class="btn btn-primary" type="submit">Buscar</button></center>
                    </div>
                </div>
                <div style="display: none;" id="form-edad">
                  
                </div>
            </form>            
          </div>
        </section>

        <?php if($hoteles_guatehoteles->count() != 0): ?>
          <section class="o-hidden" style="background: linear-gradient(90deg, #0099FF 0%, #6610f2 100%);
          max-height: 800px;
          ">
            <div class="container">
              <div class="row mb-4">
                <div class="col">
                  <span class="h2 text-white">Hoteles recomendados por nosotros</span>
                </div>
              </div>
            </div>
            <div data-flickity="{ &quot;cellAlign&quot;:&quot;<?php if($hoteles_guatehoteles->count()< 4): ?> false <?php else: ?> true <?php endif; ?>&quot;,&quot;autoPlay&quot;: true, &quot;contain&quot;: true, &quot;imagesLoaded&quot;: true, &quot;wrapAround&quot;: true }" class="controls-light slider-highlight-selected">
            <?php $__currentLoopData = $hoteles_guatehoteles; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
              <div class="col-12 col-md-4 col-lg-3 pt-3">
                  <?php echo $__env->make('layouts.cardhoteles', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
              </div>
            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>            
            </div>
          </section>
        <?php endif; ?>

        <?php if($hoteles_inguat->count() != 0): ?>
        <section>
          <center><h1>Hoteles reconocidos por Inguat</h1></center>
          <hr>

          <div class="container">
            <div class="row">
             <?php $__currentLoopData = $hoteles_inguat; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
              <div class="col-md-3">
                <?php echo $__env->make('layouts.cardhoteles', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
              </div>
              <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </div>
          </div>

        </section>
        <?php endif; ?>

        <section style="background: #152a49;">
          <center><h1 class="text-white">Encuentra hoteles según tu destino</h1></center>
          <hr>

          <div class="container0" style="padding: 30px;">
            <div class="row">
             <?php $__currentLoopData = $departamentos; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
              <div class="col-md-3">
                <div class="card">
                  <img class="card-img-top" src="<?php echo e(asset($key->img)); ?>" alt="<?php echo e($key->departamento); ?>" style="min-height: 133.5px; max-height: 133.5px;" />
                  <div class="card-body py-3">
                    <h5><?php echo e($key->departamento); ?></h5><hr>
                    <div style="min-height: 150px; max-height: 150px;overflow: auto;font-size: 14px;">
                      <?php $__currentLoopData = $key->municipios; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key2): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>                         
                        <div class="row" style="padding: 0;margin: 0px;">
                          <div class="col-10" style="font-size: 13px;"><?php echo e($key2->municipio); ?></div>
                          <div class="col-2"  style="font-size: 13px;"> <span><?php echo e($key2->n_hoteles()); ?></span></div>
                        </div>
                      <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </div>
                  </div>
                  <div class="card-footer">
                    <div class="d-flex align-items-center justify-content-between">
                        <a href="<?php echo e(asset('hoteles')); ?>?departamento=<?php echo e($key->id); ?>">Ver todos</a>                        
                        <i class="material-icons text-dark">keyboard_arrow_right</i>
                    </div>
                  </div>
                </div>
              </div>
              <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </div>
          </div>

        </section>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('script'); ?>
    <script type="text/javascript">
    var departamentos = [
      <?php 
        foreach ($departamentos as $key) {
          echo "
            {
              id:".$key->id.',
              municipios:[              
            ';

            foreach ($key->municipios as $key2) {
              echo "
                {
                  id:".$key2->id.",
                  municipio: '".$key2->municipio."'
                },
              ";
            }

            echo "]},";
        }
      ?>
    ];

    $('#departamento').change(function(){

      var value = $(this).val();

      if (value=='') {

        var option = '<option value="">Selecciona una opción</option>';
        $('#municipio').html(option);

      }else{
        var option = '<option value="">Selecciona una opción</option>';

        var municipios = departamentos[value - 1].municipios;

        municipios.forEach(function(element){
          option = option + '<option value="'+element.id+'">'+element.municipio+'</option>';
        });

        $('#municipio').html(option);
      }
    });    

  </script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH C:\xampp\htdocs\guatehoteles\resources\views/welcome.blade.php ENDPATH**/ ?>