@extends('front.layouts.app')

@section('content')

    <div class="main-content-box">
        <div class="height-counter d-flex  justify-content-between flex-column">
            <div class="terms-box pad-y">
                <div class="container">
                    <div class="row">
                        <div class="col-12 pad-x-100">
                            <div class="guide-box">
                                <div id="accordion">
                                    @forelse($faqs as $faq)
                                    <div class="card">
                                        <div class="card-header p-0" id="heading{{$faq->id}}">
                                            <h5 class="mb-0">
                                                <button class="btn btn-link d-flex align-items-center justify-content-between w-100 @if(!$loop->first) collapsed @endif" data-toggle="collapse" data-target="#collapseOne{{$faq->id}}" @if($loop->first)aria-expanded="true" @else aria-expanded="false" @endif aria-controls="collapseOne">
                                                    {{$faq->translation->title}} <i class="fas fa-angle-down"></i>
                                                </button>
                                            </h5>
                                        </div>

                                        <div id="collapseOne{{$faq->id}}" class="collapse @if($loop->first) show @endif" aria-labelledby="heading{{$faq->id}}" data-parent="#accordion">
                                            <div class="card-body">
                                                {!! $faq->translation->content !!}
                                            </div>
                                        </div>
                                    </div>
                                    @empty
                                    @endforelse
                                </div>

                               
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="bottom-content-mt">
                <div class="container">
                    <div class="row">
                        <div class="col-12 pad-x-100 text-center">
                            <a href="{{ url()->previous() }}" class="site-btn" >{{__('Close')}}</a>
{{--                            <button class="site-btn">Close</button>--}}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection