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

            
            <?php if (isset($component)) { $__componentOriginalc45a5e48f24715e66ba38d7c37555f4d = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginalc45a5e48f24715e66ba38d7c37555f4d = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.job-descriptions.nav-tabs','data' => ['active' => 'library']] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('job-descriptions.nav-tabs'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes(['active' => 'library']); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginalc45a5e48f24715e66ba38d7c37555f4d)): ?>
<?php $attributes = $__attributesOriginalc45a5e48f24715e66ba38d7c37555f4d; ?>
<?php unset($__attributesOriginalc45a5e48f24715e66ba38d7c37555f4d); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalc45a5e48f24715e66ba38d7c37555f4d)): ?>
<?php $component = $__componentOriginalc45a5e48f24715e66ba38d7c37555f4d; ?>
<?php unset($__componentOriginalc45a5e48f24715e66ba38d7c37555f4d); ?>
<?php endif; ?>

            
            <a href="<?php echo e(route('dashboard.job-descriptions.index')); ?>"
                class="inline-flex items-center gap-2 text-sm text-gray-500 hover:text-gray-700 transition-colors mb-6">
                <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="M10 19l-7-7m0 0l7-7m-7 7h18" />
                </svg>
                Back to Library
            </a>

            <?php
                $jd = $jobDescription;
            ?>

            
            <div class="flex flex-col md:flex-row md:items-center justify-between gap-4 mb-8">
                <div class="md:flex block  items-center gap-3">
                    <h1 class="text-2xl font-semibold text-gray-900"><?php echo e($jd->job_title); ?></h1>
                    <?php switch($jd->status):
                        case ('approved'): ?>
                            <span
                                class="inline-flex items-center gap-1 px-3 py-1 rounded-full text-xs font-semibold bg-green-100 text-green-700 border border-green-200">
                                <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>
                                Approved
                            </span>
                        <?php break; ?>

                        <?php case ('published'): ?>
                            <span
                                class="inline-flex items-center gap-1 px-3 py-1 rounded-full text-xs font-semibold bg-blue-100 text-blue-700 border border-blue-200">
                                <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 break; ?>

                        <?php case ('unpublished'): ?>
                            <span
                                class="inline-flex items-center gap-1 px-3 py-1 rounded-full text-xs font-semibold bg-orange-100 text-orange-700 border border-orange-200">
                                Unpublished
                            </span>
                        <?php break; ?>

                        <?php default: ?>
                            <span
                                class="inline-flex items-center px-3 py-1 rounded-full text-xs font-semibold bg-gray-100 text-gray-600 border border-gray-200">Draft</span>
                    <?php endswitch; ?>
                </div>
                <div class="flex items-center gap-3">
                    <?php if(!$jd->isPublished()): ?>
                        <a href="<?php echo e(route('dashboard.job-descriptions.edit', $jd->id)); ?>"
                            class="inline-flex items-center gap-2 h-10 px-5 rounded-lg text-sm font-medium text-gray-700 bg-white border border-gray-200 hover:bg-gray-50 transition-colors">
                            <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="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" />
                            </svg>
                            Edit
                        </a>
                    <?php endif; ?>
                    <?php echo $__env->make('partials.export_pdf_blue', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>


                </div>
            </div>

            
            <p class="text-sm text-gray-500 mb-6">Job ID: <?php echo e($jd->job_id); ?></p>

            
            <?php if(session('success')): ?>
                <div x-data="{ show: true }" x-show="show" x-cloak x-init="setTimeout(() => show = false, 4000)"
                    x-transition:enter="transition ease-out duration-300"
                    x-transition:enter-start="opacity-0 transform -translate-y-2"
                    x-transition:enter-end="opacity-100 transform translate-y-0"
                    x-transition:leave="transition ease-in duration-300" x-transition:leave-start="opacity-100"
                    x-transition:leave-end="opacity-0" class="bg-green-50 border border-green-100 rounded-2xl p-5 mb-6">
                    <div class="flex items-center gap-3">
                        <div class="w-10 h-10 bg-green-100 rounded-full flex items-center justify-center shrink-0">
                            <svg class="w-5 h-5 text-green-600" 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>
                        </div>
                        <div>
                            <h4 class="text-sm font-bold text-gray-900">
                                <?php echo e(session('success')); ?>

                            </h4>
                        </div>
                    </div>
                </div>
            <?php endif; ?>

            <?php if($errors->has('error')): ?>
                <div x-data="{ show: true }" x-show="show" x-cloak x-init="setTimeout(() => show = false, 4000)"
                    x-transition:enter="transition ease-out duration-300"
                    x-transition:enter-start="opacity-0 transform -translate-y-2"
                    x-transition:enter-end="opacity-100 transform translate-y-0"
                    x-transition:leave="transition ease-in duration-300" x-transition:leave-start="opacity-100"
                    x-transition:leave-end="opacity-0" class="bg-red-50 border border-red-100 rounded-2xl p-5 mb-6">
                    <div class="flex items-center gap-3">
                        <div class="w-10 h-10 bg-red-100 rounded-full flex items-center justify-center shrink-0">
                            <svg class="w-5 h-5 text-red-600" fill="currentColor" viewBox="0 0 20 20">
                                <path fill-rule="evenodd"
                                    d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z"
                                    clip-rule="evenodd" />
                            </svg>
                        </div>

                        <h4 class="text-sm font-bold text-gray-900 leading-snug m-0">
                            <?php echo e($errors->first('error')); ?>

                        </h4>
                    </div>
                </div>
            <?php endif; ?>

            
            <div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-8">
                <div class="bg-white border border-gray-200 rounded-2xl p-5 flex items-center gap-3">
                    <div class="w-8 h-8 bg-blue-50 rounded-lg flex items-center justify-center shrink-0">
                        <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path d="M5 18.3333V3.33329C5 2.89127 5.17559 2.46734 5.48816 2.15478C5.80072 1.84222 6.22464 1.66663 6.66667 1.66663H13.3333C13.7754 1.66663 14.1993 1.84222 14.5118 2.15478C14.8244 2.46734 15 2.89127 15 3.33329V18.3333H5Z" stroke="#2F3D7E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                        <path d="M5.0013 10H3.33464C2.89261 10 2.46868 10.1756 2.15612 10.4882C1.84356 10.8007 1.66797 11.2246 1.66797 11.6667V16.6667C1.66797 17.1087 1.84356 17.5326 2.15612 17.8452C2.46868 18.1577 2.89261 18.3333 3.33464 18.3333H5.0013" stroke="#2F3D7E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                        <path d="M15 7.5H16.6667C17.1087 7.5 17.5326 7.6756 17.8452 7.98816C18.1577 8.30072 18.3333 8.72464 18.3333 9.16667V16.6667C18.3333 17.1087 18.1577 17.5326 17.8452 17.8452C17.5326 18.1577 17.1087 18.3333 16.6667 18.3333H15" stroke="#2F3D7E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                        <path d="M8.33203 5H11.6654" stroke="#2F3D7E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                        <path d="M8.33203 8.33337H11.6654" stroke="#2F3D7E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                        <path d="M8.33203 11.6666H11.6654" stroke="#2F3D7E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                        <path d="M8.33203 15H11.6654" stroke="#2F3D7E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                        </svg>
                    </div>
                    <div>
                        <p class="text-xs text-gray-500">Department</p>
                        <p class="text-sm font-semibold text-gray-900"><?php echo e($jd->department); ?></p>
                    </div>
                </div>
                <div class="bg-white border border-gray-200 rounded-2xl p-5 flex items-center gap-3">
                    <div class="w-8 h-8 bg-orange-50 rounded-lg flex items-center justify-center shrink-0">
                        <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path d="M13.3346 16.6666V3.33329C13.3346 2.89127 13.159 2.46734 12.8465 2.15478C12.5339 1.84222 12.11 1.66663 11.668 1.66663H8.33464C7.89261 1.66663 7.46869 1.84222 7.15612 2.15478C6.84356 2.46734 6.66797 2.89127 6.66797 3.33329V16.6666" stroke="#F76C5E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                        <path d="M16.668 5H3.33464C2.41416 5 1.66797 5.74619 1.66797 6.66667V15C1.66797 15.9205 2.41416 16.6667 3.33464 16.6667H16.668C17.5884 16.6667 18.3346 15.9205 18.3346 15V6.66667C18.3346 5.74619 17.5884 5 16.668 5Z" stroke="#F76C5E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                        </svg>
                    </div>
                    <div>
                        <p class="text-xs text-gray-500">Level</p>
                        <p class="text-sm font-semibold text-gray-900"><?php echo e($jd->level); ?></p>
                    </div>
                </div>
                <div class="bg-white border border-gray-200 rounded-2xl p-5 flex items-center gap-3">
                    <div class="w-8 h-8 bg-green-50 rounded-lg flex items-center justify-center shrink-0">
                        <svg class="w-4 h-4 text-green-600" fill="none" stroke="currentColor"
                            viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
                        </svg>
                    </div>
                    <div>
                        <p class="text-xs text-gray-500">Location</p>
                        <p class="text-sm font-semibold text-gray-900"><?php echo e($jd->location); ?></p>
                    </div>
                </div>
                <div class="bg-white border border-gray-200 rounded-2xl p-5 flex items-center gap-3">
                    <div class="w-8 h-8 bg-yellow-50 rounded-lg flex items-center justify-center shrink-0">
                        <svg class="w-4 h-4 text-yellow-600" 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>
                    </div>
                    <div>
                        <p class="text-xs text-gray-500">Type</p>
                        <p class="text-sm font-semibold text-gray-900"><?php echo e($jd->employment_type); ?></p>
                    </div>
                </div>
            </div>

            
            <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
                
                <div class="lg:col-span-2 space-y-6">
                    
                    <div class="bg-white border border-gray-200 rounded-2xl p-6">
                        <h3 class="text-base font-semibold text-gray-900 mb-3">Role Summary</h3>
                        <p class="text-sm text-gray-600 leading-relaxed"><?php echo e($jd->role_summary); ?></p>
                    </div>

                    
                    <div class="bg-white border border-gray-200 rounded-2xl p-6">
                        <h3 class="text-base font-semibold text-gray-900 mb-4">Key Responsibilities</h3>
                        <ul class="space-y-3">
                            <?php $__currentLoopData = $jd->responsibilities; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <li class="flex items-start gap-2 text-sm text-gray-600">
                                    <span class="w-1.5 h-1.5 bg-[#2F3D7E] rounded-full mt-1.5 shrink-0"></span>
                                    <?php echo e($item); ?>

                                </li>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </ul>
                    </div>

                    
                    <div class="bg-white border border-gray-200 rounded-2xl p-6">
                        <h3 class="text-base font-semibold text-gray-900 mb-4">Required Skills</h3>
                        <ul class="space-y-3">
                            <?php $__currentLoopData = $jd->required_skills; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <li class="flex items-start gap-2 text-sm text-gray-600">
                                    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <g clip-path="url(#clip0_888_11781)">
                                    <path d="M18.1669 8.33332C18.5474 10.2011 18.2762 12.1428 17.3984 13.8348C16.5206 15.5268 15.0893 16.8667 13.3431 17.6311C11.597 18.3955 9.64154 18.5381 7.80293 18.0353C5.96433 17.5325 4.35368 16.4145 3.23958 14.8678C2.12548 13.3212 1.57529 11.4394 1.68074 9.53615C1.78619 7.63294 2.54092 5.8234 3.81906 4.4093C5.0972 2.9952 6.8215 2.06202 8.7044 1.76537C10.5873 1.46872 12.515 1.82654 14.166 2.77916" stroke="#00A63E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M7.5 9.16659L10 11.6666L18.3333 3.33325" stroke="#00A63E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                                    </g>
                                    <defs>
                                    <clipPath id="clip0_888_11781">
                                    <rect width="20" height="20" fill="white"/>
                                    </clipPath>
                                    </defs>
                                    </svg>
                                    <?php echo e($item); ?>

                                </li>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </ul>
                    </div>

                    
                    <div class="bg-white border border-gray-200 rounded-2xl p-6">
                        <h3 class="text-base font-semibold text-gray-900 mb-4">Qualifications</h3>
                        <ul class="space-y-3">
                            <?php $__currentLoopData = $jd->qualifications; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <li class="flex items-start gap-2 text-sm text-gray-600">
                                    <span class="w-1.5 h-1.5 bg-[#2F3D7E] rounded-full mt-1.5 shrink-0"></span>
                                    <?php echo e($item); ?>

                                </li>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </ul>
                    </div>

                    
                    <div class="bg-white border border-gray-200 rounded-2xl p-6">
                        <h3 class="text-base font-semibold text-gray-900 mb-4">Key Competencies</h3>
                        <div class="flex flex-wrap gap-2">
                            <?php $__currentLoopData = $jd->competencies; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $comp): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <span
                                    class="inline-flex items-center px-3 py-1.5 bg-gray-100 text-gray-700 rounded-full text-xs font-medium border border-gray-200">
                                    <?php echo e($comp); ?>

                                </span>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </div>
                    </div>

                    
                    <?php if($jd->customSections && $jd->customSections->count()): ?>
                        <?php $__currentLoopData = $jd->customSections; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $section): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <div class="bg-white border border-gray-200 rounded-2xl p-6">

                                <h3 class="text-base font-semibold text-gray-900 mb-3">
                                    <?php echo e($section->title); ?>

                                </h3>

                                <div class="text-sm text-gray-600 leading-relaxed whitespace-pre-line">
                                    <?php echo nl2br(e($section->content)); ?>

                                </div>

                            </div>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    <?php endif; ?>
                </div>

                
                <div class="space-y-6">
                    
                    <div class="bg-white border border-gray-200 rounded-2xl p-6">
                        <h3 class="text-base font-semibold text-gray-900 mb-4">Document Information</h3>
                        <div class="space-y-4">
                            <div class="flex items-center gap-3">
                                <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="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
                                </svg>
                                <div>
                                    <p class="text-xs text-gray-500">Created By</p>
                                    <p class="text-sm font-semibold text-gray-900">
                                        <?php echo e($jd->created_by ?? 'Sarah Johnson'); ?></p>
                                </div>
                            </div>
                            <hr class="border-gray-100">
                            <div class="flex items-center gap-3">
                                <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="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
                                </svg>
                                <div>
                                    <p class="text-xs text-gray-500">Last Modified</p>
                                    <p class="text-sm font-semibold text-gray-900"><?php echo e($jd->updated_at->format('Y-m-d')); ?>

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

                            <?php if($jd->status === 'approved' || $jd->status === 'published'): ?>
                                <hr class="border-gray-100">
                                <div class="flex items-center gap-3">
                                    <svg width="14" height="14" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <g clip-path="url(#clip0_888_11781)">
                                    <path d="M18.1669 8.33332C18.5474 10.2011 18.2762 12.1428 17.3984 13.8348C16.5206 15.5268 15.0893 16.8667 13.3431 17.6311C11.597 18.3955 9.64154 18.5381 7.80293 18.0353C5.96433 17.5325 4.35368 16.4145 3.23958 14.8678C2.12548 13.3212 1.57529 11.4394 1.68074 9.53615C1.78619 7.63294 2.54092 5.8234 3.81906 4.4093C5.0972 2.9952 6.8215 2.06202 8.7044 1.76537C10.5873 1.46872 12.515 1.82654 14.166 2.77916" stroke="#00A63E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M7.5 9.16659L10 11.6666L18.3333 3.33325" stroke="#00A63E" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
                                    </g>
                                    <defs>
                                    <clipPath id="clip0_888_11781">
                                    <rect width="20" height="20" fill="white"/>
                                    </clipPath>
                                    </defs>
                                    </svg>
                                    <div>
                                        <p class="text-xs text-gray-500">Approved By</p>
                                        <p class="text-sm font-semibold text-gray-900">
                                            <?php echo e($jd->approved_by ?? 'David Martinez'); ?></p>
                                    </div>
                                </div>
                                <div class="pl-7">
                                    <p class="text-xs text-gray-500">Approval Date</p>
                                    <p class="text-sm font-semibold text-gray-900">
                                        <?php echo e($jd->approved_at ? $jd->approved_at->format('Y-m-d') : '—'); ?></p>
                                </div>
                            <?php endif; ?>
                        </div>
                    </div>

                    
                    <div class="bg-white border border-gray-200 rounded-2xl p-6">
                        <h3 class="text-base font-semibold text-gray-900 mb-4">Quick Actions</h3>
                        <div class="space-y-3">
                            <?php echo $__env->make('partials.export_doc', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                            <?php echo $__env->make('partials.export_pdf', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                            <?php echo $__env->make('partials.copy_link', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                        </div>
                    </div>

                    
                    <?php if(in_array($jd->status, ['draft', 'approved', 'published'])): ?>
                        <div x-data="{ showConfirm: false }" class="bg-white border border-gray-200 rounded-2xl p-6">
                            <h3 class="text-base font-semibold text-gray-900 mb-4">Next Steps</h3>

                            <?php if($jd->status === 'draft'): ?>
                                <form id="status-action-form" action="<?php echo e(route('dashboard.job-descriptions.submit-approval', $jd->id)); ?>" method="POST">
                                    <?php echo csrf_field(); ?>
                                </form>
                                <button @click="showConfirm = true"
                                    class="w-full inline-flex items-center justify-center gap-2 h-11 px-6 rounded-lg font-medium text-white bg-[#2F3D7E] hover:bg-[#1E2858] transition-colors mb-2">
                                    <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 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                                    </svg>
                                    Approve
                                </button>
                                <p class="text-xs text-gray-500 text-center">Complete editing before approving</p>

                                
                                <div x-show="showConfirm" x-cloak class="fixed inset-0 z-50 flex items-center justify-center p-4">
                                    <div class="fixed inset-0 bg-black/50" @click="showConfirm = false"></div>
                                    <div class="relative bg-white rounded-2xl shadow-xl w-full max-w-sm p-6 text-center">
                                        <div class="w-12 h-12 bg-blue-50 rounded-full flex items-center justify-center mx-auto mb-4">
                                            <svg class="w-6 h-6 text-[#2F3D7E]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                                            </svg>
                                        </div>
                                        <h4 class="text-lg font-semibold text-gray-900 mb-2">Approve Job Description?</h4>
                                        <p class="text-sm text-gray-500 mb-6">This will mark the job description as approved. You can then proceed to publish it.</p>
                                        <div class="flex gap-3">
                                            <button @click="showConfirm = false" class="flex-1 h-11 rounded-lg font-medium text-gray-700 border border-gray-200 hover:bg-gray-50 transition-colors text-sm">Cancel</button>
                                            <button @click="document.getElementById('status-action-form').submit()" class="flex-1 h-11 rounded-lg font-medium text-white bg-[#2F3D7E] hover:bg-[#1E2858] transition-colors text-sm">Yes, Approve</button>
                                        </div>
                                    </div>
                                </div>

                            <?php elseif($jd->status === 'approved'): ?>
                                <form id="status-action-form" action="<?php echo e(route('dashboard.job-descriptions.do-publish', $jd->id)); ?>" method="POST">
                                    <?php echo csrf_field(); ?>
                                </form>
                                <button @click="showConfirm = true"
                                    class="w-full inline-flex items-center justify-center gap-2 h-11 px-6 rounded-lg font-medium text-white bg-[#2F3D7E] hover:bg-[#1E2858] transition-colors mb-2">
                                    <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="M5 13l4 4L19 7" />
                                    </svg>
                                    Publish
                                </button>
                                <p class="text-xs text-gray-500 text-center">Publishing makes this JD publicly accessible</p>

                                
                                <div x-show="showConfirm" x-cloak class="fixed inset-0 z-50 flex items-center justify-center p-4">
                                    <div class="fixed inset-0 bg-black/50" @click="showConfirm = false"></div>
                                    <div class="relative bg-white rounded-2xl shadow-xl w-full max-w-sm p-6 text-center">
                                        <div class="w-12 h-12 bg-green-50 rounded-full flex items-center justify-center mx-auto mb-4">
                                            <svg class="w-6 h-6 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
                                            </svg>
                                        </div>
                                        <h4 class="text-lg font-semibold text-gray-900 mb-2">Publish Job Description?</h4>
                                        <p class="text-sm text-gray-500 mb-6">This will make the job description publicly accessible via a shareable link.</p>
                                        <div class="flex gap-3">
                                            <button @click="showConfirm = false" class="flex-1 h-11 rounded-lg font-medium text-gray-700 border border-gray-200 hover:bg-gray-50 transition-colors text-sm">Cancel</button>
                                            <button @click="document.getElementById('status-action-form').submit()" class="flex-1 h-11 rounded-lg font-medium text-white bg-[#2F3D7E] hover:bg-[#1E2858] transition-colors text-sm">Yes, Publish</button>
                                        </div>
                                    </div>
                                </div>

                            <?php elseif($jd->status === 'published'): ?>
                                <form id="status-action-form" action="<?php echo e(route('dashboard.job-descriptions.unpublish', $jd->id)); ?>" method="POST">
                                    <?php echo csrf_field(); ?>
                                </form>
                                <button @click="showConfirm = true"
                                    class="w-full inline-flex items-center justify-center gap-2 h-11 px-6 rounded-lg font-medium text-white bg-[#2F3D7E] hover:bg-[#1E2858] transition-colors mb-2">
                                    <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="M5 13l4 4L19 7" />
                                    </svg>
                                    Unpublish
                                </button>
                                <p class="text-xs text-gray-500 text-center">This will revert the JD to approved status</p>

                                
                                <div x-show="showConfirm" x-cloak class="fixed inset-0 z-50 flex items-center justify-center p-4">
                                    <div class="fixed inset-0 bg-black/50" @click="showConfirm = false"></div>
                                    <div class="relative bg-white rounded-2xl shadow-xl w-full max-w-sm p-6 text-center">
                                        <div class="w-12 h-12 bg-yellow-50 rounded-full flex items-center justify-center mx-auto mb-4">
                                            <svg class="w-6 h-6 text-yellow-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
                                            </svg>
                                        </div>
                                        <h4 class="text-lg font-semibold text-gray-900 mb-2">Unpublish Job Description?</h4>
                                        <p class="text-sm text-gray-500 mb-6">This will remove public access and revert the job description to approved status.</p>
                                        <div class="flex gap-3">
                                            <button @click="showConfirm = false" class="flex-1 h-11 rounded-lg font-medium text-gray-700 border border-gray-200 hover:bg-gray-50 transition-colors text-sm">Cancel</button>
                                            <button @click="document.getElementById('status-action-form').submit()" class="flex-1 h-11 rounded-lg font-medium text-white bg-red-600 hover:bg-red-700 transition-colors text-sm">Yes, Unpublish</button>
                                        </div>
                                    </div>
                                </div>
                            <?php endif; ?>
                        </div>
                    <?php endif; ?>
                </div>
            </div>
        </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_dev/resources/views/dashboard/job-descriptions/detail.blade.php ENDPATH**/ ?>