@extends('front.frontLayout')
@section('title',isset($package_detail->name) ? $package_detail->name : 'Test Detail')
@section('pagelevelcss')
@stop
@section('content')
@if(isset($package_detail) && !empty($package_detail))
   
   <section class="test-detail section-padding" id="test-detail-sec">
      <div class="container">
         <div class="row  test-row-one">
            <!-- <div class="col-md-4">
               <div class="kit-img-wrapper">
                  <div class="img-wrapper">
                     <img src="{{ asset('uploads/'.$package_detail->package_image) }}" title="{{ $package_detail->name }}">
                  </div>
               </div>
            </div> -->
            <div class="col-md-8">
               <div class="kit-details">
                  <h3>{{ $package_detail->name }}</h3>
                  <p>{!! $package_detail->description !!}</p>
                  
                 
               </div>
            </div>
            <div class="col-md-4">
               <div class="text-detail-right">
                  <div class="kit-note">
                     <h4>Price</h4>
                     <ul>
                        <li>${{ $package_detail->price }}</li>
                     </ul>
                  </div>
                  <div class="kit-note">
                     <h4>Preparation</h4>
                     <ul>
                        <li>{{ $package_detail->preparation }}</li>
                     </ul>
                  </div>
                  <h4>Result</h4>
                  {!! $package_detail->result !!}
                  <div class="mx-auto text-center">
                        <a href="{{route('BookAppointment',$package_detail->id)}}" title="" class="custom-btn appointment">Appointment</a>
                        
                  </div>
               </div>
            </div>
         </div>
      </div>
   </section>
   <section class="testing-tabs-section section-padding" id="testing_kits_section">
      <div class="container">
         <div class="testing-tabs">
            <ul class="nav nav-tabs" role="tablist">
               <li class="nav-item home-tab" id="kitlist">
                  <a class="nav-link active" data-toggle="tab" href="#tabs-1" role="tab">
                     <h3 class="main-title text-center">What's In this Test?</h3>
                  </a>
               </li>
               <li class="nav-item clinic-tab">
                  <a class="nav-link" data-toggle="tab" href="#tabs-2" role="tab">
                     <h3 class="main-title text-center">Who Should Get Tested?</h3>
                  </a>
               </li>
            </ul>
            <!-- Tab panes -->
            <div class="tab-content">
               <div class="tab-pane home-tab active" id="tabs-1" role="tabpanel">
                  <div class="whats-in-test">
                     <div class="et_pb_tab_content">
                        {!! $package_detail->whats_in_this_test !!}
                     </div>
                  </div>
               </div>
               <div class="tab-pane clinic-tab" id="tabs-2" role="tabpanel">
                  <div class="whats-in-test">
                     <div class="et_pb_tab_content">
                        {!! $package_detail->who_should_get_tested !!}
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </section>
   <section class="test-deatil-step pt-2 pb-5 mt-0 mb-5">
      <div class="container">
         <div class="step-wrap">
            <div class="step-1 test-step">
               <h6>Step 1:</h6>
               <h6>Choose your Step</h6>
               <p>Shedule an appointment and pay online</p>
            </div>
            <div class="step-2 test-step">
               <h6>Step 2:</h6>
               <h6>Provide Sample</h6>
               <p>Bring confirmation number a long with Photo ID to our location </p>
            </div>
            <div class="step-3 test-step">
               <h6>Step 3:</h6>
               <h6>Access Your results online</h6>
               <p>View result online by logging in to your Account</p>
            </div>
         </div>
      </div>
   </section>
@else
   <section class="test-detail section-padding" id="test-detail-sec" style="text-align: center;">
      <p class="description">No data available.</p>
   </section>
@endif
@endsection
@section('pageleveljs')
@stop