<div class="o-overlay-menu  js-overlay-menu" id="overlay-menu" hidden>

    <div class="o-overlay-menu__bar">
        <div class="o-overlay-menu__main">
            <a class="o-overlay-menu__logo" href="{{ $links->home->route ?? '/' }}" tabindex="-99">
                @include('components.images.logo')
            </a>
        </div>

        <div class="o-overlay-menu__toggle">
            <button class="c-close  js-overlay-menu-trigger" aria-expanded="true" aria-controls="overlay-menu" tabindex="-1"></button>
        </div>
    </div>

    @unless((isset($hideNavigation) && $hideNavigation == true))
        <nav class="o-overlay-menu__nav" role=navigation>
            <ul class="o-overlay-menu__list">

                @foreach(config('site.mobile_navigation') as $navItem)
                    @continue(empty($links->{$navItem}))

                    <li class="o-overlay-menu__item @if(isset($page->code_name) && $page->code_name == $navItem) is-active @endif">
                        <a class="o-overlay-menu__link" href="{{ $links->{$navItem}->route }}" @if(!empty($navPreventTab)) tabindex="-1" @endif>
                            {{ $links->{$navItem}->name }}
                        </a>
                    </li>
                @endforeach

            </ul>
        </nav>
    @endunless

    @if(config('app.multipleLanguages'))
        <div class="o-overlay-menu__language">
            @include('components.languageSelect', [
                'modifiers' => isset($hideNavigation) && $hideNavigation == true ? ['to-bottom'] : ['to-top']
            ])
        </div>
    @endif
</div>