<?php get_header(); ?>

<main class="main-content">
    <div class="container">
        
        <!-- Search Results Header -->
        <div class="search-results-header">
            <h1>Resultados de búsqueda para: <?php echo get_search_query(); ?></h1>
            <p>Se encontraron <?php echo $wp_query->found_posts; ?> resultados</p>
        </div>
        
        <!-- Search Results Grid -->
        <?php if (have_posts()) : ?>
            <div class="search-results-grid">
                <?php
                $post_count = 0;
                while (have_posts() && $post_count < 14) : // 2 rows of 7 posts
                    the_post();
                    $post_count++;
                ?>
                    <?php
                    // Get post categories and tags for filtering
                    $post_categories = get_the_category();
                    $post_tags = get_the_tags();
                    $filter_classes = '';
                    
                    if ($post_categories) {
                        foreach ($post_categories as $cat) {
                            $filter_classes .= ' category-' . $cat->slug;
                        }
                    }
                    
                    if ($post_tags) {
                        foreach ($post_tags as $tag) {
                            $filter_classes .= ' tag-' . $tag->slug;
                        }
                    }
                    ?>
                    <article class="post-item search-result-item<?php echo esc_attr($filter_classes); ?>">
                        <a href="<?php the_permalink(); ?>">
                            <?php pulsegrid_post_thumbnail_with_badges('medium'); ?>
                        </a>
                        <div class="post-content">
                            <h3 class="post-title">
                                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
                            </h3>
                        </div>
                    </article>
                <?php endwhile; ?>
            </div>
            
            <!-- Pagination -->
            <div class="pagination">
                <?php
                echo paginate_links(array(
                    'prev_text' => '« Anterior',
                    'next_text' => 'Siguiente »',
                    'type' => 'list'
                ));
                ?>
            </div>
            
        <?php else : ?>
            <div class="no-results">
                <h2>No se encontraron resultados</h2>
                <p>Lo sentimos, pero no se encontraron resultados para tu búsqueda. Intenta con otros términos.</p>
                
                <!-- Search form -->
                <div class="search-again">
                    <form role="search" method="get" class="search-form" action="<?php echo home_url('/'); ?>">
                        <input type="search" class="search-input" placeholder="Buscar de nuevo..." value="" name="s" />
                        <button type="submit" class="search-submit">Buscar</button>
                    </form>
                </div>
                
                <!-- Suggested posts -->
                <div class="suggested-posts">
                    <h3>Quizás te interese:</h3>
                    <div class="posts-grid">
                        <?php
                        $suggested_posts = new WP_Query(array(
                            'posts_per_page' => 7,
                            'orderby' => 'rand'
                        ));
                        
                        if ($suggested_posts->have_posts()) :
                            while ($suggested_posts->have_posts()) : $suggested_posts->the_post();
                        ?>
                            <article class="post-item">
                                <a href="<?php the_permalink(); ?>">
                                    <?php if (has_post_thumbnail()) : ?>
                                        <img src="<?php the_post_thumbnail_url('medium'); ?>" alt="<?php the_title(); ?>" class="post-thumbnail">
                                    <?php else : ?>
                                        <div class="post-thumbnail no-image">Sin imagen</div>
                                    <?php endif; ?>
                                    <div class="post-content">
                                        <h3 class="post-title"><?php the_title(); ?></h3>
                                    </div>
                                </a>
                            </article>
                        <?php
                            endwhile;
                            wp_reset_postdata();
                        endif;
                        ?>
                    </div>
                </div>
            </div>
        <?php endif; ?>
        
    </div>
</main>

<?php get_footer(); ?>
