LauckCycles/resources/views/components/navbar.blade.php

<nav class="bg-slate-100/90 dark:bg-neutral-900/90 backdrop-blur-md border-b border-black/10 dark:border-white/10 w-full z-50 sticky top-0">
    <div class="max-w-7xl flex flex-wrap items-center justify-between mx-auto p-4">
        
        <!-- Logo -->
        @auth
            <a href="{{ route('dashboard') }}" class="flex items-center space-x-3 rtl:space-x-reverse group">
        @endauth
        @guest
            <a href="{{ url('/') }}" class="flex items-center space-x-3 rtl:space-x-reverse group">
        @endguest
            <div class="h-10 w-10 bg-slate-200 dark:bg-neutral-800 rounded-full flex items-center justify-center border-2 border-transparent group-hover:border-lime-700 group-hover:dark:border-neon-lime transition-all duration-300">
                <svg class="w-6 h-6 dark:text-white group-hover:text-lime-700 group-hover:dark:text-neon-lime transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg>
            </div>
            <span class="self-center text-2xl font-black whitespace-nowrap dark:text-white italic tracking-wide group-hover:text-lime-700 group-hover:dark:text-neon-lime transition-colors duration-300">
                LAUCK<span class="text-lime-700 dark:text-neon-lime font-light not-italic">SYS</span>
            </span>
        </a>

        <!-- Mobile Menu Button -->
        <button data-collapse-toggle="navbar-default" type="button" class="inline-flex items-center p-2 w-10 h-10 justify-center text-gray-400 rounded-lg md:hidden hover:bg-neutral-800 focus:outline-none focus:ring-2 focus:ring-neon-lime" aria-controls="navbar-default" aria-expanded="false">
            <span class="sr-only">Abrir menú</span>
            <svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 17 14">
                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 1h15M1 7h15M1 13h15"/>
            </svg>
        </button>

        <!-- Links -->
        <div class="hidden w-full md:block md:w-auto" id="navbar-default">
            <ul class="font-bold flex flex-col items-center p-4 md:p-0 mt-4 border border-neutral-700 rounded-lg bg-neutral-800 md:flex-row md:space-x-8 rtl:space-x-reverse md:mt-0 md:border-0 md:bg-transparent">

                @auth
                    <li>
                        <a href="{{ url('/dashboard') }}" 
                            class="block py-2 px-3 md:p-0 transition-colors {{ request()->is('dashboard') ? 'text-lime-600 dark:text-neon-lime border-b-2 border-lime-600 dark:border-neon-lime' : 'dark:text-white hover:text-lime-600 hover:dark:text-neon-lime' }}">
                            Inicio
                        </a>
                    </li>
                    <li>
                        <a href="{{ url('/productos') }}" 
                            class="block py-2 px-3 md:p-0 transition-colors {{ request()->is('productos*') ? 'text-lime-600 dark:text-neon-lime border-b-2 border-lime-600 dark:border-neon-lime' : 'dark:text-white hover:text-lime-600 hover:dark:text-neon-lime' }}">
                            Stock
                        </a>
                    </li>
                    <li>
                        <a href="{{ route('taller.index') }}" 
                            class="block py-2 px-3 md:p-0 transition-colors {{ request()->is('taller*') ? 'text-lime-600 dark:text-neon-lime border-b-2 border-lime-600 dark:border-neon-lime' : 'dark:text-white hover:text-lime-600 hover:dark:text-neon-lime' }}">
                            Taller
                        </a>
                    </li>
                    <li>
                        <a href="{{ route('sales.index') }}" 
                            class="block py-2 px-3 md:p-0 transition-colors {{ request()->is('sales*') ? 'text-lime-600 dark:text-neon-lime border-b-2 border-lime-600 dark:border-neon-lime' : 'dark:text-white hover:text-lime-600 hover:dark:text-neon-lime' }}">
                            Ventas
                        </a>
                    </li>
                @endauth

                <button onclick="toggleTheme()" class="p-2 text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white transition-colors rounded-full hover:bg-gray-200 dark:hover:bg-neutral-800">
                    <!-- Icono de Sol (Se muestra en modo oscuro) -->
                    <svg class="w-5 h-5 hidden dark:block" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path></svg>
                    <!-- Icono de Luna (Se muestra en modo claro) -->
                    <svg class="w-5 h-5 block dark:hidden" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path></svg>
                </button>
                
                {{-- LÓGICA DE VISITANTE (GUEST) --}}
                @guest
                    <li>
                        <a href="{{ url('/catalogo') }}" 
                            class="block py-2 px-3 md:p-0 transition-colors {{ request()->is('catalogo*') ? 'text-lime-600 dark:text-neon-lime border-b-2 border-lime-600 dark:border-neon-lime' : 'dark:text-white hover:text-lime-600 hover:dark:text-neon-lime' }}">
                            Catalogo
                        </a>
                    </li>

                    <!-- Buscador Integrado -->
                    <li class="w-full md:w-auto my-2 md:my-0">
                        <form action="{{ route('catalogo.index') }}" method="GET">
                            <div class="relative">
                                <input type="text" name="search" 
                                    class="block w-full md:w-48 p-2 ps-3 text-xs dark:text-white border border-slate-400 dark:border-neutral-600 rounded-full bg-slate-300/50 dark:bg-neutral-800/50 focus:ring-neon-lime focus:border-neon-lime placeholder-gray-500 transition-all focus:w-full md:focus:w-64" 
                                    placeholder="Buscar productos...">
                                <button type="submit" class="absolute top-0 end-0 p-2 text-sm font-medium h-full dark:text-white rounded-e-lg hover:text-lime-600 hover:dark:text-neon-lime">
                                    <svg class="w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
                                        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"/>
                                    </svg>
                                </button>
                            </div>
                        </form>
                    </li>

                    <!-- Botón Login Resaltado -->
                    <li>
                        <a href="{{ route('login') }}" 
                            class="block py-2 px-5 text-center text-neon-lime dark:text-neutral-900 bg-neutral-900 dark:bg-neon-lime font-black rounded hover:dark:bg-[#b3e600] transition-colors uppercase tracking-wider text-xs shadow-lg shadow-gray-300 dark:shadow-neon-lime/20 hover:dark:shadow-neon-lime/40 transform hover:-translate-y-0.5 duration-200">
                            Ingresar
                        </a>
                    </li>
                @endguest
            </ul>
        </div>
    </div>
</nav>