@foreach ($menuStructured as $menuItem)
    @if($menuItem->bigMenu)
        <div
            class="header-menu__sub-menu"
            data-role="tabletSubMenu"
            data-menu="{{ $menuItem->bigMenu->slug }}"
        >

            <div class="header-menu__sub-menu-container">
                <div class="header-menu__sub-menu-left">
                    <a class="header-menu__sub-menu-back" data-action="closeTabletSubmenu">
                        {{ $menuItem->title }}
                    </a>

                    <nav data-menu="{{ $menuItem->bigMenu->slug }}" data-role="menu">
                        @if(!empty($menuItem->children))
                            @foreach($menuItem->children as $colMenu)
                                <div class="main-nav-tablet__col">
                                    <div class="main-nav-tablet__col-heading" data-role="tabletColmenu" data-colmenu-id="{{ $colMenu->id }}">
                                        @if($colMenu->url !== '#')
                                            <a
                                                href="{{ strpos($colMenu->url, 'http') === 0 ? $colMenu->url : lang_url($colMenu->url) }}"
                                                {!! $colMenu->target ? "target='{$colMenu->target}'" : '' !!}
                                                class="tm-level1-menu-item"
                                            >
                                                {{ $colMenu->title }}
                                                <span class="main-nav-tablet__col-heading-icon">
                                                    @if (!empty($colMenu->children))
                                                        @include('frontend.svg.icon-arrow-right')
                                                    @else
                                                        @include('frontend.svg.icon-arrow-down-right')
                                                    @endif
                                                </span>
                                            </a>
                                        @else
                                            {{ $colMenu->title }}
                                            <span class="main-nav-tablet__col-heading-icon">
                                                @if (!empty($colMenu->children))
                                                    @include('frontend.svg.icon-arrow-right')
                                                @else
                                                    @include('frontend.svg.icon-arrow-down-right')
                                                @endif
                                            </span>
                                        @endif

                                    </div>
                                    <ul data-role="submenuTablet" data-colmenu-id="{{ $colMenu->id }}">
                                        <li>
                                            <a class="header-menu__sub-menu-back" data-action="closeTabletSubSubMenu">
                                                {{ $menuItem->title }}
                                            </a>
                                        </li>

                                        @if($colMenu->url !== '#')
                                            <a
                                                href="{{ strpos($colMenu->url, 'http') === 0 ? $colMenu->url : lang_url($colMenu->url) }}"
                                                {!! $colMenu->target ? "target='{$colMenu->target}'" : '' !!}
                                                class="main-nav-tablet__menu-item tm-level1-menu-item"
                                            >
                                                {{ $colMenu->title }}
                                            </a>
                                        @endif

                                        @php
                                            $lastItem = null;
                                        @endphp
                                        @foreach($colMenu->children as $colItem)
                                            <li>
                                                <a
                                                    href="{{ strpos($colItem->url, 'http') === 0 ? $colItem->url : lang_url($colItem->url) }}"
                                                    {!! $colItem->target ? "target='{$colItem->target}'" : '' !!}
                                                    class="main-nav-tablet__menu-item tm-level2-menu-item"
                                                >
                                                    {{ $colItem->title }}
                                                </a>
                                            </li>
                                            @php
                                                $lastItem = $colItem;
                                            @endphp
                                        @endforeach
                                    </ul>
                                </div>
                            @endforeach
                        @endif
                    </nav>

                    @if($menuItem->url !== '#')
                        <a
                            href="{{ strpos($menuItem->url, 'http') === 0 ? $menuItem->url : lang_url($menuItem->url) }}"
                            {!! $menuItem->target ? "target='{$menuItem->target}'" : '' !!}
                            class="main-nav-tablet__menu-item main-nav-tablet__menu-item--top tm-main-menu-item"
                        >
                            @lang('frontend.view_all')
                            <span class="main-nav-tablet__menu-item-icon">
                                @include('frontend.svg.icon-arrow-down-right')
                            </span>
                        </a>
                    @endif
                </div>

                <div class="header-menu__sub-menu-right">
                    <div class="main-nav-tablet__cta">
                        @if(!empty($menuItem->bigMenu->highlight_title1))
                            @include('frontend.components.menu-cta', ['bigMenu' => $menuItem->bigMenu, 'ctaIndex' => 1])
                        @endif
                        @if(!empty($menuItem->bigMenu->highlight_title2))
                            @include('frontend.components.menu-cta', ['bigMenu' => $menuItem->bigMenu, 'ctaIndex' => 2])
                        @endif
                    </div>
                </div>
            </div>

            <div class="main-nav-tablet__banner-item" data-role="tablet-banner">
                @if($menuItem->bigMenu->bannerImage)
                    <img
                        src="{{ getMediaUrl($menuItem->bigMenu->bannerImage->filename, '90x90') }}"
                        alt="{{ htmlentities($menuItem->bigMenu->banner_label) }}"
                    />
                @endif
                <div class="main-nav-tablet__banner-text">
                    <div class="main-nav-tablet__banner-label">
                        {{ $menuItem->bigMenu->banner_label }}
                    </div>
                    @if($menuItem->bigMenu->banner_cta)
                        {!! generateLink($menuItem->bigMenu->banner_cta, 'main-nav-tablet__banner-cta link-left-arrow link-animation-arrow tm-menu-banner') !!}
                    @endif
                </div>
            </div>
        </div>
    @endif
@endforeach
