@extends('layouts.master')

@section('title', '- Maps')

@section('content')

<div class="detailpage" style="background-color: #eeeeee;">

    <div class="row">
        <div class="detail-headerbox">
            <h1>
                Sie haben noch Fragen?
            </h1>

            <br>

            <div class="outer-row">
                <div class="detail-row">
                    <div class="detail-second-col">
                        Hier erfahren Sie mehr!
                    </div>
                </div>
            </div><!-- .outer-row -->
        </div>
    </div>

    <div class="detail-content">
        <div class="detail-content-inner">
            <div class="row px-3">
                <div class="col-12 px-0 faq_list">
                    @for($i = 0; $i < count($faq); $i++)
                        <div class="group_title pl-3">
                            {{ $faq[$i]['title'] }}
                        </div>
                        @if($faq[$i]['desc'])
                            <div class="group_desc">
                                {{ $faq[$i]['desc'] }}
                            </div>
                        @endif
                        <div class="accordion">
                            @for($j=0; $j < count($faq[$i]['faq']); $j++)
                                <div class="card">
                                    <div class="card-header" id="group_{{ $i }}_heading_{{ $j }}">
                                        <h5 class="mb-0">
                                            <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#group_{{ $i }}_faq_{{ $j }}" aria-expanded="true" aria-controls="group_{{ $i }}_faq_{{ $j }}">
                                                <i class="fas fa-angle-right"></i><i class="fas fa-angle-down"></i> {{ $faq[$i]['faq'][$j]['question'] }}
                                            </button>
                                        </h5>
                                    </div>
                                    <div id="group_{{ $i }}_faq_{{ $j }}" class="collapse" aria-labelledby="group_{{ $i }}_heading_{{ $j }}">
                                        <div class="card-body">
                                            {!! $faq[$i]['faq'][$j]['answer'] !!}
                                        </div>
                                    </div>
                                </div>
                            @endfor
                        </div>
                    @endfor
                </div>
            </div>
        </div>
    </div>
@endsection