<style type="text/css">

.user-info-row-one {
  width: 100%;
}

.hostel_details_wrap .sele-sub-opt-two {
  margin-left: 20px;
  margin-top: 10px;
}
.red-pay {
  background-color: red;
}
</style>
<main class="common_margin" id="main"> 
  <div class="main-wrap">
    <div class="my-info-inner">

      <?php if($this->session->flashdata('success')) { ?>

        <div class="alert alert-success alert-dismissible fade show" role="alert">
          <p><?php echo $this->session->flashdata('success') ?></p>
          <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>

      <?php } ?>    

      <div class="payment-selection-wrap"> 
        <div class="hostel_details_wrap">
          <h4 class="payment_subhead">Hostel Details</h4>
          <?php if(!isset($hostel_room)) {
            echo 'Student has not been assigned with any room. Please contact Hostel Administrator';
          } else { ?>
            <ul class="hostel_details">
              <li><label>Joined Date:</label><span><?= date('d-m-Y', strtotime($hostel_room['joined_date'])) ?></span></li>
              <li><label>Block:</label><span><?= $hostel_room['block_name'] ?></span></li>
              <li><label>Floor:</label><span><?= $hostel_room['floor_name'] ?></span></li>
              <li><label>Room No:</label><span><?= $hostel_room['room_name'] ?></span></li>
              <li><label>Room Type:</label><span><?= $hostel_room['room_ac'] ?></span></li>
              <li><label>Bed No:</label><span><?= $hostel_room['bed_name'] ?></span></li>
              <li><label>Food Type:</label><span><?= $hostel_room['food_type'] ?></span></li> 
            </ul>
          <?php } ?>
          

        </div>
        <?php if(isset($installment)) { ?>
          <div class="hostel_details_wrap"> 
            <h4 class="payment_subhead">Hostel Fee Details</h4>
            <div class="user-info-row-one">
              <div class="user-info-one-fees">
                <p>Hostel Fee Total:</p>
                <p>N<?= $installment['amount'] ?></p> 
              </div> 
              <div class="user-info-one-fees">
                <p>Payment Dates:</p>
                <ul class="sele-sub-opt-two" style="list-style-type: none;"> 
                  <?php 
                  $flag = true;
                  foreach ($installment['due_amount_date'] as $key => $value) {
                    foreach ($value as $index => $ele) { 
                      $due_date = date('Y-m-d', strtotime($ele->due_date));
                      $current_date = date('Y-m-d');
                      $class = $ele->payment_status == 'yes' ? 'green-pay' : '';
                      ?>

                      <li>
                        <?php if($ele->payment_status == 'yes') { ?>
                          <div class="outter-pay-wrap" style="display: flex;">
                            <div class="outter-check  <?= $class ?>"><i class="fa fa-check"></i></div> <!-- green-pay -->
                            <p class="paid-para">N<?= $ele->amount ?> </p>
                          </div> 
                          <div class="paid-space">  Paid date: <?= $ele->paid_date ?> </div>
                        <?php } else { ?>
                          <div class="outter-pay-wrap" style="display: flex;">
                           <?php if(($due_date > $current_date)) { ?>
                            <div class="outter-check  <?= $class ?>"><i class="fa fa-check"></i></div>
                            <?php } else { ?>
                              <div class="outter-check red-pay"><i class="fas fa-times"></i></div>
                            <?php }  ?>
                             <!-- green-pay -->
                            <p class="paid-para">N<?= $ele->amount ?> </p>
                          </div> 
                          <div class="paid-space">  Due date: <?= $ele->due_date ?> </div>
                        <?php } ?>
                        
                        <?php if($ele->payment_status == 'no' && $flag) { ?>
                          <a href="<?= base_url() ?>student/pay_hostel_fees/<?= $encrypted ?>" class="fees-pay-btn text-white">Pay Now</a>
                          <?php $flag = false; } ?>

                        </li>

                      <?php }
                    }
                    ?>


                  </ul>
                </div> 
              </div> 
            </div>
          <?php } ?>


        </div> 
      </div>
    </div>  
  </main>