@extends('layouts.app')

@section('title', $contest->title . ' - ' . __('radio.contests') . ' - ' . config('app.name'))

@section('content')
<div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
    <div class="bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
        <div class="p-6 text-white">
            <div class="mb-6">
                <a href="{{ route('radio.contests.index') }}" class="text-indigo-400 hover:text-indigo-300 flex items-center">
                    <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
                    {{ __('radio.back_overview') }}
                </a>
            </div>

            <h1 class="text-3xl font-bold mb-4">{{ $contest->title }}</h1>
            
            <div class="prose prose-invert max-w-none mb-8">
                {!! nl2br(e($contest->description)) !!}
            </div>

            <div class="bg-gray-700 p-6 rounded-lg mb-8">
                <h3 class="text-xl font-semibold mb-4">{{ __('radio.information') }}</h3>
                <ul class="space-y-2 text-gray-300">
                    <li><strong>{{ __('radio.start_date') }}:</strong> {{ $contest->starts_at->format('d-m-Y H:i') }}</li>
                    <li><strong>{{ __('radio.end_date') }}:</strong> {{ $contest->ends_at->format('d-m-Y H:i') }}</li>
                    <li><strong>{{ __('radio.participants') }}:</strong> {{ $contest->entryCount() }}</li>
                </ul>
            </div>

            <div class="bg-gray-700 p-6 rounded-lg">
                <p class="text-center text-gray-300">{{ __('radio.participate_button') }} form placeholder.</p>
            </div>
        </div>
    </div>
</div>
@endsection