@extends('layouts.v2.frontend-user-backend')

@section('title', '| FREE END-OF-LIFE PLAN')

@section('content')
@include('frontend.forms.v2.End-Of-Life-Plan.stepIndicator')
    <form action="{{route('EndoflifePlanFormStore')}}" method="POST" id="signUpForm">
      @csrf
      <input type="hidden" id="stepInput" name="step" value="5">
      <div class="multiple-form dashboard-radio">
         <h4>Services</h4>
         <p>Do you wish to have a formal service or services?</p>

         <div class="form">
            <div class="row">
               <div class="col-12">
                  <div class="dashboard-radio-form">
                     <div class="form-check">
                        <input id="formalservice-y" class="form-check-input" name="formalservice" type="radio" value="yes" {{ isset($service['services_av']) && $service['services_av'] === 'yes' ? 'checked' : '' }}>
                        <label for="formalservice-y"><p>Yes</p></label>
                     </div>
                     <div class="form-check">
                        <input id="formalservice-n" class="form-check-input" name="formalservice" type="radio" value="no" {{ isset($service['services_av']) && $service['services_av'] === 'no' ? 'checked' : '' }}>
                        <label for="formalservice-n"><p>No</p></label>
                     </div>
                  </div>
               </div>
            </div>
            <div class="row">
               <div id="formalservice" class="form-check-list">
                  <p class="mt-3">What type of service would you like? (Select all that apply.)</p>

                  <div class="form-check mb-3">
                     <label class="form-check-label" id="form-check-label-custom">
                        <input type="checkbox" class="form-check-input" name="servicetype[]" value="visitation" {{ isset($service['type']) && in_array('visitation', $service['type']) ? 'checked' : '' }}>
                        <p>
                           Visitation
                           <a tabindex="0" class="info-icon" role="button" data-bs-toggle="popover" data-bs-html="true" data-bs-trigger="focus" title="Visitation Info" data-bs-content="<p>A visitation, also known as a viewing, is typically held before a funeral—or sometimes in place of one. This more informal gathering brings family and friends together, allowing guests to stop by and offer their condolences. The body or cremated remains are often present, providing an opportunity for guests to pay their final respects.</p>">?</a>
                        </p>
                     </label>
                  </div>

                  <div class="form-check mb-3">
                     <label class="form-check-label" id="form-check-label-custom">
                        <input type="checkbox" class="form-check-input" name="servicetype[]" value="funeral" {{ isset($service['type']) && in_array('funeral', $service['type']) ? 'checked' : '' }}>
                        <p>
                           Funeral
                           <a tabindex="0" class="info-icon" role="button" data-bs-toggle="popover" data-bs-html="true" data-bs-trigger="focus" title="Funeral Info" data-bs-content="<p>A funeral is a formal ceremony honoring the life of the deceased, typically led by a religious leader or funeral officiant. It is most commonly held at a funeral home or a place of worship, such as a church, synagogue, or mosque. The service may include eulogies, prayers, music, and special readings, offering a meaningful tribute and a time for reflection</p>">?</a>
                        </p>
                     </label>
                  </div>

                  <div class="form-check mb-3">
                     <label class="form-check-label" id="form-check-label-custom">
                        <input type="checkbox" class="form-check-input" name="servicetype[]" value="graveside" {{ isset($service['type']) && in_array('graveside', $service['type']) ? 'checked' : '' }}>
                        <p>
                           Graveside Service
                           <a tabindex="0" class="info-icon" role="button" data-bs-toggle="popover" data-bs-html="true" data-bs-trigger="focus" title="Graveside Info" data-bs-content="<p>A graveside service may follow a funeral or serve as a standalone ceremony, taking place just before the final disposition of the deceased's remains. It is held at the site of interment—such as a grave, mausoleum, or urn garden—and typically includes religious rites performed by an officiant in accordance with the beliefs of the deceased.</p>">?</a>
                        </p>
                     </label>
                  </div>

                  <div class="form-check mb-3">
                     <label class="form-check-label" id="form-check-label-custom">
                        <input type="checkbox" class="form-check-input" name="servicetype[]" value="memorial" {{ isset($service['type']) && in_array('memorial', $service['type']) ? 'checked' : '' }}>
                        <p>
                           Memorial Service
                           <a tabindex="0" class="info-icon" role="button" data-bs-toggle="popover" data-bs-html="true" data-bs-trigger="focus" title="Memorial Info" data-bs-content="<p>A memorial service is typically held after the deceased has been buried or cremated, so their body is not present. The service can take place in a house of worship, an event venue, or even a family home. While generally less formal than a funeral, it still provides a meaningful opportunity for family and friends to say their final goodbyes. The ceremony may include personal speeches, music, and special readings</p>">?</a>
                        </p>
                     </label>
                  </div>

                  <div class="form-check mb-3">
                     <label class="form-check-label" id="form-check-label-custom">
                        <input type="checkbox" class="form-check-input" name="servicetype[]" value="other" {{ isset($service['type']) && in_array('other', $service['type']) ? 'checked' : '' }}>
                        <p>
                           Other
                           <a tabindex="0" class="info-icon" role="button" data-bs-toggle="popover" data-bs-html="true" data-bs-trigger="focus" title="Other Services" data-bs-content="<p>Other types of services may include traditional religious observances, such as a Catholic Vigil or Jewish Shiva, or a more general spiritual gathering. You may also choose to leave specific instructions on how you would like to be formally memorialized.</p>">?</a>
                        </p>
                     </label>
                  </div>
               </div>

               <div class="servicetype_error a-status-error-message text-danger small fw-bold d-none mb-4"></div>
            </div>
         </div>
         <!-- start previous / next buttons -->
         <div id="buttonsection" class="submit-button-multiple">
            @if (in_array($endoflifePlanForm->remains, ['nopreference']))
            <button type="button" onclick="window.location.href = '{{ route('endoflifePlan.create.step.four') }}'">Back</button>
            @elseif (in_array($endoflifePlanForm->remains, ['burial', 'mausoleum', 'donationscience', 'other']))
            <button type="button" onclick="window.location.href = '{{ route('endoflifePlan.create.step.four_1') }}'">Back</button>
            @elseif(url()->previous() !== url()->current())
            <button type="button" onclick="window.location.href = '{{ url()->previous() }}'">Back</button>
            @else
            <button type="button" onclick="window.location.href = '{{ route('endoflifePlan.create.step.four') }}'">Back</button>
            @endif
            <button type="submit" class="submit-btn">Save and Continue</button>
            <button type="submit" class="d-none" name="preview_submit" value="preview">{{env('PREVIEW_BUTTON_TEXT')}}</button>
            <button type="button" class="skip-btn d-none">Skip Step</button>
         </div>
         <!-- end previous / next buttons -->
      </div>
    </form>	  
@endsection
@section('page-js')
<script src="{{ url('frontend/assets/js/forms/end-of-life-plan-multi-step.js') }}?v={{ time() }}"></script>
<script src="{{ url('frontend/assets/js/forms/custom.js?v=10.3') }}"></script>
<script src="{{ url('v2/js/form-validation.js') }}?v={{ time() }}"></script>
@endsection