@extends('layouts.app')

@section('title', config('game.name', 'The Crime Syndicate') . ' - ' . ($title ?? 'Game'))

@section('content')
    <!-- Game Header -->
    <header class="bg-gray-800 text-white shadow">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="flex justify-between items-center h-16">
                <!-- Logo -->
                <div class="flex-shrink-0 flex items-center">
                    <a href="{{ route('game.dashboard') }}" class="text-xl font-bold">
                        {{ config('game.name', 'The Crime Syndicate') }}
                    </a>
                </div>
                
                <!-- Character Stats -->
                <div class="flex items-center space-x-4">
                    @if(auth()->check() && auth()->user()->character)
                        @include('game.partials.stats-bar')
                    @endif
                </div>
                
                <!-- User Menu -->
                <div class="flex items-center">
                    @include('layouts.navigation')
                </div>
            </div>
        </div>
    </header>

    <!-- Flash Messages -->
    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
        @if(session('success'))
            <div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4" role="alert">
                <strong class="font-bold">Success!</strong>
                <span class="block sm:inline">{{ session('success') }}</span>
            </div>
        @endif
        
        @if(session('error'))
            <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4" role="alert">
                <strong class="font-bold">Error!</strong>
                <span class="block sm:inline">{{ session('error') }}</span>
            </div>
        @endif
    </div>

    <!-- Main Content -->
    <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
        @yield('game-content')
    </main>

    <!-- Game Footer -->
    <footer class="bg-gray-800 text-white mt-auto">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
            <div class="text-center text-sm text-gray-400">
                &copy; {{ date('Y') }} {{ config('game.name', 'The Crime Syndicate') }} - v{{ config('game.version', '1.0.0') }}
            </div>
        </div>
    </footer>
@endsection