<?php

	use Tech360\Utils as Utils;

?>

<div class="header-image position-relative" style="<?php Utils::_header_style( get_the_ID() ) ?>">
	<div class="container position-relative z-index-1">
		<div class="row">
			<div class="col-md-6">
				<h1 class="text-light"><?php the_title() ?></h1>
			</div>
		</div>
	</div>
<?php
if( get_field( 'header_overlay_opacity' ) ) {
	$overlay_style = [ 'background-color: #000' ];
	$overlay_style[] = sprintf( 'opacity: %s', ( intval( get_field( 'header_overlay_opacity' ) ) / 100 ) );
?>
	<span class="bg-overlay" style="<?php echo implode( '; ', $overlay_style ) ?>"></span>
<?php
}
?>
</div>

<div id="page-main-content" class="container py-5">
	<div class="row">
		<?php
		if( has_post_thumbnail() ) {
		?>
		<div class="col-md-7">
			<?php the_content() ?>
		</div>
		<div class="col-md-5 mt-4 mt-md-0">
			<?php the_post_thumbnail( 'post-thumbnail', [ 'class' => 'img-fluid img-border' ] ) ?>
		</div>
		<?php
		} else {
		?>
		<div class="col">
			<?php the_content() ?>
		</div>
		<?php
		}
		?>
	</div>
	<div class="row mt-5">
		<div class="col-md-8 offset-md-2 text-center">
			<h2><?php esc_html_e( 'Our Fleet', 'tech360' ) ?></h2>
		</div>
	</div>
	<div class="row">
		<?php
		foreach( Utils::get_all( 'vehicle' ) as $vehicle ) {
		?>
		<div class="col-md-6 col-lg-4 auto-mt auto-mt-4 text-center">
			<div class="h-100">
				<?php
				if( has_post_thumbnail( $vehicle->ID ) ) {
				?>
				<div class="post-thumbnail embed-responsive embed-responsive-16by9">
					<a href="<?php echo get_the_permalink( $vehicle->ID ) ?>" title="<?php echo get_the_title( $vehicle->ID ) ?>">
						<?php echo get_the_post_thumbnail( $vehicle->ID, 'post-thumbnail', [ 'class' => 'img-contain' ] ) ?>
					</a>
				</div>
				<?php
				}
				?>
				<div class="post-excerpt px-3 pb-3 mt-3">
					<a href="<?php echo get_the_permalink( $vehicle->ID ) ?>" title="<?php echo get_the_title( $vehicle->ID ) ?>">
						<h4>
							<?php echo get_the_title( $vehicle->ID ) ?>
						</h4>
					</a>
					<?php
					if( get_field( 'vehicle_passenger_capacity', $vehicle->ID ) || get_field( 'vehicle_luggage_capacity', $vehicle->ID ) ) {
					?>
					<div class="vehicle-specs d-flex mt-4 justify-content-center">
						<?php
						if( get_field( 'vehicle_passenger_capacity', $vehicle->ID ) ) {
						?>
						<span class="spec passengers d-flex">
							<i class="fas fa-fw fa-user-friends"></i>
							<span class="number"><?php echo get_field( 'vehicle_passenger_capacity', $vehicle->ID ) ?></span>
						</span>
						<?php
						}
						if( get_field( 'vehicle_luggage_capacity', $vehicle->ID ) ) {
						?>
						<span class="spec luggage d-flex">
							<i class="fas fa-fw fa-suitcase-rolling"></i>
							<span class="number"><?php echo get_field( 'vehicle_luggage_capacity', $vehicle->ID ) ?></span>
						</span>
						<?php
						}
						?>
					</div>
					<?php
					}
					?>
					<p>
						<a class="btn btn-primary" href="<?php echo get_the_permalink( $vehicle->ID ) ?>" title="<?php echo get_the_title( $vehicle->ID ) ?>"><?php esc_html_e( 'Learn more', 'tech360' ) ?></a>
					</p>
				</div>
			</div>
		</div>
		<?php
		}
		?>
	</div>
</div>
