@php
    $path = trim(request()->path(), '/');
    $isHome = $path === '' || in_array($path, config('app.locales', []), true);
    $isBlog = request()->is('blog', 'blog/*', '*/blog', '*/blog/*');
    $isContact = request()->is('contact', '*/contact');
    $isShop = request()->is('shop', '*/shop', 'shop/*', '*/shop/*');
    $isHowItWorks = request()->is('how-it-works', '*/how-it-works');
    $isPastEvents = request()->is('past-events', 'past-events/*', '*/past-events', '*/past-events/*');
    $isPricing = request()->is('pricing', '*/pricing');
    $isWorkshop = $isHowItWorks || $isPastEvents || $isPricing;
    $headerLocale = app()->getLocale();
    $headerLocaleName = config('app.locale_names.' . $headerLocale, $headerLocale);
    $topEmail = __('public.contact.office_email');
    $topPhone = __('public.contact.office_phone');
    $topTelHref = $topPhone ? 'tel:' . preg_replace('/[^0-9+]/', '', $topPhone) : '#';
@endphp

<header class="header-area header-wide">
    <div class="main-header d-none d-lg-block">
        <div class="header-top bdr-bottom">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-6">
                        <div class="welcome-message">
                            <p>{{ __('public.header.welcome') }}</p>
                        </div>
                    </div>
                    <div class="col-lg-6 text-right">
                        <div class="header-top-settings">
                            <ul class="nav align-items-center justify-content-end">
                                <li class="language">
                                    {{ $headerLocaleName }}
                                    <i class="fas fa-angle-down"></i>
                                    <ul class="dropdown-list">
                                        @foreach(array_diff(config('app.locales', []), [$headerLocale]) as $l)
                                            <li>
                                                <a class="change-locale" href="/locale/{{ $l }}">
                                                    {{ config('app.locale_names.' . $l, $l) }}
                                                </a>
                                            </li>
                                        @endforeach
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="header-main-area">
            <div class="container">
                <div class="row align-items-center position-relative">
                    <div class="col-lg-3">
                        <div class="logo">
                            <a href="{{ __url('/') }}">
                                <img src="/assets/images/logo/logo.png" alt="{{ __('alts.logo') }}">
                            </a>
                        </div>
                    </div>

                    <div class="col-lg-6 position-static">
                        <div class="main-menu-area">
                            <div class="main-menu">
                                <nav class="desktop-menu">
                                    <ul>
                                        <li class="{{ $isHome ? 'active' : '' }}"><a href="{{ __url('/') }}">{{ __('public.menu.home') }}</a></li>
                                        <li class="{{ $isShop ? 'active' : '' }}"><a href="{{ __url('/shop') }}">{{ __('public.menu.shop') }}</a></li>
                                        <li class="{{ $isWorkshop ? 'active' : '' }}">
                                            <a href="{{ __url('/how-it-works') }}">{{ __('public.menu.workshop') }} <i class="fas fa-angle-down"></i></a>
                                            <ul class="dropdown">
                                                <li class="{{ $isHowItWorks ? 'active' : '' }}"><a href="{{ __url('/how-it-works') }}">{{ __('public.menu.how_it_works') }}</a></li>
                                                <li class="{{ $isPastEvents ? 'active' : '' }}"><a href="{{ __url('/past-events') }}">{{ __('public.menu.past_events') }}</a></li>
                                                <li class="{{ $isPricing ? 'active' : '' }}"><a href="{{ __url('/pricing') }}">{{ __('public.menu.pricing') }}</a></li>
                                            </ul>
                                        </li>
                                        <li class="{{ $isBlog ? 'active' : '' }}"><a href="{{ __url('/blog') }}">{{ __('public.menu.blog') }}</a></li>
                                        <li class="{{ $isContact ? 'active' : '' }}"><a href="{{ __url('/contact') }}">{{ __('public.menu.contact') }}</a></li>
                                    </ul>
                                </nav>
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-3">
                        <div class="header-right d-flex align-items-center justify-content-end">
                            <div class="header-configure-area">
                                <ul class="nav justify-content-end">
                                    <li class="user-hover">
                                        <a href="#" class="header-icon-link" aria-label="{{ __('public.account.my_profile') }}">
                                            <i class="far fa-user"></i>
                                        </a>
                                        <ul class="dropdown-list">
                                            @guest
                                                <li><a href="{{ __url('/login') }}">{{ __('public.menu.login') }}</a></li>
                                                <li><a href="{{ __url('/register') }}">{{ __('public.menu.sign_up') }}</a></li>
                                            @endguest
                                            @auth
                                                <li><a href="{{ __url('/profile') }}">{{ __('public.account.my_profile') }}</a></li>
                                                <li><a href="{{ __url('/user/transactions') }}">{{ __('public.transactions') }}</a></li>
                                                <li><a href="{{ __url('/user/orders') }}">{{ __('public.account.orders') }}</a></li>
                                                <li><a href="/logout">{{ __('public.account.sign_out') }}</a></li>
                                            @endauth
                                        </ul>
                                    </li>
                                    <li>
                                        <a href="#" class="minicart-btn header-icon-link">
                                            <i class="far fa-shopping-bag"></i>
                                            <div class="notification js-cart-count">0</div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="mobile-header d-lg-none d-md-block">
        <div class="container-fluid">
            <div class="row align-items-center">
                <div class="col-12">
                    <div class="mobile-main-header">
                        <div class="mobile-logo">
                            <a href="{{ __url('/') }}">
                                <img src="/assets/images/logo/logo.png" alt="{{ __('alts.logo') }}">
                            </a>
                        </div>
                        <div class="mobile-menu-toggler">
                            <div class="mini-cart-wrap">
                                <a href="#" class="minicart-btn header-icon-link">
                                    <i class="far fa-shopping-bag"></i>
                                    <div class="notification js-cart-count">0</div>
                                </a>
                            </div>
                            <button class="mobile-menu-btn" type="button">
                                <span></span>
                                <span></span>
                                <span></span>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <aside class="off-canvas-wrapper">
        <div class="off-canvas-overlay"></div>
        <div class="off-canvas-inner-content">
            <div class="btn-close-off-canvas">
                <i class="fas fa-times"></i>
            </div>

            <div class="off-canvas-inner">
                <div class="mobile-navigation">
                    <nav>
                        <ul class="mobile-menu">
                            <li><a href="{{ __url('/') }}">{{ __('public.menu.home') }}</a></li>
                            <li><a href="{{ __url('/shop') }}">{{ __('public.menu.shop') }}</a></li>
                            <li class="menu-item-has-children {{ $isWorkshop ? 'active' : '' }}"><a href="{{ __url('/how-it-works') }}">{{ __('public.menu.workshop') }}</a>
                                <ul class="dropdown">
                                    <li><a href="{{ __url('/how-it-works') }}">{{ __('public.menu.how_it_works') }}</a></li>
                                    <li><a href="{{ __url('/past-events') }}">{{ __('public.menu.past_events') }}</a></li>
                                    <li><a href="{{ __url('/pricing') }}">{{ __('public.menu.pricing') }}</a></li>
                                </ul>
                            </li>
                            <li><a href="{{ __url('/blog') }}">{{ __('public.menu.blog') }}</a></li>
                            <li><a href="{{ __url('/contact') }}">{{ __('public.menu.contact') }}</a></li>
                        </ul>
                    </nav>
                </div>

                <div class="mobile-settings">
                    <ul class="mobile-account-links">
                        @guest
                            <li><a href="{{ __url('/login') }}">{{ __('public.menu.login') }}</a></li>
                            <li><a href="{{ __url('/register') }}">{{ __('public.menu.sign_up') }}</a></li>
                        @endguest
                        @auth
                            <li><a href="{{ __url('/profile') }}">{{ __('public.account.my_profile') }}</a></li>
                            <li><a href="{{ __url('/user/transactions') }}">{{ __('public.transactions') }}</a></li>
                            <li><a href="{{ __url('/user/orders') }}">{{ __('public.account.orders') }}</a></li>
                            <li><a href="/logout">{{ __('public.account.sign_out') }}</a></li>
                        @endauth
                    </ul>
                </div>

                <div class="offcanvas-widget-area">
                    <div class="off-canvas-contact-widget">
                        <ul>
                            <li><i class="fas fa-mobile-alt"></i>
                                <a href="{{ $topTelHref }}">{{ $topPhone }}</a>
                            </li>
                            <li><i class="far fa-envelope"></i>
                                <a href="mailto:{{ $topEmail }}">{{ $topEmail }}</a>
                            </li>
                        </ul>
                    </div>
                    <div class="off-canvas-social-widget">
                        <a href="https://www.facebook.com/profile.php?id=100095559760291" target="_blank" rel="noopener noreferrer"><i class="fab fa-facebook-f"></i></a>
                        <a href="https://www.instagram.com/language.on" target="_blank" rel="noopener noreferrer"><i class="fab fa-instagram"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </aside>
</header>