<header class="bd-header mb-2 mb-md-3">
    {{-- Top bar: logo + search + hotline + login --}}
    <div class="bd-topbar">
        <div class="container d-flex align-items-center gap-3">
            {{-- Logo --}}
            <a href="{{ url('/') }}" class="bd-logo d-flex align-items-center text-decoration-none">
                <img src="{{ getimage(getOption('logo')) }}" alt="Logo">
                <span></span>
            </a>

            {{-- Search --}}
            <form action="{{ url('/search') }}" method="GET"
                  class="bd-search-form ms-auto flex-grow-1 d-flex align-items-center gap-1">
                <input type="text"
                       name="q"
                       class="form-control form-control-sm bd-search-input"
                       placeholder="খুঁজুন পণ্য, ক্যাটেগরি, ব্র্যান্ড...">
                <button class="btn btn-sm bd-search-btn" type="submit">
                    Search
                </button>
            </form>

            {{-- Hotline + Login --}}
            <div class="d-flex align-items-center gap-3 ms-2">
                <div class="bd-hotline text-end d-none d-md-block">
                    <small class="d-block">কল করে অর্ডার করুন</small>
                    <span>{{ getOption('phone') ?: '01611 785 151' }}</span>
                </div>

                @if (Route::has('login'))
                    @auth
                        <a href="{{ url('/dashboard') }}" class="btn btn-outline-secondary btn-sm bd-user-btn">
                            My Account
                        </a>
                    @else
                        <a href="{{ route('login') }}" class="btn btn-outline-secondary btn-sm bd-user-btn">
                            Login
                        </a>
                    @endauth
                @endif
            </div>
        </div>
    </div>

    {{-- Green nav bar --}}
    <nav class="bd-mainnav">
        <div class="container">
            <ul class="nav bd-mainnav-list">
                {{-- Home --}}
                <li class="nav-item">
                    <a href="{{ url('/') }}"
                       class="nav-link {{ request()->routeIs('home') ? 'active' : '' }}">
                        Home
                    </a>
                </li>

                {{-- Dynamic menus (Menu model theke) --}}
                @isset($menus)
                    @foreach ($menus as $menu)
                        @php
                            // route parameter 'slug' = /category/{slug}
                            $menuSlug = $menu->slug ?? null;
                            $isActiveCategory = request()->routeIs('main-menu-products')
                                && request()->route('slug') === $menuSlug;
                        @endphp

                        <li class="nav-item">
                            <a href="{{ $menuSlug ? route('main-menu-products', $menuSlug) : '#' }}"
                               class="nav-link text-capitalize {{ $isActiveCategory ? 'active' : '' }}">
                                {{ $menu->name }}
                            </a>
                        </li>
                    @endforeach
                @endisset
            </ul>
        </div>
    </nav>
</header>
