<?php
/**
 * Template Name: Our Products
 *
 * @package multitas
 */

get_header();
?>

	<main id="primary" class="site-main">

		<!-- Products Section -->
		<section id="products" class="products-section">
			<div class="products-container">
				<div class="products-header">
					<span class="products-label"><?php echo esc_html( get_theme_mod( 'multitas_products_label', __( 'OUR PRODUCTS', 'multitas' ) ) ); ?></span>
					<h2 class="products-title"><?php echo esc_html( get_theme_mod( 'multitas_products_title', __( 'Our Products', 'multitas' ) ) ); ?></h2>
					<?php
					$products_desc = get_theme_mod( 'multitas_products_description', '' );
					if ( ! empty( $products_desc ) ) :
						?>
						<p class="products-description"><?php echo esc_html( $products_desc ); ?></p>
					<?php endif; ?>
				</div>
				<div class="products-grid">
					<?php
					$products_query = new WP_Query(
						array(
							'post_type'      => 'product',
							'posts_per_page' => -1,
							'orderby'        => 'date',
							'order'          => 'DESC',
						)
					);

					if ( $products_query->have_posts() ) :
						while ( $products_query->have_posts() ) :
							$products_query->the_post();
							?>
							<article class="product-card">
								<?php if ( has_post_thumbnail() ) : ?>
									<div class="product-image">
										<a href="<?php the_permalink(); ?>">
											<?php the_post_thumbnail( 'large', array( 'class' => 'product-img' ) ); ?>
										</a>
									</div>
								<?php endif; ?>
								<div class="product-content">
									<h3 class="product-title">
										<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
									</h3>
									<?php if ( has_excerpt() ) : ?>
										<p class="product-excerpt"><?php echo wp_trim_words( get_the_excerpt(), 15, '...' ); ?></p>
									<?php endif; ?>
									<a href="<?php the_permalink(); ?>" class="product-link"><?php esc_html_e( 'View Details', 'multitas' ); ?> <span class="arrow">→</span></a>
								</div>
							</article>
							<?php
						endwhile;
						wp_reset_postdata();
					else :
						?>
						<p class="no-products"><?php esc_html_e( 'No products found. Add products from the dashboard.', 'multitas' ); ?></p>
						<?php
					endif;
					?>
				</div>
			</div>
		</section>

	</main><!-- #main -->

<?php
get_footer();