@extends('layouts.admin')
@section('title', 'Dashboard')
@section('header', 'Dashboard')

@section('content')
{{-- Estado del torneo --}}
<div class="mb-6 bg-white rounded-xl shadow-sm border p-5 flex items-center justify-between">
    <div>
        <div class="text-xs text-gray-500 uppercase tracking-wide">Torneo</div>
        <div class="text-xl font-bold text-gray-800 mt-0.5">{{ $config->nombre }}</div>
    </div>
    <span class="px-3 py-1 rounded-full text-sm font-medium
        @if($config->status === 'activo') bg-green-100 text-green-800
        @elseif($config->status === 'cerrado') bg-red-100 text-red-800
        @else bg-yellow-100 text-yellow-800 @endif">
        {{ ucfirst($config->status) }}
    </span>
</div>

{{-- Métricas --}}
<div class="grid grid-cols-2 md:grid-cols-3 gap-4 mb-6">
    @php
    $cards = [
        ['label' => 'Parejas activas',    'value' => $resumen['parejas_activas'],    'color' => 'blue'],
        ['label' => 'En sala de espera',  'value' => $resumen['en_espera'],          'color' => 'gray'],
        ['label' => 'Sin tokens',         'value' => $resumen['sin_tokens'],         'color' => $resumen['sin_tokens'] > 0 ? 'red' : 'green'],
        ['label' => 'Encuentros activos', 'value' => $resumen['encuentros_activos'], 'color' => 'indigo'],
        ['label' => 'Disputas pendientes','value' => $resumen['en_disputa'],         'color' => $resumen['en_disputa'] > 0 ? 'orange' : 'green'],
        ['label' => 'Sin resultado +24h', 'value' => $resumen['sin_resultado'],      'color' => $resumen['sin_resultado'] > 0 ? 'red' : 'green'],
    ];
    @endphp

    @foreach($cards as $card)
    <div class="bg-white rounded-xl border shadow-sm p-4">
        <div class="text-2xl font-bold text-gray-800">{{ $card['value'] }}</div>
        <div class="text-xs text-gray-500 mt-0.5">{{ $card['label'] }}</div>
    </div>
    @endforeach
</div>

{{-- Alertas de amonestados --}}
@if($amonestados->count() > 0)
<div class="bg-red-50 border border-red-200 rounded-xl p-4 mb-6">
    <h2 class="font-semibold text-red-800 mb-3">⚠️ Parejas con amonestaciones consecutivas</h2>
    <div class="space-y-2">
        @foreach($amonestados as $p)
        <div class="flex items-center justify-between bg-white rounded-lg px-4 py-2 border border-red-100">
            <span class="font-medium text-gray-800">{{ $p->apodo }}</span>
            <div class="flex items-center gap-3">
                <span class="text-sm text-red-600">{{ $p->consecutivas }} amonestaciones</span>
                <a href="{{ route('admin.parejas.edit', $p) }}" class="text-xs bg-red-600 text-white px-2 py-1 rounded hover:bg-red-700">Ver</a>
            </div>
        </div>
        @endforeach
    </div>
</div>
@endif

{{-- Accesos rápidos --}}
<div class="grid grid-cols-2 md:grid-cols-4 gap-3">
    <a href="{{ route('admin.parejas.create') }}" class="bg-white border rounded-xl p-4 text-center hover:shadow-md transition">
        <div class="text-2xl mb-1">➕</div>
        <div class="text-sm font-medium">Alta de pareja</div>
    </a>
    <a href="{{ route('admin.resultados.index') }}" class="bg-white border rounded-xl p-4 text-center hover:shadow-md transition">
        <div class="text-2xl mb-1">📋</div>
        <div class="text-sm font-medium">Resultados</div>
    </a>
    <a href="{{ route('admin.niveles.index') }}" class="bg-white border rounded-xl p-4 text-center hover:shadow-md transition">
        <div class="text-2xl mb-1">🏆</div>
        <div class="text-sm font-medium">Niveles</div>
    </a>
    <a href="{{ route('admin.tokens.index') }}" class="bg-white border rounded-xl p-4 text-center hover:shadow-md transition">
        <div class="text-2xl mb-1">🪙</div>
        <div class="text-sm font-medium">Tokens</div>
    </a>
</div>
@endsection