@push('styles')
    <link rel="stylesheet" href="{{ asset('css/custom/accordrx-footer.css') }}">
@endPush

@php
    $seller = seller()->user();
@endphp

<header class="fixed top-0 left-0 right-0 z-[999] hidden items-center justify-between border-b px-7 py-4 lg:flex transition-all duration-300" style="background:#fff;">
    <!-- Left Side - AccordRx Logo (outside white container) -->
    <div class="flex items-center">
        <a href="{{ route('seller.dashboard.index') }}" class="mr-6">
            <img
                class="h-12"
                src="https://accordrx.com/wp-content/uploads/2023/04/AccordRx_logo_color_350w.png"
                alt="AccordRx Logo"
            />
        </a>
    </div>

    <!-- Center/Right - Search and Actions in white container -->
    <div class="flex items-center justify-between flex-1" style="background: #ffffff; border-radius: 15px; padding: 1rem 2rem; ">
        <!-- Search Bar Component -->
        <x-marketplace::seller.layouts.header.search />

        <div class="flex gap-7">
            <a
                href="{{ route('shop.home.index') }}"
                target="_blank"
                class="flex"
            >
                <span
                    class="mp-home-icon cursor-pointer rounded-md p-1 text-2xl transition-all hover:bg-gray-100"
                    title="@lang('marketplace::app.components.seller.layouts.header.home-page')"
                >
                </span>
            </a>

            @if ($seller && $seller->url)
            <a
                href="{{ route('shop.marketplace.sellers.show', $seller->url)}}"
                target="_blank"
                class="flex"
            >
                <span
                    class="mp-store-icon cursor-pointer rounded-md p-1 text-2xl transition-all hover:bg-gray-100"
                    title="@lang('marketplace::app.components.seller.layouts.header.visit-shop')"
                >
                </span>
            </a>
            @endif

            @php
                $unreadCount = $seller?->communication?->seller_unread_count;
            @endphp

            <a
                class="flex items-baseline relative"
                href="{{ route('seller.communication.index') }}"
            >
                <span class="mp-notification-icon cursor-pointer rounded-md p-1 text-2xl transition-all hover:bg-gray-100">
                </span>

                @if ($unreadCount)
                    <span
                        class="h-5 w-5 absolute flex items-center justify-center top-0 right-0 -mt-1 -mr-1 text-xs text-white bg-blue-500 rounded-full px-1"
                    >
                        {{ $unreadCount > 9 ? '9+' : $unreadCount }}
                    </span>
                @endif
            </a>

            <!-- Seller profile -->
            <x-shop::dropdown position="bottom-{{ core()->getCurrentLocale()->direction === 'ltr' ? 'right' : 'left' }}">
                <x-slot:toggle>
                    <div class="flex items-baseline">
                        <span class="icon-users cursor-pointer rounded-md p-1 text-2xl transition-all hover:bg-gray-100">
                        </span>
                    </div>
                </x-slot>

                <!-- Seller Dropdown -->
                <x-slot:content>
                    <div class="grid gap-1">
                        <a
                            class="cursor-pointer rounded-xl px-5 py-2 text-base hover:bg-gray-100"
                            href="{{ route('seller.profile.index') }}"
                        >
                            @lang('marketplace::app.components.seller.layouts.header.my-profile')
                        </a>

                        <!--Seller logout-->
                        <x-shop::form
                            method="DELETE"
                            action="{{ route('seller.session.destroy') }}"
                            id="sellerLogout"
                        >
                        </x-shop::form>

                        <a
                            class="cursor-pointer rounded-xl px-5 py-2 text-base hover:bg-gray-100"
                            href="{{ route('admin.session.destroy') }}"
                            onclick="event.preventDefault(); document.getElementById('sellerLogout').submit();"
                        >
                            @lang('marketplace::app.components.seller.layouts.header.logout')
                        </a>
                    </div>
                </x-slot>
            </x-shop::dropdown>
        </div>
    </div>
</header>