@php
    use App\Enums\EventSettingTypesEnum;

    $currentEventByYearShowAndHideSettings = isset($currentEventByYearSettings) && isset($currentEventByYearSettings[EventSettingTypesEnum::HIDE_AND_SHOW->value])
        ? $currentEventByYearSettings[EventSettingTypesEnum::HIDE_AND_SHOW->value]
        : [];

    $customEventPagesShowmInHeader = $headerPages ?? [];
@endphp

<header class="wrapper bg-soft-primary">
    <nav class="navbar navbar-expand-lg center-nav navbar-dark bg-color1">
        <div class="container flex-lg-row flex-nowrap align-items-center justify-content-between gap-3">
            <div class="navbar-brand w-100">
                <a href="{{ Route::has('website.index') ? route('website.index') : url('/') }}">
                    <img src="{{ asset('storage/' . ($currentEventByYearLogo ?? '')) }}" srcset="{{ asset('storage/' . ($currentEventByYearLogo ?? '')) }}" class="img-fluid mx-auto" style="max-width: 100px" alt="Logo" />
                </a>        
            </div>

            <div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
                <div class="offcanvas-header d-lg-none">
                    <a href="{{ Route::has('website.index') ? route('website.index') : url('/') }}">
                        <img class="img-fluid" src="{{ asset('storage/' . ($currentEventByYearLogo ?? '')) }}" srcset="{{ asset('storage/' . ($currentEventByYearLogo ?? '')) }} 2x" alt="{{ config('settings.meta-title', '') }}">
                    </a>

                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas" aria-label="Close"></button>
                </div>

                <div class="offcanvas-body mx-lg-auto d-flex flex-column h-100">
                    <ul class="navbar-nav">
                        @if ($currentEventByYearShowAndHideSettings['speakers_page_is_show']['value'] ?? false)
                            <li class="nav-item">
                                <a class="nav-link" href="{{ route('website.speakers') }}">
                                    {{ __('app.Speakers') }}
                                </a>
                            </li>
                        @endif

                        @if ($currentEventByYearShowAndHideSettings['investors_page_is_show']['value'] ?? false)
                            <li class="nav-item dropdown dropdown-mega">
                                <a class="nav-link" href="{{ route('website.investors') }}">
                                    {{ __('app.Investors') }}
                                </a>
                            </li>
                        @endif

                        @if ($currentEventByYearShowAndHideSettings['workshops_page_is_show']['value'] ?? false)
                            <li class="nav-item">
                                <a class="nav-link" href="{{ route('website.workshops') }}">
                                    {{ __('app.Workshops') }}
                                </a>
                            </li>
                        @endif

                        @if ($currentEventByYearShowAndHideSettings['meet_and_greet_page_is_show']['value'] ?? false)
                            <li class="nav-item">
                                <a class="nav-link" href="{{ route('website.meet-and-greet') }}">
                                    {{ __('app.Meet and greet') }}
                                </a>
                            </li>
                        @endif

                        @if ($currentEventByYearShowAndHideSettings['exhibit_page_is_show']['value'] ?? false)
                            <li class="nav-item">
                                <a class="nav-link" href="{{ route('website.exhibition') }}">
                                    {{ __('app.Exhibition') }}
                                </a>
                            </li>
                        @endif

                        @if ($currentEventByYearShowAndHideSettings['compete_page_is_show']['value'] ?? false)
                            <li class="nav-item">
                                <a class="nav-link" href="{{ route('website.compete') }}">
                                    {{ __('app.Compete') }}
                                </a>
                            </li>
                        @endif

                        @foreach ($customEventPagesShowmInHeader as $customPage)
                            <li class="nav-item">
                                <a class="nav-link text-capitalize" href="{{ route('website.page', ['slug' => $customPage->slug]) }}">
                                    {{ $customPage->header_title ? $customPage->header_title : $customPage->page_title }}
                                </a>
                            </li>
                        @endforeach

                        {{-- <li class="nav-item">
                            <a class="nav-link" href="#">{{ __('app.Join now') }}</a>
                        </li> --}}

                        @if ($currentEventByYearShowAndHideSettings['contact_page_is_show']['value'] ?? false)
                            <li class="nav-item">
                                <a class="nav-link" href="{{ route('website.contact-us') }}">{{ __('app.Contact us') }}</a>
                            </li>
                        @endif

                        @if ($currentEventByYearShowAndHideSettings['header_book_now_is_show']['value'] ?? false)
                            <li class="nav-item">
                                <a class="nav-btn btn btn-primary bg-event-color border-event-color rounded-pill shadow-none my-3 py-1 text-capitalize scroll" href="#ticketsSection">
                                    {{ __('app.Book Now') }}
                                </a>
                            </li>
                        @endif

                        <li class="nav-item">
                            <a class="nav-btn btn btn-primary bg-event-color border-event-color rounded-pill shadow-none my-3 py-1 text-capitalize" href="https://forms.zohopublic.com/techne/form/TechneSummitCairoContactUsForm1/formperma/uVYvNNQwgOS21s91Q9tuso1dWSm8_Yhd56K6EorMefE" target="_blank">
                                Register Now – 2-for-1 Offer
                            </a>
                        </li>
                    </ul>

                    <div class="offcanvas-footer d-lg-none">
                        <div>
                            @if(config('settings.email'))
                                <a href="mailto:{{ config('settings.email') }}" class="link-inverse">{{ config('settings.email') }}</a>
                                <br />
                            @endif

                            @if(config('settings.phone'))
                                <a href="tel:{{ config('settings.phone') }}" dir="ltr">{{ config('settings.phone') }}</a>
                                <br />
                            @endif

                            <nav class="nav social social-white mt-4">
                                @if(config('settings.facebook'))
                                    <a href="{{ config('settings.facebook') }}" target="_blank"><i class="uil uil-facebook-f"></i></a>
                                @endif
                
                                @if(config('settings.twitter'))
                                    <a href="{{ config('settings.twitter') }}" target="_blank"><i class="uil uil-twitter"></i></a>
                                @endif

                                @if(config('settings.linkedin'))
                                    <a href="{{ config('settings.linkedin') }}" target="_blank"><i class="uil uil-linkedin"></i></a>
                                @endif

                                @if(config('settings.instagram'))
                                    <a href="{{ config('settings.instagram') }}" target="_blank"><i class="uil uil-instagram"></i></a>
                                @endif

                                @if(config('settings.youtube'))
                                    <a href="{{ config('settings.youtube') }}" target="_blank"><i class="uil uil-youtube"></i></a>
                                @endif
                            </nav>
                        </div>
                    </div>
                </div>
            </div>

            <div class="navbar-other d-flex">
                <ul class="navbar-nav flex-row align-items-center gap-2">
                    <li class="nav-item">
                        <a href="{{ route('website.choose-language', ['year' => request()->route('year') ?? date('Y'), 'locale' => (app()->currentLocale() == 'en' ? 'ar' : 'en')]) }}" class="d-flex justify-content-between align-items-center gap-1 text-white">
                            <img class="flag" src="{{ asset('website/assets/images/icons/lang/'.(app()->currentLocale() == 'en' ? 'ar' : 'en').'.svg') }}" alt="img rounded" width="26px">
                            <span class="text-uppercase">{{ app()->currentLocale() == 'en' ? 'ar' : 'en' }}</span>
                        </a>
                    </li>

                    {{-- @if ($currentEventByYearShowAndHideSettings['header_book_now_is_show']['value'] ?? false)
                        <li class="nav-item">
                            <a class="nav-btn btn btn-primary bg-event-color border-event-color rounded-pill shadow-none my-2 text-capitalize scroll" href="#ticketsSection" style="padding: 0px 10px; font-size: 14px;">
                                {{ __('app.Book Now') }}
                            </a>
                        </li>
                    @endif --}}

                    {{-- <li class="nav-item">
                        <a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info">
                            <i class="uil uil-comment-info"></i>
                        </a>
                    </li> --}}

                    <li class="nav-item d-lg-none align-self-end">
                        <button class="hamburger offcanvas-nav-btn border rounded p-2"><span></span></button>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
