@php
    use function Modules\Core\Settings\Helpers\setting;
    $currentFullUrl = request()->fullUrl();
@endphp

<header>

    {{-- notificaciones --}}
    <div class="p-2 text-white bg-black">
        <div class="container flex justify-center items-center lg:justify-around">

            <div class="hidden lg:flex grow basis-0">
                @if (setting('social.social_networks'))
                    @foreach (setting('social.social_networks') as $sn)
                        <a href="{{ $sn->url }}" target="_blank"
                            class="flex justify-center items-center ml-1 h-6 bg-white rounded-full first:ml-8 aspect-square">
                            @svg($sn->icon, 'h-4 text-black')
                        </a>
                    @endforeach
                @endif
            </div>

            <div class="uppercase font-semibold animate-pulse">{{ setting('site.notification') }}</div>

            <div class="hidden justify-end lg:flex grow basis-0">
            </div>
        </div>
    </div>


    {{-- menu --}}
    <div class="bg-white">
        {{-- --------------------------- movil ---------------------------- --}}
        <div class="container py-3">
            <div class="flex justify-between lg:hidden">

                {{-- Navegacion Izquierda --}}
                <div class="flex gap-x-1.5 items-center pl-2 grow basis-0">
                    @include('layout.drawers.menu')
                    <div class="flex lg:hidden">
                    </div>
                </div>


                {{-- Logo --}}
                <a href="{{ route('home') }}">
                    @if (setting('site.logo'))
                        <img src="{{ Storage::url(setting('site.logo')) }}" alt="{{ setting('site.title') }}"
                            class="max-h-15" />
                    @else
                        <x-quim-quimaira class="h-8"></x-quim-quimaira>
                    @endif
                </a>

                {{-- Navegacion Derecha --}}
                <div
                    class="flex justify-end items-center grow basis-0 [&>*:not(:first-child)]:ml-1.5 [&>*:not(:last-child)]:mr-1.5 pr-2">

                </div>
            </div>


            {{-- --------------------------- desktop ---------------------------- --}}
            <div class="hidden lg:flex justify-around items-center">
                {{-- Logo --}}
                <a href="{{ route('home') }}">
                    @if (setting('site.logo'))
                        <img src="{{ Storage::url(setting('site.logo')) }}" alt="{{ setting('site.title') }}"
                            class="max-h-[80px]" />
                    @else
                        <x-quim-quimaira class="h-8"></x-quim-quimaira>
                    @endif
                </a>

                <div
                    class="flex transition-all duration-300 uppercase pb-2 font-semibold text-lg lg:gap-x-6 [&>a]:py-2 [&>a]:border-b-4 [&>a]:border-transparent [&>a:hover]:border-b-red-500 [&>a:hover]:text-red-500 ">
                    <a href="{{ route('home') }}" @class([
                        'border-b-red-500!' => $currentFullUrl == route('home'),
                    ])>Inicio</a>

                </div>
            </div>
        </div>
    </div>

</header>