{{-- Shared account dropdown: desktop / mobile header --}}
@php
    $mode = $mode ?? 'desktop';
@endphp
<div class="dropdown {{ $mode === 'mobile-header' ? 'ms-3' : '' }}" @if($mode === 'mobile-header') id="headerAccountDropdownMobile" @endif>
    @auth
        @if($mode === 'desktop')
            <a href="#" data-bs-toggle="dropdown" aria-expanded="false" role="button"
               class="btn btn-white header-register border-0 rounded-pill">
                <figure class="avatar avatar-sm me-1">
                    <img src="{{ asset('theme/assets/image/user.png') }}" alt="">
                </figure>
                <span>{{ auth()->user()->first_name }}</span>
            </a>
        @else
            <a href="#" data-bs-toggle="dropdown" aria-expanded="false" role="button"
               class="btn btn-white header-register border-0 rounded-pill p-1"
               id="headerAccountToggleMobile"
               aria-label="حساب کاربری">
                <figure class="avatar">
                    <img src="{{ asset('theme/assets/image/user.png') }}" alt="">
                </figure>
            </a>
        @endif

        <ul class="dropdown-menu dropdown-menu-end" id="headerAccountMenuMobile">
            @if($mode !== 'desktop')
                <li class="px-3 py-2 border-bottom">
                    <span class="fw-bold font-14">{{ auth()->user()->first_name }} {{ auth()->user()->last_name }}</span>
                </li>
            @endif
            <li><a href="{{ route('panel.index') }}" class="dropdown-item"><i class="bi bi-house-door me-2"></i>پروفایل</a></li>
            <li><a href="{{ route('panel.orders.index') }}" class="dropdown-item"><i class="bi bi-cart-check me-2"></i>سفارش های من</a></li>
            <li><a href="{{ route('panel.addresses.index') }}" class="dropdown-item"><i class="bi bi-pin-map me-2"></i>آدرس های من</a></li>
            <li><a href="{{ route('panel.announcements.index') }}" class="dropdown-item"><i class="bi bi-bell me-2"></i>پیام ها و اطلاعیه ها</a></li>
            <li><a href="{{ route('panel.comments.index') }}" class="dropdown-item"><i class="bi bi-chat-dots me-2"></i>نظرات من</a></li>
            <li><a href="{{ route('panel.tickets.index') }}" class="dropdown-item"><i class="bi bi-question-circle me-2"></i>درخواست پشتیبانی</a></li>
            <li><a href="{{ route('panel.wishes.index') }}" class="dropdown-item"><i class="bi bi-heart me-2"></i>محصولات مورد علاقه</a></li>
            <li>
                <a href="{{ route('logout') }}" class="dropdown-item mct-hover"
                   onclick="event.preventDefault(); document.getElementById('header-logout-form').submit();">
                    <i class="bi bi-arrow-right-square me-2"></i>خروج از حساب کاربری
                </a>
            </li>
        </ul>
    @else
        @if($mode === 'desktop')
            <a href="#" data-bs-toggle="dropdown" aria-expanded="false" role="button"
               class="btn btn-white header-register border-0 rounded-pill">
                <i class="bi bi-person-circle font-20 text-muted me-1"></i>
                <span>حساب کاربری</span>
            </a>
        @else
            <a href="#" data-bs-toggle="dropdown" aria-expanded="false" role="button"
               class="btn btn-white header-register border-0 rounded-pill p-1"
               id="headerAccountToggleMobile"
               aria-label="حساب کاربری">
                <figure class="avatar">
                    <img src="{{ asset('theme/assets/image/user.png') }}" alt="">
                </figure>
            </a>
        @endif

        <ul class="dropdown-menu dropdown-menu-end" id="headerAccountMenuMobile">
            <li><a href="{{ route('login') }}" class="dropdown-item"><i class="bi bi-box-arrow-in-right me-2"></i>ورود</a></li>
            <li><a href="{{ route('register') }}" class="dropdown-item"><i class="bi bi-person-plus me-2"></i>ثبت نام</a></li>
        </ul>
    @endauth
</div>
