<?php get_header(); ?>

<div class="container site-main">
    <div class="content-area">

        <div class="faq-archive-container">

            <header class="page-header">
                <h1 class="page-title"><?php _e( 'Häufig gestellte Fragen (FAQ)', 'minecraft-modern-theme' ); ?></h1>
                <p><?php _e( 'Wählen Sie eine Kategorie, um die passenden Fragen zu sehen.', 'minecraft-modern-theme' ); ?></p>
            </header>

            <?php
            $categories = get_terms( array(
                'taxonomy' => 'faq_category',
                'orderby'  => 'name',
                'order'    => 'ASC',
            ) );

            if ( ! empty( $categories ) && ! is_wp_error( $categories ) ) : ?>

                <ul class="faq-tabs">
                    <?php
                    $is_first = true;
                    foreach ( $categories as $category ) :
                        $active_class = $is_first ? 'active' : '';
                    ?>
                        <li>
                            <button class="faq-tab-button <?php echo esc_attr($active_class); ?>" data-category="<?php echo esc_attr($category->slug); ?>">
                                <?php echo esc_html( $category->name ); ?>
                            </button>
                        </li>
                    <?php
                        $is_first = false;
                    endforeach; ?>
                </ul>

                <div class="faq-tab-content-container">
                    <?php
                    $is_first_pane = true;
                    foreach ( $categories as $category ) :
                        $active_pane_class = $is_first_pane ? 'active' : '';
                    ?>
                        <div class="faq-tab-pane <?php echo esc_attr($active_pane_class); ?>" data-category="<?php echo esc_attr($category->slug); ?>">

                            <?php
                            $faqs = new WP_Query( array(
                                'post_type'      => 'faq',
                                'posts_per_page' => -1,
                                'tax_query'      => array(
                                    array(
                                        'taxonomy' => 'faq_category',
                                        'field'    => 'slug',
                                        'terms'    => $category->slug,
                                    ),
                                ),
                                'orderby' => 'menu_order',
                                'order'   => 'ASC',
                            ) );

                            if ( $faqs->have_posts() ) : ?>
                                <div class="faq-list">
                                    <?php while ( $faqs->have_posts() ) : $faqs->the_post(); ?>
                                        <div class="faq-item">
                                            <button class="faq-question"><?php the_title(); ?></button>
                                            <div class="faq-answer"><?php the_content(); ?></div>
                                        </div>
                                    <?php endwhile; ?>
                                </div>
                                <?php wp_reset_postdata();
                            else : ?>
                                <p><?php _e( 'Keine FAQs in dieser Kategorie gefunden.', 'minecraft-modern-theme' ); ?></p>
                            <?php endif; ?>

                        </div>
                    <?php
                        $is_first_pane = false;
                    endforeach; ?>
                </div>

            <?php else : ?>
                <p><?php _e( 'Keine FAQ-Kategorien gefunden.', 'minecraft-modern-theme' ); ?></p>
            <?php endif; ?>

        </div><!-- /faq-archive-container -->

    </div>
</div>

<?php get_footer(); ?>