@extends('layouts.app')

@section('title', 'Dashboard')

@section('content')
<div class="mb-8 flex justify-between items-center">
    <h1 class="text-4xl font-bold bg-gradient-to-r from-purple-600 to-indigo-600 bg-clip-text text-transparent">
        Dashboard
    </h1>
    <div class="flex gap-4">
        <a href="{{ route('sites.index') }}" class="px-4 py-2 bg-gray-200 hover:bg-gray-300 text-gray-800 rounded-lg transition-colors">
            Mes Sites
        </a>
        <a href="{{ route('upload.create') }}" class="px-4 py-2 bg-gradient-to-r from-orange-500 to-orange-600 text-white rounded-lg hover:from-orange-600 hover:to-orange-700 transition-all shadow-lg hover:shadow-xl">
            + Nouvelle analyse
        </a>
    </div>
</div>

@if($sites->isEmpty() && $analyses->isEmpty())
<div class="bg-white rounded-xl shadow-lg p-12 text-center">
    <p class="text-gray-600 mb-6 text-lg">Aucun site ou analyse pour le moment</p>
    <div class="flex gap-4 justify-center">
        <a href="{{ route('sites.index') }}" class="px-4 py-2 bg-gray-200 hover:bg-gray-300 text-gray-800 rounded-lg transition-colors inline-block">
            Créer un site
        </a>
        <a href="{{ route('upload.create') }}" class="px-4 py-2 bg-gradient-to-r from-orange-500 to-orange-600 text-white rounded-lg hover:from-orange-600 hover:to-orange-700 transition-all shadow-lg hover:shadow-xl inline-block">
            Analyser un fichier de logs
        </a>
    </div>
</div>
@else
@if($sites->isNotEmpty())
<div class="mb-8">
    <h2 class="text-2xl font-semibold mb-4">Mes Sites</h2>
    <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
        @php
        $colorClasses = [
            ['stat' => 'text-purple-600', 'badge' => 'bg-purple-100 text-purple-800'],
            ['stat' => 'text-indigo-600', 'badge' => 'bg-indigo-100 text-indigo-800'],
            ['stat' => 'text-cyan-600', 'badge' => 'bg-cyan-100 text-cyan-800'],
            ['stat' => 'text-pink-600', 'badge' => 'bg-pink-100 text-pink-800'],
            ['stat' => 'text-orange-600', 'badge' => 'bg-orange-100 text-orange-800'],
            ['stat' => 'text-emerald-600', 'badge' => 'bg-emerald-100 text-emerald-800'],
        ];
        $gradientBorders = [
            'from-purple-200 via-indigo-200 to-cyan-200',
            'from-pink-200 via-purple-200 to-indigo-200',
            'from-cyan-200 via-blue-200 to-indigo-200',
            'from-orange-200 via-pink-200 to-purple-200',
            'from-emerald-200 via-cyan-200 to-blue-200',
            'from-indigo-200 via-purple-200 to-pink-200',
        ];
        @endphp
        @foreach($sites->take(6) as $index => $site)
            @php
            $colorIndex = $index % count($colorClasses);
            $gradientIndex = $index % count($gradientBorders);
            $borderGradient = $gradientBorders[$gradientIndex];
            $stats = $site->getStatistics();
            @endphp
        <a href="{{ route('sites.show', $site->id) }}" class="bg-white rounded-xl shadow-lg p-6 block relative overflow-hidden group hover:shadow-xl transition-all">
            <!-- Bande colorée en haut -->
            <div class="absolute top-0 left-0 right-0 h-1 bg-gradient-to-r {{ $borderGradient }}"></div>
            
            <div class="flex justify-between items-start mb-4 pt-2">
                <div class="flex-1">
                    <div class="flex items-center gap-2 mb-2">
                        <div class="w-3 h-3 rounded-full bg-gradient-to-r {{ $borderGradient }}"></div>
                        <h3 class="text-lg font-bold text-gray-900 group-hover:text-purple-600 transition-colors">
                            {{ $site->name }}
                        </h3>
                    </div>
                    @if($site->domain)
                    <p class="text-sm text-gray-600 mb-2 flex items-center gap-1">
                        <span class="text-purple-500">🌐</span>
                        {{ $site->domain }}
                    </p>
                    @endif
                </div>
            </div>
            <div class="grid grid-cols-3 gap-3 text-center border-t border-gray-200 pt-4">
                <div class="bg-gradient-to-br from-purple-50 to-purple-100 rounded-lg p-2">
                    <div class="{{ $colorClasses[$colorIndex]['stat'] }} text-lg font-bold">
                        {{ number_format($stats['total_analyses'] ?? 0) }}
                    </div>
                    <p class="text-xs text-gray-600 mt-1 font-medium">Analyses</p>
                </div>
                <div class="bg-gradient-to-br from-indigo-50 to-indigo-100 rounded-lg p-2">
                    <div class="{{ $colorClasses[($colorIndex + 1) % count($colorClasses)]['stat'] }} text-lg font-bold">
                        {{ number_format($stats['total_hits'] ?? 0) }}
                    </div>
                    <p class="text-xs text-gray-600 mt-1 font-medium">Hits</p>
                </div>
                <div class="bg-gradient-to-br from-cyan-50 to-cyan-100 rounded-lg p-2">
                    <div class="{{ $colorClasses[($colorIndex + 2) % count($colorClasses)]['stat'] }} text-lg font-bold">
                        {{ number_format($stats['total_urls'] ?? 0) }}
                    </div>
                    <p class="text-xs text-gray-600 mt-1 font-medium">URLs</p>
                </div>
            </div>
            
            <!-- Effet de hover avec gradient -->
            <div class="absolute inset-0 bg-gradient-to-br from-purple-500/0 via-indigo-500/0 to-cyan-500/0 group-hover:from-purple-500/5 group-hover:via-indigo-500/5 group-hover:to-cyan-500/5 transition-all duration-300 pointer-events-none rounded-xl"></div>
        </a>
        @endforeach
    </div>
    @if($sites->count() > 6)
    <div class="text-center mt-6">
        <a href="{{ route('sites.index') }}" class="text-purple-600 hover:text-purple-700">
            Voir tous les sites ({{ $sites->count() }}) →
        </a>
    </div>
    @endif
