@extends('frontend.layouts.app')
@push('style')
@endpush
@section('content')
    <div>
        <div class="container mt-3">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="#">Home</a></li>
                    <li class="breadcrumb-item active" aria-current="page">Freequently Ask Question</li>
                </ol>
            </nav>
        </div>

        <div class="container mb-5 mt-5">
            <div class="row">
                <div class="col-12 faq-content">
                    @foreach ($faqs as $faq)
                        <div class="faq">
                            <div class="d-flex justify-content-between">
                                <h4>{{ $faq->question }}</h4>
                            </div>
                            <div class="">
                                <div class="card card-body">{!! $faq->answer !!}</div>
                            </div>
                        </div>
                    @endforeach
               
                </div>
            </div>
        </div>
    </div>
@endsection
@push('style')
    <style>
        .faq{
            height: auto;
            background-color:rgb(243, 243, 243);
            margin-bottom: 20px;
            padding: 20px;
         
        }
        .card-body {
            height: auto;
        }
    </style>
@endpush