@php
$logo = asset('images/Logo_Panamfarma_horizontal.png');
$currentLocale = app()->getLocale();

if (!in_array($currentLocale, ['en', 'es'], true)) {
$currentLocale = session('site_locale', 'en');
}
@endphp

<header class="pf-header" id="pfHeader">
    <div class="pf-wrap">

        <div class="pf-top">
            <a href="{{ url('/') }}" class="pf-logo" title="{{ __('header.logo_title') }}">
                <img src="{{ $logo }}" alt="{{ __('header.logo_title') }}">
            </a>

            <button type="button" class="pf-burger" id="pfBurger" aria-label="{{ __('header.menu') }}"
                aria-expanded="false" aria-controls="pfHeader">
                <span></span><span></span><span></span>
            </button>

            <ul class="pf-top-menu">
                <li>
                    <a href="{{ url('/b2b') }}" title="{{ __('header.b2b') }}">
                        <svg viewBox="0 0 448 512" aria-hidden="true">
                            <path
                                d="M224 256a128 128 0 1 0 0-256 128 128 0 0 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3 0 498.7 13.3 512 29.7 512h388.6c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304h-91.4z" />
                        </svg>
                        {{ __('header.b2b') }}
                    </a>

                    <button type="button" class="pf-sub-toggle" aria-label="{{ __('header.submenu') }}">
                        <svg viewBox="0 0 12 12">
                            <path d="M1 3.5l5 5 5-5" />
                        </svg>
                    </button>

                    <ul class="pf-sub fixmenu">
                        <li>
                            <a href="{{ url('/warehousing') }}">
                                {{ __('header.warehousing') }}
                            </a>
                        </li>
                    </ul>
                </li>

                {{-- Language switcher --}}
                <li class="pf-language-switcher">
                    <div class="pf-language-dropdown">

                        <button type="button" class="pf-language-toggle" aria-label="Select language"
                            aria-haspopup="true" aria-expanded="false">
                            @if ($currentLocale === 'es')
                            {{-- Spain Flag --}}
                            <svg class="pf-language-icon" viewBox="0 0 48 48" role="img" aria-label="Spanish">
                                <rect width="48" height="48" rx="6" fill="#AA151B" />
                                <path fill="#F1BF00" d="M0 14H48V34H0Z" />
                            </svg>
                            @else
                            {{-- USA Flag --}}
                            <svg class="pf-language-icon" viewBox="0 0 48 48" role="img" aria-label="English">
                                <rect width="48" height="48" rx="5" fill="#B22234" />
                                <path fill="#FFFFFF"
                                    d="M0 6H48V10H0ZM0 14H48V18H0ZM0 22H48V26H0ZM0 30H48V34H0ZM0 38H48V42H0Z" />
                                <path fill="#3C3B6E" d="M0 0H23V26H0Z" />
                                <g fill="#FFFFFF">
                                    <circle cx="5" cy="5" r="1" />
                                    <circle cx="12" cy="5" r="1" />
                                    <circle cx="19" cy="5" r="1" />
                                    <circle cx="8.5" cy="10" r="1" />
                                    <circle cx="15.5" cy="10" r="1" />
                                    <circle cx="5" cy="15" r="1" />
                                    <circle cx="12" cy="15" r="1" />
                                    <circle cx="19" cy="15" r="1" />
                                    <circle cx="8.5" cy="20" r="1" />
                                    <circle cx="15.5" cy="20" r="1" />
                                </g>
                            </svg>
                            @endif

                            <svg class="pf-language-chevron" viewBox="0 0 12 12" aria-hidden="true">
                                <path d="M2 4L6 8L10 4" />
                            </svg>
                        </button>

                        <div class="pf-language-menu">
                            <a href="{{ route('language.switch', ['locale' => 'en']) }}" hreflang="en" lang="en"
                                aria-label="Switch to English" class="{{ $currentLocale === 'en' ? 'active' : '' }}"
                                @if($currentLocale==='en' ) aria-current="true" @endif>

                                <!-- English flag SVG -->
                                <svg class="pf-language-icon" viewBox="0 0 48 48" aria-hidden="true">
                                    <rect width="48" height="48" rx="5" fill="#B22234" />

                                    <path fill="#FFFFFF"
                                        d="M0 6H48V10H0ZM0 14H48V18H0ZM0 22H48V26H0ZM0 30H48V34H0ZM0 38H48V42H0Z" />

                                    <path fill="#3C3B6E" d="M0 0H23V26H0Z" />

                                    <g fill="#FFFFFF">
                                        <circle cx="5" cy="5" r="1" />
                                        <circle cx="12" cy="5" r="1" />
                                        <circle cx="19" cy="5" r="1" />
                                        <circle cx="8.5" cy="10" r="1" />
                                        <circle cx="15.5" cy="10" r="1" />
                                        <circle cx="5" cy="15" r="1" />
                                        <circle cx="12" cy="15" r="1" />
                                        <circle cx="19" cy="15" r="1" />
                                        <circle cx="8.5" cy="20" r="1" />
                                        <circle cx="15.5" cy="20" r="1" />
                                    </g>
                                </svg>
                            </a>

                            <a href="{{ route('language.switch', ['locale' => 'es']) }}" hreflang="es" lang="es"
                                aria-label="Cambiar a español" class="{{ $currentLocale === 'es' ? 'active' : '' }}"
                                @if($currentLocale==='es' ) aria-current="true" @endif>

                                <svg class="pf-language-icon" viewBox="0 0 48 48" aria-hidden="true">
                                    <rect width="48" height="48" rx="6" fill="#AA151B" />
                                    <path fill="#F1BF00" d="M0 14H48V34H0Z" />
                                </svg>

                                @if($currentLocale === 'es')
                                <span class="pf-language-check">✓</span>
                                @endif

                            </a>
                        </div>
                    </div>
                </li>

            </ul>
        </div>

        <nav class="pf-nav" aria-label="{{ __('header.main_menu') }}">
            <ul>
                <li>
                    <a href="{{ url('/shop') }}">
                        {{ __('header.portfolio') }}
                    </a>
                </li>
            </ul>

            <ul>
                <li>
                    <a href="{{ url('/our-company') }}">
                        {{ __('header.company') }}
                        <svg class="pf-caret" viewBox="0 0 12 12">
                            <path d="M1 3.5l5 5 5-5" />
                        </svg>
                    </a>

                    <button type="button" class="pf-sub-toggle" aria-label="{{ __('header.submenu') }}">
                        <svg viewBox="0 0 12 12">
                            <path d="M1 3.5l5 5 5-5" />
                        </svg>
                    </button>

                    <ul class="pf-sub">
                        <li>
                            <a href="{{ url('/warehousing') }}">
                                {{ __('header.warehousing') }}
                            </a>
                        </li>

                        <li>
                            <a href="{{ url('/contract-development-manufacturing-services') }}">
                                {{ __('header.cdmo') }}
                            </a>
                        </li>

                        <li>
                            <a href="{{ url('/what-we-are-working-on') }}">
                                {{ __('header.rd_pipeline') }}
                            </a>
                        </li>
                    </ul>
                </li>

                <li>
                    <a href="{{ url('/contact-us') }}">
                        {{ __('header.contact_us') }}
                    </a>
                </li>
            </ul>
        </nav>

    </div>
</header>

<script src="{{ asset('js/header.js') }}"></script>