</div>
@endif

@if($analyses->isNotEmpty())
<div>
    <h2 class="text-2xl font-semibold mb-4">Dernières analyses</h2>
    <div class="grid gap-4">
        @foreach($analyses as $analysis)
        <a href="{{ route('analysis.show', $analysis->id) }}" class="bg-white rounded-xl shadow-lg p-6 hover:shadow-xl transition-all block group relative overflow-hidden">
            <!-- Bande colorée à gauche -->
            <div class="absolute left-0 top-0 bottom-0 w-1 bg-gradient-to-b from-purple-500 via-indigo-500 to-cyan-500"></div>
            
            <div class="flex justify-between items-start pl-4">
                <div class="flex-1">
                    <div class="flex items-center gap-3 mb-2">
                        <h3 class="text-lg font-bold text-gray-900 group-hover:text-purple-600 transition-colors">
                            {{ $analysis->site ? $analysis->site->name : 'Analyse sans site' }}
                        </h3>
                    </div>
                    <p class="text-sm text-gray-500 mb-4 flex items-center gap-1">
                        <span class="text-purple-400">📅</span>
                        {{ $analysis->created_at->format('d/m/Y à H:i') }}
                    </p>
                    <div class="flex gap-4">
                        <div class="bg-gradient-to-br from-purple-50 to-purple-100 rounded-lg px-4 py-2 flex-1">
                            <span class="text-purple-600 text-xl font-bold">
                                {{ number_format($analysis->total_hits) }}
                            </span>
                            <p class="text-xs text-gray-600 mt-1 font-medium">Hits</p>
                        </div>
                        <div class="bg-gradient-to-br from-indigo-50 to-indigo-100 rounded-lg px-4 py-2 flex-1">
                            <span class="text-indigo-600 text-xl font-bold">
                                {{ number_format($analysis->total_urls) }}
                            </span>
                            <p class="text-xs text-gray-600 mt-1 font-medium">URLs</p>
                        </div>
                        <div class="bg-gradient-to-br from-cyan-50 to-cyan-100 rounded-lg px-4 py-2 flex-1">
                            <span class="text-cyan-600 text-xl font-bold">
                                {{ $analysis->logsIA()->distinct('bot_id')->count() }}
                            </span>
                            <p class="text-xs text-gray-600 mt-1 font-medium">Bots</p>
                        </div>
                    </div>
                </div>
                <div class="flex flex-col items-end justify-center ml-4 gap-2">
                    <span class="text-sm text-gray-600 font-medium">Analyse du fichier</span>
                    <div class="text-purple-600 text-2xl group-hover:translate-x-1 transition-transform">→</div>
                </div>
            </div>
        </a>
        @endforeach
    </div>
</div>
@endif
@endif
@endsection