@extends('admin.layouts.layout')

@section('content')
    <div class="container-scroller">
        @include('admin.layouts.navbar')

        <div class="container-fluid page-body-wrapper">
            @include('admin.layouts.sidebar')

            <div class="main-panel">
                <div class="content-wrapper">
                    <h2>تفاصيل الرياضة: {{ $game->name }}</h2>

                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <p><strong>اسم الرياضة:</strong> {{ $game->name }}</p>
                        </div>
                        <div class="col-md-6 mb-3">
                            <p><strong>السعر:</strong> {{ number_format($game->price, 2) }} جنيه</p>
                        </div>
                        <div class="col-md-12 mb-3">
                            <p><strong>الوصف:</strong></p>
                            <p>{{ $game->description ?? 'لا يوجد وصف متاح' }}</p>
                        </div>
                    </div>

                    <h3>الألعاب الفرعية</h3>
                    @if ($game->subGames->isNotEmpty())
                        <table class="table table-bordered">
                            <thead>
                                <tr>
                                    <th>اسم اللعبة الفرعية</th>
                                    <th>الوصف</th>
                                    <th>السعر</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($game->subGames as $subGame)
                                    <tr>
                                        <td>{{ $subGame->name }}</td>
                                        <td>{{ $subGame->description ?? 'لا يوجد وصف متاح' }}</td>
                                        <td>{{ number_format($subGame->price, 2) }} جنيه</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    @else
                        <p>لا توجد ألعاب فرعية لهذه الرياضة.</p>
                    @endif

                    <a href="{{ route('games.index') }}" class="btn btn-secondary mt-3">رجوع</a>
                </div>
            </div>
        </div>
    </div>
@endsection