<?php
/**
 * Template Name: Services Layout
 */
get_header();
include get_template_directory() . '/inc/menus/menu.php';
?>

<!-- HERO -->
<?php if ( has_post_thumbnail() ) : ?>
<section class="single-hero">
    <?php if (has_post_thumbnail()) : ?>
        <?php the_post_thumbnail('full', ['class' => 'single-hero-bg']); ?>
    <?php endif; ?>

    <div class="single-hero-content">
        <h1 class="single-hero-title"><?php the_title(); ?></h1>
    </div>
</section>
<?php endif; ?>

<div class="services-wrapper">

    <!-- SIDEBAR -->
    <aside class="services-sidebar">
        <ul>
            <?php
            $services_pages = new WP_Query([
                'post_type'      => 'page',
                'posts_per_page' => -1,
                'orderby'        => 'menu_order',
                'order'          => 'ASC',
                'tax_query'      => [
                    [
                        'taxonomy' => 'page_category',
                        'field'    => 'slug',
                        'terms'    => 'services',
                    ],
                ],
            ]);

            while ($services_pages->have_posts()) :
                $services_pages->the_post();
                $active = (get_the_ID() === get_queried_object_id()) ? 'active' : '';
            ?>
                <li class="<?php echo esc_attr($active); ?>">
                    <a href="<?php the_permalink(); ?>">
                        <span class="arrow">➜</span>
                        <?php the_title(); ?>
                    </a>
                </li>
            <?php endwhile; wp_reset_postdata(); ?>
        </ul>
    </aside>

    <!-- CONTENT -->
    <main class="services-content">
        <?php
        while ( have_posts() ) :
            the_post();
            the_content();
        endwhile;
        ?>
    </main>

</div>



<?php get_footer(); ?>
