wordpress media image showing in front page - pagination issue

I retrive the wordpress upload media in front end with this code:

<?php get_header(); ?>
<div class="media-gallery">
    <div class="container">

        <!-- Media Gallery Wrapper -->
        <div class="media-gallery__wrapper">
            <?php
            // Set up pagination variables
            $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
            $posts_per_page = 12; // Number of images per page

            // Fetch media images with pagination
            $args = array(
                'post_type'      => 'attachment',
                'post_mime_type' => 'image',
                'post_status'    => 'inherit',
                'posts_per_page' => $posts_per_page,
                'paged'          => $paged, // Use paged to handle pagination
            );

            $query = new WP_Query($args);

            if ($query->have_posts()) {
                while ($query->have_posts()) {
                    $query->the_post();
                    $image_url = wp_get_attachment_url(get_the_ID());
                    $image_title = get_the_title();
                    $used_status = get_post_meta(get_the_ID(), '_image_used', true);

                    // Check if the current user is an admin or editor
                    $can_edit = current_user_can('edit_posts');
            ?>
                    <div class="media-item">
                        <div class="media-item__top">
                            <img src="<?php echo esc_url($image_url); ?>" class="media-item__img" loading="lazy">
                            <div class="media-item__top--overlay">
                                <?php if ($can_edit) { ?>
                                    <span class="media-item__used-label" id="used-<?php echo get_the_ID(); ?>" style="background-color: <?php echo $used_status ? '#dc3545' : '#28a745'; ?>;">USED</span>
                                <?php } ?>
                                <a href="<?php echo esc_url($image_url); ?>" class="media-item__download" data-id="<?php echo get_the_ID(); ?>" download>
                                    <img src="<?php echo get_template_directory_uri() ?>/assets/images/download-mini.svg" alt="" width="24" height="24">
                                </a>
                            </div>
                        </div>
                        <?php if ($can_edit) { ?>
                            <div class="media-item__bottom">
                                <input type="text" id="title-<?php echo get_the_ID(); ?>" class="media-item__bottom--input" value="<?php echo esc_attr($image_title); ?>">
                                <button class="media-item__bottom--save-title" data-id="<?php echo get_the_ID(); ?>">ذخیره</button>
                            </div>
                        <?php } ?>
                    </div>
                <?php } ?>
        </div>
    <?php
                // Display pagination links
                $total_pages = $query->max_num_pages;
                if ($total_pages > 1) {
                    echo '<div class="pagination">';
                    echo paginate_links(array(
                        'current' => $paged,
                        'total'   => $total_pages,
                        'prev_text' => __('&laquo; Previous'),
                        'next_text' => __('Next &raquo;'),
                    ));
                    echo '</div>';
                }
            }
    ?>
    </div>
</div>
<?php get_footer();

however the pagingation is not working as expected. it will change the page to what I clicked but page one images still shows.also I noticed that the pagination link that I click to is not actived and still clickable (the page one remains active)! can anyone help me what should I do to make this correct?

I noticed that this code is right. another admin changed the front page to another but I don't know why the fornt page instead of getting template from front-page.php it gets from page-gallery.php. that was interfearing and the pagination not works as expected.