@extends('web.layout.default')
@section('page_title')
    | {{ trans('labels.faq') }}
@endsection
@section('content')
    <div class="breadcrumb-sec">
        <div class="container">
            <div class="breadcrumb-sec-content">
                <nav class="text-dark d-flex breadcrumb-divider" aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item {{ session()->get('direction') == '2' ? 'breadcrumb-item-rtl ps-0' : '' }}"> <a class="fw-bold text-dark" href="{{ route('home') }}">{{ trans('labels.home') }}</a> </li>
                        <li class="breadcrumb-item {{ session()->get('direction') == '2' ? 'breadcrumb-item-rtl ps-0' : '' }} text-primary fw-bold active" aria-current="page">{{ trans('labels.faq') }}</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>
    <section class="my-5">
        <div class="container faq">
            <h3 class="fw-bold fs-2 mb-4 color-changer truncate-2">{{ trans('labels.faq') }}</h3>
            @if(count($getfaqs) > 0)
                <div class="d-lg-flex justify-content-center">
                    @php
                        $i = 1;
                    @endphp
                    <div class="col-lg-6 col-12 p-2 faq-img">
                        <img src="{{ helper::image_path(helper::appdata()->faq_image) }}" class="w-100" alt="">
                    </div>
                    <div class="col-lg-6 col-12 p-2">
                        <div class="accordion faq" id="faqleft">
                            @foreach ($getfaqs as $key => $faqdata)
                            <div class="accordion-item border-0 bg-transparent d-flex flex-column gap-3 rounded mb-3">
                                <h2 class="accordion-header border rounded" id="faq{{$key}}">
                                    <button class="accordion-button shadow-none rounded mb-0 {{$key==0 ? '' : 'collapsed'}} {{ session('direction') == 2 ? 'rtl' : ' ' }}" type="button" data-bs-toggle="collapse"
                                        data-bs-target="#faqs{{$key}}" aria-expanded="{{$key==0 ? 'true' : 'false'}}" aria-controls="collapseOne">
                                        {{$faqdata->title}}
                                    </button>
                                </h2>
                                <div id="faqs{{$key}}" class="accordion-collapse collapse {{$key==0 ? 'show' : ''}}" aria-labelledby="faq{{$key}}"
                                    data-bs-parent="#faqleft">
                                    <div class="accordion-body card fs-7 text-muted fw-600">{{$faqdata->description}}</div>
                                </div>
                            </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            @else
                @include('web.nodata')
            @endif
        </div>
    </section>

@endsection
@section('scripts')
@endsection