<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" class="dark">
    <head>
        @include('partials.head')
    </head>
    <body class="min-h-screen bg-white dark:bg-zinc-800">
        <flux:sidebar sticky collapsible="mobile" class="border-e border-zinc-200 bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-900">
            <flux:sidebar.header class="flex items-center gap-3 px-3 py-4">
                {{-- Brand: bus icon + app name + sub-label --}}
                <a href="{{ route('dashboard') }}" wire:navigate class="flex items-center gap-3 min-w-0 flex-1 group">
                    <div class="flex shrink-0 items-center justify-center size-9 rounded-lg bg-blue-600 text-white shadow-sm group-hover:bg-blue-700 transition-colors">
                        <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="size-5 fill-current">
                            <path d="M4 16c0 .88.39 1.67 1 2.22V20a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-1h8v1a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-1.78c.61-.55 1-1.34 1-2.22V6c0-3.5-3.58-4-8-4s-8 .5-8 4v10zm3.5 1a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm9 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zM6 6h12v5H6V6z"/>
                        </svg>
                    </div>
                    <div class="grid min-w-0">
                        <flux:heading class="truncate text-sm font-semibold leading-tight">{{ config('app.name', 'PayRide') }}</flux:heading>
                        <flux:text class="truncate text-xs leading-tight opacity-60">School Portal</flux:text>
                    </div>
                </a>
                <flux:sidebar.collapse class="lg:hidden shrink-0" />
            </flux:sidebar.header>
        @if(Qs::userIsSuperAdmin())

  <flux:sidebar.nav>
                <flux:sidebar.group :heading="__('Management')">
                    <flux:sidebar.item icon="home" :href="route('admin.dashboard')" :current="request()->routeIs('admin.dashboard')" wire:navigate>
                        {{ __('Dashboard') }}
                    </flux:sidebar.item>

                    <flux:sidebar.item icon="user-group" :href="route('admin.applicants.index')" :current="request()->routeIs('admin.applicants.*')" wire:navigate>
                        {{ __('School Registrations') }}
                    </flux:sidebar.item>

                    <flux:sidebar.item icon="users" :href="route('admin.tenants.index')" :current="request()->routeIs('admin.tenants.*')" wire:navigate>
                        {{ __('Registered Schools') }}
                    </flux:sidebar.item>
                </flux:sidebar.group>

                <flux:sidebar.group :heading="__('Billing')">
                    <flux:sidebar.item icon="currency-dollar" :href="route('admin.billing.index')" :current="request()->routeIs('admin.billing.*')" wire:navigate>
                        {{ __('All Invoices') }}
                    </flux:sidebar.item>

                    <flux:sidebar.item icon="credit-card" :href="route('admin.billing.payments.index')" :current="request()->routeIs('admin.billing.payments.*')" wire:navigate>
                        {{ __('Manage Payments') }}
                    </flux:sidebar.item>

                    <flux:sidebar.item icon="cloud-arrow-up" :href="route('admin.billing.payments.uploads')" :current="request()->routeIs('admin.billing.payments.uploads')" wire:navigate>
                        {{ __('Manage Proofs') }}
                    </flux:sidebar.item>

                    <flux:sidebar.item icon="exclamation-triangle" :href="route('admin.billing.baddebts.index')" :current="request()->routeIs('admin.billing.baddebts.*')" wire:navigate>
                        {{ __('Bad Debts') }}
                    </flux:sidebar.item>

                    <flux:sidebar.item icon="cog" :href="route('admin.billing.settings')" :current="request()->routeIs('admin.billing.settings')" wire:navigate>
                        {{ __('Global Settings') }}
                    </flux:sidebar.item>
                </flux:sidebar.group>
            </flux:sidebar.nav>

        @elseif(auth()->user()->role !== 'super_admin')
        {{-- Active tenant badge --}}
   {{-- Active school badge --}}
            @if(session('school'))
            <div class="px-3 pb-2">
                <flux:badge color="blue" size="sm" class="w-full justify-start gap-1.5 truncate">
                    <flux:icon.map-pin class="size-3 shrink-0" />
                    <span class="truncate">{{ session('school') }}</span>
                </flux:badge>
            </div>
            @endif

            <flux:sidebar.nav>
                <!-- Platform Section -->
                <flux:sidebar.group :heading="__('Platform')" class="grid">
                    <flux:sidebar.item icon="home" :href="route('dashboard')" :current="request()->routeIs('dashboard')" wire:navigate>
                        {{ __('Dashboard') }}
                    </flux:sidebar.item>
                </flux:sidebar.group>

                <!-- Management Section (Admin Only) -->
                @if(auth()->user() && (auth()->user()->role === 'admin' || auth()->user()->role === 'super_admin'))
                <flux:sidebar.group :heading="__('Management')">
                    @if(Route::has('classes.index'))
                        <flux:sidebar.item icon="academic-cap" :href="route('classes.index')" :current="request()->routeIs('classes.*')" wire:navigate>
                            {{ __('Classes') }}
                        </flux:sidebar.item>
                    @endif

                    @if(Route::has('destinations.index'))
                        <flux:sidebar.item icon="map-pin" :href="route('destinations.index')" :current="request()->routeIs('destinations.*')" wire:navigate>
                            {{ __('Destinations') }}
                        </flux:sidebar.item>
                    @endif

                    @if(Route::has('students.index'))
                        <flux:sidebar.item icon="user-group" :href="route('students.index')" :current="request()->routeIs('students.*')" wire:navigate>
                            {{ __('Students') }}
                        </flux:sidebar.item>
                    @endif
                </flux:sidebar.group>
                @endif

                <!-- Financial Section -->
                <flux:sidebar.group :heading="__('Financial')">
                    @if(Route::has('payments.index'))
                        <flux:sidebar.item icon="credit-card" :href="route('payments.index')" :current="request()->routeIs('payments.*')" wire:navigate>
                            {{ __('Payments') }}
                        </flux:sidebar.item>
                    @endif
                </flux:sidebar.group>

                <!-- System Section with Dropdown (Admin Only) -->
                @if(auth()->user() && (auth()->user()->role === 'admin' || auth()->user()->role === 'super_admin'))
                <flux:sidebar.group :heading="__('System')">
                @php
                    $isReportsActive = request()->routeIs('reports.*');
                @endphp

                <flux:dropdown>
                    <flux:sidebar.item 
                        icon="chart-bar" 
                        :current="$isReportsActive"
                        class="flex items-center justify-between w-full"
                    >
                        <span>{{ __('Reports') }}</span>
                        <flux:icon.chevron-down class="size-4 opacity-50" />
                    </flux:sidebar.item>

                    <flux:menu class="w-48">
                        @if(Route::has('reports.by-class'))
                            <flux:menu.item 
                                :href="route('reports.by-class')" 
                                icon="document-chart-bar"
                                :active="request()->routeIs('reports.by-class')"
                                wire:navigate
                            >
                                {{ __('By Class') }}
                            </flux:menu.item>
                        @endif

                        @if(Route::has('reports.by-destination'))
                            <flux:menu.item 
                                :href="route('reports.by-destination')" 
                                icon="map-pin"
                                :active="request()->routeIs('reports.by-destination')"
                                wire:navigate
                            >
                                {{ __('By Destination') }}
                            </flux:menu.item>
                        @endif
                    </flux:menu>
                </flux:dropdown>

                    @if(Route::has('settings.index'))
                        <flux:sidebar.item icon="cog" :href="route('settings.index')" :current="request()->routeIs('settings.*')" wire:navigate>
                            {{ __('Settings') }}
                        </flux:sidebar.item>
                    @endif

                    @if(Route::has('users.index'))
                        <flux:sidebar.item icon="users" :href="route('users.index')" :current="request()->routeIs('users.*')" wire:navigate>
                            {{ __('Users') }}
                        </flux:sidebar.item>
                    @endif
                </flux:sidebar.group>
                @endif
            </flux:sidebar.nav>

            <flux:spacer />

            <flux:sidebar.nav>
                <flux:sidebar.item icon="folder-open" href="https://github.com/laravel/livewire-starter-kit" target="_blank">
                    {{ __('Repository') }}
                </flux:sidebar.item>

                <flux:sidebar.item icon="book-open" href="https://laravel.com/docs/starter-kits#livewire" target="_blank">
                    {{ __('Documentation') }}
                </flux:sidebar.item>
            </flux:sidebar.nav>

            <x-desktop-user-menu class="hidden lg:block" :name="session('user_name', 'User')" />

        {{-- End active tenant badge --}}
        @endif
                 </flux:sidebar>

        <!-- Mobile User Menu -->
        <flux:header class="lg:hidden">
            <flux:sidebar.toggle class="lg:hidden" icon="bars-2" inset="left" />

            <flux:spacer />

            @php
                $userName = session('user_name', 'User');
                $userEmail = session('user_email', '');
                $initials = collect(explode(' ', $userName))->take(2)->map(fn($word) => substr($word, 0, 1))->implode('');
            @endphp

            <flux:dropdown position="top" align="end">
                <flux:profile
                    :initials="$initials"
                    icon-trailing="chevron-down"
                />

                <flux:menu>
                    <flux:menu.radio.group>
                        <div class="p-0 text-sm font-normal">
                            <div class="flex items-center gap-2 px-1 py-1.5 text-start text-sm">
                                <flux:avatar
                                    :name="$userName"
                                    :initials="$initials"
                                />

                                <div class="grid flex-1 text-start text-sm leading-tight">
                                    <flux:heading class="truncate">{{ $userName }}</flux:heading>
                                    <flux:text class="truncate">{{ $userEmail }}</flux:text>
                                </div>
                            </div>
                        </div>
                    </flux:menu.radio.group>

                    <flux:menu.separator />

                    <flux:menu.radio.group>
                        <flux:menu.item :href="route('profile.edit')" icon="cog" wire:navigate>
                            {{ __('Settings') }}
                        </flux:menu.item>
                    </flux:menu.radio.group>

                    <flux:menu.separator />

                    <form method="POST" action="{{ route('logout') }}" class="w-full">
                        @csrf
                        <flux:menu.item
                            as="button"
                            type="submit"
                            icon="arrow-right-start-on-rectangle"
                            class="w-full cursor-pointer"
                            data-test="logout-button"
                        >
                            {{ __('Log out') }}
                        </flux:menu.item>
                    </form>
                </flux:menu>
            </flux:dropdown>
        </flux:header>

        {{ $slot }}

        @persist('toast')
            <flux:toast.group>
                <flux:toast />
            </flux:toast.group>
        @endpersist

        {{ $scripts ?? '' }}

        @fluxScripts
    </body>
</html>