Can't make carousel work in php: CodeIgniter - codeigniter

Question

I have added a carousel in a container but it remains static showing the first pic. Though the carousel buttons are visible but not active. The code is:
<div class="col-xl-8 col-lg-8 col-md-7 mb-5 mb-md-0">
<div id="" class="pt-0 pt-md-4 pt-lg-5">
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<?php if (!empty($event)) {
foreach ($event as $key => $value) {
?>
<li data-target="#carouselExampleIndicators" data-slide-to="<?= $key ?>" <?php if ($key == 0) { ?> class="active" <?php } ?>></li>
<?php }
} ?>
</ol>
<div class="carousel-inner">
<?php if (!empty($event)) {
foreach ($event as $key => $value) {
$date = date('d', strtotime($value['datetime']));
$month = date('F', strtotime($value['datetime']));
$year = date('Y', strtotime($value['datetime']));
$seconds = strtotime($value['datetime']) - time();
$days = floor($seconds / 86400);
$seconds %= 86400;
$hours = floor($seconds / 3600);
$seconds %= 3600;
$minutes = floor($seconds / 60);
$seconds %= 60;
$cdate = date("Y-m-d H:i:s", strtotime($value['datetime']));
if ($cdate > date("Y-m-d H:i:s")) {
?>
<div class="carousel-item <?php if ($key == 0) { ?>active<?php } ?>">
<div class="row">
<div class="col-md-12 col-lg-6 mb-4 mb-md-0">
<div class="d-flex align-items-center justify-content-between w-100">
<!--<div class="images-craus">-->
<!-- <img src="<?= base_url() ?>/images/upcomingevents/<?= $value['image1'] ?>">-->
<!--</div>-->
<div class="dates">
<h3 class="months"><?= $month ?> <?= $date ?><br><?= $year ?></h3>
<h3 class="team"><?= $cdate ?> <br><?= $value['team1'] ?> vs <?= $value['team2'] ?></h3>
</div>
<!--<div class="images-craus">-->
<!-- <img src="<?= base_url() ?>/images/upcomingevents/<?= $value['image2'] ?>">-->
<!--</div>-->
</div>
</div>
<div class="col-md-12 col-lg-6 mb-4 mb-md-0">
<div class="details1">
<div class="pt-0 pt-md-4 pb-3">
<h5 class="text-white text-center">Next Match<br><?= $value['team1'] ?> vs <?= $value['team2'] ?></h5>
</div>
<div class="button-20 d-flex">
<button type="button" class="btn btn-danger"><?= $days ?> day</button>
<button type="button" class="btn btn-danger"><?= $hours ?> hr</button>
<button type="button" class="btn btn-danger"><?= $minutes ?>min</button>
</div>
</div>
</div>
</div>
</div>
<?php }
}
} ?>
</div>
I tried looking at bootstrap feature but couldn't really work it out. Mind you this carousel also have a table list which shows on the right side of the container. I am not sharing it code as table is working fine.