<?php $__env->startSection('content'); ?>

    <section class="join-soty">
        <div class="container-fluid">
            <div class="tabs-containers">
                <div class="tabs">
                    <?php $__currentLoopData = $joinAsTypes; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key => $type): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <button class="tab-link <?php echo e($key == 0 ? 'active' : ''); ?>" 
                            onclick="showTab('<?php echo e($type->slug ?? 'tab-'.$type->id); ?>', event)">
                            <?php echo e($type->name); ?>

                        </button>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </div>
            
                <div class="content">
                    <?php $__currentLoopData = $joinAsTypes; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key => $type): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <div id="<?php echo e($type->slug ?? 'tab-'.$type->id); ?>" 
                             class="tab-content" 
                             style="<?php echo e($key == 0 ? 'display:block;' : 'display:none;'); ?>">
                            
                            <div class="tab-containers">
                                <?php $__empty_1 = true; $__currentLoopData = $type->details; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $detail): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                                    <div class="card">
                                        <h3><?php echo e($detail->title); ?></h3>
                                        <p><?php echo $detail->description; ?></p>
                                    </div>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                                    <div class="card">
                                        <p>No content available.</p>
                                    </div>
                                <?php endif; ?>
                            </div>
            
                            <!--<a class="btn" href="<?php echo e(URL::to('/join/'.$type->slug)); ?>">-->
                            <!--    Join Soty-->
                            <!--</a>-->
                            <!--<a class="btn" href="<?php echo e(URL::to('/registration/')); ?>">-->
                            <!--    Join Soty-->
                            <!--</a>-->
                            <a class="btn" href="<?php echo e(URL::to('/joinmentor')); ?>">Join Soty</a>
                            
                        </div>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </div>
            </div>
        </div>
    </section>
    
    
    <script>
    
    function showTab(tabId, event) {
        document.querySelectorAll('.tab-content').forEach(c => c.style.display = 'none');
        document.querySelectorAll('.tab-link').forEach(b => b.classList.remove('active'));
        document.getElementById(tabId).style.display = 'block';
        event.currentTarget.classList.add('active');
    }
  </script>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('footer'); ?>
    <?php echo $__env->make('layouts.footer', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.master', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>