@php
    $nav = [
        ['route' => 'dashboard', 'label' => 'Dashboard'],
        ['route' => 'template.index', 'label' => 'Templates'],
        ['route' => 'requests.index', 'label' => 'Requests'],
        ['route' => 'settings.api-keys', 'label' => 'API Keys'],
        ['route' => 'settings.webhooks', 'label' => 'Webhooks'],
    ];
@endphp
<div class="flex h-full flex-col">
    <div class="flex h-14 items-center gap-2 border-b border-slate-200 px-5">
        <div class="h-7 w-7 rounded-md bg-brand-600"></div>
        <span class="font-semibold">{{ config('esign.product_name') }}</span>
    </div>
    <nav class="flex-1 space-y-1 p-3 text-sm">
        @foreach ($nav as $item)
            <a href="{{ route($item['route']) }}"
               wire:navigate
               @class([
                   'flex items-center gap-2 rounded-lg px-3 py-2 font-medium transition',
                   'bg-brand-50 text-brand-700' => request()->routeIs($item['route'].'*'),
                   'text-slate-600 hover:bg-slate-100' => ! request()->routeIs($item['route'].'*'),
               ])>
                {{ $item['label'] }}
            </a>
        @endforeach
    </nav>
    <div class="border-t border-slate-200 p-4 text-xs text-slate-400">
        {{ config('esign.product_name') }}
    </div>
</div>