


<?php if (isset($component)) { $__componentOriginalf2a1b2b34b0a376d40858ac9c2a946a5 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginalf2a1b2b34b0a376d40858ac9c2a946a5 = $attributes; } ?>
<?php $component = App\View\Components\SiteLayout::resolve(['title' => ''.e($category->name).' - Mentorship Programmes','metaDescription' => ''.e(Str::limit($category->description ?? 'Browse mentorship programmes in ' . $category->name, 160)).'','showBreadcrumbs' => true] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('site-layout'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\App\View\Components\SiteLayout::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes([]); ?>

    
    <div class="bg-gradient-to-r from-green-600 to-green-700 text-white">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
            <div class="flex flex-col md:flex-row md:items-center md:justify-between gap-6">
                <div class="flex items-center">
                    <div class="w-16 h-16 rounded-full bg-white bg-opacity-20 flex items-center justify-center mr-4">
                        <i class="<?php echo e($category->icon ?? 'fas fa-folder'); ?> text-3xl"></i>
                    </div>
                    <div>
                        <h1 class="text-3xl md:text-4xl font-bold">
                            <?php echo e($category->name); ?>

                        </h1>
                        <?php if($category->description): ?>
                            <p class="text-green-100 mt-2 max-w-5xl">
                                <?php echo e($category->description); ?>

                            </p>
                        <?php endif; ?>
                    </div>
                </div>
                <div class="flex flex-col items-start md:items-end">
                    <span class="text-4xl font-bold"><?php echo e($programmes->total()); ?></span>
                    <span class="text-green-100">Programmes Available</span>
                </div>
            </div>
        </div>
    </div>

    
    <div class="bg-gray-50 border-b border-gray-200">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-3">
            <nav class="flex items-center space-x-2 text-sm text-gray-600" aria-label="Breadcrumb">
                <a href="<?php echo e(url('/')); ?>" class="hover:text-green-600 transition flex items-center">
                    <i class="fas fa-home mr-1"></i>Home
                </a>
                <i class="fas fa-chevron-right text-gray-400 text-xs"></i>
                <a href="<?php echo e(route('mentorship.public.index')); ?>" class="hover:text-green-600 transition">Mentorship</a>
                <i class="fas fa-chevron-right text-gray-400 text-xs"></i>
                <span class="text-gray-900 font-medium"><?php echo e($category->name); ?></span>
            </nav>
        </div>
    </div>

    
    <div class="py-12 bg-theme-body">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="grid grid-cols-1 lg:grid-cols-4 gap-8">
                
                <div class="lg:col-span-1">
                    <div class="theme-card rounded-lg shadow-sm sticky top-4">
                        <div class="p-6 border-b theme-divider">
                            <h3 class="text-lg font-semibold text-theme-heading">
                                <i class="fas fa-filter mr-2 text-green-600"></i>
                                Categories
                            </h3>
                        </div>
                        <div class="p-4">
                            <ul class="space-y-1">
                                <?php $__currentLoopData = $categories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $cat): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <li>
                                        <a href="<?php echo e(route('mentorship.public.category', $cat)); ?>" 
                                           class="flex items-center justify-between px-3 py-2 rounded-lg transition <?php echo e($cat->id === $category->id ? 'bg-green-100 text-green-700 font-medium' : 'text-theme-body hover:bg-theme-card-hero'); ?>">
                                            <span class="flex items-center">
                                                <i class="<?php echo e($cat->icon ?? 'fas fa-folder'); ?> mr-2 text-sm"></i>
                                                <?php echo e($cat->name); ?>

                                            </span>
                                            <span class="text-xs <?php echo e($cat->id === $category->id ? 'text-green-600' : 'text-theme-body'); ?>">
                                                <?php echo e($cat->active_programmes_count ?? 0); ?>

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

                    
                    <div class="theme-card rounded-lg shadow-sm mt-6">
                        <div class="p-6 border-b theme-divider">
                            <h3 class="text-lg font-semibold text-theme-heading">
                                <i class="fas fa-sliders-h mr-2 text-green-600"></i>
                                Filters
                            </h3>
                        </div>
                        <div class="p-6">
                            <form method="GET" action="<?php echo e(route('mentorship.public.category', $category)); ?>">
                                
                                <div class="mb-4">
                                    <label class="block text-sm font-medium text-theme-body mb-1">Search</label>
                                    <input type="text" 
                                           name="search" 
                                           value="<?php echo e(request('search')); ?>"
                                           placeholder="Search programmes..."
                                           class="w-full border theme-divider rounded-lg px-3 py-2 bg-theme-card text-theme-body focus:ring-2 focus:ring-green-500 text-sm">
                                </div>

                                
                                <div class="mb-4">
                                    <label class="block text-sm font-medium text-theme-body mb-1">Fee</label>
                                    <select name="is_free" 
                                            class="w-full border theme-divider rounded-lg px-3 py-2 bg-theme-card text-theme-body focus:ring-2 focus:ring-green-500 text-sm">
                                        <option value="">All</option>
                                        <option value="1" <?php echo e(request('is_free') === '1' ? 'selected' : ''); ?>>Free Only</option>
                                        <option value="0" <?php echo e(request('is_free') === '0' ? 'selected' : ''); ?>>Paid Only</option>
                                    </select>
                                </div>

                                
                                <div class="mb-4">
                                    <label class="block text-sm font-medium text-theme-body mb-1">Format</label>
                                    <select name="session_type" 
                                            class="w-full border theme-divider rounded-lg px-3 py-2 bg-theme-card text-theme-body focus:ring-2 focus:ring-green-500 text-sm">
                                        <option value="">All Formats</option>
                                        <option value="online" <?php echo e(request('session_type') === 'online' ? 'selected' : ''); ?>>Online</option>
                                        <option value="in_person" <?php echo e(request('session_type') === 'in_person' ? 'selected' : ''); ?>>In-Person</option>
                                        <option value="hybrid" <?php echo e(request('session_type') === 'hybrid' ? 'selected' : ''); ?>>Hybrid</option>
                                    </select>
                                </div>

                                <div class="flex gap-2">
                                    <button type="submit" class="flex-1 px-4 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 transition text-sm">
                                        Apply
                                    </button>
                                    <a href="<?php echo e(route('mentorship.public.category', $category)); ?>" 
                                       class="px-4 py-2 border theme-divider rounded-lg hover:bg-theme-card-hero transition text-sm">
                                        Clear
                                    </a>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

                
                <div class="lg:col-span-3">
                    
                    <div class="flex items-center justify-between mb-6">
                        <p class="text-theme-body">
                            Showing <?php echo e($programmes->firstItem() ?? 0); ?> - <?php echo e($programmes->lastItem() ?? 0); ?> of <?php echo e($programmes->total()); ?> programmes
                        </p>
                        <a href="<?php echo e(route('mentorship.public.index')); ?>" 
                           class="text-green-600 hover:underline text-sm">
                            <i class="fas fa-arrow-left mr-1"></i>
                            View All Programmes
                        </a>
                    </div>

                    <?php if($programmes->count() > 0): ?>
                        <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-6">
                            <?php $__currentLoopData = $programmes; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $programme): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <div class="theme-card rounded-lg shadow-sm border theme-divider overflow-hidden hover:shadow-md transition group">
                                    <?php if($programme->featured_image): ?>
                                        <div class="h-40 bg-cover bg-center" 
                                             style="background-image: url('<?php echo e($programme->featured_image); ?>')">
                                        </div>
                                    <?php else: ?>
                                        <div class="h-40 bg-gradient-to-r from-green-500 to-green-600 flex items-center justify-center">
                                            <i class="fas fa-graduation-cap text-white text-4xl opacity-50"></i>
                                        </div>
                                    <?php endif; ?>
                                    <div class="p-5">
                                        <div class="flex items-center justify-between mb-2">
                                            <?php if($programme->is_featured): ?>
                                                <span class="text-xs px-2 py-1 bg-yellow-100 text-yellow-800 rounded">
                                                    <i class="fas fa-star mr-1"></i>Featured
                                                </span>
                                            <?php else: ?>
                                                <span class="text-xs text-theme-body">&nbsp;</span>
                                            <?php endif; ?>
                                            <?php if($programme->is_free): ?>
                                                <span class="text-xs font-semibold text-green-600">FREE</span>
                                            <?php else: ?>
                                                <span class="text-xs font-semibold text-theme-heading"><?php echo e($programme->formatted_fee); ?></span>
                                            <?php endif; ?>
                                        </div>
                                        <h3 class="text-lg font-semibold text-theme-heading group-hover:text-green-600 transition">
                                            <?php echo e($programme->title); ?>

                                        </h3>
                                        <p class="text-sm text-theme-body mt-2 line-clamp-2">
                                            <?php echo e(Str::limit($programme->description, 100)); ?>

                                        </p>
                                        <div class="flex items-center gap-3 mt-3 text-xs text-theme-body">
                                            <span>
                                                <i class="fas fa-clock mr-1"></i>
                                                <?php echo e($programme->duration_text); ?>

                                            </span>
                                            <span>
                                                <?php if($programme->session_type === 'online'): ?>
                                                    <i class="fas fa-video mr-1"></i>Online
                                                <?php elseif($programme->session_type === 'in_person'): ?>
                                                    <i class="fas fa-map-marker-alt mr-1"></i>In-Person
                                                <?php else: ?>
                                                    <i class="fas fa-globe mr-1"></i>Hybrid
                                                <?php endif; ?>
                                            </span>
                                        </div>
                                        <div class="flex items-center gap-2 mt-4">
                                            <a href="<?php echo e(route('mentorship.public.programme', $programme)); ?>" 
                                               class="flex-1 text-center px-3 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 transition text-sm font-medium">
                                                View Details
                                            </a>
                                            <?php if($programme->canApply(auth()->user())): ?>
                                                <a href="<?php echo e(route('mentorship.public.apply', ['programme_id' => $programme->id])); ?>" 
                                                   class="px-3 py-2 border theme-divider rounded-lg hover:bg-theme-card-hero transition text-sm">
                                                    <i class="fas fa-user-plus"></i>
                                                </a>
                                            <?php endif; ?>
                                        </div>
                                    </div>
                                </div>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </div>

                        
                        <div class="mt-8">
                            <?php echo e($programmes->links()); ?>

                        </div>
                    <?php else: ?>
                        
                        <div class="theme-card rounded-lg shadow-sm">
                            <div class="p-12 text-center">
                                <div class="w-20 h-20 mx-auto mb-6 bg-theme-card-hero rounded-full flex items-center justify-center">
                                    <i class="fas fa-search text-theme-body text-3xl opacity-50"></i>
                                </div>
                                <h3 class="text-xl font-semibold text-theme-heading mb-2">No Programmes Found</h3>
                                <p class="text-theme-body mb-6 max-w-md mx-auto">
                                    No programmes match your current filters. Try adjusting your search or browse other categories.
                                </p>
                                <a href="<?php echo e(route('mentorship.public.index')); ?>" 
                                   class="inline-flex items-center px-6 py-3 bg-green-600 text-white rounded-lg hover:bg-green-700 transition">
                                    <i class="fas fa-graduation-cap mr-2"></i>
                                    Browse All Programmes
                                </a>
                            </div>
                        </div>
                    <?php endif; ?>
                </div>
            </div>
        </div>
    </div>
 <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginalf2a1b2b34b0a376d40858ac9c2a946a5)): ?>
<?php $attributes = $__attributesOriginalf2a1b2b34b0a376d40858ac9c2a946a5; ?>
<?php unset($__attributesOriginalf2a1b2b34b0a376d40858ac9c2a946a5); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalf2a1b2b34b0a376d40858ac9c2a946a5)): ?>
<?php $component = $__componentOriginalf2a1b2b34b0a376d40858ac9c2a946a5; ?>
<?php unset($__componentOriginalf2a1b2b34b0a376d40858ac9c2a946a5); ?>
<?php endif; ?>
<?php /**PATH /home/www/sshia.org/sshia/resources/views/mentorship/public/category.blade.php ENDPATH**/ ?>