dishplanner/resources/views/dashboard.blade.php

<x-layouts.app>
    <div class="px-4 sm:px-6 lg:px-8">
        <div class="max-w-7xl mx-auto">
            <h1 class="text-2xl font-syncopate text-accent-blue mb-8">DASHBOARD</h1>

            <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
                <div class="border-2 border-secondary rounded-lg p-6">
                    <p class="text-4xl font-bold text-accent-blue">{{ $stats['dish_count'] }}</p>
                    <h3 class="text-sm font-bold uppercase tracking-wide text-gray-100 mt-2">Dishes</h3>
                </div>

                <div class="border-2 border-secondary rounded-lg p-6">
                    <p class="text-4xl font-bold text-primary">{{ $stats['user_count'] }}</p>
                    <h3 class="text-sm font-bold uppercase tracking-wide text-gray-100 mt-2">Users</h3>
                </div>

                <div class="border-2 border-secondary rounded-lg p-6">
                    <p class="text-4xl font-bold text-success">{{ $stats['meals_this_month'] }}</p>
                    <h3 class="text-sm font-bold uppercase tracking-wide text-gray-100 mt-2">Meals this month</h3>
                </div>
            </div>

            <div class="border-2 border-secondary rounded-lg p-6 mb-8">
                <h2 class="text-xl font-bold text-accent-blue mb-4">Favorite dishes</h2>

                @if ($stats['favorite_dishes']->isEmpty())
                    <p class="text-gray-100">No users yet.</p>
                @else
                    <ul class="space-y-3">
                        @foreach ($stats['favorite_dishes'] as $favorite)
                            <li class="flex justify-between gap-4">
                                <span class="font-bold text-primary">{{ $favorite['user']->name }}</span>
                                @if ($favorite['dish'])
                                    <span class="text-gray-100">{{ $favorite['dish']->name }} <span class="text-gray-400">({{ $favorite['count'] }})</span></span>
                                @else
                                    <span class="text-gray-400">No meals yet</span>
                                @endif
                            </li>
                        @endforeach
                    </ul>
                @endif
            </div>
            
            <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
                <a href="{{ route('users.index') }}" class="border-2 border-secondary rounded-lg p-6 hover:bg-gray-700 transition-colors duration-200">
                    <h3 class="text-xl font-bold text-primary mb-2">Manage Users</h3>
                    <p class="text-gray-100">Add and manage planner users</p>
                </a>

                <a href="{{ route('dishes.index') }}" class="border-2 border-secondary rounded-lg p-6 hover:bg-gray-700 transition-colors duration-200">
                    <h3 class="text-xl font-bold text-accent-blue mb-2">Manage Dishes</h3>
                    <p class="text-gray-100">Create and manage your dish collection</p>
                </a>

                <a href="{{ route('schedule.index') }}" class="border-2 border-secondary rounded-lg p-6 hover:bg-gray-700 transition-colors duration-200">
                    <h3 class="text-xl font-bold text-success mb-2">View Schedule</h3>
                    <p class="text-gray-100">See your monthly dish schedule</p>
                </a>
            </div>
        </div>
    </div>
</x-layouts.app>