@extends('layouts.applicant.applicant')

@section('title', 'Applicant Dashboard')

@section('content')
<div class="container-fluid">
    <!-- Welcome Section -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card border-0 bg-gradient-primary text-white">
                <div class="card-body p-4">
                    <div class="row align-items-center">
                        <div class="col-md-8">
                            <h1 class="h3 mb-2">Welcome back, {{ auth()->user()->name }}!</h1>
                            <p class="mb-0 opacity-75">Track your applications and discover new opportunities</p>
                        </div>
                        <div class="col-md-4 text-end">
                            <i class="fas fa-user-graduate fa-3x opacity-50"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Statistics Cards -->
    <div class="row mb-4">
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card border-left-primary shadow h-100 py-2">
                <div class="card-body">
                    <div class="row no-gutters align-items-center">
                        <div class="col mr-2">
                            <div class="text-xs font-weight-bold text-primary text-uppercase mb-1">
                                Total Applications
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $stats['total_applications'] }}</div>
                        </div>
                        <div class="col-auto">
                            <i class="fas fa-file-alt fa-2x text-gray-300"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card border-left-warning shadow h-100 py-2">
                <div class="card-body">
                    <div class="row no-gutters align-items-center">
                        <div class="col mr-2">
                            <div class="text-xs font-weight-bold text-warning text-uppercase mb-1">
                                Draft Applications
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $stats['draft_applications'] }}</div>
                        </div>
                        <div class="col-auto">
                            <i class="fas fa-edit fa-2x text-gray-300"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card border-left-success shadow h-100 py-2">
                <div class="card-body">
                    <div class="row no-gutters align-items-center">
                        <div class="col mr-2">
                            <div class="text-xs font-weight-bold text-success text-uppercase mb-1">
                                Submitted Applications
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $stats['submitted_applications'] }}</div>
                        </div>
                        <div class="col-auto">
                            <i class="fas fa-check-circle fa-2x text-gray-300"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card border-left-info shadow h-100 py-2">
                <div class="card-body">
                    <div class="row no-gutters align-items-center">
                        <div class="col mr-2">
                            <div class="text-xs font-weight-bold text-info text-uppercase mb-1">
                                Under Review
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $stats['under_review'] }}</div>
                        </div>
                        <div class="col-auto">
                            <i class="fas fa-search fa-2x text-gray-300"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Recent Applications -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card shadow">
                <div class="card-header py-3 d-flex justify-content-between align-items-center">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-file-alt me-2"></i>Recent Applications
                    </h6>
                    <a href="{{ route('applicant.applications.index') }}" class="btn btn-primary btn-sm">
                        <i class="fas fa-eye me-1"></i>View All
                    </a>
                </div>
                <div class="card-body">
                    @if($recentApplications->count() > 0)
                        <div class="table-responsive">
                            <table class="table table-bordered table-hover">
                                <thead class="table-light">
                                    <tr>
                                        <th>Application #</th>
                                        <th>Position</th>
                                        <th>Department</th>
                                        <th>Status</th>
                                        <th>Progress</th>
                                        <th>Submitted</th>
                                        <th>Actions</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($recentApplications as $application)
                                    <tr>
                                        <td>
                                            <span class="font-weight-bold text-primary">
                                                {{ $application->application_number }}
                                            </span>
                                        </td>
                                        <td>{{ $application->advertisement->title ?? 'N/A' }}</td>
                                        <td>{{ $application->advertisement->department ? $application->advertisement->department->name : 'N/A' }}</td>
                                        <td>
                                            @php
                                                $statusColors = [
                                                    'draft' => 'warning',
                                                    'submitted' => 'success',
                                                    'under_review' => 'info',
                                                    'shortlisted' => 'primary',
                                                    'rejected' => 'danger'
                                                ];
                                                $color = $statusColors[$application->status] ?? 'secondary';
                                            @endphp
                                            <span class="badge badge-{{ $color }}">
                                                {{ ucfirst($application->status) }}
                                            </span>
                                        </td>
                                        <td>
                                            @php
                                                $percentage = method_exists($application, 'getCompletionPercentage') 
                                                    ? $application->getCompletionPercentage() 
                                                    : 0;
                                            @endphp
                                            <div class="progress" style="height: 20px;">
                                                <div class="progress-bar bg-{{ $percentage == 100 ? 'success' : 'primary' }}" 
                                                     role="progressbar" 
                                                     style="width: {{ $percentage }}%"
                                                     aria-valuenow="{{ $percentage }}" 
                                                     aria-valuemin="0" 
                                                     aria-valuemax="100">
                                                    {{ $percentage }}%
                                                </div>
                                            </div>
                                        </td>
                                        <td>
                                            @php
                                                $submissionDate = $application->getActualSubmissionDate();
                                            @endphp
                                            @if($application->status === 'submitted' && $submissionDate)
                                                {{ $submissionDate->format('M d, Y') }}
                                                @if(!$application->submitted_at)
                                                    <small class="d-block text-warning">Auto-detected</small>
                                                @endif
                                            @elseif($application->status === 'draft')
                                                <span class="text-muted">Not submitted</span>
                                            @else
                                                <span class="text-info">{{ $application->created_at->format('M d, Y') }}</span>
                                                <small class="d-block text-muted">{{ ucfirst($application->status) }}</small>
                                            @endif
                                        </td>
                                        <td>
                                            <div class="btn-group" role="group">
                                                @if($application->status === 'draft')
                                                    <a href="{{ route('applicant.applications.edit', $application) }}" 
                                                       class="btn btn-sm btn-outline-primary" title="Continue Application">
                                                        <i class="fas fa-edit"></i>
                                                    </a>
                                                @else
                                                    <a href="{{ route('applicant.applications.show', $application) }}" 
                                                       class="btn btn-sm btn-outline-info" title="View Application">
                                                        <i class="fas fa-eye"></i>
                                                    </a>
                                                @endif
                                                
                                                @if($application->status === 'submitted')
                                                    <a href="{{ route('applicant.applications.download', $application) }}" 
                                                       class="btn btn-sm btn-outline-success" title="Download PDF">
                                                        <i class="fas fa-download"></i>
                                                    </a>
                                                @endif
                                            </div>
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    @else
                        <div class="text-center py-5">
                            <i class="fas fa-file-alt fa-4x text-muted mb-3"></i>
                            <h5 class="text-muted">No Applications Yet</h5>
                            <p class="text-muted mb-4">You haven't applied for any positions yet. Start by browsing available positions below.</p>
                            <a href="#available-positions" class="btn btn-primary">
                                <i class="fas fa-search me-2"></i>Browse Positions
                            </a>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>

    <!-- Available Positions -->
    <div class="row" id="available-positions">
        <div class="col-12">
            <div class="card shadow">
                <div class="card-header py-3 d-flex justify-content-between align-items-center">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-briefcase me-2"></i>Available Positions
                    </h6>
                    <a href="{{ route('welcome') }}#recruitments" class="btn btn-outline-primary btn-sm">
                        <i class="fas fa-external-link-alt me-1"></i>View All Openings
                    </a>
                </div>
                <div class="card-body">
                    @if($available_advertisements->count() > 0)
                        <div class="row">
                            @foreach($available_advertisements->take(6) as $advertisement)
                            <div class="col-md-6 col-lg-4 mb-4">
                                <div class="card h-100 border-left-primary">
                                    <div class="card-body">
                                        <h5 class="card-title text-primary">{{ $advertisement->title }}</h5>
                                        <h6 class="card-subtitle mb-2 text-muted">
                                            <i class="fas fa-building me-1"></i>{{ $advertisement->department ? $advertisement->department->name : 'N/A' }}
                                        </h6>
                                        <p class="card-text">{{ Str::limit($advertisement->description, 100) }}</p>
                                        
                                        <div class="mb-3">
                                            <small class="text-muted d-block">
                                                <i class="fas fa-calendar me-1"></i>
                                                Deadline: {{ $advertisement->application_end_date->format('M d, Y') }}
                                            </small>
                                            @if($advertisement->salary_min && $advertisement->salary_max)
                                            <small class="text-muted d-block">
                                                <i class="fas fa-money-bill-wave me-1"></i>
                                                ₹{{ number_format($advertisement->salary_min) }} - ₹{{ number_format($advertisement->salary_max) }}
                                            </small>
                                            @endif
                                            <small class="text-muted d-block">
                                                <i class="fas fa-users me-1"></i>
                                                {{ $advertisement->number_of_posts }} Position(s)
                                            </small>
                                        </div>
                                    </div>
                                    <div class="card-footer bg-transparent">
                                        <div class="d-grid gap-2">
                                            <a href="{{ route('recruitment.show', $advertisement) }}" 
                                               class="btn btn-outline-primary btn-sm">
                                                <i class="fas fa-eye me-1"></i>View Details
                                            </a>
                                            <a href="{{ route('applicant.applications.create') }}?advertisement_id={{ $advertisement->id }}" 
                                               class="btn btn-primary btn-sm">
                                                <i class="fas fa-paper-plane me-1"></i>Apply Now
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            @endforeach
                        </div>
                        
                        @if($available_advertisements->count() > 6)
                        <div class="text-center mt-3">
                            <a href="{{ route('welcome') }}#recruitments" class="btn btn-primary">
                                <i class="fas fa-plus me-2"></i>View {{ $available_advertisements->count() - 6 }} More Positions
                            </a>
                        </div>
                        @endif
                    @else
                        <div class="text-center py-5">
                            <i class="fas fa-search fa-4x text-muted mb-3"></i>
                            <h5 class="text-muted">No Available Positions</h5>
                            <p class="text-muted mb-4">There are no open positions available at the moment that you haven't already applied for.</p>
                            <a href="{{ route('welcome') }}" class="btn btn-outline-primary">
                                <i class="fas fa-home me-2"></i>Visit Homepage
                            </a>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
</div>

<style>
.bg-gradient-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.border-left-primary {
    border-left: 4px solid #667eea !important;
}

.border-left-warning {
    border-left: 4px solid #f6c23e !important;
}

.border-left-success {
    border-left: 4px solid #1cc88a !important;
}

.border-left-info {
    border-left: 4px solid #36b9cc !important;
}

.card {
    transition: all 0.3s ease;
}

.card:hover {
    transform: translateY(-2px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.table th {
    border-top: none;
    font-weight: 600;
    color: #5a5c69;
}

.badge {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
}

.btn-group .btn {
    margin-right: 2px;
}

.progress {
    border-radius: 10px;
    overflow: hidden;
}

.progress-bar {
    border-radius: 10px;
}
</style>
@endsection

@push('scripts')
<script>
// Auto-refresh dashboard every 5 minutes
setTimeout(function() {
    location.reload();
}, 300000);

// Smooth scroll to available positions
document.addEventListener('DOMContentLoaded', function() {
    const links = document.querySelectorAll('a[href="#available-positions"]');
    links.forEach(link => {
        link.addEventListener('click', function(e) {
            e.preventDefault();
            document.getElementById('available-positions').scrollIntoView({
                behavior: 'smooth'
            });
        });
    });
});
</script>
@endpush