<?php

if(get_theme_mod('feature_area_disable') != 'on' ){ ?>
	<?php 
		if( get_theme_mod('feature_areaTpadding',true) ) {
			$feature_areaTpadding = 'padding-top:'.esc_attr(get_theme_mod('feature_areaTpadding')).';';
		}
		if( get_theme_mod('feature_areaBpadding',true) ) {
			$feature_areaBpadding = 'padding-bottom:'.esc_attr(get_theme_mod('feature_areaBpadding')).';';
		}	
	?>	 	
	<div class="feature-area" id="feature" >
		<?php
			// width 
			$c_width = get_theme_mod('fea_c_width', 'container');

		    if ($c_width === 'container') {
			    $c_alignment = 'container';
			} elseif ($c_width === 'container-fluid') {
			    $c_alignment = 'container-fluid';
			} else {
			    $text_alignment = 'container'; // Default to 'container' if the setting is invalid
			}

			// Heading Style
        	$heading_case = get_theme_mod('fea_maintitle_case', 'capitalize');

		    if ($heading_case === 'uppercase') {
				$text_case = 'uppercase';
			} elseif ($heading_case === 'lowercase') {
			    $text_case = 'lowercase';
			} elseif ($heading_case === 'capitalize') {
			    $text_case = 'capitalize';
			} else {
			    $text_case = 'capitalize'; // Default to 'left' if the setting is invalid
			}
				 
			// Alientment
        	$heading_alignment = get_theme_mod('fea_maintitle_align', 'left');

		    if ($heading_alignment === 'left') {
				$text_alignment = 'left';
			} elseif ($heading_alignment === 'center') {
			    $text_alignment = 'center';
			} elseif ($heading_alignment === 'right') {
			    $text_alignment = 'right';
			} else {
			    $text_alignment = 'left'; // Default to 'left' if the setting is invalid
			}

			
	    ?>
		<?php								
			$fea_title = get_theme_mod('fea_title', 'Why People trust Us');
			$fea_subtitle = get_theme_mod('fea_subtitle', 'Why We Best');
			$fea_txt = get_theme_mod('fea_txt', 'There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or which do not look even slightly believable.');
			$f_phone = get_theme_mod('f_phone', '+00 12 3456 789');
			$f_2phone = get_theme_mod('f_2phone', '+00 12 3456 780');
			$f_txt = get_theme_mod('f_txt', 'Book Your First Service & Get 30% Off');

			$f_btn = get_theme_mod('f_btn', 'Book Now');
			$f_btnlink = get_theme_mod('f_btnlink', '#');
		?>			

		<?php if( $fea_title || $fea_subtitle || $fea_txt ){ ?>	
		<div class="section-title">
			<div class="<?php echo esc_attr($c_width); ?>">
				<div class="row">
					<div class="col-lg-6">
						<div class="titlebx">
							<h3 style="text-align: <?php echo esc_attr($text_alignment); ?>;  text-transform: <?php echo esc_attr($heading_case); ?>;"><?php echo ($fea_title); ?></h3>
							<h5 style="text-align: <?php echo esc_attr($text_alignment); ?>;"><?php echo ($fea_subtitle); ?></h5>
							<div class="titlebrd"></div>
						</div>
					</div>
					<div class="col-lg-6">
						<p>
							<?php echo ($fea_txt); ?>	
						</p>
						<div class="clearfix"></div>
					</div>
				</div>
			</div>
		</div>
		<?php }?>
		
		<?php if( $f_phone || $f_2phone || $f_txt || $f_btn ){ ?>
		<div class="conbx">
			<div class="<?php echo esc_attr($c_width); ?>">
				<div class="row">
					<div class="col-lg-6">
						<div class="phbx">
							<a class="ph1" href="tel:<?php echo $f_phone;?>"><?php echo $f_phone;?></a> 
							<?php if( $f_2phone  ){ ?>
							<a class="ph2" href="tel:<?php echo $f_2phone;?>"><?php echo $f_2phone;?></a>
							<?php }?>
						</div>
					</div>
					<div class="col-lg-6">
						<div class="btnbx">
							<P><?php echo $f_txt;?></P>
							<?php if( $f_btn ){ ?>
							<a class="fbttn" href="<?php echo ($f_btnlink);  ?>"> <?php echo $f_btn;?></a>
							<?php }?>
						</div>
					</div>
				</div>
			</div>
		</div>
		<?php }?>
		
		<?php
          $showStatic = true;
          for( $i = 1; $i < 9; $i++ ){
          	$url = get_theme_mod('ourfeatured_page_url_'.$i, '#');
            $feature_page_id = get_theme_mod('feature_page_icon'.$i); 
            if(!empty($feature_page_id)){
              $showStatic = false;
              break;
            }
          }
      	?>

		<div class="<?php echo esc_attr($c_width); ?>">  
			<div class="feature-single-area">  
				<div class="row ">	
				<?php
					$cols = get_theme_mod('feature_npp_count', 4);
					$cols++;
								// echo '$cold: '.$cols;
					switch($cols){
						case 1:
						$colCls = 'col-lg-12 col-md-12 col-sm-6 col-xs-12';
						break;
						case 2:	
						$colCls = 'col-lg-6 col-md-6 col-sm-6 col-xs-12';
						break;
						case 3:
						case 5:
						case 6:
						case 9:
						case 11:
						case 13:
						case 15:
						$colCls = 'col-lg-4 col-md-6 col-sm-6 col-xs-12';
						break;
						default: 
						$colCls = 'col-lg-4 col-md-6 col-sm-6 col-xs-12';
						break;
					}
					$icons = array(1=>'heart', 2=>'star', 3=>'flash', 4=>'bell',5=>'heart', 6=>'star', 7=>'flash', 8=>'bell');
				?>
							 						
		        <?php
		          for( $i = 1; $i <= $cols; $i++ ){
		            if($showStatic === false){
		            	$url = get_theme_mod('ourfeatured_page_url_'.$i, '#');
						$feature_page_id = get_theme_mod('feature_page'.$i);
						$feature_page_title = get_theme_mod('feature_page_title'.$i, 'Contact Professional');
						$feature_page_txt = get_theme_mod('feature_page_txt'.$i, 'There are many variations of which do not look even slightly believable.');
						$feature_title_img = get_theme_mod('feature_title_img'.$i); 
						$feature_page_icon = get_theme_mod('feature_page_icon'.$i);
						$feature_page_icon = get_theme_mod('feature_page_icon'.$i);
					if($feature_page_icon){
		              
		        ?>
			
		           <div class="<?php echo $colCls;?> f-bx">
		                <div class="fea-single f-bxinn">
		                	<div class="row">
			            		<div class="fea-icon">
			            			<a href="<?php echo esc_url(!empty($url)?$url:'#');?>">
			                  			<span class="<?php echo $feature_page_icon; ?>"></span>    
			                  		</a>            		
			                	</div> 
			                	<div class="fea-conbx">
			                		<a href="<?php echo esc_url(!empty($url)?$url:'#');?>">
		                			<div class="fea-title inner-area-title">
		                					<?php echo $feature_page_title; ?>
		                			</div>
		                		</a>
		                			<p><?php echo $feature_page_txt; ?></p>
			                	</div>
		                	</div>		                	
		            	</div>
		              	<div class="clearfix"></div>
		          	</div>
					<?php   }
					                          
					}else{?>

					<div class="<?php echo $colCls;?> f-bx">
						<div class="fea-single f-bxinn">
							<div class="row">
								<div class="fea-icon">
									<a href="#">									
										<span class="fa fa-users" aria-hidden="true"></span>
									</a>
								</div>
								<div class="fea-conbx">
									<a href="#">			
									<div class="fea-title inner-area-title">Contact Professional </div>
									</a>
									<p>There are many variations of which do not look even slightly believable.</p>
								</div>
							</div>
						</div>
						<div class="clearfix"></div>
					</div>
		            <?php }
		          }?>
			       <div class="clearfix"></div>
			  	</div>
			</div>
		</div>
	</div> 
	<!-- feature Area Start -->
  
<script type="text/javascript">
$(document).ready(function(){
    var highestBox = 0;
        $('#feature .f-bxinn').each(function(){  
                if($(this).height() > highestBox){  
                highestBox = $(this).height();  
        }
    });    
    $('#feature .f-bxinn').height(highestBox);
});
</script>
<?php } 


