<?php $__env->startSection('title', 'Bienvenido'); ?>

<?php $__env->startSection('content'); ?>
  <section class="hero py-5">
    <div class="row align-items-center g-4">
      <div class="col-lg-7">
        <span class="brand-badge">Nuevo</span>
        <h1 class="display-5 mt-3">Organiza, sube y comparte la <span style="color:var(--accent)">historia visual</span> de tu evento</h1>
        <p class="lead mt-3">
          Crea tu evento, sube imágenes en minutos y comparte un enlace de vista previa protegido por código.
          Ideal para matrimonios, lanzamientos, cumpleaños o eventos corporativos.
        </p>

        <div class="d-flex flex-wrap gap-2 mt-3">
          <?php if(auth()->guard()->check()): ?>
            <?php if(Route::has('events.create')): ?>
              <a href="<?php echo e(route('events.create')); ?>" class="btn btn-accent btn-lg">Crear mi evento</a>
            <?php endif; ?>
            <?php if(Route::has('events.index')): ?>
              <a href="<?php echo e(route('events.index')); ?>" class="btn btn-outline-light btn-lg">Ver mis eventos</a>
            <?php endif; ?>
          <?php else: ?>
            <?php if(Route::has('register')): ?>
              <a href="<?php echo e(route('register')); ?>" class="btn btn-accent btn-lg">Comenzar gratis</a>
            <?php endif; ?>
            <?php if(Route::has('login')): ?>
              <a href="<?php echo e(route('login')); ?>" class="btn btn-outline-light btn-lg">Ya tengo cuenta</a>
            <?php endif; ?>
          <?php endif; ?>
        </div>

        
        <div class="mt-4 p-3 code-pill">
          <form class="row g-2 align-items-center" action="<?php echo e(url('/p')); ?>" method="GET" onsubmit="return goToPreview(event)">
            <div class="col-md-7">
              <input id="slugInput" type="text" class="form-control form-control-lg bg-dark text-white border-0"
                     placeholder="Pega aquí el enlace de preview (ej: /p/mi-evento-abc123)">
            </div>
            <div class="col-md-3">
              <input id="codeInput" type="password" class="form-control form-control-lg bg-dark text-white border-0"
                     placeholder="Código">
            </div>
            <div class="col-md-2 d-grid">
              <button class="btn btn-outline-light btn-lg">Entrar</button>
            </div>
          </form>
          <small class="text-muted ms-1">Tu galería se abre con un código privado, sólo para invitados.</small>
        </div>
      </div>

      
      <div class="col-lg-5">
        <?php
          $featured = ($featuredEvents ?? collect());
        ?>

        <?php if($featured->isNotEmpty()): ?>
          <div id="featuredCarousel" class="carousel slide rounded-4 overflow-hidden shadow-lg border" data-bs-ride="carousel">
            <div class="carousel-inner">
              <?php $__currentLoopData = $featured; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $i => $ev): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <?php
                  $cover = optional($ev->images->first())->path
                    ? asset('storage/'.$ev->images->first()->path)
                    : 'https://images.unsplash.com/photo-1511578314322-379afb476865?q=80&w=1600&auto=format&fit=crop';
                ?>
                <div class="carousel-item <?php echo e($i === 0 ? 'active' : ''); ?>">
                  <img src="<?php echo e($cover); ?>" class="d-block w-100" style="height:420px; object-fit:cover" alt="Evento destacado">
                  <div class="carousel-caption d-none d-md-block text-start">
                    <h5 class="fw-semibold"><?php echo e($ev->titulo); ?></h5>
                    <p class="text-white-50">Vista protegida: /p/<?php echo e($ev->slug); ?></p>
                  </div>
                </div>
              <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </div>
            <button class="carousel-control-prev" type="button" data-bs-target="#featuredCarousel" data-bs-slide="prev">
              <span class="carousel-control-prev-icon" aria-hidden="true"></span>
              <span class="visually-hidden">Anterior</span>
            </button>
            <button class="carousel-control-next" type="button" data-bs-target="#featuredCarousel" data-bs-slide="next">
              <span class="carousel-control-next-icon" aria-hidden="true"></span>
              <span class="visually-hidden">Siguiente</span>
            </button>
          </div>
        <?php else: ?>
          <img class="w-100 rounded-4 shadow-lg border"
               src="https://images.unsplash.com/photo-1511578314322-379afb476865?q=80&w=1600&auto=format&fit=crop"
               alt="Demo eventos">
        <?php endif; ?>
      </div>
    </div>
  </section>

  
  <section class="py-4">
    <div class="d-flex align-items-center justify-content-between mb-3">
      <h2 class="h4 m-0">Eventos recientes</h2>
      <?php if(auth()->guard()->check()): ?>
        <?php if(Route::has('events.create')): ?>
          <a href="<?php echo e(route('events.create')); ?>" class="link-light text-decoration-none">+ Nuevo evento</a>
        <?php endif; ?>
      <?php endif; ?>
    </div>

    <div class="row g-3">
      <?php
        $recent = ($recentEvents ?? collect());
      ?>

      <?php $__empty_1 = true; $__currentLoopData = $recent; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $ev): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
        <?php
          $cover = optional($ev->images->first())->path
            ? asset('storage/'.$ev->images->first()->path)
            : 'https://images.unsplash.com/photo-1521119989659-a83eee488004?q=80&w=1600&auto=format&fit=crop';
        ?>
        <div class="col-6 col-md-4 col-lg-3">
          <div class="card card-surface h-100 rounded-4 overflow-hidden">
            <img src="<?php echo e($cover); ?>" alt="Portada evento" style="aspect-ratio:16/9; object-fit:cover; border-bottom:1px solid rgba(255,255,255,.06)">
            <div class="card-body">
              <h3 class="h6 mb-1 text-truncate"><?php echo e($ev->titulo); ?></h3>
              <div class="small text-muted">Preview: /p/<?php echo e($ev->slug); ?></div>
            </div>
            <div class="card-footer bg-transparent border-0 d-flex gap-2">
              <?php if(Route::has('preview.form')): ?>
                <a class="btn btn-sm btn-outline-light flex-fill" href="<?php echo e(route('preview.form', $ev->slug)); ?>">Ver</a>
              <?php endif; ?>
              <?php if(auth()->guard()->check()): ?> <?php if (app(\Illuminate\Contracts\Auth\Access\Gate::class)->check('update', $ev)): ?>
                <?php if(Route::has('events.edit')): ?>
                  <a class="btn btn-sm btn-accent flex-fill" href="<?php echo e(route('events.edit', $ev)); ?>">Editar</a>
                <?php endif; ?>
              <?php endif; ?> <?php endif; ?>
            </div>
          </div>
        </div>
      <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
        <?php for($i=0; $i<8; $i++): ?>
          <div class="col-6 col-md-4 col-lg-3">
            <div class="card card-surface h-100 rounded-4 overflow-hidden">
              <img src="https://images.unsplash.com/photo-1521119989659-a83eee488004?q=80&w=1600&auto=format&fit=crop" alt="Demo"
                   style="aspect-ratio:16/9; object-fit:cover; border-bottom:1px solid rgba(255,255,255,.06)">
              <div class="card-body">
                <h3 class="h6 mb-1">Tu próximo evento</h3>
                <div class="small text-muted">Súbelo y compártelo</div>
              </div>
              <div class="card-footer bg-transparent border-0">
                <?php if(auth()->guard()->check()): ?>
                  <?php if(Route::has('events.create')): ?>
                    <a class="btn btn-sm btn-accent w-100" href="<?php echo e(route('events.create')); ?>">Crear ahora</a>
                  <?php endif; ?>
                <?php else: ?>
                  <?php if(Route::has('register')): ?>
                    <a class="btn btn-sm btn-outline-light w-100" href="<?php echo e(route('register')); ?>">Crear cuenta</a>
                  <?php endif; ?>
                <?php endif; ?>
              </div>
            </div>
          </div>
        <?php endfor; ?>
      <?php endif; ?>
    </div>
  </section>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
<script>
  // Permite pegar "/p/slug" o URL completa y mandar al form de código
  function goToPreview(e) {
    e.preventDefault();
    const slugInput = document.getElementById('slugInput');
    const codeInput = document.getElementById('codeInput');
    const raw = (slugInput.value || '').trim();
    if (!raw) return;

    let slug = raw;
    try {
      const url = new URL(raw, window.location.origin);
      const parts = url.pathname.split('/').filter(Boolean);
      if (parts[0] === 'p' && parts[1]) slug = '/p/' + parts[1];
    } catch (_) {
      // si pegó path relativo, seguimos con raw
    }

    if (codeInput.value) {
      sessionStorage.setItem('prefill_code', codeInput.value);
    }
    window.location.href = slug;
  }
</script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\Users\jaran\Documents\Marketing Digital\Laravel\eventos\resources\views/welcome.blade.php ENDPATH**/ ?>