I have site and it is on hosting it uses apache server and php. I need to make pagination work because currently when I visit gallery on some page 2 or 3 it says page not found 404 with this url for example domain.com/gallery/page?page=2 . My other links and routing work fine and I need them to stay the same not to be overridden by pagination config. I have directories and files in my root like this

pages
   - gallery.php
   - about_us.php

.htaccess
 router.php
 config.php
 404.php
 phpinfo.php
 index.php

my htaccess looks like this

RewriteEngine On
RewriteBase /

# If the request is for a file or directory that exists, do nothing
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

# Redirect all requests to router.php
RewriteRule ^(.*)$ router.php?page=$1 [L,QSA]

RewriteRule ^gallery/([0-9]+)?$ pages/gallery.php?page=$1 [L]

routing.php

<?php
$page = isset($_GET['page']) ? $_GET['page'] : 'index';
$paginated = isset($_GET['paged']) ? (int)$_GET['paged'] : 1;

switch ($page) {
    case 'home':
        include('index.php');
        break;
    case 'about_us':
        include('pages/about_us.php');
        break;
    case 'blog':
        include('pages/blog.php');
        break;
    case 'book_appointment':
        include('pages/book_appointment.php');
        break;
    case 'events':
        include('pages/events.php');
        break;
    case 'gallery':
        include('pages/gallery.php');
        break;
    case 'price_list':
        include('pages/price_list.php');
        break;
    default:
        http_response_code(404);
        include('404.php');
        break;
}


?>

gallery.php

<?php include('header.php'); ?>

<!-- ***** Main Banner Area Start ***** -->

<!-- ***** Main Banner Area End ***** -->

<!-- ***** Gallery Section Start ***** -->
<section class="gallery">
  <div class="container">
    <?php 
    $totalImages = 127; // Total number of images
$imagesPerPage = 9; // Images per page (3 rows of 3 images each)
$currentPage = isset($_GET['paged']) ? (int)$_GET['paged'] : 1; // Use 'paged' instead of 'page'

$startIndex = max(1, ($currentPage - 1) * $imagesPerPage + 1);
$endIndex = min($startIndex + $imagesPerPage - 1, $totalImages);

for ($i = $startIndex; $i <= $endIndex; $i += 3): ?>
  <div class="row">
    <?php for ($j = $i; $j < $i + 3 && $j <= $endIndex; $j++): 
      $filename = "galerija ($j).jpg";
      $altText = "Image $j"; ?>
      <div class="col-md-3 mb-4">
        <div class="gallery-item" style="position: relative; overflow: hidden; width: 100%; padding-top: 75%;">
          <a href="<?php echo BASE_URL . 'images/gallery/' . str_replace(' ', '%20', $filename); ?>" data-fancybox="gallery" data-caption="<?php echo $altText; ?>">
            <img src="<?php echo BASE_URL . 'images/gallery/' . str_replace(' ', '%20', $filename); ?>" alt="<?php echo $altText; ?>" class="img-fluid" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;">
          </a>
        </div>
      </div>
    <?php endfor; ?>
  </div>
<?php endfor; ?>

<div class="pagination">
  <?php 
  $totalPages = ceil($totalImages / $imagesPerPage);
  for ($page = 1; $page <= $totalPages; $page++):
  ?>
    <a href="<?php echo BASE_URL . 'gallery/page?page=' . $page; ?>" class="btn btn-primary<?php echo $page === $currentPage ? ' active' : ''; ?>">
      <?php echo $page; ?>
    </a>
  <?php endfor; ?>
</div>



  </div>
</section>
<!-- ***** Gallery Section End ***** -->

<?php include('footer.php'); ?>

<!-- Include Fancybox CSS and JS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/[email protected]/dist/fancybox.css" />
<script src="https://cdn.jsdelivr.net/npm/@fancyapps/[email protected]/dist/fancybox.umd.js"></script>
<script>
  // Initialize Fancybox
  Fancybox.bind("[data-fancybox='gallery']", {
    infinite: true,
    keyboard: true,
    toolbar: true,
    buttons: [
      "zoom",
      "download",
      "thumbs",
      "close"
    ],
  });

  // Enhance keyboard navigation
  document.addEventListener('keydown', function(event) {
    const fancybox = Fancybox.getInstance();

    if (event.key === 'ArrowRight') {
      // Navigate to the next image
      fancybox?.next();
    } else if (event.key === 'ArrowLeft') {
      // Navigate to the previous image
      fancybox?.prev();
    } else if (event.key === 'Escape') {
      // Close the gallery
      fancybox?.close();
    }
  });
</script>

config.php

<?php
    define('BASE_URL', 'https://smashzone.rs/');
?>