@props(['menu' => collect(), 'navMegaMenus' => []])

@php
    $currentPath = '/'.ltrim(request()->path(), '/');
    if ($currentPath === '/') { $currentPath = '/'; }

    $megaTypes = [
        'services' => ['path' => '/services', 'icon' => 'services'],
        'hire' => ['path' => '/hire', 'icon' => 'hire'],
        'industries' => ['path' => '/industries', 'icon' => 'industries'],
        'locations' => ['path' => '/locations', 'icon' => 'location'],
    ];

    $navLink = 'inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-sm font-semibold leading-tight transition';
@endphp

<header x-data="{ navOpen: false }" @mobile-nav-closed.window="navOpen = false" class="site-header sticky top-0 z-50 border-b border-slate-200/90 bg-white/95 backdrop-blur-xl" role="banner">
    @php
        $ps = $publicSettings ?? $themeSettings ?? [];
        $headerLogo = $ps['branding.header_logo'] ?? $ps['branding.logo_url'] ?? '';
        if ($headerLogo && ! str_starts_with($headerLogo, 'http') && ! str_starts_with($headerLogo, '//')) {
            $headerLogo = asset(ltrim($headerLogo, '/'));
        }
        $showName = filter_var($ps['branding.show_site_name'] ?? true, FILTER_VALIDATE_BOOLEAN);
        $siteName = $ps['branding.site_name'] ?? config('apex.name');
        $socials = [];
        if (filter_var($ps['social.show_in_header'] ?? false, FILTER_VALIDATE_BOOLEAN)) {
            $socials = app(\App\Modules\Settings\Services\SettingsService::class)->socialProfiles(true);
        }
    @endphp
    <div class="site-header__bar container-page flex items-center justify-between gap-3">
        <a href="{{ route('home') }}" class="group flex shrink-0 items-center gap-2" aria-label="{{ $siteName }} home">
            @if($headerLogo)
                <img src="{{ $headerLogo }}" alt="{{ $siteName }}" class="h-9 w-auto max-w-[160px] object-contain" width="160" height="36">
            @else
                <span class="flex h-9 w-9 items-center justify-center rounded-lg bg-gradient-to-br from-primary to-accent shadow-sm shadow-primary/20">
                    <span class="text-xs font-bold text-white">{{ strtoupper(substr($siteName, 0, 1)) }}</span>
                </span>
            @endif
            @if($showName)
                <span class="text-base font-bold tracking-tight text-secondary">{{ $siteName }}</span>
            @endif
        </a>

        <nav class="hidden min-w-0 items-center gap-0.5 lg:flex" aria-label="Main navigation">
            @foreach($menu as $item)
                @php
                    $itemPath = parse_url($item->url, PHP_URL_PATH) ?: $item->url;
                    $isActive = $itemPath === $currentPath || ($itemPath !== '/' && str_starts_with($currentPath, rtrim($itemPath, '/')));
                    $megaType = null;

                    foreach ($megaTypes as $type => $meta) {
                        if (($item->icon ?? '') === $meta['icon'] || rtrim($itemPath, '/') === $meta['path']) {
                            $megaType = $type;
                            break;
                        }
                    }
                @endphp

                @if($megaType && ! empty($navMegaMenus[$megaType]))
                    <x-nav.mega-menu
                        :label="$item->label"
                        :active="$isActive"
                        :mega-menu="$navMegaMenus[$megaType]"
                    />
                @else
                    <a href="{{ $item->url }}"
                       @class([
                           $navLink,
                           'bg-primary/10 text-primary-text' => $isActive,
                           'text-slate-700 hover:bg-slate-100 hover:text-secondary' => ! $isActive,
                       ])>
                        <x-menu.icon :name="$item->icon ?? 'default'" class="h-4 w-4 shrink-0" />
                        {{ $item->label }}
                    </a>
                @endif
            @endforeach
            <x-ui.button href="{{ $ps['cta.primary_url'] ?? '/book' }}" size="sm" class="site-header__cta ml-1 shrink-0" data-track-cta="header-primary" data-position="header">
                {{ $ps['cta.primary_text'] ?? 'Book Consultation' }}
            </x-ui.button>
            @if(count($socials))
                <div class="ml-2 hidden items-center gap-1 xl:flex">
                    @foreach($socials as $social)
                        <a href="{{ $social['url'] }}"
                           @if(filter_var($ps['social.open_in_new_tab'] ?? true, FILTER_VALIDATE_BOOLEAN)) target="_blank" rel="noopener noreferrer" @endif
                           class="inline-flex h-8 w-8 items-center justify-center rounded-full text-slate-500 transition hover:bg-slate-100 hover:text-secondary"
                           aria-label="{{ $social['label'] }}">
                            <span class="text-[10px] font-bold uppercase">{{ strtoupper(substr($social['platform'], 0, 2)) }}</span>
                        </a>
                    @endforeach
                </div>
            @endif
        </nav>

        <button type="button" class="flex h-10 w-10 shrink-0 items-center justify-center rounded-lg text-secondary transition hover:bg-slate-100 lg:hidden" @click="navOpen = !navOpen; $dispatch('toggle-mobile-nav')" :aria-expanded="navOpen" :aria-label="navOpen ? 'Close menu' : 'Open menu'">
            <svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/></svg>
        </button>
    </div>
</header>

<x-mobile-nav :menu="$menu" :nav-mega-menus="$navMegaMenus" />