  <!--start main wrapper-->
    <main class="main-wrapper">
        <div class="main-content">
            <div class="row my-2 g-2">
                <div class="col-md-6">
                    <div class="input-group custom-search">
                        <span class="input-group-text"><i class="bi bi-search"></i></span>
                        <input type="text" class="form-control" placeholder="Search..." aria-label="Search">
                    </div>
                </div>
               <div class="col-md-6 d-flex justify-content-end">
  <a href="<?= base_url('site/addcontent'); ?>" class="btn btn-p">Add a Prioritized Video</a>
</div>

<div class="row my-2 g-4">

  <?php 
  // Example array of posters — you can replace this later with dynamic data from DB
  $posters = ['poster.png', 'po2.png', 'po3.png', 'po4.png', 'po5.png', 'po6.png', 'po7.png', 'po8.png'];

  foreach ($posters as $poster): ?>
    <div class="col-md-3">
      <div class="video-card">
        
        <!-- Video Section -->
        <div class="video-container position-relative">
          <video class="w-100 video-element" poster="<?= base_url('assets/images/' . $poster); ?>"></video>
          <div class="play-button">
            <img src="<?= base_url('assets/images/play.png'); ?>" alt="Play" width="50">
          </div>
        </div>

        <!-- User Info -->
        <div class="d-flex align-items-center mt-3">
          <img src="<?= base_url('assets/images/uimg.png'); ?>" alt="User" class="user-photo me-2" />
          <div>
            <div class="user-name">Giana J</div>
            <div class="user-views">95,483,198 Views</div>
          </div>
        </div>

        <!-- Caption -->
        <p class="user-caption mt-2 mb-0">
          Follow me to help me glow! #crochet #felteyes #plushies #trending
        </p>

      </div>
    </div>
  <?php endforeach; ?>

</div>


        </div>

    </main>
    <!--end main wrapper-->