<!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>JF&I Courier Booking Portal V.2</title>
    
    <!-- Fonts -->
    <link rel="preconnect" href="https://fonts.bunny.net">
    <link href="https://fonts.bunny.net/css?family=instrument-sans:400,500,600" rel="stylesheet" />

    <!-- Scripts -->
    <?php echo app('Illuminate\Foundation\Vite')(['resources/css/app.css', 'resources/js/app.js']); ?>
    
    <style>
        .hero-overlay {
            background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.7));
        }
        @keyframes fadeInUp {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }
        @keyframes fadeInDown {
            from { opacity: 0; transform: translateY(-20px); }
            to { opacity: 1; transform: translateY(0); }
        }
        @keyframes slowZoom {
            from { transform: scale(1); }
            to { transform: scale(1.1); }
        }
        .animate-fade-in-up { animation: fadeInUp 0.8s ease-out forwards; }
        .animate-fade-in-down { animation: fadeInDown 0.8s ease-out forwards; }
        .animate-slow-zoom { animation: slowZoom 20s infinite alternate linear; }
        .glass-card {
            background: rgba(255, 255, 255, 0.1);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.2);
        }
    </style>
</head>
<body class="font-poppins text-jfi-dark antialiased bg-black overflow-hidden">
    
    <!-- Header (Logo Only) -->
    <header class="fixed top-0 w-full z-50 p-6 animate-fade-in-down">
        <div class="container mx-auto flex justify-between items-center">
            <a href="/" class="block">
                <img src="https://jfi.lk/images/logo.png" alt="JF&I Logo" class="h-16 w-auto brightness-0 invert drop-shadow-md hover:opacity-80 transition-opacity duration-300">
            </a>
        </div>
    </header>

    <!-- Main Portal Section -->
    <div class="relative w-full h-screen flex flex-col justify-center items-center text-center text-white px-4">
         <!-- Background Image -->
         <div class="absolute inset-0 overflow-hidden">
            <div class="w-full h-full bg-cover bg-center animate-slow-zoom" style="background-image: url('https://jfi.lk/images/gallery/Koswatta.JPG');"></div>
            <div class="absolute inset-0 hero-overlay"></div>
         </div>

         <!-- Content -->
         <div class="relative z-10 w-full max-w-5xl mx-auto">
            <div class="glass-card rounded-2xl p-12 md:p-16 shadow-2xl transform transition-all hover:shadow-[0_0_30px_rgba(211,180,95,0.3)] duration-500 animate-fade-in-up">
                 <h1 class="text-4xl md:text-7xl font-bold mb-6 leading-normal tracking-wide drop-shadow-lg text-transparent bg-clip-text bg-gradient-to-r from-white via-gray-200 to-gray-400 pb-2">
                    JF&I Courier<br>Booking Portal V.2
                 </h1>
                 
                 <?php if(Route::has('login')): ?>
                     <div class="flex flex-col md:flex-row justify-center gap-6 opacity-0 animate-fade-in-up" style="animation-delay: 0.6s; animation-fill-mode: forwards;">
                        <?php if(auth()->guard()->check()): ?>
                            <a href="<?php echo e(url('/dashboard')); ?>" class="group relative px-10 py-4 bg-jfi-gold text-white font-bold rounded-full overflow-hidden shadow-lg transition-all duration-300 hover:scale-105 hover:shadow-glow">
                                <span class="relative z-10">GO TO DASHBOARD</span>
                                <div class="absolute inset-0 bg-white opacity-0 group-hover:opacity-20 transition-opacity duration-300"></div>
                            </a>
                        <?php else: ?>
                            <a href="<?php echo e(route('login')); ?>" class="group relative px-10 py-4 bg-transparent border-2 border-white text-white font-bold rounded-full overflow-hidden shadow-lg transition-all duration-300 hover:bg-white hover:text-jfi-dark hover:scale-105 min-w-[180px]">
                                <span class="relative z-10">LOG IN</span>
                            </a>

                            <?php if(Route::has('register')): ?>
                                <a href="<?php echo e(route('register')); ?>" class="group relative px-10 py-4 bg-jfi-gold border-2 border-jfi-gold text-white font-bold rounded-full overflow-hidden shadow-lg transition-all duration-300 hover:bg-transparent hover:border-white hover:scale-105 min-w-[180px]">
                                    <span class="relative z-10">REGISTER</span>
                                </a>
                            <?php endif; ?>
                        <?php endif; ?>
                     </div>
                 <?php endif; ?>
            </div>
         </div>
         
         <!-- Footer Copyright (Fixed bottom) -->
         <div class="absolute bottom-6 text-white text-opacity-60 text-sm">
             &copy; <?php echo e(date('Y')); ?> JF&I Packaging. All rights reserved.
         </div>
         
         <!-- Footer Copyright (Fixed bottom) -->
         <div class="absolute bottom-6 text-white text-opacity-60 text-sm">
             &copy; <?php echo e(date('Y')); ?> JF&I Packaging. All rights reserved.
         </div>

         <!-- Spotlight Overlay -->
         <div class="fixed inset-0 pointer-events-none z-0 spotlight transition-opacity duration-500"></div>

         <script>
            const spotlight = document.querySelector('.spotlight');
            document.addEventListener('mousemove', (e) => {
                const x = e.clientX;
                const y = e.clientY;
                spotlight.style.background = `radial-gradient(circle 600px at ${x}px ${y}px, rgba(211, 180, 95, 0.15), transparent 40%)`;
            });
         </script>
    </div>
</body>
</html>
<?php /**PATH F:\xampp\htdocs\courier_booking\resources\views/welcome.blade.php ENDPATH**/ ?>