@php
    $cartCount = app('App\Services\CartService')->count();
    $user = auth()->user();
    $activeTrackingOrders = $activeTrackingOrders ?? collect();
    $trackingEntryUrl = $trackingEntryUrl ?? route('track.index');
    $hasTrackableOrder = $activeTrackingOrders->isNotEmpty();
@endphp
<header>
    <nav class="container">
        <a href="{{ route('home') }}" class="logo">AVIOBOOTS</a>
        <ul class="nav-menu">
            <li><a href="{{ route('home') }}">Home</a></li>
            @if($hasTrackableOrder)
                <li>
                    <a href="{{ $trackingEntryUrl }}">
                        Track Order
                        @if($activeTrackingOrders->count() > 1)
                            <span style="display:inline-flex; min-width:18px; height:18px; align-items:center; justify-content:center; margin-left:.45rem; padding:0 .35rem; border-radius:999px; background:#6366f1; color:#fff; font-size:.72rem; font-weight:700;">
                                {{ $activeTrackingOrders->count() }}
                            </span>
                        @endif
                    </a>
                </li>
            @endif
            <li><a href="{{ route('offers') }}">Special Offers</a></li>
            <li><a href="{{ route('about') }}">About Us</a></li>
            <li><a href="{{ route('contact') }}">Contact Us</a></li>
        </ul>
        <div class="icons">
            <a href="{{ $user ? route('account') : route('login') }}" class="icon user-icon" title="{{ $user?->name ?? 'Login' }}">
                <i class="fa-regular fa-user"></i>
            </a>
            <button type="button" class="icon mobile-toggle" aria-label="Menu">
                <i class="fa-solid fa-bars"></i>
            </button>
            <button type="button" class="icon search-icon" aria-label="Search">
                <i class="fa-solid fa-magnifying-glass"></i>
            </button>
            <a href="{{ route('cart.index') }}" class="icon cart-icon" aria-label="Cart">
                <i class="fa-solid fa-bag-shopping"></i>
                <span class="cart-badge {{ $cartCount ? '' : 'hidden' }}" id="cartCount">{{ $cartCount }}</span>
            </a>
        </div>
    </nav>
</header>

<!-- Search Modal -->
<div class="search-overlay">
    <div class="search-modal">
        <h2>Search Products</h2>
        <div class="search-input-group">
            <input type="text" id="searchInput" placeholder="Search boots, sizes, colors..." autocomplete="off">
            <button class="search-clear" type="button" style="display:none;">&times;</button>
        </div>
        <div id="searchResults" class="search-results">
            <div class="no-search-results">Start typing to see products...</div>
        </div>
    </div>
</div>