@php
    $modules = [
        ['name' => 'home', 'displayName' => 'Főoldal', 'icon' => 'home', 'link' => route('dashboard.index'), 'roles' => ['root','admin','developer','profit-center']],
        ['name' => 'order', 'displayName' => 'Új megrendelés', 'icon' => 'bevetelezes', 'link' => route('order.index'), 'roles' => ['root','profit-center']],
        ['name' => 'activeOrder', 'displayName' => 'Megrendelések', 'icon' => 'tranzakciok', 'link' => route('orderArchive.index'), 'roles' => ['root','developer','admin','profit-center']],
        ['name' => 'productGroup', 'displayName' => 'Termékcsoportok', 'icon' => 'category', 'link' => route('admin.productGroup.index'), 'roles' => ['root','developer','admin']],
        ['name' => 'product', 'displayName' => 'Termék', 'icon' => 'raktar', 'link' => route('admin.product.index'), 'roles' => ['root','developer','admin']],
        ['name' => 'supplier', 'displayName' => 'Beszállító adatbázis', 'icon' => 'supplier', 'link' => route('admin.supplier.index'), 'roles' => ['root','developer','admin','profit-center']],
        ['name' => 'priceList', 'displayName' => 'Webrendelős árlisták', 'icon' => 'price_list2', 'link' => route('admin.priceList.index'), 'roles' => ['root','developer','admin','profit-center']],
        ['name' => 'priceListProcessor', 'displayName' => 'Árlista feldolgozó', 'icon' => 'price_list', 'link' => '/admin/pricelist-files', 'roles' => ['root','developer','admin']],
    ];
@endphp

<nav class="fi-speed-button-nav flex items-center h-full ml-4">
    <ul class="flex items-center gap-x-1">
        @foreach ($modules as $module)
            @role($module['roles'])
                @php
                    $isActive = request()->is(ltrim($module['link'], '/') . '*');
                @endphp
                <li class="flex-none">
                    <a href="{{ $module['link'] }}"
                       title="{{ $module['displayName'] }}"
                       class="flex flex-col items-center justify-center w-[110px] h-[105px] rounded-md transition-colors duration-200 {{ $isActive ? 'bg-white/50 shadow-inner' : 'hover:bg-white/30' }}">
                        <img src="{{ asset('images/icons/ico_'.$module['icon'].'.png') }}"
                             class="w-16 h-16 object-contain mb-1"
                             alt="">
                        <span class="text-[11px] font-bold text-[#453821] truncate w-full text-center px-1 leading-tight">
                            {{ $module['displayName'] }}
                        </span>
                    </a>
                </li>
            @endrole
        @endforeach
    </ul>
</nav>

<style>
    /* Biztosítjuk, hogy a topbar ne essen szét */
    .fi-topbar {
        height: auto !important;
    }
    .fi-topbar-content {
        height: auto !important;
        min-height: 64px;
        padding-top: 4px;
        padding-bottom: 4px;
    }
</style>