<style>
    .second-level,
    .third-level {
        position: absolute !important;
        left: 182px !important;
        top: -2px !important;
    }
</style>
<header class="clearfix second-style">


    <!-- Bootstrap navbar -->
    <nav class="navbar navbar-default navbar-static-top" role="navigation">

        <div class="logo-advertisement">
            <div class="container">

                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="/"><img src="/images/logo.jpg" alt=""></a>
                </div>

                <div class="advertisement carousel slide" data-ride="carousel">
                    <div class="desktop-advert carousel-inner">

                        @if($home->banner_top_google != '')
                        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
                        <ins class="adsbygoogle"
                            style="display:block"
                            data-ad-client="ca-pub-0209495346002620"
                            data-ad-slot="{{$home->banner_top_google}}"
                            data-ad-format="auto"
                            data-full-width-responsive="true"></ins>
                        <script>
                            (adsbygoogle = window.adsbygoogle || []).push({});
                        </script>
                        @else
                        @php
                        $found = false;
                        $count = 0;
                        @endphp
                        @if(isset($home->banner_top) && $home->banner_top != '')
                        <div class="item {{$count == 0 ? 'active' : ''}}">
                            <a href="{{$home->banner_top_url}}"><img src="/files/{{$home->banner_top}}" width="728" alt="" style="border:1px solid gray;"></a>
                        </div>
                        @php
                        $count += 1;
                        $found = true;
                        @endphp
                        @endif
                        @if(isset($home->banner_top_2) && $home->banner_top_2 != '')
                        <div class="item {{$count == 0 ? 'active' : ''}}">
                            <a href="{{$home->banner_top_url_2}}"><img src="/files/{{$home->banner_top_2}}" width="728" alt="" style="border:1px solid gray;"></a>
                        </div>
                        @php
                        $found = true;
                        @endphp
                        @endif
                        @if(isset($home->banner_top_3) && $home->banner_top_3 != '')
                        <div class="item {{$count == 0 ? 'active' : ''}}">
                            <a href="{{$home->banner_top_url_3}}"><img src="/files/{{$home->banner_top_3}}" width="728" alt="" style="border:1px solid gray;"></a>
                        </div>
                        @php
                        $found = true;
                        @endphp
                        @endif
                        @if(isset($home->banner_top_4) && $home->banner_top_4 != '')
                        <div class="item {{$count == 0 ? 'active' : ''}}">
                            <a href="{{$home->banner_top_url_4}}"><img src="/files/{{$home->banner_top_4}}" width="728" alt="" style="border:1px solid gray;"></a>
                        </div>
                        @php
                        $found = true;
                        @endphp
                        @endif
                        @if(isset($home->banner_top_5) && $home->banner_top_5 != '')
                        <div class="item {{$count == 0 ? 'active' : ''}}">
                            <a href="{{$home->banner_top_url_5}}"><img src="/files/{{$home->banner_top_5}}" width="728" alt="" style="border:1px solid gray;"></a>
                        </div>
                        @php
                        $found = true;
                        @endphp
                        @endif
                        @if(!$found)
                        <div class="widget" style="width:728px;height:90px;border:1px solid gray;">
                            @endif
                            @endif

                        </div>
                        <div class="tablet-advert carousel-inner">
                            @if($home->banner_top_google != '')
                            <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
                            <ins class="adsbygoogle"
                                style="display:block"
                                data-ad-client="ca-pub-0209495346002620"
                                data-ad-slot="{{$home->banner_top_google}}"
                                data-ad-format="auto"
                                data-full-width-responsive="true"></ins>
                            <script>
                                (adsbygoogle = window.adsbygoogle || []).push({});
                            </script>
                            @else
                            @php
                            $found = false;
                            $count = 0;
                            @endphp
                            @if(isset($home->banner_top) && $home->banner_top != '')
                            <div class="item {{$count == 0 ? 'active' : ''}}">
                                <a href="{{$home->banner_top_url}}"><img src="/files/{{$home->banner_top}}" width="728" alt="" style="border:1px solid gray;"></a>
                            </div>
                            @php
                            $count += 1;
                            $found = true;
                            @endphp
                            @endif
                            @if(isset($home->banner_top_2) && $home->banner_top_2 != '')
                            <div class="item {{$count == 0 ? 'active' : ''}}">
                                <a href="{{$home->banner_top_url_2}}"><img src="/files/{{$home->banner_top_2}}" width="728" alt="" style="border:1px solid gray;"></a>
                            </div>
                            @php
                            $found = true;
                            @endphp
                            @endif
                            @if(isset($home->banner_top_3) && $home->banner_top_3 != '')
                            <div class="item {{$count == 0 ? 'active' : ''}}">
                                <a href="{{$home->banner_top_url_3}}"><img src="/files/{{$home->banner_top_3}}" width="728" alt="" style="border:1px solid gray;"></a>
                            </div>
                            @php
                            $found = true;
                            @endphp
                            @endif
                            @if(isset($home->banner_top_4) && $home->banner_top_4 != '')
                            <div class="item {{$count == 0 ? 'active' : ''}}">
                                <a href="{{$home->banner_top_url_4}}"><img src="/files/{{$home->banner_top_4}}" width="728" alt="" style="border:1px solid gray;"></a>
                            </div>
                            @php
                            $found = true;
                            @endphp
                            @endif
                            @if(isset($home->banner_top_5) && $home->banner_top_5 != '')
                            <div class="item {{$count == 0 ? 'active' : ''}}">
                                <a href="{{$home->banner_top_url_5}}"><img src="/files/{{$home->banner_top_5}}" width="728" alt="" style="border:1px solid gray;"></a>
                            </div>
                            @php
                            $found = true;
                            @endphp
                            @endif
                            @if(!$found)
                            <div class="widget" style="width:728px;height:90px;border:1px solid gray;">
                                @endif
                                @endif
                            </div>
                            <div class="mobile-advert carousel-inner">
                                @if($home->banner_top_google != '')
                                <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
                                <ins class="adsbygoogle"
                                    style="display:block"
                                    data-ad-client="ca-pub-0209495346002620"
                                    data-ad-slot="{{$home->banner_top_google}}"
                                    data-ad-format="auto"
                                    data-full-width-responsive="true"></ins>
                                <script>
                                    (adsbygoogle = window.adsbygoogle || []).push({});
                                </script>
                                @else
                                @php
                                $found = false;
                                $count = 0;
                                @endphp
                                @if(isset($home->banner_top) && $home->banner_top != '')
                                <div class="item {{$count == 0 ? 'active' : ''}}">
                                    <a href="{{$home->banner_top_url}}"><img src="/files/{{$home->banner_top}}" width="728" alt="" style="border:1px solid gray;"></a>
                                </div>
                                @php
                                $count += 1;
                                $found = true;
                                @endphp
                                @endif
                                @if(isset($home->banner_top_2) && $home->banner_top_2 != '')
                                <div class="item {{$count == 0 ? 'active' : ''}}">
                                    <a href="{{$home->banner_top_url_2}}"><img src="/files/{{$home->banner_top_2}}" width="728" alt="" style="border:1px solid gray;"></a>
                                </div>
                                @php
                                $found = true;
                                @endphp
                                @endif
                                @if(isset($home->banner_top_3) && $home->banner_top_3 != '')
                                <div class="item {{$count == 0 ? 'active' : ''}}">
                                    <a href="{{$home->banner_top_url_3}}"><img src="/files/{{$home->banner_top_3}}" width="728" alt="" style="border:1px solid gray;"></a>
                                </div>
                                @php
                                $found = true;
                                @endphp
                                @endif
                                @if(isset($home->banner_top_4) && $home->banner_top_4 != '')
                                <div class="item {{$count == 0 ? 'active' : ''}}">
                                    <a href="{{$home->banner_top_url_4}}"><img src="/files/{{$home->banner_top_4}}" width="728" alt="" style="border:1px solid gray;"></a>
                                </div>
                                @php
                                $found = true;
                                @endphp
                                @endif
                                @if(isset($home->banner_top_5) && $home->banner_top_5 != '')
                                <div class="item {{$count == 0 ? 'active' : ''}}">
                                    <a href="{{$home->banner_top_url_5}}"><img src="/files/{{$home->banner_top_5}}" width="728" alt="" style="border:1px solid gray;"></a>
                                </div>
                                @php
                                $found = true;
                                @endphp
                                @endif
                                @if(!$found)
                                <div class="widget" style="width:728px;height:90px;border:1px solid gray;">
                                    @endif
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- End Logo & advertisement -->

                    <!-- navbar list container -->
                    <div class="nav-list-container">
                        <div class="container">

                            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                                <ul class="nav navbar-nav navbar-left">
                                <form class="hide-search-on-large navbar-form form-inline2" role="search" autocomplete="off" action="/ricerca" method="POST" style="border-color:white; margin-left:5px">
                                        {{ csrf_field() }}
                                        <div style="position: relative; display: inline-block; width: 75%;">
                                            <input type="text" id="search" name="search" placeholder="Cerca qui"
                                                style="width: 100%; border-radius: 20px; padding: 5px 35px 5px 10px; border: 1px solid #ccc;">
                                            <i class="fa fa-search" style="position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: gray;"></i>
                                        </div>
                                    </form>
                                    <li><a href="/">Home</a></li>
                                    <li class="dropdown-item pagine-web-mobile"  style="display:none">
                                            <a class="dropdown-toggle" href="#" style="color:red!important;">Pagine WEB<span class="caret"></span></a>
                                            <ul class="dropdown-menu">
                                                @foreach($pages as $page)
                                                <li class="single-paginaweb"><a href="/{{$page->slug}}">{{$page->title}}</a></li>
                                                @endforeach
                                            </ul>
                                    </li>
                                    <!--
                <li class="search-top"><a><i class="fa fa-search" aria-hidden="true"></i></a></li>
                -->
                                    @php $insertedAreaRosa = false; @endphp
                                    @foreach($sections_menu as $section)
                                    @if($section->slug != 'europei-2022' && strpos($section->name, "/F") === false)
                                    <li>
                                        @if($section->layout != '')
                                        <a class="home-scroll-section" href="#" onclick="scroll_to('{{$section->slug}}')">{{$section->name}}</a>
                                        @else
                                        <a href="/{{$section->slug}}">{{$section->name}}</a>
                                        @endif
                                    </li>
                                    @endif

                                    @if(!$insertedAreaRosa && strtolower($section->name) === 'serie c2')
                                    <li class="drop"><a class="home" href="#">Area rosa</a>
                                        <ul class="dropdown">
                                            @foreach($sections_menu as $rosaSection)
                                            @if(strpos($rosaSection->name, "/F") > 0)
                                            <li>
                                                @if($rosaSection->layout != '')
                                                <a class="home-scroll-section"  href="#" onclick="scroll_to('{{$rosaSection->slug}}')">{{$rosaSection->name}}</a>
                                                @else
                                                <a class="home-scroll-section" href="/{{$rosaSection->slug}}">{{$rosaSection->name}}</a>
                                                @endif
                                            </li>
                                            @endif
                                            @endforeach
                                        </ul>
                                    </li>
                                    @php $insertedAreaRosa = true; @endphp
                                    @endif
                                    @endforeach
                                    <li>
                                        <a class="home-scroll-section" href="/eventi">EVENTI</a>
                                    </li>

                                    <li class="dropdown open" id="calendarMobile">
                                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true">Risultati <span class="caret"></span></a>
                                        <ul class="dropdown-menu">
                                            @foreach($calendars as $type => $categories)
                                            @foreach($categories as $category => $groups)
                                            @if(sizeof($groups) > 1)
                                            <li class="drop">
                                                <a href="#" style="padding-top: 5px !important;font-weight:bold;">{{$category}}</a>
                                                <ul class="dropdown " style="overflow-y:scroll;">
                                                    @foreach($groups as $group => $cal)
                                                    <li><a style="margin-left:20px !important;" href="/calendario/{{Str::slug($category)}}-{{Str::slug($group)}}/{{$cal}}">{{$group}}</a></li>
                                                    @endforeach
                                                </ul>
                                            </li>
                                            @else
                                            <li>
                                                <a href="/calendario/{{Str::slug($category)}}/{{reset($groups)}}" style="padding-top: 5px !important;font-weight:bold;">{{$category}}</a>
                                            </li>
                                            @endif
                                            @endforeach
                                            @endforeach

                                        </ul>
                                    </li>

                                    @if(false)
                                    <li class="drop" id="calendar"><a class="home" href="#">Risultati</a>
                                        <ul class="dropdown">
                                            @foreach($calendars as $type => $categories)
                                            <li class="drop">
                                                <a href="#">{{$type}}</a>
                                                <ul class="dropdown second-level">
                                                    @foreach($categories as $category => $groups)
                                                    @if(is_array($groups))
                                                    <li class="drop">
                                                        <a href="#">{{$category}}</a>
                                                        <ul class="dropdown third-level">
                                                            @foreach($groups as $group => $cal)
                                                            <li><a href="/calendario/{{Str::slug($category)}}-{{Str::slug($group)}}/{{$cal}}">{{$group}}</a></li>
                                                            @endforeach
                                                        </ul>
                                                    </li>
                                                    @else
                                                    <li>
                                                        <a href="/calendario/{{Str::slug($category)}}/{{$groups}}">{{$category}}</a>
                                                    </li>
                                                    @endif
                                                    @endforeach
                                                </ul>
                                            </li>
                                            @endforeach

                                        </ul>
                                    </li>

                                    @if(false)
                                    @foreach($calendars as $type => $categories)
                                    <li class="dropdown">
                                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{$type}} </a>
                                        <ul class="dropdown-submenu">
                                            @foreach($categories as $category => $groups)
                                            @if(is_array($groups))
                                            <li class="dropdown">
                                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{$category}} </a>
                                                <ul class="dropdown-submenu">
                                                    @foreach($groups as $group => $cal)
                                                    <li><a href="/calendario/{{Str::slug($category)}}-{{Str::slug($group)}}/{{$cal}}">{{$group}}</a></li>
                                                    @endforeach
                                                </ul>
                                            </li>
                                            @else
                                            <li>
                                                <a href="/calendario/{{Str::slug($category)}}/{{$groups}}">{{$category}}</a>
                                            </li>
                                            @endif
                                            @endforeach
                                        </ul>
                                    </li>
                                    @endforeach
                                    @endif

                                    <li class="drop"><a class="home" href="#">Eventi</a>
                                        <ul class="dropdown">
                                            @foreach($events as $event)
                                            <li><a href="/eventi/{{$event->slug}}">{{$event->title}}</a></li>
                                            @endforeach
                                        </ul>
                                    </li>

                                    @endif
                                    <!--
                        <li class="drop"><a class="home" href="#">Pagine WEB</a>

                            <ul class="dropdown pagineweb columns">
                                @foreach($pages as $page)
                                    <li><a href="/{{$page->slug}}">{{$page->title}}</a></li>
                                @endforeach
                            </ul>
                        </li>
