@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->course_name,
   'pagename' => $cms->course_name,
   'breadcumb_image' => showImage($bg->image ?? '', $bg->image_webp ?? '')
   ]
)  

<div class="course-details-area py-5 exam-nid-criteria-acs">
    <div class="container">
        <div class="row m-0">
            <div class="col-xl-9 col-lg-8 mb-3 mb-md-0">
                <div class="course-left-wrap">
                     @if (!empty($cms->image))
                    <div class="apply-area">
                        <img src="{{ showImage($cms->image ?? '',$cms->image_webp ?? '') }}" alt="{{ $cms->heading ?? '' }}">
                    </div>
                     @endif
                    <div class="course-detail-content-new common-ul-li mt-3">
                        <h1>{{ $cms->course_name ?? '' }}</h1>
                        <p>Total Fees : {{ $cms->total_fees ?? '' }}</p>
                        <p>Discount Fees : {{ $cms->discount_fees ?? '' }}</p>
                        <p>Course Duration : {{ $cms->duration ?? '' }}</p>
                         {!! $cms->description ?? '' !!}
                    </div>
                </div>
            </div>
            <div class="col-xl-3 col-lg-4">
                <div class="sidebar-style sidebar-res-mrg-none">
                    <div class="sidebar-recent-post">
                        <div class="sidebar-title mb-40">
                            <h4>Related Courses</h4>
                        </div>
                        <div class="recent-post-wrap">
                            @if (!empty($random_courses))
                            @foreach ($random_courses as $value)
                            <div class="single-recent-post">
                                <div class="recent-post-img">
                                    <a href="{{ route('courseDetails',  $value->page_url ?? '') }}"><img src="{{ showImage($value->image ?? '',$value->image_webp ?? '') }}" alt="{{ $value->course_name ?? '' }}"></a>
                                </div>
                                <div class="recent-post-content">
                                    <h5><a href="{{ route('courseDetails',  $value->page_url ?? '') }}">{{ $value->course_name ?? '' }}</a></h5>
                                    <p>{{ Str::limit($value->short_description ?? '', 100, '...') }}</p>
                                </div>
                            </div>
                            @endforeach
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>




@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($course_category))
<div class="course-area bg-img py-5" style="background-image:url(assets/img/bg/bg-1.jpg);">
    <div class="container">
        <div class="row m-0">

             <div class="section-title text-center mb-4">
            <h2 class="mb-2"><span>Related </span> Course Categories</h2>
         </div>

            @foreach ($course_category as $value)
            <div class="col-md-4 mb-3">
                <div class="single-course">
                    <div class="course-img">
                        <a href="{{ route('courseCategory', $value->page_url ?? '') }}"><img class="animated"
                                src="{{ showImage($value->image ?? '',$value->image_webp ?? '') }}" alt="{{ $value->category_name ?? '' }}"></a>
                    </div>
                    <div class="course-content course-only-conte-new">
                        <h4><a href="{{ route('courseCategory', $value->page_url ?? '') }}">{{ $value->category_name ?? '' }}</a></h4>
                       <p>{!! substr(strip_tags($value->description ?? ''), 0, 255) . '...' !!}</p>
                    </div>
                    <div class="course-position-content">
                        <div class="course-btn">
                            <a class="default-btn" href="{{ route('courseCategory', $value->page_url ?? '') }}">READ MORE</a>
                        </div>
                    </div>
                </div>
            </div>
            @endforeach
       </div>
    </div>
</div>
@endif



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


@endsection