<?php
/**
 *
 * Single Post
 *
 * @package far_loop
 */

get_header();

$fields = array_fill_keys( array(
    'subtitle',
    'lead_description',
), null );

foreach ( $fields as $field => $value ) {
    $fields[$field] = get_field( $field );
}

// 🔹 Layout del header (tal cual tenías)
$post_layout = get_field('post_layout');
$layout_class = ($post_layout === 'two_columns') ? ' layout-two-columns' : ' layout-full';

$post_thumbnail_id       = get_post_thumbnail_id( $post );
$post_thumbnail_src      = wp_get_attachment_image_src( $post_thumbnail_id, 'full' );
$post_thumbnail          = get_post( $post_thumbnail_id );
$post_thumbnail_metadata = wp_get_attachment_metadata( $post_thumbnail_id );

while ( have_posts() ) : the_post(); ?>

<div class="u_pt-3 u_pt-md-6 wrapper-single-post <?php echo esc_attr($layout_class); ?>">
  <div class="l_container u_mv-1">

    <div class="container-header-post">

      <?php if ( $post_layout === 'full' ) { ?>

        <figure class="cover-image">
          <img src="<?php echo esc_url( $post_thumbnail_src[0] ); ?>" alt="<?php the_title_attribute(); ?>">
          <figcaption class="cover-image__caption"><?php echo esc_html( $post_thumbnail->post_excerpt ); ?></figcaption>
        </figure>

        <!-- page-title module-->
        <div class="page-title u_mb-3 u_mb-md-4">
          <!-- Page title-->
          <h1 class="page-title__alpha-title u_mb-0p5"><?php the_title(); ?></h1>

          <?php if ( ! empty( $fields['subtitle'] ) ) : ?>
            <!-- Page subtitle-->
            <h2 class="page-title__gamma-title u_mt-min0p5">&mdash; <?php echo esc_html( $fields['subtitle'] ); ?></h2>
          <?php endif; ?>

          <!-- Blog post date-->
          <div class="page-title__blog-post-date">
            <?php echo date_string( array( 'start_date' => get_the_date( 'c' ) ) ); ?>
          </div>
        </div>

      <?php } else { ?>

        <!-- page-title module-->
        <div class="page-title u_mb-3 u_mb-md-4">
          <!-- Blog post date-->
          <div class="page-title__blog-post-date">
            <?php echo date_string( array( 'start_date' => get_the_date( 'c' ) ) ); ?>
          </div>

          <!-- Page title-->
          <h1 class="page-title__alpha-title u_mb-0p5"><?php the_title(); ?></h1>

          <?php if ( ! empty( $fields['subtitle'] ) ) : ?>
            <!-- Page subtitle-->
            <h2 class="page-title__gamma-title u_mt-min0p5">&mdash; <?php echo esc_html( $fields['subtitle'] ); ?></h2>
          <?php endif; ?>
        </div>

        <figure class="cover-image">
          <img src="<?php echo esc_url( $post_thumbnail_src[0] ); ?>" alt="<?php the_title_attribute(); ?>">
          <figcaption class="cover-image__caption"><?php echo esc_html( $post_thumbnail->post_excerpt ); ?></figcaption>
        </figure>

      <?php } ?>

    </div><!-- /.container-header-post -->

    <?php if ( ! empty( $fields['lead_description'] ) ) : ?>
        <!-- lead-description module-->
        <div class="container-lead-description">
          <p class="lead-description u_mb-2 h1"><?php echo esc_html( $fields['lead_description'] ); ?></p>
        </div>
      <?php endif; ?>

    <div class="single-description">
      
      <!-- wysiwyg module-->
      <div class="wysiwyg">
        <?php the_content(); ?>
      </div>
    </div>

    <?php
    // =========================
    // Bloque: .post-image-blocks
    // =========================

    // Select ACF: 'post_image_layout' => 'full' | 'two'
    $post_image_layout = get_field('post_image_layout');

    // Campos de imagen (URL)
    $full_screen_image         = trim( (string) get_field('full_screen_image') );
    $two_columns_first_image   = trim( (string) get_field('two_columns_first_image') );
    $two_columns_second_image  = trim( (string) get_field('two_columns_second_image') );

    // Normalización de layout por defecto
    if ( ! in_array( $post_image_layout, array( 'full', 'two' ), true ) ) {
        $post_image_layout = ''; // nada que pintar si no hay valor válido
    }
    ?>

    <div class="post-image-blocks">
      <?php if ( $post_image_layout === 'full' && ! empty( $full_screen_image ) ) : ?>
        <figure class="post-image-block post-image-block--full">
          <img src="<?php echo esc_url( $full_screen_image ); ?>" alt="<?php echo esc_attr( get_the_title() ); ?>">
        </figure>

      <?php elseif ( $post_image_layout === 'two' && ( ! empty( $two_columns_first_image ) || ! empty( $two_columns_second_image ) ) ) : ?>
        <div class="post-image-block post-image-block--two grid u_mh-min1">
          <?php if ( ! empty( $two_columns_first_image ) ) : ?>
            <figure class="post-image-block__col">
              <img src="<?php echo esc_url( $two_columns_first_image ); ?>" alt="<?php echo esc_attr( get_the_title() ); ?>">
            </figure>
          <?php endif; ?>

          <?php if ( ! empty( $two_columns_second_image ) ) : ?>
            <figure class="post-image-block__col">
              <img src="<?php echo esc_url( $two_columns_second_image ); ?>" alt="<?php echo esc_attr( get_the_title() ); ?>">
            </figure>
          <?php endif; ?>
        </div>
      <?php endif; ?>
    </div><!-- /.post-image-blocks -->

  </div><!-- /.l_container -->

  <?php what_to_read_next_module(); ?>

</div><!-- /.wrapper-single-post -->

<?php endwhile; // End of the loop. ?>

<?php get_footer(); ?>