@extends('website.includes.layout')
@section('meta_title', $cms->meta_title ?? '')
@section('meta_keyword', $cms->meta_keyword ?? '')
@section('meta_description', $cms->meta_description ?? '')
@section('image', $cms->image ?? '')
@section('content') 


@include('website.sections.breadcumb', 
   ['heading' => $cms->display_name,
   'pagename' => $cms->display_name,
   'breadcumb_image' => showImage($bg->image ?? '', $bg->image_webp ?? '')
   ]
) 



<section class="exam-container-acsnew py-5">
    <div class="container">
    <div class="row m-0">
        <div class="section-title text-center mb-4">
            <h2 class="mb-2">{{ $cms->heading ?? '' }}</h2>
            <p class="text-center mt-1">{{ $cms->short_description ?? '' }}</p>
        </div>
        <div class="col-md-6">
            <div class="exam-container-content">
                {!! $cms->description ?? '' !!}
            </div>
        </div>
        <div class="col-md-6">
            <div class="exam-container-img">
                <img src="{{ showImage($cms->image ?? '',$cms->image_webp ?? '') }}" alt="{{ $cms->heading ?? '' }}">
            </div>
        </div>
    </div>
    </div>
</section>

@if(!empty($cms->description_two))
<section class="exam-full-boxnew pb-5">
    <div class="container">
        <div class="row m-0">
            <div class="col-12">
                <div class="exam-full-container">
                    {!! $cms->description_two ?? '' !!}
                </div>
            </div>
        </div>
    </div>
</section>
@endif




 @php $about_program = $cms->about_program ?? []; @endphp

@if (!empty($about_program ))
<section class="py-5 onli-sec-programmes">
    <div class="container">
        <div class="row m-0">
            <div class="onli-sec-programme-content text-center mb-4">
                <h2 class="mb-1"> {{ $cms->program_heading ?? '' }} </h2>
                <p class="text-center mt-2">{{ $cms->program_short_description ?? '' }}</p>
            </div>

              

              @foreach ($about_program  as $index => $value)
            <div class="col-md-4 mb-3">
                <div class="three-card-onli-sec-progr common-ul-li">
                    <h3>{{ $value['heading'] ?? '' }}</h3>
                    <div class="pos-card-mb-newmain">
                    <p>{{ $value['short_description'] ?? '' }}</p>
                    </div>
                </div>
            </div>
            @endforeach

        
        </div>
    </div>
</section>
@endif

@if (!empty($cms->about_exam))
<section class="exam-nid-criteria-acs py-5">
  <div class="container">
    <div class="row m-0">
      <div class="col-12">
      {!! $cms->about_exam ?? '' !!}
      </div>
    </div>
  </div>
</section>
@endif

@if(!empty($course_category))
<div class="course-area bg-img py-5 blue-bg-newacs">
   <div class="container">
      <div class="row m-0">
         <div data-aos="fade-up" class="section-title mb-4">
            <h2>{!! $home_settings->course_heading ?? '' !!}</h2>
         </div>
         <div class="d-block d-lg-flex align-items-start">
            <div class="nav flex-column nav-pills me-3 our-course-tabsmain mb-3" role="tablist">
               @foreach($course_category as $key => $cat)
               <button class="nav-link {{ $key == 0 ? 'active' : '' }}"
                  data-bs-toggle="pill"
                  data-bs-target="#tab-{{ $cat->id }}"
                  type="button">
               {{ $cat->category_name ?? '' }}
               </button>
               @endforeach
            </div>
            <div class="tab-content w-100">
               @foreach($course_category as $key => $cat)
                  <div class="tab-pane fade {{ $key == 0 ? 'show active' : '' }}" id="tab-{{ $cat->id }}">
                     <div class="row">
                        @if(!empty($course_by_category[$cat->id]) && count($course_by_category[$cat->id]) > 0)
                           @foreach($course_by_category[$cat->id] as $item)
                              <div data-aos="zoom-in" class="col-md-4 mb-3">
                                 <div class="single-course">
                                    <div class="course-img">
                                       <a href="{{ route('courseDetails', $item->page_url ?? '') }}">
                                          <img class="animated" src="{{ showImage($item->image, $item->image_webp) }}" alt="{{ $item->course_name }}">
                                       </a>
                                    </div>
                                    <div class="course-content">
                                       <h4><a href="{{ route('courseDetails', $item->page_url ?? '') }}">{{ $item->course_name }}</a></h4>
                                       <p>{{ $item->short_description ?? '' }}</p>
                                    </div>
                                    <div class="course-position-content">
                                       <div class="course-btn">
                                          <a class="default-btn" href="{{ route('courseDetails', $item->page_url ?? '') }}">READ MORE</a>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                           @endforeach
                        @endif
                     </div>
                  </div>
               @endforeach
            </div>
         </div>
      </div>
   </div>
</div>
@endif

@if(!empty($banner))
@include('website.sections.banner', ['banner' => $banner])
@endif

@php
    $faqs = $cms->faqs ?? [];
@endphp

@if (!empty($faqs))
<section class="faq-acsnew py-5">
    <div class="container">
        <h2 class="section-title">Frequently Asked <span>Questions</span></h2>

        <div class="faq-box">
            <div class="accordion" id="faqAccordion">

                @foreach($faqs as $index => $faq)

                    @php
                        $faqId = 'faq-' . $index;
                        $collapseId = 'collapse-' . $index;
                        $isFirst = $index === 0;
                    @endphp

                    <div class="accordion-item">
                        <h2 class="accordion-header" id="{{ $faqId }}">
                            <button class="accordion-button {{ !$isFirst ? 'collapsed' : '' }}"
                                    type="button"
                                    data-bs-toggle="collapse"
                                    data-bs-target="#{{ $collapseId }}">
                                {{ $faq['question'] ?? 'Question' }}
                            </button>
                        </h2>

                        <div id="{{ $collapseId }}"
                             class="accordion-collapse collapse {{ $isFirst ? 'show' : '' }}"
                             data-bs-parent="#faqAccordion">

                            <div class="accordion-body">
                                {!! $faq['answer'] ?? '' !!}
                            </div>
                        </div>
                    </div>

                @endforeach

            </div>
        </div>
    </div>
</section>
@endif

@if(!empty($banner))
@include('website.sections.banner', ['banner' => $banner])
@endif

@endsection