</header>

<div class="offcanvas offcanvas-end text-inverse" id="offcanvas-info" data-bs-scroll="true">
    <div class="offcanvas-header">
        <a href="{{ Route::has('website.index') ? route('website.index') : url('/') }}">
            <img src="{{ asset('storage/' . ($currentEventByYearLogo ?? '')) }}" srcset="{{ asset('storage/' . ($currentEventByYearLogo ?? '')) }} 2x" alt="{{ config('settings.meta-title', '') }}" class="img-fluid mx-auto w-75">
        </a>
        
        <button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas" aria-label="Close"></button>
    </div>

    <div class="offcanvas-body">
        <div class="widget mb-8">
            {{ config('settings.about') }}
        </div>

        <div class="widget my-4">
            @if(config('settings.adress'))
                <address> {{ config('settings.adress') }} </address>
                <br />
            @endif

            @if(config('settings.email'))
                <a href="mailto:{{ config('settings.email') }}" class="link-inverse">{{ config('settings.email') }}</a>
                <br />
            @endif

            @if(config('settings.phone'))
                <a href="tel:{{ config('settings.phone') }}" dir="ltr">{{ config('settings.phone') }}</a>
                <br />
            @endif
        </div>

        <div class="widget">
            <h4 class="widget-title text-white mb-3">{{ __('app.Follow us') }}</h4>

            <nav class="nav social social-white mt-4">
                @if(config('settings.facebook'))
                    <a href="{{ config('settings.facebook') }}" target="_blank"><i class="uil uil-facebook-f"></i></a>
                @endif

                @if(config('settings.twitter'))
                    <a href="{{ config('settings.twitter') }}" target="_blank"><i class="uil uil-twitter"></i></a>
                @endif

                @if(config('settings.linkedin'))
                    <a href="{{ config('settings.linkedin') }}" target="_blank"><i class="uil uil-linkedin"></i></a>
                @endif

                @if(config('settings.instagram'))
                    <a href="{{ config('settings.instagram') }}" target="_blank"><i class="uil uil-instagram"></i></a>
                @endif

                @if(config('settings.youtube'))
                    <a href="{{ config('settings.youtube') }}" target="_blank"><i class="uil uil-youtube"></i></a>
                @endif
            </nav>
        </div>
    </div>
</div>