<?php $html_id = pxl_get_element_id($settings); 
$is_new = \Elementor\Icons_Manager::is_migration_allowed();
if(isset($settings['tabs']) && !empty($settings['tabs']) && count($settings['tabs'])): 
    $tab_bd_ids = [];
    ?>
    <div class="pxl-tabs pxl-tabs1 <?php echo esc_attr($settings['style'].' '.$settings['tab_effect'].' '.$settings['pxl_animate']); ?>" data-wow-delay="<?php echo esc_attr($settings['pxl_animate_delay']); ?>ms">
        <div class="pxl-tabs--inner">
            <div class="pxl-inner-top">
                <?php if (in_array($settings['style'], ['style-2', 'style-7'])) : ?>
                    <div class="pxl-item-heading <?php echo esc_attr($settings['pxl_animate3']); ?>" data-wow-delay="<?php echo esc_attr($settings['pxl_animate_delay3']); ?>ms">
                        <?php echo pxl_print_html($settings['heading']); ?>
                    </div>
                <?php endif; ?>
                <?php if($settings['style'] == 'style-7') : ?>
                    <div class="pxl-text-desc">
                        <?php echo pxl_print_html($settings['text_desc']); ?>
                    </div>
                <?php endif; ?>
            </div>
            <div class="pxl-tabs--title <?php echo esc_attr($settings['pxl_animate2']); ?>" data-wow-delay="<?php echo esc_attr($settings['pxl_animate_delay2']); ?>ms">
                <?php foreach ($settings['tabs'] as $key => $title) :?>
                    <span class="pxl-tab--title pxl-cursor--cta <?php if($settings['tab_active'] == $key + 1) { echo 'active'; } ?>" data-target="#<?php echo esc_attr($html_id.'-'.$title['_id']); ?>">
                        <?php if($settings['style'] == 'style-3') : ?>
                            <span class="pxl-item-number pxl-mr-30">
                                <?php echo pxl_print_html($title['number']); ?>
                            </span>
                        <?php endif; ?>
                        <span class="pxl-title--text">
                            <?php echo pxl_print_html($title['title']); ?>
                        </span>
                        <?php if($settings['style'] == 'style-7') : ?>
                            <span class="pxl-item-icon pxl-ml-18">
                                <svg xmlns="http://www.w3.org/2000/svg" fill="#000" height="512" viewBox="0 0 24 24" width="512"><path d="m16.0039 9.414-8.60699 8.607-1.414-1.414 8.60599-8.607h-7.58499v-2h10.99999v11h-2z" fill="rgb(0,0,0)"></path></svg>
                            </span>
                        <?php endif; ?>
                    </span>
                <?php endforeach; ?>
            </div>

            <div class="pxl-tabs--content">
                <?php foreach ($settings['tabs'] as $key => $content) : ?>
                    <div id="<?php echo esc_attr($html_id.'-'.$content['_id']); ?>" class="pxl-tab--content <?php if($settings['tab_active'] == $key + 1) { echo 'active'; } ?> <?php if($content['content_type'] == 'template') { echo 'pxl-tabs--elementor'; } ?>" <?php if($settings['tab_active'] == $key + 1) { ?>style="display: block;"<?php } ?>>
                        <?php if($content['content_type'] == 'df' && !empty($content['desc'])) {
                            echo pxl_print_html($content['desc']); 
                        } elseif($content['content_type'] == 'template' && !empty($content['content_template'])) {
                            $tab_content = Elementor\Plugin::$instance->frontend->get_builder_content_for_display( (int)$content['content_template']);
                            $tab_bd_ids[] = (int)$content['content_template'];
                            pxl_print_html($tab_content);
                        } ?>        
                    </div>
                <?php endforeach; ?>
            </div>
            
        </div>
    </div>
<?php endif; ?>