@php
    $authHomeRoute = null;
    $authHomeLabel = 'Dashboard';

    if (auth()->check()) {
        $authHomeRoute = auth()->user()->isAdmin()
            ? route('admin.dashboard')
            : (auth()->user()->isSupportTeam()
                ? route('support-team.dashboard')
                : (auth()->user()->isMentor() ? route('mentor.dashboard') : route('dashboard')));
        $authHomeLabel = auth()->user()->isAdmin()
            ? 'Admin Dashboard'
            : (auth()->user()->isSupportTeam()
                ? 'Support Dashboard'
                : (auth()->user()->isMentor() ? 'Mentor Dashboard' : 'Dashboard'));
    }
@endphp

<header class="sticky top-0 z-30 border-b border-blue-100 bg-white/85 backdrop-blur-xl transition-colors duration-300 dark:border-blue-900/50 dark:bg-slate-950/85">
    <div class="mx-auto flex max-w-7xl items-center justify-between gap-4 px-4 py-4 sm:px-6 lg:px-8">
        <a href="{{ url('/') }}" class="flex min-w-0 items-center">
            <x-application-logo class="h-10 w-44 shrink-0" />
        </a>

        <nav class="flex shrink-0 items-center gap-2">
            <a href="{{ url('/#features') }}" class="hidden rounded-lg px-3 py-2 text-sm font-semibold text-slate-600 transition hover:text-blue-700 md:inline-flex dark:text-slate-300 dark:hover:text-blue-300">Features</a>
            <a href="{{ url('/#challenge') }}" class="hidden rounded-lg px-3 py-2 text-sm font-semibold text-slate-600 transition hover:text-blue-700 lg:inline-flex dark:text-slate-300 dark:hover:text-blue-300">Challenge</a>
            <a href="{{ route('community.index') }}" class="hidden rounded-lg px-3 py-2 text-sm font-semibold text-slate-600 transition hover:text-blue-700 lg:inline-flex dark:text-slate-300 dark:hover:text-blue-300">Community</a>
            <a href="{{ route('pricing') }}" class="hidden rounded-lg px-3 py-2 text-sm font-semibold text-slate-600 transition hover:text-blue-700 md:inline-flex dark:text-slate-300 dark:hover:text-blue-300">Pricing</a>
            <a href="{{ route('support.create') }}" class="hidden rounded-lg px-3 py-2 text-sm font-semibold text-slate-600 transition hover:text-blue-700 lg:inline-flex dark:text-slate-300 dark:hover:text-blue-300">Support</a>
            <x-theme-toggle class="bg-transparent shadow-none" />

            @auth
                <a href="{{ $authHomeRoute }}" class="rounded-lg bg-blue-600 px-4 py-2 text-sm font-bold text-white shadow-sm shadow-blue-600/20 transition hover:-translate-y-0.5 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-400">{{ $authHomeLabel }}</a>
            @else
                <a href="{{ route('login') }}" class="hidden rounded-lg border border-blue-100 px-4 py-2 text-sm font-bold text-blue-700 transition hover:-translate-y-0.5 hover:bg-blue-50 sm:inline-flex dark:border-blue-900 dark:text-blue-300 dark:hover:bg-blue-950/60">Login</a>
                <a href="{{ route('register') }}" class="rounded-lg bg-blue-600 px-4 py-2 text-sm font-bold text-white shadow-sm shadow-blue-600/20 transition hover:-translate-y-0.5 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-400">Register</a>
            @endauth
        </nav>
    </div>
</header>