{{-- NetGescon Header Brandizzato --}}
<div class="flex items-center justify-between">
    <!-- Breadcrumb e Titolo Pagina -->
    <div>
        @if(isset($breadcrumbs) && count($breadcrumbs) > 0)
            <nav class="netgescon-breadcrumb text-white/70">
                @foreach($breadcrumbs as $item)
                    @if($loop->last)
                        <span class="text-white font-medium">{{ $item['title'] ?? $item['label'] ?? $item }}</span>
                    @else
                        @if(isset($item['url']))
                            <a href="{{ $item['url'] }}" class="text-white/80 hover:text-white">{{ $item['title'] ?? $item['label'] ?? $item }}</a>
                        @else
                            <span class="text-white/80">{{ $item['title'] ?? $item['label'] ?? $item }}</span>
                        @endif
                        <i class="fas fa-chevron-right text-xs mx-2"></i>
                    @endif
                @endforeach
            </nav>
        @endif
        
        <h1 class="text-2xl font-bold text-white">
            @yield('page-title', 'Dashboard')
        </h1>
        
        @if(isset($pageDescription))
            <p class="text-white/80 text-sm mt-1">{{ $pageDescription }}</p>
        @endif
    </div>
    
    <!-- Actions e User Menu -->
    <div class="flex items-center space-x-4">
        <!-- Notifications -->
        <div class="relative">
            <button class="p-2 text-white/80 hover:text-white transition-colors">
                <i class="fas fa-bell text-lg"></i>
                <span class="absolute -top-1 -right-1 bg-red-500 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center">
                    3
                </span>
            </button>
        </div>
        
        <!-- Quick Actions -->
        <div class="hidden md:flex items-center space-x-2">
            <a href="{{ route('admin.rubrica.index') }}" class="netgescon-btn netgescon-btn-secondary">
                <i class="fas fa-address-book"></i>
                Rubrica
            </a>
            <button class="netgescon-btn netgescon-btn-secondary">
                <i class="fas fa-plus"></i>
                Nuovo Stabile
            </button>
        </div>
        
        <!-- User Dropdown -->
        <div class="relative" x-data="{ open: false }">
            <button @click="open = !open" class="flex items-center space-x-3 p-2 rounded-lg hover:bg-white/10 transition-colors">
                <div class="w-8 h-8 bg-white/20 rounded-full flex items-center justify-center">
                    <span class="text-white text-sm font-medium">
                        {{ auth()->user() ? substr(auth()->user()->name, 0, 2) : 'U' }}
                    </span>
                </div>
                <div class="hidden md:block text-left">
                    <div class="text-white text-sm font-medium">{{ auth()->user()->name ?? 'Utente' }}</div>
                    <div class="text-white/70 text-xs">Amministratore</div>
                </div>
                <i class="fas fa-chevron-down text-white/70 text-xs"></i>
            </button>
            
            <!-- Dropdown Menu -->
            <div x-show="open" 
                 x-transition:enter="transition ease-out duration-100"
                 x-transition:enter-start="transform opacity-0 scale-95"
                 x-transition:enter-end="transform opacity-100 scale-100"
                 x-transition:leave="transition ease-in duration-75"
                 x-transition:leave-start="transform opacity-100 scale-100"
                 x-transition:leave-end="transform opacity-0 scale-95"
                 @click.away="open = false"
                 class="absolute right-0 mt-2 w-48 bg-white rounded-lg shadow-lg border border-gray-200 py-1 z-50">
                 
                <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">
                    <i class="fas fa-user w-4 mr-2"></i>
                    Il mio Profilo
                </a>
                
                <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">
                    <i class="fas fa-cog w-4 mr-2"></i>
                    Impostazioni
                </a>
                
                <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">
                    <i class="fas fa-question-circle w-4 mr-2"></i>
                    Aiuto
                </a>
                
                <hr class="my-1">
                
                <form method="POST" action="{{ route('logout') }}">
                    @csrf
                    <button type="submit" class="w-full text-left block px-4 py-2 text-sm text-red-600 hover:bg-red-50">
                        <i class="fas fa-sign-out-alt w-4 mr-2"></i>
                        Logout
                    </button>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- Mobile Menu Toggle -->
<button class="md:hidden fixed top-4 left-4 z-50 p-2 bg-white/20 rounded-lg backdrop-blur-sm" 
        onclick="toggleMobileMenu()">
    <i class="fas fa-bars text-white"></i>
</button>