<STYLE>
/* The container */
.container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 18px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #ebd3d3;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #e8e3e3;
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #2f5496;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}
</style>
<div class="container">
  
  <div class="row">
    <div class="col-12 text-center">
      <h2 class="heading"><?php echo ucwords($quiz_data['title']) ?></h2><hr>
    </div>
  </div>

  <div class="page-header">
    <?php 
      $csrf = array(
        'name' => $this->security->get_csrf_token_name(),
        'hash' => $this->security->get_csrf_hash()
      );
    ?>
  </div>
  <div class = "row" >
  <div  class="col-lg-8 order-lg-1 mb-8"> </div>
    <div  class="col-lg-4 order-lg-1 mb-4">
        <div class="card">
          <div class="card-header timer">
            <h3 class="card-title "><span class="float-left mr-3"> <?php echo lang('count_down'); ?>: </span>
               <span class="text-danger timerrr" data-seconds-left=<?php echo xss_clean($left_time); ?> > &nbsp; </span>
              <section class='actions'></section>
            </h3>
          </div>

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

  <form action="" method="POST" id="myform" >
    <input type="hidden" name="<?=$csrf['name'];?>" value="<?=$csrf['hash'];?>" />
    <?php $ques_no = 0; ?>
    <?php foreach($question_data as $quesData) {  ?>
    <div class="row">
      <div class="col-lg-10">
        <div class="card">
          <div class="card-header">
            <h3 class="card-title">
              
              <br />
              <p style="color: blue;"> <?php echo xss_clean($ques_no+1)." ) ". $quesData['title'] ;?></p>    
            </h3>
          </div>

          <div class="card-body">
            <div class="selectgroup selectgroup-pills w-100">
              <?php 
             // Print_r($quesData['choices']);
                $question_choies = json_decode($quesData['choices']);
                
                $question_choies_count = COUNT($question_choies);
                $checked = '';
                $option_selected = false;
                $chk = 'DUE';
                $p = 0;

                foreach ($question_choies as  $question_choice) 
                { 
                  $p++;              
                  $q_answer = isset($quesData['answer'])  ?  $question_data['answer'] : array();
                  foreach ($q_answer as  $value) 
                  {
                    if($question_choice == $value)
                    {
                      $checked = 'checked';
                      $option_selected = true;
                      $chk = 'DONE';
                    }
                  }
                  $is_multiple = $quesData['is_multiple'] == 1 ? 'checkbox' : 'radio';
              ?>

                  <label class="container">
                       <?php echo xss_clean($question_choice) ?>
                    <input <?php echo xss_clean($checked) ;?> type="<?php echo xss_clean($is_multiple); ?>" name="answer[<?php echo $ques_no ?>]" value="<?php echo xss_clean($question_choice) ?>" class="answer_input" >
                    <span class="checkmark"></span>
                
                  </label>
              <?php 
                  $checked = '';  
                             
                }
              ?>
            </div>
          </div>

         
        </div>
      </div>

      

    </div>
    <?php 
  $ques_no++;   
  }  ?>
    <div class="card-footer">
            <div class="card-options">

             <!--  <button type="Submit" name="mark_or_next_quiz" value="Mark for Review and Next" class="btn btn-sm btn-orange mr-2 ml-auto answer_given"><i class="fe fe-check-circle"></i><?php //echo lang('mark_for_review_and_next'); ?> </button> -->
              <!-- <button type="Submit" name="save_or_next_quiz" value="Save & Next" class="btn btn-sm btn-teal mr-2 answer_given"><i class="fe fe-save"></i>  echo lang('save_and_next'); ?></button> -->
              <button type="Submit" name="submit_test" value="submit_test" class="btn btn-primary btn-lg btn-block submit_test "><i class="fe fe-corner-down-right"></i> Submit <?php //echo lang('submit_test'); ?> </button>
            </div>
          </div>
  </form>

</div>
