@extends('layouts.app')
@section('content')
<section class="pages_content">
  <div class="container">
    <div class="row">
      <div class="col-xs-12">
        <h1 class="page_title"> <i class="fa fa-question-circle"></i> مساعدة</h1>
        <div class="form-group theme_form">
          <div class="input-group ">
            <input type="text" class="form-control" id="search-faq" placeholder="البحث عن ..">
            <span class="input-group-btn">
              <button class="btn btn-secondary-outline" type="button"><i class="fa fa-search fa-lg"></i></button>
            </span>
          </div><!-- /input-group -->
        </div>
        <div class="clearfix"></div>
        <div class="panel-group faq_accord" id="accordion" role="tablist" aria-multiselectable="true">
          @foreach($faqs as $faq)
          @if($faq->is_published)
          <div class="panel panel-default">
            <div class="panel-heading" role="tab">
              <h4 class="panel-title">
                <a class="collapsed btn btn-success-outline btn-block text-xs-left faq-search" role="button" data-toggle="collapse" data-parent="#accordion" href="#accrd{{$faq->id}}" aria-expanded="false" aria-controls="collapseThree">
                 {{$faq->question}}
               </a>
             </h4><!--end panel-title-->
           </div><!--end panel-heading-->
           <div id="accrd{{$faq->id}}" class="panel-collapse collapse" role="tabpane{{$faq->id}}">
            <div class="panel-body card card-block card-success-outline h6 line_text">
              {{$faq->answer}}
            </div><!--end panel-body-->
          </div><!--end panel-collapse-->
        </div><!--end panel -->
        @endif
        @endforeach
        <!--////////////////-->
      </div><!--end #accordion-->
    </div><!--end col-xs-12-->
    <div class="clearfix"></div>
  </div><!--end row-->
</div><!--end container-->
</section><!--end pages_content -->
@endsection