<?php
/**
 * The main template file
 *
 * @package Rosea
 *
 * This file is part of the Rosea WordPress theme.
 *
 * Rosea WordPress Theme, Copyright 2026 nopStation
 * Rosea is distributed under the terms of the GNU General Public License v2 or later.
 *
 * @license GPL-2.0-or-later
 * @license URI: https://www.gnu.org/licenses/gpl-2.0.html
 */

get_header();
?>

<main id="main" role="main">
	<!--Hero Blog Post-->
	<div class="blog-homepage-container">
		<?php
		// Hero Blog Post - Show latest post
		$hero_query = new WP_Query(array(
			'posts_per_page' => 1,
			'post_status' => 'publish',
		));

		if ($hero_query->have_posts()):
			$hero_query->the_post();
			?>
			<div class="hero-blog-section">
				<div class="hero-blog-card">
					<div class="hero-blog-image">
						<?php
						if (has_post_thumbnail()) {
							the_post_thumbnail('large', array('class' => 'hero-blog-thumbnail'));
						} else {
							?>
							<a href="<?php the_permalink(); ?>">
								<img src="<?php echo esc_url( get_template_directory_uri() . '/assets/img/banner.jpg' ); ?>">
								
							</a>
							<?php
						}
						?>
					</div>
					<div class="hero-blog-content">
						<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
						<div class="hero-blog-meta">— <?php echo esc_html(get_the_date()); ?></div>
						<div class="hero-blog-excerpt">
							<?php the_excerpt(); ?>
						</div>
						<a href="<?php the_permalink(); ?>"
							class="blog-card-readmore"><?php esc_html_e('Read More →', 'rosea'); ?></a>
					</div>
				</div>
			</div>
			<?php
			wp_reset_postdata();
		endif;
		?>

		<!--Featured Blog Posts-->
		<div class="featured-blog-section">
			<h2 class="blog-section"><?php esc_html_e('Latest Blog Posts', 'rosea'); ?></h2>

			<?php
			if (have_posts()):
				?>
				<div class="blog-grid">
					<?php
					// Skip the first post (already shown in hero)
					$post_count = 0;
					while (have_posts()):
						the_post();
						$post_count++;

						// Skip first post if it's the hero post
						if ($post_count === 1 && is_home() && is_front_page()) {
							continue;
						}
						?>
						<div class="blog-card">
							<div class="blog-card-image">
								<?php
								if (has_post_thumbnail()) {
									?>
									<a href="<?php the_permalink(); ?>">
										<?php the_post_thumbnail('medium', array('class' => 'blog-card-thumbnail')); ?>
									</a>
									<?php
								} else {
									?>

									<a href="<?php the_permalink(); ?>">
									<img src="<?php echo esc_url( get_template_directory_uri() . '/assets/img/banner.jpg' ); ?>" class="blog-card">
								</a>
									<?php
								}
								?>
							</div>
							<div class="blog-card-content">
								<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
								<div class="blog-card-meta">— <?php echo esc_html(get_the_date()); ?></div>
								<div class="blog-card-excerpt">
									<?php the_excerpt(); ?>
								</div>
								<a href="<?php the_permalink(); ?>"
									class="blog-card-readmore"><?php esc_html_e('Read More →', 'rosea'); ?></a>
							</div>
						</div>
						<?php
					endwhile;
					?>
				</div>

				<!-- Pagination -->
				<div class="blog-pagination">
					<?php
					the_posts_pagination(array(
						'mid_size' => 2,
						'prev_text' => __('&laquo; Previous', 'rosea'),
						'next_text' => __('Next &raquo;', 'rosea'),
					));
					?>
				</div>
				<?php
			else:
				?>
				<div class="no-posts-found">
					<p><?php esc_html_e('No posts found.', 'rosea'); ?></p>
				</div>
				<?php
			endif;
			?>
		</div>
		<!--Featured Blog Posts-->
	</div>
</main>

<?php
get_footer();