<?php
/**
 * Single Post Template
 *
 * @package Navier_Instruments
 */

get_header();
?>

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

<div class="single-post-header">
    <div class="container">
        <div class="single-post-meta">
            <?php
            $categories = get_the_category();
            if ($categories) :
            ?>
                <span class="post-category">
                    <a href="<?php echo esc_url(get_category_link($categories[0]->term_id)); ?>">
                        <?php echo esc_html($categories[0]->name); ?>
                    </a>
                </span>
            <?php endif; ?>

            <span class="post-date">
                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
                    <line x1="16" y1="2" x2="16" y2="6"></line>
                    <line x1="8" y1="2" x2="8" y2="6"></line>
                    <line x1="3" y1="10" x2="21" y2="10"></line>
                </svg>
                <?php echo get_the_date(); ?>
            </span>

            <span class="post-author">
                <?php echo get_avatar(get_the_author_meta('ID'), 32); ?>
                <?php the_author(); ?>
            </span>
        </div>

        <?php the_title('<h1 class="page-title">', '</h1>'); ?>
    </div>
</div>

<?php if (has_post_thumbnail()) : ?>
    <div class="single-post-thumbnail" style="padding: 0 0 var(--spacing-2xl);">
        <div class="container">
            <img src="<?php echo esc_url(get_the_post_thumbnail_url(get_the_ID(), 'large')); ?>" alt="<?php the_title_attribute(); ?>" style="width: 100%; max-width: 800px; margin: 0 auto; display: block; border-radius: var(--border-radius-lg);">
        </div>
    </div>
<?php endif; ?>

<div class="single-post-content">
    <div class="container">
        <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
            <div class="entry-content">
                <?php
                the_content();

                wp_link_pages(array(
                    'before' => '<div class="page-links">' . esc_html__('Pages:', 'navier-instruments'),
                    'after'  => '</div>',
                ));
                ?>
            </div>

            <footer class="entry-footer" style="margin-top: var(--spacing-2xl); padding-top: var(--spacing-xl); border-top: 1px solid var(--navier-gray-300);">
                <?php
                $tags = get_the_tags();
                if ($tags) :
                ?>
                    <div class="post-tags" style="display: flex; gap: var(--spacing-sm); flex-wrap: wrap;">
                        <span style="font-weight: 600;"><?php esc_html_e('Tags:', 'navier-instruments'); ?></span>
                        <?php foreach ($tags as $tag) : ?>
                            <a href="<?php echo esc_url(get_tag_link($tag->term_id)); ?>" style="background: var(--navier-gray-100); padding: var(--spacing-xs) var(--spacing-sm); border-radius: var(--border-radius-sm); font-size: 0.875rem;">
                                <?php echo esc_html($tag->name); ?>
                            </a>
                        <?php endforeach; ?>
                    </div>
                <?php endif; ?>
            </footer>
        </article>

        <!-- Post Navigation -->
        <nav class="post-navigation" style="margin-top: var(--spacing-2xl); padding-top: var(--spacing-xl); border-top: 1px solid var(--navier-gray-300);">
            <?php
            the_post_navigation(array(
                'prev_text' => '<span class="nav-subtitle">' . esc_html__('Previous:', 'navier-instruments') . '</span><span class="nav-title">%title</span>',
                'next_text' => '<span class="nav-subtitle">' . esc_html__('Next:', 'navier-instruments') . '</span><span class="nav-title">%title</span>',
            ));
            ?>
        </nav>

        <?php
        // If comments are open or we have at least one comment, load up the comment template.
        if (comments_open() || get_comments_number()) :
            comments_template();
        endif;
        ?>
    </div>
</div>

<?php
endwhile;

get_footer();
