{{-- Submenu das marcas --}}
@php
    use App\Helpers\TranslationHelper;
@endphp
@php
    $marcaIds = collect(app(\App\Settings\ConfiguracaoGeral::class)->marca_links)->pluck('marca_id')->toArray();
    $marcasData = \App\Models\Marca::whereIn('id', $marcaIds)
        ->get()
        ->keyBy('id');
    $nossasMarcas = TranslationHelper::getPageUrl('nossas-marcas');
@endphp
<template x-teleport="body">
    <div x-show="open"
         x-cloak
         x-transition
         class="fixed z-50"
         :style="getPositionStyle()"
         @mouseenter="clearTimeout(closing)"
         @mouseleave="startClosing()">
        <div class="bg-white grid rounded-2xl min-w-60 overflow-hidden" x-cloak x-transition x-show="open">
            <div>
                <div class="p-8 grid grid-cols-3 gap-y-5 font-bricolage font-bold">
                    @foreach($marcaIds as $marcaId)
                        @php
                            $marca = $marcasData[$marcaId] ?? null;
                        @endphp
                        <a class="hover:opacity-100 opacity-60 text-midnightblue-100" target="{{ $marca?->target }}" href="{{ $marca?->href }}">{{ $marca?->nome }}</a>
                    @endforeach
                    <a class="hover:opacity-100 opacity-60 text-midnightblue-100 inline-flex gap-2 items-center" href="{{ $nossasMarcas }}">
                        {{ __('messages.ver_todas') }}
                        <svg class="transform -rotate-90" xmlns="http://www.w3.org/2000/svg" width="11.987" height="6.339"><path d="M10.577 1.41 5.993 5.339 1.41 1.41" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/></svg>
                    </a>
                </div>
            </div>
        </div>
    </div>
</template>