@extends('layouts.admin')

@section('content')
    <div class="container mx-auto p-4">
        <h1 class="text-3xl font-extrabold text-center mb-6 text-gray-800">Create New Match</h1>

        <div class="bg-white p-6 rounded-xl shadow-lg max-w-lg mx-auto">
            <form action="{{ route('admin.matches.store') }}" method="POST" enctype="multipart/form-data">
                @csrf

                <div class="mb-4">
                    <label for="home_team" class="block text-gray-700 font-medium mb-2">Home Team</label>
                    <input type="text" name="home_team" id="home_team" class="w-full p-3 border border-gray-300 rounded-lg" required>
                    @error('home_team')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>

                <div class="mb-4">
                    <label for="away_team" class="block text-gray-700 font-medium mb-2">Away Team</label>
                    <input type="text" name="away_team" id="away_team" class="w-full p-3 border border-gray-300 rounded-lg" required>
                    @error('away_team')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>

                <div class="mb-4">
                    <label for="match_date" class="block text-gray-700 font-medium mb-2">Match Date & Time</label>
                    <input type="datetime-local" name="match_date" id="match_date" class="w-full p-3 border border-gray-300 rounded-lg" required>
                    @error('match_date')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>

                <div class="mb-4">
                    <label for="stadium" class="block text-gray-700 font-medium mb-2">Stadium</label>
                    <input type="text" name="stadium" id="stadium" class="w-full p-3 border border-gray-300 rounded-lg" required>
                    @error('stadium')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>

                <div class="mb-4">
                    <label for="home_team_flag" class="block text-gray-700 font-medium mb-2">Home Team Flag</label>
                    <input type="file" name="home_team_flag" id="home_team_flag" class="w-full p-3 border border-gray-300 rounded-lg" accept="image/*" required>
                    @error('home_team_flag')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>

                <div class="mb-4">
                    <label for="away_team_flag" class="block text-gray-700 font-medium mb-2">Away Team Flag</label>
                    <input type="file" name="away_team_flag" id="away_team_flag" class="w-full p-3 border border-gray-300 rounded-lg" accept="image/*" required>
                    @error('away_team_flag')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>

                <div class="mb-4">
                    <label for="ordinary_amount" class="block text-gray-700 font-medium mb-2">Ordinary Ticket Price</label>
                    <input type="number" name="ordinary_amount" id="ordinary_amount" step="0.01" min="0" class="w-full p-3 border border-gray-300 rounded-lg" required>
                    @error('ordinary_amount')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>

                <div class="mb-4">
                    <label for="vip_amount" class="block text-gray-700 font-medium mb-2">VIP Ticket Price</label>
                    <input type="number" name="vip_amount" id="vip_amount" step="0.01" min="0" class="w-full p-3 border border-gray-300 rounded-lg" required>
                    @error('vip_amount')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>

                <div class="mb-4">
                    <label for="total_ticket_number" class="block text-gray-700 font-medium mb-2">Total Number of Tickets</label>
                    <input type="number" name="total_ticket_number" id="total_ticket_number" min="0" class="w-full p-3 border border-gray-300 rounded-lg" required>
                    @error('total_ticket_number')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>

                <button type="submit" class="w-full bg-indigo-600 text-white p-3 rounded-lg font-semibold hover:bg-indigo-700 transition duration-200 shadow-md">
                    Create Match
                </button>
            </form>
        </div>
    </div>
@endsection