<!DOCTYPE html>
<html lang="fa" dir="rtl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@yield('title', 'پنل مدیریت') | آبتین اسپرت</title>
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <x-pwa-head />
    <link rel="stylesheet" href="{{ asset('css/app.css') }}">
</head>
<body class="bg-paper text-ink-900 antialiased">

<div class="min-h-screen flex flex-col md:flex-row">

    <aside class="hidden md:flex md:w-64 md:flex-col bg-ink-950 text-slate-300 shrink-0">
        <div class="flex items-center gap-2.5 px-5 py-5 border-b border-white/5">
            <span class="flex h-8 w-8 items-center justify-center rounded-lg bg-ember-500/15 text-ember-500">
                <x-icon name="flame" class="w-5 h-5" />
            </span>
            <div>
                <div class="text-white font-semibold text-sm leading-none">آبتین اسپرت</div>
                <div class="text-[11px] text-slate-500 mt-1">پنل مدیریت</div>
            </div>
        </div>

        <nav class="flex-1 p-3 space-y-1 overflow-y-auto">
            <a href="{{ route('admin.dashboard') }}" class="nav-link {{ request()->routeIs('admin.dashboard') ? 'is-active' : '' }}">
                <x-icon name="dashboard" class="w-[18px] h-[18px]" /> داشبورد
            </a>
            <a href="{{ route('admin.goals.index') }}" class="nav-link {{ request()->routeIs('admin.goals.*') ? 'is-active' : '' }}">
                <x-icon name="star" class="w-[18px] h-[18px]" /> اهداف ورزشی
            </a>
            <a href="{{ route('admin.exercises.index') }}" class="nav-link {{ request()->routeIs('admin.exercises.*', 'admin.muscles.*', 'admin.equipment.*') ? 'is-active' : '' }}">
                <x-icon name="dumbbell" class="w-[18px] h-[18px]" /> بانک حرکات ورزشی
            </a>
            <a href="{{ route('admin.coaches.index') }}" class="nav-link {{ request()->routeIs('admin.coaches.*') ? 'is-active' : '' }}">
                <x-icon name="briefcase" class="w-[18px] h-[18px]" /> مربیان
            </a>
            <a href="{{ route('admin.athletes.index') }}" class="nav-link {{ request()->routeIs('admin.athletes.*') ? 'is-active' : '' }}">
                <x-icon name="users" class="w-[18px] h-[18px]" /> ورزشکاران
            </a>
            <a href="{{ route('admin.coach-requests.index') }}" class="nav-link {{ request()->routeIs('admin.coach-requests.*') ? 'is-active' : '' }}">
                <x-icon name="clipboard" class="w-[18px] h-[18px]" /> درخواست‌های همکاری
            </a>
            <a href="{{ route('admin.workout-plans.index') }}" class="nav-link {{ request()->routeIs('admin.workout-plans.*') ? 'is-active' : '' }}">
                <x-icon name="chart" class="w-[18px] h-[18px]" /> برنامه‌های تمرینی
            </a>
            <a href="{{ route('admin.nutrition-plans.index') }}" class="nav-link {{ request()->routeIs('admin.nutrition-plans.*') ? 'is-active' : '' }}">
                <x-icon name="meal" class="w-[18px] h-[18px]" /> برنامه‌های غذایی
            </a>
            <a href="{{ route('admin.payments.index') }}" class="nav-link {{ request()->routeIs('admin.payments.*') ? 'is-active' : '' }}">
                <x-icon name="wallet" class="w-[18px] h-[18px]" /> پرداخت‌ها
            </a>
            <a href="{{ route('admin.reviews.index') }}" class="nav-link {{ request()->routeIs('admin.reviews.*') ? 'is-active' : '' }}">
                <x-icon name="star" class="w-[18px] h-[18px]" /> نظرات
            </a>
            <a href="{{ route('admin.audit-logs.index') }}" class="nav-link {{ request()->routeIs('admin.audit-logs.*') ? 'is-active' : '' }}">
                <x-icon name="log" class="w-[18px] h-[18px]" /> گزارش فعالیت‌ها
            </a>
        </nav>

        <div class="p-3 border-t border-white/5">
            <div class="flex items-center gap-2.5 px-2 py-2">
                <span class="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-ember-500 text-white text-xs font-semibold">
                    {{ mb_substr(auth()->user()->first_name, 0, 1) }}
                </span>
                <div class="min-w-0">
                    <div class="text-white text-sm truncate">{{ auth()->user()->fullName() }}</div>
                    <div class="text-[11px] text-slate-500">مدیر کل</div>
                </div>
            </div>
        </div>
    </aside>

    <div class="flex-1 flex flex-col min-w-0">

        <header class="bg-white border-b border-slate-100 px-4 md:px-6 py-3.5 flex items-center justify-between">
            <button class="md:hidden text-ink-900" onclick="document.getElementById('mobile-menu').classList.toggle('hidden')" aria-label="منو">
                <x-icon name="menu" class="w-6 h-6" />
            </button>
            <div class="flex-1"></div>
            <div class="flex items-center gap-4">
                <x-notification-bell />
                <form method="POST" action="{{ route('logout') }}">
                    @csrf
                    <button type="submit" class="btn-ghost btn-sm">
                        <x-icon name="logout" class="w-4 h-4" /> خروج
                    </button>
                </form>
            </div>
        </header>

        <nav id="mobile-menu" class="hidden md:hidden bg-ink-950 text-slate-300 p-3 space-y-1">
            <a href="{{ route('admin.dashboard') }}" class="nav-link"><x-icon name="dashboard" class="w-[18px] h-[18px]" /> داشبورد</a>
            <a href="{{ route('admin.goals.index') }}" class="nav-link"><x-icon name="star" class="w-[18px] h-[18px]" /> اهداف ورزشی</a>
            <a href="{{ route('admin.exercises.index') }}" class="nav-link"><x-icon name="dumbbell" class="w-[18px] h-[18px]" /> بانک حرکات</a>
            <a href="{{ route('admin.coaches.index') }}" class="nav-link"><x-icon name="briefcase" class="w-[18px] h-[18px]" /> مربیان</a>
            <a href="{{ route('admin.athletes.index') }}" class="nav-link"><x-icon name="users" class="w-[18px] h-[18px]" /> ورزشکاران</a>
            <a href="{{ route('admin.payments.index') }}" class="nav-link"><x-icon name="wallet" class="w-[18px] h-[18px]" /> پرداخت‌ها</a>
            <a href="{{ route('admin.reviews.index') }}" class="nav-link"><x-icon name="star" class="w-[18px] h-[18px]" /> نظرات</a>
            <a href="{{ route('admin.audit-logs.index') }}" class="nav-link"><x-icon name="log" class="w-[18px] h-[18px]" /> گزارش فعالیت‌ها</a>
        </nav>

        <main class="flex-1 p-4 md:p-7">
            @if (session('status'))
                <div class="mb-5 flex items-center gap-2 rounded-xl bg-emerald-50 text-emerald-700 px-4 py-3 text-sm">
                    <x-icon name="check" class="w-4 h-4 shrink-0" /> {{ session('status') }}
                </div>
            @endif

            @yield('content')
        </main>
    </div>
</div>

</body>
</html>
