<?php
/**
 * Template part for displaying the about section
 *
 * @package Marketing Campaigns
 * @subpackage marketing_campaigns
 */

$marketing_campaigns_static_image = get_template_directory_uri() . '/assets/images/about-img.png';

// Check if the about section is enabled
if ( get_theme_mod( 'marketing_campaigns_about_enable', true )) : ?>
    <section id="about" class="my-5 px-md-0 px-3">
        <div class="container">
            <div class="row">
                <div class="col-lg-5 col-md-5 image-abt">
                    <div class="about-banner mb-3">
                        <?php 
                        $marketing_campaigns_image1 = get_theme_mod( 'marketing_campaigns_abt_banner_image1', '' );
                        if ( $marketing_campaigns_image1 ) : ?>
                            <img src="<?php echo esc_url( $marketing_campaigns_image1 ); ?>" alt="<?php esc_attr_e( 'About Banner', 'marketing-campaigns' ); ?>" />
                        <?php endif; ?>
                    </div>
                </div>
                <div class="col-lg-7 col-md-7">
                    <div class="match-heading">
                        <?php 
                        $marketing_campaigns_sub_heading = get_theme_mod( 'marketing_campaigns_service_sec_heading' );
                        if ( $marketing_campaigns_sub_heading ) : ?>
                            <p class="mb-md-3 mb-2 abt-title"><?php echo esc_html( $marketing_campaigns_sub_heading ); ?></p>
                        <?php endif; ?>
                    </div>
                    <div class="row">
                        <?php for ($marketing_campaigns_i = 1; $marketing_campaigns_i <= 6; $marketing_campaigns_i++) : ?>
                            <div class="col-lg-6 col-md-6 align-self-center mb-lg-2 mb-md-1 mb-2">
                                <?php 
                                $marketing_campaigns_heading = get_theme_mod('marketing_campaigns_tab_heading' . $marketing_campaigns_i);
                                $marketing_campaigns_description = get_theme_mod('marketing_campaigns_tab_para' . $marketing_campaigns_i);

                                if ( !empty($marketing_campaigns_heading) || !empty($marketing_campaigns_description) ) : ?>
                                    <div class="tab-item mb-3 mb-md-2 mb-3 bg-tab-<?php echo $marketing_campaigns_i; ?>">
                                        <div class="serv-icon">
                                            <?php 
                                            $marketing_campaigns_tab_icon = esc_attr( get_theme_mod( 'marketing_campaigns_tab_icon' . $marketing_campaigns_i, 'fas fa-lightbulb' ) );
                                            if ( $marketing_campaigns_tab_icon ) : ?>
                                                <i class="me-lg-3 me-2 <?php echo $marketing_campaigns_tab_icon; ?>"></i>
                                            <?php endif; ?>
                                        </div>
                                        <div class="post-content">
                                            <div class="tab-title">
                                                <?php if ( !empty($marketing_campaigns_heading) ) : ?>
                                                    <h3 class="mb-2"><?php echo esc_html($marketing_campaigns_heading); ?></h3>
                                                <?php endif; ?>
                                            </div>
                                            <div class="tab-description">
                                                <?php if ( !empty($marketing_campaigns_description) ) : ?>
                                                    <p class="mb-0"><?php echo esc_html($marketing_campaigns_description); ?></p>
                                                <?php endif; ?>
                                            </div>
                                        </div>
                                    </div>
                                <?php endif; ?>
                            </div>
                        <?php endfor; ?>
                    </div>
                </div>
            </div>
        </div>
    </section>
<?php endif; ?>