<?php
get_header();

$term = get_queried_object();
$term_id = $term && !is_wp_error($term) ? (int) $term->term_id : 0;
$paged = max(1, (int) get_query_var('paged'), (int) get_query_var('page'));

$latest_query = new WP_Query([
  'post_type' => 'post',
  'posts_per_page' => 1,
  'post_status' => 'publish',
  'cat' => $term_id,
]);
$latest_post_id = $latest_query->have_posts() ? (int) $latest_query->posts[0]->ID : 0;

$blog_query = new WP_Query([
  'post_type' => 'post',
  'paged' => $paged,
  'posts_per_page' => 8,
  'post_status' => 'publish',
  'cat' => $term_id,
  'post__not_in' => $latest_post_id ? [$latest_post_id] : [],
]);
?>

<main class="fjord-main fjord-blog">
  <section class="fjord-blog__layout">
    <div class="fjord-blog__featured">
      <?php if ($latest_query->have_posts()) : ?>
        <?php while ($latest_query->have_posts()) : $latest_query->the_post(); ?>
          <article <?php post_class('fjord-blog-card fjord-blog-card--featured'); ?>>
            <a class="fjord-blog-card__link" href="<?php the_permalink(); ?>">
              <div class="fjord-blog-card__media">
                <?php if (has_post_thumbnail()) : ?>
                  <?php the_post_thumbnail('large'); ?>
                <?php else : ?>
                  <div class="fjord-blog-card__placeholder"></div>
                <?php endif; ?>
              </div>
              <div class="fjord-blog-card__footer">
                <span class="fjord-blog-card__badge"><?php esc_html_e('Nuevo', 'fjord-clone'); ?></span>
                <span class="fjord-blog-card__footer-title"><?php the_title(); ?></span>
                <span class="fjord-blog-card__read"><?php esc_html_e('Leer', 'fjord-clone'); ?></span>
              </div>
            </a>
          </article>
        <?php endwhile; ?>
      <?php endif; ?>
    </div>

    <div class="fjord-blog__content">
      <section class="fjord-shop__intro fjord-blog__intro">
        <h1 class="fjord-shop__title"><?php echo esc_html(single_cat_title('', false)); ?></h1>
        <?php if (!empty($term->description)) : ?>
          <p class="fjord-shop__lead"><?php echo wp_kses_post($term->description); ?></p>
        <?php else : ?>
          <p class="fjord-shop__lead"><?php esc_html_e('Latest articles from this category.', 'fjord-clone'); ?></p>
        <?php endif; ?>
      </section>

      <?php if ($blog_query->have_posts()) : ?>
        <section class="fjord-blog__grid">
          <?php while ($blog_query->have_posts()) : $blog_query->the_post(); ?>
            <article <?php post_class('fjord-blog-card'); ?>>
              <a class="fjord-blog-card__link" href="<?php the_permalink(); ?>">
                <div class="fjord-blog-card__media">
                  <?php if (has_post_thumbnail()) : ?>
                    <?php the_post_thumbnail('large'); ?>
                  <?php else : ?>
                    <div class="fjord-blog-card__placeholder"></div>
                  <?php endif; ?>
                </div>
                <div class="fjord-blog-card__footer">
                  <span class="fjord-blog-card__footer-title"><?php the_title(); ?></span>
                  <span class="fjord-blog-card__read"><?php esc_html_e('Leer', 'fjord-clone'); ?></span>
                </div>
              </a>
            </article>
          <?php endwhile; ?>
        </section>

        <div class="fjord-blog__pagination">
          <?php
          echo paginate_links([
            'total' => $blog_query->max_num_pages,
            'current' => $paged,
            'prev_text' => '←',
            'next_text' => '→',
          ]);
          ?>
        </div>
      <?php else : ?>
        <p class="fjord-blog__empty"><?php esc_html_e('No posts found.', 'fjord-clone'); ?></p>
      <?php endif; ?>
    </div>
  </section>
</main>

<?php
wp_reset_postdata();
get_footer();
?>
