<?php $__env->startSection('content'); ?>
    <div class="w-full md:min-h-screen bg-gray-50 pt-[20px] pb-20">
        <div class="md:max-w-[90%] max-w-[90%] mx-auto px-6">

            
            <div class="mb-8 flex md:flex-row flex-col items-center justify-between">
                <div class="md:mb-0 mb-2">
                    <h1 class="text-3xl font-bold text-gray-900 mb-2">Your Job Experiences</h1>
                    <p class="text-gray-500">Manage and track your salary history</p>
                </div>
                <a href="<?php echo e(route('dashboard.job-experiences.create')); ?>"
                   class="inline-flex items-center justify-center h-12 px-6 rounded-lg font-medium transition-all duration-200 text-base bg-[#2F3D7E] hover:bg-[#2F3D7E]/90 text-white shadow-sm active:scale-[0.98]">
                    <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
                    </svg>
                    Add Job / Salary
                </a>
            </div>

            <?php if($experiences->isEmpty()): ?>
                
                <div class="bg-white rounded-[20px] border border-gray-100 shadow-sm p-12 text-center">
                    <div class="w-20 h-20 bg-blue-50 rounded-xl flex items-center justify-center mx-auto mb-6">
                        <svg class="w-10 h-10 text-[#2F3D7E]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13.255A23.931 23.931 0 0112 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 00-2-2h-4a2 2 0 00-2 2v2m4 6h.01M5 20h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
                        </svg>
                    </div>
                    <h3 class="text-2xl font-bold text-gray-900 mb-3">No job experiences yet</h3>
                    <p class="text-gray-500 mb-8 max-w-md mx-auto">
                        Start tracking your salary history and career progression by adding your first job experience.
                    </p>
                    <a href="<?php echo e(route('dashboard.job-experiences.create')); ?>"
                       class="inline-flex items-center justify-center h-12 px-8 rounded-lg font-medium transition-all duration-200 text-base bg-[#2F3D7E] hover:bg-[#2F3D7E]/90 text-white shadow-lg shadow-blue-900/10 active:scale-[0.98]">
                        <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
                        </svg>
                        Add Your First Job
                    </a>
                </div>
            <?php else: ?>
                
                <?php if($experiences->count() > 0): ?>
                <div class="mt-8 bg-gradient-to-r from-[#2F3D7E] to-[#3b4ca8] rounded-[20px] p-6 md:p-8 text-white shadow-xl relative overflow-hidden">
                    <div class="absolute top-0 right-0 w-64 h-64 bg-white/10 rounded-full -translate-y-1/2 translate-x-1/4 blur-3xl"></div>
                    <div class="relative z-10 grid grid-cols-1 md:grid-cols-3 gap-6">
                        <div>
                            <p class="text-blue-200 text-sm font-medium mb-1 uppercase tracking-wide">Total Experiences</p>
                            <p class="text-4xl font-bold"><?php echo e($experiences->count()); ?></p>
                        </div>
                        <div>
                            <p class="text-blue-200 text-sm font-medium mb-1 uppercase tracking-wide">Current Position</p>
                            <p class="text-4xl font-bold"><?php echo e($experiences->where('still_employed', true)->count()); ?></p>
                        </div>
                        <div>
                            <p class="text-blue-200 text-sm font-medium mb-1 uppercase tracking-wide">Published</p>
                            <p class="text-4xl font-bold"><?php echo e($experiences->where('is_published', true)->count()); ?></p>
                        </div>
                    </div>
                </div>
                <?php endif; ?>

                
                <div class="mt-8 grid md:grid-cols-2 gap-6">
                    <?php $__currentLoopData = $experiences; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $experience): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <a href="<?php echo e(route('dashboard.job-experiences.show', $experience->id)); ?>"
                       class="bg-white rounded-[20px] border border-gray-100 shadow-sm hover:shadow-xl hover:-translate-y-1 transition-all duration-300 overflow-hidden block relative group">

                        
                        <div class="absolute top-0 right-0 w-48 h-48 bg-blue-50/50 rounded-full -translate-y-1/2 translate-x-1/3 blur-3xl pointer-events-none opacity-0 group-hover:opacity-100 transition-opacity"></div>

                        
                        <div class="p-6 md:p-8 relative z-10">

                            
                            <div class="flex items-start justify-between mb-4">
                                <div class="flex-1">
                                    <h2 class="text-xl font-bold text-gray-900 mb-2 group-hover:text-[#2F3D7E] transition-colors">
                                        <?php echo e($experience->job_title); ?>

                                    </h2>
                                    <div class="flex items-center gap-2 text-gray-600 mb-3">
                                        <svg class="w-4 h-4 text-gray-400" fill="currentColor" viewBox="0 0 20 20">
                                            <path fill-rule="evenodd" d="M4 4a2 2 0 012-2h8a2 2 0 012 2v12a1 1 0 110 2h-3a1 1 0 01-1-1v-2a1 1 0 00-1-1H9a1 1 0 00-1 1v2a1 1 0 01-1 1H4a1 1 0 110-2V4zm3 1h2v2H7V5zm2 4H7v2h2V9zm2-4h2v2h-2V5zm2 4h-2v2h2V9z" clip-rule="evenodd" />
                                        </svg>
                                        <span class="font-medium text-sm"><?php echo e($experience->company_name); ?></span>
                                        <span class="text-gray-400">•</span>
                                        <span class="text-sm"><?php echo e($experience->level); ?></span>
                                    </div>
                                </div>

                                <?php if($experience->is_published): ?>
                                    <span class="bg-green-100 text-green-700 px-3 py-1 rounded-full text-xs font-bold flex items-center gap-1 border border-green-200 shrink-0">
                                        <svg class="w-3 h-3" fill="currentColor" viewBox="0 0 20 20">
                                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd" />
                                        </svg>
                                        Published
                                    </span>
                                <?php else: ?>
                                    <span class="bg-gray-100 text-gray-600 px-3 py-1 rounded-full text-xs font-bold flex items-center gap-1 border border-gray-200 shrink-0">
                                        <svg class="w-3 h-3" fill="currentColor" viewBox="0 0 20 20">
                                            <path fill-rule="evenodd" d="M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z" clip-rule="evenodd" />
                                        </svg>
                                        Private
                                    </span>
                                <?php endif; ?>
                            </div>

                            
                            <div class="mb-6 p-5 bg-gradient-to-r from-blue-50 to-white border border-blue-100 rounded-2xl">
                                <div class="flex justify-between items-center">
                                    <div>
                                        <p class="text-xs text-[#2F3D7E] font-bold uppercase tracking-wide mb-1">Annual Salary</p>
                                        <div class="flex items-baseline gap-1">
                                            <span class="text-2xl font-bold text-[#2F3D7E]">
                                                <?php echo e($experience->currency); ?> <?php echo e(number_format($experience->annual_base_salary)); ?>

                                            </span>
                                            <span class="text-gray-500 text-sm font-medium">/ year</span>
                                        </div>
                                    </div>
                                    <div class="h-12 w-12 rounded-full bg-white flex items-center justify-center shadow-sm text-2xl">
                                        💰
                                    </div>
                                </div>
                            </div>

                            
                            <div class="grid grid-cols-2 gap-4 mb-6">
                                <div>
                                    <p class="text-xs text-gray-500 font-medium mb-1 uppercase tracking-wide">Status</p>
                                    <p class="text-sm font-bold text-gray-900 flex items-center gap-2">
                                        <?php if($experience->still_employed): ?>
                                            <span class="w-2 h-2 bg-green-500 rounded-full"></span>
                                            Currently Working
                                        <?php else: ?>
                                            <span class="w-2 h-2 bg-gray-400 rounded-full"></span>
                                            Past Position
                                        <?php endif; ?>
                                    </p>
                                </div>
                                <div>
                                    <p class="text-xs text-gray-500 font-medium mb-1 uppercase tracking-wide">Work Type</p>
                                    <p class="text-sm font-bold text-gray-900">
                                        <?php echo e(ucfirst(str_replace('_', ' ', $experience->work_status))); ?>

                                    </p>
                                </div>
                            </div>

                            
                            <div class="flex items-center gap-2 text-sm text-gray-600 mb-6">
                                <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
                                </svg>
                                <span class="font-medium">
                                    <?php echo e(date('M Y', mktime(0, 0, 0, $experience->employment_month, 1, $experience->employment_year))); ?>

                                </span>
                                <span>→</span>
                                <span class="font-medium">
                                    <?php if($experience->still_employed): ?>
                                        Present
                                    <?php else: ?>
                                        <?php echo e(date('M Y', mktime(0, 0, 0, $experience->end_month, 1, $experience->end_year))); ?>

                                    <?php endif; ?>
                                </span>
                                <span class="text-gray-400 ml-2">
                                    <?php
        $startDate = \Carbon\Carbon::create($experience->employment_year, $experience->employment_month, 1);
        $endDate = $experience->still_employed
            ? \Carbon\Carbon::now()
            : \Carbon\Carbon::create($experience->end_year, $experience->end_month, 1);
        $duration = $startDate->diffInMonths($endDate);
        $years = floor($duration / 12);
        $months = $duration % 12;
                                    ?>
                                    (<?php echo e($years > 0 ? $years . 'y ' : ''); ?><?php echo e($months); ?>m)
                                </span>
                            </div>

                            
                            <div class="flex items-center justify-between pt-4 border-t border-gray-100">
                                <div class="flex items-center gap-2 text-sm text-gray-500">
                                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
                                    </svg>
                                    Updated <?php echo e($experience->updated_at->diffForHumans()); ?>

                                </div>
                                <span class="text-[#2F3D7E] font-medium text-sm flex items-center gap-2 group-hover:gap-3 transition-all">
                                    View Details
                                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
                                    </svg>
                                </span>
                            </div>
                        </div>
                    </a>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </div>


            <?php endif; ?>

        </div>
    </div>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.dashboard', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH /var/www/ratemypay/resources/views/dashboard/job-experiences/index.blade.php ENDPATH**/ ?>