@extends('frontend.layouts.master')
@section('styles')
@parent
@stop
@section('content')
<main>
  <section class="inner_banner">
    <div class="bg_ p_img">
        @if(!empty($apartments_for_sale) && !empty($apartments_for_sale->getData('banner_image')))
        <picture>
            <source srcset="{{webp($apartments_for_sale->getData('banner_image'))}}" type="image/webp">
            <source srcset="{{PP($apartments_for_sale->getData('banner_image'))}}" type="image/{{FT($apartments_for_sale->getData('banner_image'))}}">
            <img src="{{PP($apartments_for_sale->getData('banner_image'))}}" loading="lazy" alt="">
        </picture>
        @else
        <picture>
            <source srcset="{{getFrontendAsset('images/project_banner.webp')}}" type="image/webp">
            <source srcset="{{getFrontendAsset('images/project_banner.jpg')}}" type="image/jpeg">
            <img src="{{getFrontendAsset('images/project_banner.jpg')}}" loading="lazy" alt="">
        </picture>
        @endif
    </div>


    <div class="container">
      <div class="page_title no_p_b">
        <div class="breadcrumb_wrap">
          <ul>
            <li>
              <a href="{{URL::to('/')}}" class="link_">
                {{lang('home')}}
              </a>
            </li>

            <li class="active_">
               <span>{{lang('apartments_for_sale')}}</span>
            </li>
          </ul>
        </div>
        <h1>
        @if(!empty($apartments_for_sale) && !empty($apartments_for_sale->getData('post_title')))
          <span>{{$apartments_for_sale->getData('post_title')}}</span>
          @endif
        </h1>

      </div>

    </div>


   @include('frontend.layouts.social')
  </section>
  <section class="page-section tr_top">
    <div class="container lm_width">

      @if(!empty(!empty($apartments_for_sale) && $apartments_for_sale->getData('rde_top_image')))
      <div class="img_box normalImgBanner">
        <picture>
          <source srcset="{{webp($apartments_for_sale->getData('rde_top_image'))}}" type="image/webp">
          <source srcset="{{PP($apartments_for_sale->getData('rde_top_image'))}}" type="image/{{FT($apartments_for_sale->getData('rde_top_image'))}}">
          <img src="{{PP($apartments_for_sale->getData('rde_top_image'))}}" loading="lazy" alt="{{$apartments_for_sale->getData('rde_top_image_alt')}}">
        </picture>
      </div>
      @endif

      <div class="text_box">
        @if(!empty($apartments_for_sale) && !empty($apartments_for_sale->getData('description')))
        {!!@$apartments_for_sale->getData('description')!!}
        @endif
      </div>

      @if(!empty($apartments_for_sale) && !empty($apartments_for_sale->getData('rde_bottom_image')))
      <div class="img_box normalImgBanner m_top">
        <picture>
          <source srcset="{{webp($apartments_for_sale->getData('rde_bottom_image'))}}" type="image/webp">
          <source srcset="{{PP($apartments_for_sale->getData('rde_bottom_image'))}}" type="image/{{FT($apartments_for_sale->getData('rde_bottom_image'))}}">
          <img src="{{PP($apartments_for_sale->getData('rde_bottom_image'))}}" loading="lazy" alt="{{$apartments_for_sale->getData('rde_bottom_image_alt')}}">
        </picture>
      </div>
      @endif

    </div>
  </section>

  @if(!empty($faqData) && $faqData->isNotEmpty())
  <section class="page-section ">

    <div class="container lm_width">

      <H3>{{lang('frequently_asked_questions')}}</H3>

      <div class="accordion_wrap">
          @foreach($faqData as $faq)
            <div class="a_item">
            <a href="#" data-title>
                <h2>{{$faq->getTitle()}}</h2>
                <i></i>
            </a>
            <div class="content">
                <div class="text_box">
                {!!$faq->getData('description')!!}
                </div>
            </div>
            </div>
            @endforeach

      </div>

    </div>
  </section>
  @endif


</main>
@stop

@section('scripts')
@parent
<script>
  $(function () {

    $("[data-title]").on("click", function (e) {
      e.preventDefault();
      var el_ = $(this);
      if (el_.hasClass("active")) {
        el_.removeClass("active");
        el_
          .siblings(".content")
          .slideUp(200, function () {
            var val_ = el_.offset().top - $('header').height() - 50;

            $([document.documentElement, document.body]).animate({
              scrollTop: val_
            }, 500);
          });

      } else {
        $("[data-title]").removeClass("active");
        el_.addClass("active");
        $(".accordion_wrap .content").slideUp(200);
        el_
          .siblings(".content")
          .slideDown(200, function () {
            var val_ = el_.offset().top - $('header').height() - 50;

            $([document.documentElement, document.body]).animate({
              scrollTop: val_
            }, 500);
          });
      }
    });

  })
</script>
@stop