@extends('layout.master')
@section('meta')
    @include('layout.partials.seo', [
        'title' => nova_get_setting_translate('faq_meta_title'),
        'description' => nova_get_setting_translate('faq_meta_description'),
        'keywords' => nova_get_setting_translate('faq_meta_keywords'),
        'image' => Storage::url(nova_get_setting('faq_banner')),
        'schema' => nova_get_setting('faq_schema')
    ])
@endsection
@section('content')
    <!-- Common Banner Area -->
    <section id="common_banner" style="background-image:url({{Storage::url(nova_get_setting('faq_banner'))}});"
            role="img"
            aria-label="{{ nova_get_setting_translate('faq_alt') }}"
            title="{{ nova_get_setting_translate('faq_title') }}">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="common_bannner_text">
                        <h1>{{ nova_get_setting_translate('faq_name') }}</h1>
                        <ul>
                            <li><a href="{{route('home')}}">{{__('general.home')}}</a></li>
                            <li><span><i class="fas fa-circle"></i></span>{{ nova_get_setting_translate('faq_name') }}</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- Faqs Area -->
    <section id="faqs_main_arae" class="section_padding">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-12">
                    <div class="section_heading_center">
                        <h2>{{ nova_get_setting_translate('faq_title') }}</h2>
                    </div>
                </div>
            </div>
            <div class="faqs_area_top">
                <div class="row">
                    <div class="col-lg-8">
                        <div class="faqs_three_area_wrapper">
                        <!-- Item One -->
                            <div class="faqs_item_wrapper">
                                <div class="faqs_main_item">
                                    <div class="accordion" id="accordionExample">
                                        @foreach ($faqs as $item)                                        
                                        <div class="accordion-item">
                                            <h2 class="accordion-header" id="heading{{$loop->index}}">
                                                <button class="accordion-button" type="button" data-bs-toggle="collapse"
                                                    data-bs-target="#collapse{{$loop->index}}" aria-expanded="{{$loop->first ? 'true' : 'false'}}"
                                                    aria-controls="collapse{{$loop->index}}">
                                                    {{$item->question}}
                                                </button>
                                            </h2>
                                            <div id="collapse{{$loop->index}}" class="accordion-collapse collapse {{$loop->first ? 'show' : ''}}"
                                                    aria-labelledby="heading{{$loop->index}}" data-bs-parent="#accordionExample">
                                                    <div class="accordion-body">
                                                        {!! $item->answer !!}
                                                    </div>
                                            </div>
                                        </div>
                                        @endforeach
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="faqs_call_area">
                            <img src="{{asset('assets/images/icon/call.png')}}" alt="img">
                            <h5>{{__('general.contact_us')}}</h5>
                            <h3><a href="tel:{{nova_get_setting('site_phone')}}">{{nova_get_setting('site_phone')}}</a></h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection