@extends('layouts.master2')
@section('loginMobile')
@endsection
@section('pageHeader')
<div class="bg-gd-primary-lighter">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="py-5 bg-gd-primary-lighter text-white">
                   <div class="container">
                        <div class="row">
                            <div class="col-12">
                                <div class="pb-3">
                                    <span class="gd-font-xxl">
                                        Halo, apa yang bisa kami bantu?
                                    </span>
                                </div>
                            </div>
                            <div class="col-md-5">
                                <a href="https://wa.me/6281293501705" target="_blank" class="btn btn-gd-yellow btn-block">
                                    <div class="row align-items-center no-gutters p-2">
                                        <div class="col-1 text-left">
                                            <img src="{{ asset('img/icon/ic_chat.png') }}" class="img-fluid w-75" alt="Chat">
                                        </div>
                                        <div class="col-10  text-left">
                                            <span class="text-white font-weight-bold">Tanyakan Pertanyaanmu Disini</span>
                                        </div>
                                        <div class="col-1 text-right">
                                            <img src="{{ asset('img/icon/ic_arrow-right.png') }}" class="img-fluid w-75" alt="Go">
                                        </div>
                                    </div>
                                </a>
                            </div>
                        </div>
                   </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('content')
@if ($faqs)
<div class="container">
        <div class="py-3 py-md-5">
            <div class="row">
                <div class="col-12 ">
                    <p class="gd-font-xxl font-weight-bold">
                        Pertanyaan yang sering ditanyaakan
                    </p>
                </div>
            </div>
            <div class="row">
                <div class="col-12">
                    <div class="accordion gd-accordion" id="faqAccordion">
                        @foreach($faqs as $key => $faq)
                        <div class="card">
                            <div class="card-header" id="{{ 'headingFaq'. ((int)$key + 1 ) }}">
                                <h2 class="mb-0">
                                    <button class="btn btn-link" type="button" data-toggle="collapse" data-target="#{{ 'faq'. ((int)$key + 1 ) }}" aria-expanded="false" aria-controls="{{ 'faq'. ((int)$key + 1 ) }}">
                                        <div class="row">
                                            <div class="col-10">
                                                {{ $faq->question }}
                                            </div>
                                            <div class="col-2 text-right">
                                                <i class="fa fa-angle-down"></i>
                                            </div>
                                        </div>
                                    </button>
                                </h2>
                            </div>
    
                            <div id="{{ 'faq'. ((int)$key + 1 ) }}" class="collapse" aria-labelledby="{{ 'headingFaq'. ((int)$key + 1 ) }}" data-parent="#faqAccordion">
                                <div class="card-body">
                                    {!! $faq->answer !!}
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>
@endif
@endsection