<?php
/**
 *
 * @package Luzuk Premium
 */
if(get_theme_mod('premium_featured_section_disable') != 'on' ){?>
	<?php 
			if( get_theme_mod('featuredsection_toppadding',true) ) {
                $featuredsection_toppadding = 'padding-top:'.esc_attr(get_theme_mod('featuredsection_toppadding')).';';
            }
            if( get_theme_mod('featuredsection_bottompadding',true) ) {
                $featuredsection_bottompadding = 'padding-bottom:'.esc_attr(get_theme_mod('featuredsection_bottompadding')).';';
            }
            if( get_theme_mod('featuredsection_leftpadding',true) ) {
                $featuredsection_leftpadding = 'padding-left:'.esc_attr(get_theme_mod('featuredsection_leftpadding')).';';
            }
            if( get_theme_mod('countersectionRpadding',true) ) {
                $countersectionRpadding = 'padding-right:'.esc_attr(get_theme_mod('countersectionRpadding')).';';
            }
		?>	
 
<section id="featured-content-section" class="ht-section " style="<?php echo esc_attr($featuredsection_toppadding); ?> <?php echo esc_attr($featuredsection_bottompadding); ?> <?php echo esc_attr($featuredsection_leftpadding); ?> <?php echo esc_attr($countersectionRpadding); ?>">	
	 	<div class="col-md-12 col-sm-12 featured-right"> 
			<?php					
				$featured_title = get_theme_mod('featured_title', 'OUR FEATURES');
				$featured_subtext = get_theme_mod('featured_subtext', 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vitae ante a nibh ornare tristique laoreet ac odio. Donec ac eleifend lacus. Etiam bibendum nec mi non consequat.');
			?>					
				<?php if($featured_title){ ?>
					<div class="ht-section-title-tagline ">
						<div class="heading-icon">
							<i class="fa fa-cog"></i>
						</div>
						<div>
						<h2 class="ht-section-title lz-featured-heading">
							<?php
							if(!empty($featured_title))	{
								echo ($featured_title);
							} ?>
						</h2> 
						<div class="title-icon1">
		 					 	<img src="<?php echo esc_html(get_template_directory_uri()); ?>/images/f.png" />
		 					</div>	
		 					</div>					
						<div class="clearfix"></div>
					</div>
				<?php }?>
				
				<h4 class="featured-subtext">
					<?php
						if(!empty($featured_subtext))	{
							echo ($featured_subtext);
					} ?>
				</h4>
				<div class="clearfix"></div>
		</div> 
		<div class="col-md-12 col-sm-12 featured-left">
			<div class="featured-box">
				
					<?php
					$showStatic = true;
					for( $i = 1; $i < 4; $i++ ){
						$featured_page_id = get_theme_mod('featured_page_icon'.$i); 
						if(!empty($featured_page_id)){
							$showStatic = false;
							break;
						}
					}
					
					?>
			<div class="featuredrightbox">
				<div class="featured-post-wrap">
						<?php
						$cols = get_theme_mod('featured_npp_count', 3);
						$cols++;
				// echo '$cold: '.$cols;
						switch($cols){
							case 1:
							$colCls = 'col-md-12 col-sm-12';
							break;
							case 2:
							$colCls = 'col-md-6 col-sm-6';
							break;
							case 3:
							case 6:
							case 9:
							$colCls = 'col-md-4 col-sm-6';
							break;
							default: 
							$colCls = 'col-md-3 col-sm-6';
							break;
						}
						$icons = array(1=>'heart', 2=>'star', 3=>'flash', 4=>'bell',5=>'heart', 6=>'star', 7=>'flash', 8=>'bell');
						?>
						<div class="row">
							<?php
							for( $i = 1; $i <= $cols; $i++ ){
								if($showStatic === false){
									$featured_page_title = get_theme_mod('featured_page_title_'.$i, 'REPAIR');
									$featured_page_description = get_theme_mod('featured_page_description'.$i, 'Aliquam erat volutpat. Quisque posuere elit ut efficitur henerit. ');
									$featured_page_id = get_theme_mod('featured_page'.$i);
									$featured_page_icon = get_theme_mod('featured_page_icon'.$i);
									if($featured_page_icon){

							?>

								<div class="<?php echo $colCls;?> feabx">
									<div project-match-height="groupName" class="featured-post">
										<div class="featured-icon">	
			 								<img src="<?php echo esc_url($featured_page_icon); ?>" class="img-responsive" />
			 								<div class="ovrly"></div>
										</div>
										
										<div class="f-post">
											<h5><?php echo $featured_page_title; ?></h5>
											<div class="description"><?php echo $featured_page_description; ?></div>
											<?php
												$featurednew_page_id = get_theme_mod('featurednew_page');
												$featurednew_page_button_title = get_theme_mod('featurednew_page_button_title_'.$i, 'LEARN MORE');
												?>
												<?php if($featurednew_page_button_title){ ?>
													<div class="readmore">
														<a class="btn" href="<?php echo esc_url(!empty($url)?$url:'#');?>"><?php echo $featurednew_page_button_title; ?><i class="fa fa-long-arrow-right"></i>
														</a>
														<div class="clearfix"></div>
													</div>
												<?php } ?>
									
										</div>
										<div class="clearfix"></div>
									</div>
									<div class="clearfix"></div>
								</div>
								
								<?php
							}	
							}else{?>
								<div class="<?php echo $colCls;?> feabx">
									<div project-match-height="groupName" class="featured-post">
										<div class="featured-icon">			
											<img src="<?php echo esc_html(get_template_directory_uri()); ?>/images/team.jpg" class="img-responsive" />
											<div class="ovrly"></div>
										</div>
										<div class="f-post">
											<h5>REPAIR</h5>
											<div class="description">Aliquam erat volutpat. Quisque posuere elit ut efficitur henerit.</div>
											<div class="readmore">
													<a class="btn" href="#"> LEARN MORE <i class="fa fa-long-arrow-right"></i></a>
											</div>
											
										</div>
										<div class="clearfix"></div>
									</div>
									<div class="clearfix"></div>
								</div>
							<?php }

							}?>
							<!-- <div class="clearfix"></div> -->
						</div>
					</div>
			</div>	
		</div>
		<!-- </div> -->
	</div>
	<div class="clearfix"></div>
	</section>
	<script>
	var matchHeight = function () {
	
	function init() {
		eventListeners();
		matchHeight();
	}
	
	function eventListeners(){
		$(window).on('resize', function() {
			matchHeight();
		});
	}
	
	function matchHeight(){
		var groupName = $('[featured-post-height]');
		var groupHeights = [];
		
		groupName.css('min-height', 'auto');
		
		groupName.each(function() {
			groupHeights.push($(this).outerHeight());
		});
		
		var maxHeight = Math.max.apply(null, groupHeights);
		groupName.css('min-height', maxHeight);
	};
	
	return {
		init: init
	};
	
} ();

$(document).ready(function() {
	matchHeight.init();
});
</script>
<?php }