<?php global $site_url, $zon; ?>
<section class="section-wise wow fadeInDown mt-8">
  <div class="heading flex justify-between">
    <h2 class="text-2xl font-bold">Blogs</h2>
    <a href="<?php echo $site_url ?>blogs" class="capitalize text-sm">more</a>
  </div>
  <div class="m-slider-container relative ">
    <div data-target=".slider-container-blog" class="pagination-container">
      <div class="left-pagination Pagination">
        <button>
          <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" stroke-width="1.5"
            viewBox="0 0 24 24" color="#000000">
            <path style="stroke: var(--zon-common-text-color);" stroke="#000000" stroke-width="1.5"
              stroke-linecap="round" stroke-linejoin="round" d="m15 6-6 6 6 6"></path>
          </svg>
        </button>
      </div>
      <div class="right-pagination Pagination">
        <button>
          <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" stroke-width="1.5"
            viewBox="0 0 24 24" color="#000000">
            <path style="stroke: var(--zon-common-text-color);" stroke="#000000" stroke-width="1.5"
              stroke-linecap="round" stroke-linejoin="round" d="m9 6 6 6-6 6"></path>
          </svg>
        </button>
      </div>
    </div>
    <div class="slider-container-blog relative overflow-x-scroll scroll-none mt-3">
      <div style="width: calc(300px * <?php echo $zon['config']['section_games_limit'] ?>)" class="silders flex gap-6">
        <?php foreach (getBlogs() as $blog) { ?>
          <div class="game-card">
            <img class="object-cover" src="<?= $site_url . 'static/blog/' . $blog['blog_image'] ?>" />
            <div class="game-details">
              <a href="<?php echo $site_url . 'blog/' . makeSlug($blog['blog_title']) . '/' . $blog['id'] ?>" class="text-md line-clamp-2 font-semibold"><?= $blog['blog_title'] ?></a>
              <p class="text-sm text-muted "><?= $blog['blog_date'] ?></p>
            </div>
          </div>
        <?php } ?>
      </div>
    </div>
  </div>


</section>

<?php if (getAd('3,4', 'status') == 0) { ?>
  <div class="p-2 mt-4 mb-4">
    <div class="ads flex justify-center">
      <?php echo getAd('3,4', 'code') ?>
    </div>
  </div>
<?php } ?>