@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="online-coaching-section py-5">
    <div class="container">
        <div class="row m-0">
            <div class="online-section-coach-content">
                <h1>{{ $cms->heading ?? '' }}</h1>
                <p>{{ $cms->short_description ?? '' }}</p>
                <img src="{{ showImage($cms->image_two ?? '',$cms->image_two_webp ?? '') }}" alt="{{ $cms->heading ?? '' }}" class="mb-2">
                {!! $cms->description ?? '' !!}
            </div>
        </div>
    </div>
</section>




@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

 @php $overview = $cms->overview ?? []; @endphp
@if (!empty($overview ))
<section class="online-coaching-overviewacs py-5">
    <div class="container">
        <div class="row m-0">
            <div class="onli-sec-programme-content">
                <h2>Overview</h2>
            </div>
            <div class="d-block d-lg-flex align-items-start">
                <div class="nav flex-column nav-pills me-3" id="v-pills-tab" role="tablist">
                    @foreach($overview as $index => $tab)
                        <button class="nav-link {{ $index == 0 ? 'active' : '' }}"
                                id="overview-tab-{{ $index }}"
                                data-bs-toggle="pill"
                                data-bs-target="#overview-{{ $index }}"
                                type="button"
                                role="tab">
                            {{ $tab['heading'] ?? '' }}
                        </button>
                    @endforeach
                </div>
                <div class="tab-content" id="v-pills-tabContent">
                    @foreach($overview as $index => $tab)
                        <div class="tab-pane fade {{ $index == 0 ? 'show active' : '' }}"
                             id="overview-{{ $index }}"
                             role="tabpanel">
                            <div class="overviewacs-content">
                                <div class="overview-insi-conttent">
                                    <h2>{{ $tab['heading'] ?? '' }}</h2>
                               <p>{{ $tab['short_description'] ?? '' }}</p>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </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 class="btn-card-new-onli">
                        <a href=" {{ route('contact') }}">Enroll Now</a>
                    </div>
                </div>
            </div>
            @endforeach
        </div>
    </div>
</section>
@endif


@if (!empty($review ))
<section class="testi-newnormal py-5">
    <div class="container">
        <div class="row m-0">
            <div data-aos="fade-up" class="section-head">
                <h2>Certification Reviews</h2>
            </div>
            <div class="swiper myTestiSwiper">
                <div class="swiper-wrapper testi-normal-new">
                   @foreach ($review as $value)
                    <div data-aos="zoom-in" class="swiper-slide">
                        <div class="testi-card">
                            <img class="testi-avatar" src="{{ showImage($value->image ?? '',$value->image_webp ?? '') }}"
                                alt="{{ $value->name ?? '' }}">
                            <div class="testi-name">{{ $value->name ?? '' }}</div>
                            <div class="testi-text">{{ $value->short_description ?? '' }}</div>
                                @php
                                    $rating = (int) ($value->rating ?? 0);
                                @endphp
                                <div class="testi-stars">
                                    @for ($i = 1; $i <= 5; $i++)
                                        @if ($i <= $rating)
                                            ★
                                        @endif
                                    @endfor
                                </div>
                        </div>
                    </div>
                    @endforeach
                </div>
                <div class="swiper-pagination mt-4 d-none"></div>
            </div>
        </div>
    </div>
</section>
@endif


@if (!empty($course_advisor ))
<section class="advisor-acs-mainnew py-5">
    <div class="container">
      <div class="row m-0">
        <div class="col-12 text-center mb-4">
          <h2 class="section-title">Gen AI Courses Advisors</h2>
        </div>
      </div>
        <div class="col-12">
          <div class="swiper advisorSwiper">
            <div class="swiper-wrapper">
            @foreach ($course_advisor as $value)
                <div class="swiper-slide d-flex justify-content-center">
                    <div class="advisor-card-wrap">
                    <img class="advisor-photo" src="{{ showImage($value->image ?? '',$value->image_webp ?? '') }}" alt="{{ $value->name ?? '' }}">
                    <div class="advisor-card">
                        <h5>{{ $value->name ?? '' }}</h5>
                        <p class="role">{{ $value->designation ?? '' }}</p>
                        <p class="desc">
                        {{ $value->short_description ?? '' }}
                        </p>
                    </div>
                    <div class="bottom-accent"></div>
                    </div>
                </div>
            @endforeach
            </div>
                            <div class="advisor-btnnrw">
                    <div class="swiper-button-prev advisor-btn-both" aria-label="Previous"></div>

                    <div class="advisor-middle-line">
                        <div class="advisor-middle-active"></div>
                    </div>

                    <div class="swiper-button-next advisor-btn-both" aria-label="Next"></div>
                </div>


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

  @if (!empty($cms->class_heading) || !empty($cms->class_short_detail) || !empty($cms->class_short_description))
<section class="only-content-container-acs default-overlay py-5">
    <div class="container">
        <div class="row m-0">
            
            <div class="col-12">
                <div class="content-box-acs" id="contentBox">
                    <h2 class="mb-3">{{ $cms->class_heading ?? '' }}</h2>
                    <h5 class="mb-3">{{ $cms->class_short_detail ?? '' }}</h5>
                    <p>{{ $cms->class_short_description ?? '' }}</p>
                <a href="{{ route('contact') }}"  class="default-btn">Read More</a>
            </div>

        </div>
    </div>
</section>
@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