
<nav x-data="{ scrolled: false, open: false }" @scroll.window="scrolled = window.pageYOffset > 50"
     :class="scrolled ? 'bg-white shadow-md py-3' : 'bg-transparent py-5'"
     class="fixed top-0 left-0 right-0 z-50 transition-all duration-300">
    <div class="max-w-screen-xl mx-auto px-6 lg:px-8 flex items-center justify-between">
        <a href="<?php echo e(route('home')); ?>" class="flex items-center gap-2.5 shrink-0">
            <svg width="40" height="40" viewBox="0 0 44 44" fill="none">
                <circle cx="22" cy="22" r="22" :fill="scrolled ? '#FEF2F2' : 'rgba(255,255,255,0.12)'"/>
                <polygon points="22,8 36,16 22,24 8,16" fill="#ED1C24"/>
                <rect x="34" y="16" width="2.5" height="9" fill="#ED1C24"/>
                <ellipse cx="35.25" cy="26.5" rx="3.5" ry="1.8" fill="#ED1C24"/>
                <rect x="19" y="24" width="6" height="8" rx="1" fill="#ED1C24"/>
                <rect x="17" y="31" width="10" height="2" rx="1" fill="#991B1B"/>
            </svg>
            <div>
                <div class="text-base font-black leading-none tracking-[0.05em]"
                     :class="scrolled ? 'text-[#ED1C24]' : 'text-white'">SMART</div>
                <div class="text-[9px] font-semibold tracking-[0.22em]"
                     :class="scrolled ? 'text-gray-800' : 'text-white/70'">ACADEMY</div>
            </div>
        </a>
        <div class="flex items-center gap-6 lg:gap-9">
            
            <div class="hidden lg:flex items-center gap-9">
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::openLoop(); ?><?php endif; ?><?php $__currentLoopData = ['Home' => '/', 'About' => '/about', 'Teachers' => '/teachers', 'Timetable' => '/timetable', 'Contact' => '/contact', 'Blog' => '/blog']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $label => $href): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::startLoopIteration(); ?><?php endif; ?>
                    <a href="<?php echo e($href); ?>"
                       :class="scrolled ? 'text-slate-800' : 'text-white'"
                       class="text-sm font-medium opacity-85 hover:opacity-100 transition-opacity"><?php echo e($label); ?></a>
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::endLoop(); ?><?php endif; ?><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::closeLoop(); ?><?php endif; ?>
            </div>
            
            <a href="<?php echo e(route('login')); ?>"
               class="hidden lg:inline-flex bg-[#ED1C24] text-white rounded-full px-6 py-2.5 text-sm font-bold shadow-[0_4px_15px_rgba(237,28,36,0.45)] hover:bg-red-700 transition-colors whitespace-nowrap">
                Login Portal
            </a>
            
            <button @click="open = true"
                    class="lg:hidden flex items-center justify-center w-10 h-10 rounded-lg text-white hover:text-red-500 focus:outline-none transition-colors"
                    :class="scrolled ? 'text-slate-800 hover:text-red-500' : 'text-white hover:text-red-400'"
                    aria-label="Open menu">
                <svg class="w-6 h-6" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" viewBox="0 0 24 24">
                    <line x1="3" y1="6" x2="21" y2="6"/>
                    <line x1="3" y1="12" x2="21" y2="12"/>
                    <line x1="3" y1="18" x2="21" y2="18"/>
                </svg>
            </button>
        </div>
    </div>

    
    <div x-show="open"
         x-transition:enter="transition-opacity duration-300"
         x-transition:enter-start="opacity-0"
         x-transition:enter-end="opacity-100"
         x-transition:leave="transition-opacity duration-300"
         x-transition:leave-start="opacity-100"
         x-transition:leave-end="opacity-0"
         @click="open = false"
         class="lg:hidden fixed inset-0 bg-black/50 backdrop-blur-sm z-40"
         style="display:none"></div>

    
    <div x-show="open"
         x-transition:enter="transition-transform duration-300 ease-out"
         x-transition:enter-start="translate-x-full"
         x-transition:enter-end="translate-x-0"
         x-transition:leave="transition-transform duration-300 ease-in"
         x-transition:leave-start="translate-x-0"
         x-transition:leave-end="translate-x-full"
         class="lg:hidden fixed inset-y-0 right-0 w-72 bg-[#111111]/95 backdrop-blur-2xl border-l border-white/10 z-50 flex flex-col shadow-2xl"
         style="display:none">

        
        <div class="flex items-center justify-between px-6 pt-6 pb-4 border-b border-white/10">
            <div>
                <div class="text-base font-black text-[#ED1C24] tracking-[0.05em] leading-none">SMART</div>
                <div class="text-[9px] font-semibold tracking-[0.22em] text-white/50 mt-0.5">ACADEMY</div>
            </div>
            <button @click="open = false"
                    class="flex items-center justify-center w-9 h-9 rounded-lg text-white/60 hover:text-white hover:bg-white/10 transition-colors focus:outline-none"
                    aria-label="Close menu">
                <svg class="w-5 h-5" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" viewBox="0 0 24 24">
                    <line x1="18" y1="6" x2="6" y2="18"/>
                    <line x1="6" y1="6" x2="18" y2="18"/>
                </svg>
            </button>
        </div>

        
        <nav class="flex-1 px-6 py-4 overflow-y-auto">
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::openLoop(); ?><?php endif; ?><?php $__currentLoopData = ['Home' => '/', 'About' => '/about', 'Teachers' => '/teachers', 'Timetable' => '/timetable', 'Contact' => '/contact', 'Blog' => '/blog']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $label => $href): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::startLoopIteration(); ?><?php endif; ?>
                <a href="<?php echo e($href); ?>"
                   class="flex items-center text-zinc-300 hover:text-white font-semibold text-lg py-3.5 border-b border-white/5 transition-colors">
                    <?php echo e($label); ?>

                </a>
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::endLoop(); ?><?php endif; ?><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::closeLoop(); ?><?php endif; ?>
        </nav>

        
        <div class="px-6 pb-8 pt-4">
            <a href="<?php echo e(route('login')); ?>"
               class="block w-full bg-[#ED1C24] hover:bg-red-700 text-white font-bold py-3.5 rounded-xl text-center shadow-lg shadow-red-600/20 transition-colors text-base">
                Login Portal
            </a>
        </div>
    </div>
</nav>
<?php /**PATH D:\Supun\smart academy\smart-academy\resources\views/website/partials/navbar.blade.php ENDPATH**/ ?>