{{-- //$navigation = filament()->getNavigation();
//dd($navigation); --}}
@props(['content' => null])
<div class="mt-4 ">

    {{--
    <x-filament-panels::topbar :navigation="$navigation" /> --}}

    <header class="flex items-center justify-start w-full h-16 bg-gray-300 dark:bg-gray-950">

        @if(isset($navigation))

        <div class="flex items-center justify-start {{-- items-center justify-center --}} gap-4">

            <div class="mx-6 font-semibold uppercase text-md"><span class="text-2xl">C</span>reator <span
                    class="text-2xl">C</span>onnect</div>

            @foreach ( $navigation as $navi )
            <a href="{{ route($navi['route']) }}" wire:navigate>
                <div
                    class="flex items-center h-12 px-3 bg-gray-300 border-b-4 border-purple-500 rounded-sm rounded-b-md dark:bg-gray-900">
                    {{$navi['label']}}
                </div>
            </a>
            @endforeach
        </div>
        @endif

    </header>

    <main class="mt-4">
        <div class="p-4 bg-gray-300 dark:bg-gray-800">
            @if(isset($content))
            {{$content}}
            @endif
        </div>
    </main>

    <footer class="flex p-4">
        <h1>footer..</h1>
    </footer>

</div>