@extends('layouts.partner')

@section('title', 'Partner Dashboard - M-Ajira')

@section('content')

<!-- Hero Section -->
<section class="animated-bg py-16 relative overflow-hidden">
    <div class="absolute inset-0 overflow-hidden pointer-events-none">
        <div class="absolute top-10 left-10 w-64 h-64 bg-white/10 rounded-full blur-3xl float-animation"></div>
        <div class="absolute bottom-10 right-10 w-80 h-80 bg-white/10 rounded-full blur-3xl float-animation" style="animation-delay: 1s;"></div>
    </div>

    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
        <div class="glass p-8 rounded-[3rem]">
            <h1 class="text-6xl font-black text-white mb-3">Partner Dashboard</h1>
            <p class="text-2xl text-white/90">Welcome back, {{ $partner->partner_name ?? $partner->company_name }}! 👋</p>
        </div>
    </div>
</section>

<!-- Stats Cards -->
<section class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 -mt-8 mb-12">
    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-6">
        
        <div class="glass-card rounded-3xl p-8 card-hover">
            <div class="flex items-center justify-between mb-4">
                <div>
                    <p class="text-sm font-bold text-gray-500 uppercase mb-2">Total Demands</p>
                    <h3 class="text-5xl font-black bg-gradient-to-r from-blue-600 to-cyan-600 bg-clip-text text-transparent">
                        {{ $stats['total_demands'] }}
                    </h3>
                </div>
                <div class="w-16 h-16 bg-gradient-to-br from-blue-500 to-cyan-500 rounded-2xl flex items-center justify-center text-3xl">
                    💼
                </div>
            </div>
        </div>

        <div class="glass-card rounded-3xl p-8 card-hover">
            <div class="flex items-center justify-between mb-4">
                <div>
                    <p class="text-sm font-bold text-gray-500 uppercase mb-2">Open Demands</p>
                    <h3 class="text-5xl font-black bg-gradient-to-r from-green-600 to-emerald-600 bg-clip-text text-transparent">
                        {{ $stats['open_demands'] }}
                    </h3>
                </div>
                <div class="w-16 h-16 bg-gradient-to-br from-green-500 to-emerald-500 rounded-2xl flex items-center justify-center text-3xl">
                    ✅
                </div>
            </div>
        </div>

        <div class="glass-card rounded-3xl p-8 card-hover">
            <div class="flex items-center justify-between mb-4">
                <div>
                    <p class="text-sm font-bold text-gray-500 uppercase mb-2">Total Positions</p>
                    <h3 class="text-5xl font-black bg-gradient-to-r from-purple-600 to-pink-600 bg-clip-text text-transparent">
                        {{ $stats['total_positions'] }}
                    </h3>
                </div>
                <div class="w-16 h-16 bg-gradient-to-br from-purple-500 to-pink-500 rounded-2xl flex items-center justify-center text-3xl">
                    🎯
                </div>
            </div>
        </div>

        <div class="glass-card rounded-3xl p-8 card-hover">
            <div class="flex items-center justify-between mb-4">
                <div>
                    <p class="text-sm font-bold text-gray-500 uppercase mb-2">Filled</p>
                    <h3 class="text-5xl font-black bg-gradient-to-r from-orange-600 to-red-600 bg-clip-text text-transparent">
                        {{ $stats['filled_positions'] }}
                    </h3>
                </div>
                <div class="w-16 h-16 bg-gradient-to-br from-orange-500 to-red-500 rounded-2xl flex items-center justify-center text-3xl">
                    ⭐
                </div>
            </div>
        </div>

        <div class="glass-card rounded-3xl p-8 card-hover">
            <div class="flex items-center justify-between mb-4">
                <div>
                    <p class="text-sm font-bold text-gray-500 uppercase mb-2">Applicants</p>
                    <h3 class="text-5xl font-black bg-gradient-to-r from-pink-600 to-purple-600 bg-clip-text text-transparent">
                        {{ $stats['total_applicants'] }}
                    </h3>
                </div>
                <div class="w-16 h-16 bg-gradient-to-br from-pink-500 to-purple-500 rounded-2xl flex items-center justify-center text-3xl">
                    👥
                </div>
            </div>
        </div>
    </div>
</section>

<!-- Main Content -->
<section class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pb-20">
    <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
        
        <!-- Quick Actions -->
        <div class="glass-card rounded-3xl p-8">
            <h3 class="text-2xl font-black text-gray-800 mb-6 flex items-center">
                <span class="text-3xl mr-3">⚡</span>
                Quick Actions
            </h3>
            <div class="space-y-4">
                <a href="{{ route('partner.demands.create') }}" 
                    class="block btn-primary text-white font-bold py-4 px-6 rounded-2xl text-center hover:shadow-2xl">
                    ➕ Post New Job Demand
                </a>
                <a href="{{ route('partner.demands.index') }}" 
                    class="block bg-gray-800 text-white font-bold py-4 px-6 rounded-2xl text-center hover:bg-gray-700">
                    📋 View All Demands
                </a>
            </div>
        </div>

        <!-- Recent Demands -->
        <div class="lg:col-span-2 glass-card rounded-3xl p-8">
            <h3 class="text-2xl font-black text-gray-800 mb-6 flex items-center">
                <span class="text-3xl mr-3">📋</span>
                Recent Demands
            </h3>
            <div class="space-y-4">
                @forelse($recent_demands as $demand)
                    <div class="bg-gradient-to-br from-purple-50 to-pink-50 border-2 border-purple-200 rounded-2xl p-6 card-hover">
                        <div class="flex justify-between items-start mb-3">
                            <div>
                                <h4 class="font-black text-xl text-gray-800">{{ $demand->demand_sn }}</h4>
                                <p class="text-gray-600 font-semibold">{{ $demand->country }} • {{ $demand->positions_available }} positions</p>
                                <p class="text-sm text-gray-500 mt-1">{{ $demand->candidates_count }} applicants</p>
                            </div>
                            <span class="px-4 py-2 rounded-full text-sm font-bold
                                {{ $demand->status === 'open' ? 'bg-green-100 text-green-800' : 'bg-gray-100 text-gray-800' }}">
                                {{ ucfirst($demand->status) }}
                            </span>
                        </div>
                        <a href="{{ route('partner.demands.show', $demand) }}" 
                            class="inline-block text-purple-600 font-bold hover:text-purple-800">
                            View Details →
                        </a>
                    </div>
                @empty
                    <div class="text-center py-12">
                        <div class="text-8xl mb-4">📭</div>
                        <p class="text-gray-500 text-xl mb-6">No demands yet. Post your first job!</p>
                        <a href="{{ route('partner.demands.create') }}" class="inline-block btn-primary text-white font-bold px-8 py-3 rounded-xl">
                            Post First Job →
                        </a>
                    </div>
                @endforelse
            </div>
        </div>
    </div>
</section>

@endsection