<?php
if ( ! get_theme_mod( 'aster_portfolio_enable_slider_section' ) ) {
	return;
}

$aster_portfolio_slider_count = get_theme_mod( 'aster_portfolio_slider_count', 1 );
?>
<section id="aster_portfolio_slider_section" class="slider-section">
	<div class="owl-carousel slider-hero-carousel">
		<?php for ( $aster_portfolio_i = 1; $aster_portfolio_i <= $aster_portfolio_slider_count; $aster_portfolio_i++ ) : ?>
			<div class="slider-item">
				<p class="slider-subtitle">
					<?php echo esc_html( get_theme_mod("aster_portfolio_slider_subtitle_{$aster_portfolio_i}") ); ?>
				</p>
				<h2 class="slider-title wow zoomIn delay-1000"
					data-aster-portfolio-img-one="<?php echo esc_url( get_theme_mod("aster_portfolio_slider_title_image_one_{$aster_portfolio_i}") ); ?>"
					data-aster-portfolio-img-two="<?php echo esc_url( get_theme_mod("aster_portfolio_slider_title_image_two_{$aster_portfolio_i}") ); ?>"
					data-aster-portfolio-img-default="<?php echo esc_url( get_template_directory_uri() . '/resource/img/default1.png' ); ?>">
					<span class="slider-title-inner">
						<?php echo esc_html( get_theme_mod("aster_portfolio_slider_title_{$aster_portfolio_i}") ); ?>
					</span>
				</h2>
				<div class="slider-content">
					<!-- LEFT -->
					<div class="slider-left">
						<?php
						$aster_portfolio_expertise_text    = get_theme_mod("aster_portfolio_slider_expertise_text_{$aster_portfolio_i}");
						$aster_portfolio_expertise_content = get_theme_mod("aster_portfolio_slider_expertise_content_{$aster_portfolio_i}");

						if ( ! empty($aster_portfolio_expertise_text) || ! empty($aster_portfolio_expertise_content) ) :
						?>
							<div class="info">
								<h4><?php echo esc_html($aster_portfolio_expertise_text); ?></h4>
								<span><?php echo esc_html($aster_portfolio_expertise_content); ?></span>
							</div>
						<?php endif; ?>

						<?php
						$aster_portfolio_born_text    = get_theme_mod("aster_portfolio_slider_born_text_{$aster_portfolio_i}");
						$aster_portfolio_born_content = get_theme_mod("aster_portfolio_slider_born_content_{$aster_portfolio_i}");

						if ( ! empty($aster_portfolio_born_text) || ! empty($aster_portfolio_born_content) ) :
						?>
							<div class="info">
								<h4><?php echo esc_html($aster_portfolio_born_text); ?></h4>
								<span><?php echo esc_html($aster_portfolio_born_content); ?></span>
							</div>
						<?php endif; ?>

						<?php
						$aster_portfolio_birth_text    = get_theme_mod("aster_portfolio_slider_birth_text_{$aster_portfolio_i}");
						$aster_portfolio_birth_content = get_theme_mod("aster_portfolio_slider_birth_content_{$aster_portfolio_i}");

						if ( ! empty($aster_portfolio_birth_text) || ! empty($aster_portfolio_birth_content) ) :
						?>
							<div class="info">
								<h4><?php echo esc_html($aster_portfolio_birth_text); ?></h4>
								<span><?php echo esc_html($aster_portfolio_birth_content); ?></span>
							</div>
						<?php endif; ?>
					</div>
					<!-- CENTER -->
					<div class="slider-center wow zoomIn delay-1000">
						<?php
						$aster_portfolio_slider_img = get_theme_mod( "aster_portfolio_slider_image_{$aster_portfolio_i}" );					
						if ( $aster_portfolio_slider_img ) :
						?>
							<img src="<?php echo esc_url( $aster_portfolio_slider_img ); ?>">
						<?php else : ?>
							<img src="<?php echo esc_url( get_template_directory_uri() . '/resource/img/default.png' ); ?>" alt="<?php esc_attr_e( 'Default slider image', 'aster-portfolio' ); ?>">
						<?php endif; ?>
					</div>
					<!-- RIGHT -->
					<div class="slider-right">
						<?php
						$aster_portfolio_education_text    = get_theme_mod("aster_portfolio_slider_education_text_{$aster_portfolio_i}");
						$aster_portfolio_education_content = get_theme_mod("aster_portfolio_slider_education_content_{$aster_portfolio_i}");

						if ( ! empty($aster_portfolio_education_text) || ! empty($aster_portfolio_education_content) ) :
						?>
							<div class="info">
								<h4><?php echo esc_html($aster_portfolio_education_text); ?></h4>
								<span><?php echo esc_html($aster_portfolio_education_content); ?></span>
							</div>
						<?php endif; ?>

						<?php
						$aster_portfolio_award_text    = get_theme_mod("aster_portfolio_slider_award_text_{$aster_portfolio_i}");
						$aster_portfolio_award_content = get_theme_mod("aster_portfolio_slider_award_content_{$aster_portfolio_i}");

						if ( ! empty($aster_portfolio_award_text) || ! empty($aster_portfolio_award_content) ) :
						?>
							<div class="info">
								<h4><?php echo esc_html($aster_portfolio_award_text); ?></h4>
								<span><?php echo esc_html($aster_portfolio_award_content); ?></span>
							</div>
						<?php endif; ?>
					</div>
				</div>
			</div>
		<?php endfor; ?>
	</div>
</section>