-->





                                </ul>


                            </div>
                            <!-- /.navbar-collapse -->
                        </div>

                        <div class="container">

                            <div class="col-sm-2 no-padding">
                                <div class="center-button-reg blu-box pagine-regionali" style="text-align:left;">
                                    Pagine regionali
                                </div>
                            </div>
                            <div class="col-sm-10">
                                <nav id="menu-container" class="arrow">
                                    <div id="btn-nav-previous">
                                        <img src="/images/prev.png" width="25">
                                    </div>
                                    <div id="btn-nav-next">
                                        <img src="/images/next.png" width="25">
                                    </div>
                                    <div class="menu-inner-box">
                                        <div class="menu center-button-reg">
                                            @foreach($regions as $region)
                                            @if($region->layout != '')
                                            <a class="menu-item region" href="#" onclick="scroll_to('{{$region->slug}}')">{{$region->name}}</a>
                                            @else
                                            <a class="menu-item region" href="/{{$region->slug}}">{{$region->name}}</a>
                                            @endif
                                            @endforeach
                                        </div>
                                    </div>
                                </nav>
                            </div>

                            <div class="container" id="calendar">
                                <div class="col-sm-2 no-padding">
                                    <div class="center-button-reg blu-box" style="text-align:left; margin-left:-15px;">
                                        Risultati
                                    </div>
                                </div>
                                <div class="col-sm-8">
                                    <ul class="dropdown nav navbar-nav navbar-left">
                                        @foreach($calendars as $type => $categories)
                                        @foreach($categories as $category => $groups)
                                        @if(sizeof($groups) > 1)
                                        <li class="drop">
                                            <a href="#" style="padding-top: 5px !important;">{{$category}}</a>
                                            <ul class="dropdown" style="overflow-y:scroll;max-height: 350px !important;">
                                                @foreach($groups as $group => $cal)
                                                <li><a href="/calendario/{{Str::slug($category)}}-{{Str::slug($group)}}/{{$cal}}">{{$group}}</a></li>
                                                @endforeach
                                            </ul>
                                        </li>
                                        @else
                                        <li>
                                            <a href="/calendario/{{Str::slug($category)}}/{{reset($groups)}}" style="padding-top: 5px !important;">{{$category}}</a>
                                        </li>
                                        @endif
                                        @endforeach
                                        @endforeach

                                    </ul>

                                </div>
                                <!-- Pagine WEB menu -->
                                <div class="col-sm-2">
                                    <ul class="nav navbar-nav lg-pagine-web" style="margin-left:-10px!important">
                                        <li class="drop pagine-position">
                                            <a class="home" style="color: #2040ff!important;" href="#">Pagine WEB</a>
                                            <ul class="dropdown columns pagineweb-dropdown">
                                                @foreach($pages as $page)
                                                <li class="single-paginaweb"><a href="/{{$page->slug}}">{{$page->title}}</a></li>
                                                @endforeach
                                            </ul>
                                        </li>
                                    </ul>
                                </div>

                            </div>

                        </div>
                        <!-- End navbar list container -->

    </nav>
    <!-- End Bootstrap navbar -->
</header>

<script>
    document.addEventListener('DOMContentLoaded', function() {
        const dropdownToggle = document.querySelector('.pagine-web-mobile .dropdown-toggle');

        if (dropdownToggle) {
            dropdownToggle.addEventListener('click', function(e) {
                e.preventDefault();
                const parentLi = this.closest('.dropdown-item');
                parentLi.classList.toggle('open');
            });
        }
    });
</script>
