<?php get_header(); ?>
<main id="main">
    <section class="section wrapper fade-in-right delay_02">
        <?php
        $args = array( 'post_type' => 'movies' );
        $movies = new WP_Query( $args );

        if ( $movies->have_posts() ) : while ( $movies->have_posts() ) : $movies->the_post();
        ?>
            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <header class="entry-header">
                    <h1 class="entry-title"><?php the_title(); ?></h1>
                </header>
                <div class="entry-content">
                    <?php the_content(); ?>
                </div>
                <div class="movie-meta">
                    <p><strong>Movie Title:</strong> <?php echo get_post_meta( get_the_ID(), 'movie_title', true ); ?></p>
                </div>
            </article>
        <?php endwhile;
        wp_reset_postdata();
        else :
            echo 'No Movies';
        endif;
        ?>
    </section>
    <section class="section wrapper login fade-in-left delay_03">
        <div class="login-wrapper">
            <h1>QSS Connect</h1>
            <form class="login-form">
                <div class="row">
                    <label for="email">Email:</label>
                    <input type="email" id="email" class="input" name="email" required />
                </div>
                <div class="row">
                    <label for="password">Password:</label>
                    <input type="password" id="password" class="input" name="password" required />
                </div>
                <button type="submit" class="button button-login">Login</button>
            </form>
            <div class="loader-wrapper"><div class="loader"></div></div>
            <h2 class="message"></h2>
            <button type="button" class="button button-logout">Logout</button>
        </div>
    </section>
</main>
<?php get_footer(); ?>