{{-- updateForm --}}
<form class="tab-pane-like" id='update-form' style="border: 1px solid var(--color-doc-desc)" wire:submit='update'
    wire:loading.class='disabled' wire:target='update, translate'>
    <div class="row">








        {{-- leftCol --}}
        <div class="col-4 pt-2">
            <div class="row row--section mb-4 ms-0">
                <div class="col-12">





                    {{-- fileNumber --}}
                    <div class="d-flex align-items-center justify-content-between mb-2">
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">{{__('File No.')}}</label>
                        <input class="form-control form--input" type="text" style="width: 55%;"
                            wire:model='instance.fileNumber' readonly>
                    </div>





                    {{-- caseNumber --}}
                    <div class="d-flex align-items-center justify-content-between mb-2">
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">{{__('Case No.')}}</label>
                        <input class="form-control form--input" type="text" style="width: 55%;"
                            wire:model='instanceCase.caseNumber' required>
                    </div>










                    {{-- --------------------------------- --}}
                    {{-- --------------------------------- --}}




                    {{-- hr --}}
                    <div class="col-12">
                        <hr>
                    </div>





                    {{-- opponents --}}
                    <div class="d-flex align-items-center justify-content-between mb-2">
                        <button class="btn fs-12 w-100 btn--remove text-white" data-bs-target="#new-opponent"
                            data-bs-toggle="modal" type="button"
                            style="height: var(--input-height);">{{__('Opponents')}}</button>
                    </div>







                    {{-- 1: caseType --}}
                    <div class="d-flex align-items-center justify-content-between mb-3 child--wrapper"
                        wire:loading.class='disabled' wire:target='instanceCase.caseTypeId' wire:ignore>


                        <div class="select--single-wrapper mb-0" style="width: 100%;">
                            <select
                                class="form-select form--select2 init--select init--edit-select level--select level--one"
                                data-level-type='one' data-level-child='CaseStage' data-level-group='edit-civil-file'
                                data-instance='instanceCase.caseTypeId' data-placeholder="{{__('Select Type')}}"
                                value='{{ $instanceCase->caseTypeId }}' required>
                                <option value=""></option>





                                {{-- loop - caseTypes --}}
                                @foreach ($caseTypes ?? [] as $caseType)

                                <option value="{{ $caseType->id }}">
                                    {{ $caseType?->{__('name')} }}
                                </option>

                                @endforeach
                                {{-- end loop - caseTypes --}}




                            </select>
                        </div>
                    </div>
                    {{-- endCol --}}








                    {{-- 1.5: caseStage --}}
                    <div class="d-flex align-items-center justify-content-between mb-3 child--wrapper"
                        wire:loading.class='no-events-loading'
                        wire:target='instanceCase.caseStage, instanceCase.caseTypeId'>


                        <div class="select--single-wrapper mb-0" style="width: 100%;" wire:ignore>
                            <select
                                class="form-select form--select2 init--select init--edit-select level--select level--two"
                                data-level-type='one' data-level-group='edit-civil-file'
                                data-instance='instanceCase.caseStageId' data-placeholder="{{__('Select Stage')}}"
                                data-trigger='false' value='{{ $instanceCase?->caseStageId }}' required>
                                <option value=""></option>




                                {{-- loop - caseStages --}}
                                @foreach ($caseStages ?? [] as $caseType)

                                <option value="{{ $caseType->id }}">
                                    {{ $caseType?->{__('name')} }}
                                </option>

                                @endforeach
                                {{-- end loop - caseStages --}}




                            </select>
                        </div>
                    </div>
                    {{-- endCol --}}






                    {{-- --------------------------------- --}}
                    {{-- --------------------------------- --}}








                    {{-- mainCase --}}
                    <div class="d-flex align-items-center justify-content-between mb-2">
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">{{__('Main Case')}}</label>
                        <input class="form-control form--input" type="text"
                            value="{{ $instanceCase->isMainCase == 1 ? __('YES') : __('NO') }}" style="width: 55%"
                            readonly />
                    </div>




                    {{-- registerDate --}}
                    <div class="d-flex align-items-center justify-content-between mb-3">
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">
                            {{__('Register Date')}}</label>
                        <input class="form-control form--input" type="date" style="width: 55%;"
                            wire:model='instanceCase.registerDate' required>

                    </div>
                </div>
            </div>
            {{-- endRow --}}









            {{-- ---------------------------------- --}}
            {{-- ---------------------------------- --}}









            {{-- row --}}
            <div class="row row--section mb-4 ms-0">
                <div class="col-12">





                    {{-- court --}}
                    <div class="d-flex align-items-center justify-content-between mb-2" wire:ignore>
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">{{__('Court')}}</label>

                        <div class="select--single-wrapper mb-0" style="width: 55%;">
                            <select class="form-select form--select2 init--select init--edit-select"
                                data-instance='instanceCase.courtId' value='{{ $instanceCase?->courtId }}'>
                                <option value=""></option>

                                @foreach ($courts ?? [] as $court)
                                <option value="{{ $court->id }}">{{ $court?->{__('name')} }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>







                    {{-- department --}}
                    <div class="d-flex align-items-center justify-content-between mb-3" wire:ignore>
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">{{__('Department')}}</label>
                        <div class="select--single-wrapper mb-0" style="width: 55%;">
                            <select class="form-select form--select2 init--select init--edit-select"
                                data-instance='instanceCase.departmentId' value='{{ $instanceCase?->departmentId }}'>
                                <option value=""></option>

                                @foreach ($departments ?? [] as $department)
                                <option value="{{ $department->id }}">{{ $department?->{__('name')} }}</option>
                                @endforeach

                            </select>
                        </div>
                    </div>
                    {{-- endWrap --}}





                </div>
            </div>
            {{-- endRow --}}








            {{-- -------------------------------------------------------------------- --}}
            {{-- -------------------------------------------------------------------- --}}










            {{-- row --}}
            <div class="row row--section mb-4 ms-0">
                <div class="col-12">



                    {{-- subHeading --}}
                    <div class="search--section d-flex align-items-center justify-content-evenly">
                        <h6 class="text-center fw-bold fixed-banner mb-3 fs-14 py-2 w-50">{{__('Date')}}</h6>
                    </div>






                    {{-- 1: firstHearing --}}
                    <div class="d-flex align-items-center justify-content-between mb-2">
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">
                            {{__('First Hearing')}}</label>
                        <input class="form-control form--input" type="text"
                            value="{{ $case?->hearings?->first()?->hearingDate ? date('d / m / Y', strtotime($case?->hearings?->first()?->hearingDate)) : '' }}"
                            style="width: 55%;" readonly>
                    </div>






                    {{-- 2: nextHearing --}}
                    <div class="d-flex align-items-center justify-content-between mb-2">
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">
                            {{__('Next Hearing')}}</label>
                        <input class="form-control form--input" type="text" value="{{ $case?->hearings?->last()?->upcomingHearingDate ?
                             date('d / m / Y', strtotime($case?->hearings?->last()?->upcomingHearingDate)) : '' }}"
                            style="width: 55%" readonly />
                    </div>








                    {{-- 3: lastDecision --}}
                    <div class=" d-flex align-items-center justify-content-between mb-3">
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">
                            {{__('Last Decision')}}</label>
                        <input class="form-control form--input" type="text" value="{{ $case?->verdicts?->last()?->courtDecisionDate ?
                            date('d / m / Y', strtotime($case?->verdicts?->last()?->courtDecisionDate)) : '' }}"
                            style="width: 55%" readonly />
                    </div>



                </div>
            </div>
            {{-- endRow --}}









            {{-- ----------------------------------------- --}}
            {{-- ----------------------------------------- --}}








            {{-- Fees --}}
            <div class="row row--section mb-4 ms-0">
                <div class="col-12">



                    {{-- 1: caseFees --}}
                    <div class="d-flex align-items-center justify-content-between mb-3">
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">{{__('Case Fees')}}</label>
                        <input class="form-control form--input" type="text" data-type='number' pattern='[0-9\.,]+'
                            style="width: 55%;" wire:model='instanceCase.caseFees'>
                    </div>




                    {{-- 2: courtFees --}}
                    <div class="d-flex align-items-center justify-content-between mb-3">
                        <label class="form-label form--label fs-12 mb-0" style="width: 45%">{{
                            __('Court Fees')}}</label>
                        <input class="form-control form--input" type="text" data-type='number' pattern='[0-9\.,]+'
                            style="width: 55%;" wire:model='instanceCase.courtFees'>
                    </div>




                </div>
            </div>
        </div>
        {{-- end leftColumn --}}








        {{-- ---------------------------------------------------------- --}}
        {{-- ---------------------------------------------------------- --}}









        {{-- rightCol --}}
        <div class="col-8">
            <div class="row row pt-2 align-items-center mx-0">




                {{-- 1: isMainCase --}}
                <div class="col-12 text-center mb-4">
                    <h4 class="mb-0 badge--theme text-white px-4 rounded-1 py-1 d-inline-block fs-5">
                        {{ $case?->isMainCase === 1 ? __('Main Case') : __('Associated Case') }}
                    </h4>
                </div>






                {{-- ----------------------------- --}}
                {{-- ----------------------------- --}}







                {{-- 2: content --}}
                <div class="col-12">
                    <div class="row row--section mb-4">







                        {{-- 1: client - HIDDEN --}}
                        <div class="col-4 d-none">
                            <label class="form-label form--label">{{__('Client')}}</label>
                            <input class="form-control form--input mb-4" type="text"
                                value="{{ $case?->client?->{__('name')} }}" readonly>
                        </div>









                        {{-- 2: clientTitle --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Client Title')}}</label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.clientTitleId'
                                    value='{{ $instanceCase?->clientTitleId }}'>
                                    <option value=""></option>

                                    @foreach ($clientTitles ?? [] as $clientTitle)
                                    <option value="{{ $clientTitle->id }}">
                                        {{ $clientTitle?->{__('title')} }}
                                    </option>
                                    @endforeach

                                </select>
                            </div>
                        </div>










                        {{-- 3: claimAmount --}}
                        <div class="col-4">
                            <label class="form-label form--label">{{__('Claim Amount')}}</label>
                            <div class="input--icon  for-price">
                                <span>{{__('AED')}}</span><input class="form-control form--input mb-4" type="text"
                                    data-type='number' pattern='[0-9\.,]+' wire:model='instanceCase.claimAmount'>
                            </div>
                        </div>







                        {{-- Claims --}}
                        <div class="col-4">
                            <label class="form-label form--label">{{__('Claims')}}</label>
                            <button
                                class="btn fs-13 w-100 btn--outline-theme  d-flex align-items-center justify-content-center"
                                data-bs-target="#new-claim" data-bs-toggle="modal" type="button"
                                style="height: var(--input-height)">{{__('Modify Claims')}}</button>
                        </div>












                        {{-- ------------------------------------ --}}
                        {{-- ------------------------------------ --}}









                        {{-- 5: caseInformations --}}
                        <div class="col-6">
                            <label class="form-label form--label">{{__('Case Information')}}</label>
                            <textarea class="form-control form--input form--textarea mb-4" wire:loading.attr='disabled'
                                wire:change="translate('informationAr', 'information', 'en')"
                                wire:model='instanceCase.informationAr'></textarea>
                        </div>



                        <div class="col-6">
                            <label class="form-label form--label">{{__('Case Information in English')}}</label>
                            <textarea class="form-control form--input form--textarea mb-4" wire:loading.attr='disabled'
                                wire:change="translate('information', 'informationAr', 'ar')"
                                wire:model='instanceCase.information'></textarea>
                        </div>



                    </div>
                    {{-- endRow --}}








                    {{-- ----------------------------------------- --}}
                    {{-- ----------------------------------------- --}}










                    {{-- row --}}
                    <div class="row justify-content-center row--section mb-4">




                        {{-- rotation: Administrative - Advisor - PleadingLawyer --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Administrative')}}</label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.administrativeId'
                                    value='{{ $instanceCase?->administrativeId }}'>
                                    <option value=""></option>

                                    @foreach ($users ?? [] as $user)
                                    <option value="{{ $user->id }}">
                                        {{ $user?->{__('name')} }}
                                    </option>
                                    @endforeach

                                </select>
                            </div>
                        </div>







                        {{-- advisor --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Advisor')}}</label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.advisorId' value='{{ $instanceCase?->advisorId }}'>
                                    <option value=""></option>
                                    @foreach ($users as $user)
                                    <option value="{{ $user->id }}">{{ $user?->{__('name')} }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>






                        {{-- pleadingLawyer --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Pleading Lawyer')}}</label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.pleadingLawyerId'
                                    value='{{ $instanceCase?->pleadingLawyerId }}'>
                                    <option value=""></option>
                                    @foreach ($users as $user)
                                    <option value="{{ $user->id }}">{{ $user?->{__('name')} }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>








                        {{-- empty --}}
                        <div class="col-12"></div>






                        {{-- --------------------------------------------- --}}
                        {{-- --------------------------------------------- --}}






                        {{-- administrative --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Administrative')}}
                                <small class='notice'>({{__('2nd')}})</small>
                            </label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.secAdministrativeId'
                                    value='{{ $instanceCase?->secAdministrativeId }}'>
                                    <option value=""></option>
                                    @foreach ($users as $user)
                                    <option value="{{ $user->id }}">{{ $user?->{__('name')} }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>








                        {{-- advisor --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Advisor')}}
                                <small class='notice'>({{__('2nd')}})</small>
                            </label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.secAdvisorId'
                                    value='{{ $instanceCase?->secAdvisorId }}'>
                                    <option value=""></option>
                                    @foreach ($users as $user)
                                    <option value="{{ $user->id }}">{{ $user?->{__('name')} }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>








                        {{-- pleadingLawyer --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Pleading Lawyer')}}
                                <small class='notice'>({{__('2nd')}})</small>
                            </label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.secPleadingLawyerId'
                                    value='{{ $instanceCase?->secPleadingLawyerId }}'>
                                    <option value=""></option>
                                    @foreach ($users as $user)
                                    <option value="{{ $user->id }}">{{ $user?->{__('name')} }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>









                        {{-- empty --}}
                        <div class="col-12"></div>









                        {{-- --------------------------------------------- --}}
                        {{-- --------------------------------------------- --}}








                        {{-- administrative --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Administrative')}}
                                <small class='notice'>({{__('3rd')}})</small>
                            </label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.thirdAdministrativeId'
                                    value='{{ $instanceCase?->thirdAdministrativeId }}'>
                                    <option value=""></option>
                                    @foreach ($users as $user)
                                    <option value="{{ $user->id }}">{{ $user?->{__('name')} }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>








                        {{-- advisor --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Advisor')}}
                                <small class='notice'>({{__('3rd')}})</small>
                            </label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.thirdAdvisorId'
                                    value='{{ $instanceCase?->thirdAdvisorId }}'>
                                    <option value=""></option>
                                    @foreach ($users as $user)
                                    <option value="{{ $user->id }}">{{ $user?->{__('name')} }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>







                        {{-- pleadingLawyer --}}
                        <div class="col-4" wire:ignore>
                            <label class="form-label form--label">{{__('Pleading Lawyer')}}
                                <small class='notice'>({{__('3rd')}})</small>
                            </label>
                            <div class="select--single-wrapper mb-4">
                                <select class="form-select form--select2 init--select init--edit-select"
                                    data-instance='instanceCase.thirdPleadingLawyerId'
                                    value='{{ $instanceCase?->thirdPleadingLawyerId }}'>
                                    <option value=""></option>
                                    @foreach ($users as $user)
                                    <option value="{{ $user->id }}">{{ $user?->{__('name')} }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>
                    {{-- endRow --}}








                    {{-- -------------------------------------- --}}
                    {{-- -------------------------------------- --}}








                    {{-- row --}}
                    <div class="row justify-content-center row--section mb-4">





                        {{-- 1: mainCaseDecision --}}
                        <div class="col-12">
                            <label class="form-label form--label">{{__('Main Case Verdict')}}</label>
                            <textarea class="form-control form--input form--textarea mb-4"
                                readonly>{{ $case?->verdicts?->first()?->courtDecisionAr }}</textarea>
                        </div>




                        <div class="col-12">
                            <label class="form-label form--label">{{__('Main Case Verdict in English')}}</label>
                            <textarea class="form-control form--input form--textarea mb-4"
                                readonly>{{ $case?->verdicts?->first()?->courtDecision }}</textarea>
                        </div>


                    </div>
                    {{-- end row --}}








                    {{-- -------------------------------------- --}}
                    {{-- -------------------------------------- --}}





                    {{-- row --}}
                    <div class="row justify-content-center row--section mb-4">



                        {{-- 2: lastHearingDecision --}}
                        <div class="col-12">
                            <label class="form-label form--label">{{__('Case Final Verdict')}}</label>
                            <textarea class="form-control form--input form--textarea mb-4"
                                readonly>{{ $case?->verdicts?->last()?->courtDecisionAr }}</textarea>
                        </div>

                        <div class="col-12">
                            <label class="form-label form--label">{{__('Case Final Verdict in English')}}</label>
                            <textarea class="form-control form--input form--textarea mb-4"
                                readonly>{{ $case?->verdicts?->last()?->courtDecision }}</textarea>
                        </div>
                    </div>



                </div>
                {{-- endCol --}}







                {{-- --------------------------------------------- --}}
                {{-- --------------------------------------------- --}}










                {{-- submitButton --}}
                <div class="col-12 text-center mt-2 position-relative">

                    {{-- spinner --}}
                    <span class="spinner-border spinner-border-sm text-success spinner--float-right" role="status"
                        wire:loading wire:target='update, translate'></span>


                    {{-- button --}}
                    <button
                        class="btn btn--scheme btn--scheme-3 px-5 scalemix--3 py-1 d-inline-flex align-items-center scale--self-05"
                        wire:ignore type="submit" wire:loading.attr='disabled' wire:target='update, translate'>
                        {{__('Update')}}
                    </button>


                </div>
                {{-- end submit --}}


            </div>
        </div>
    </div>
    {{-- endRow --}}












    {{-- ----------------------------------------------------- --}}
    {{-- ----------------------------------------------------- --}}








    {{-- selectHandler --}}
    <script>
        $(".init--edit-select").on("change", function(event) {


         // 1.1: getValue - instance
         selectValue = $(this).select2('val');
         instance = $(this).attr('data-instance');

         @this.set(instance, selectValue);


      }); //end function
    </script>







    {{-- ----------------------------------------------------- --}}
    {{-- ----------------------------------------------------- --}}









    {{-- levelSelectHandle --}}
    <script>
        $(".init--edit-select.level--select").on("change", function(event) {



            // 1.1: getValue - instance
            selectValue = $(this).select2('val');
            instance = $(this).attr('data-instance');

            levelType = $(this).attr('data-level-type');
            levelChild = $(this).attr('data-level-child');
            levelGroup = $(this).attr('data-level-group');



            @this.set(instance, selectValue);
            @this.levelSelect(levelType, levelChild, selectValue, levelGroup);


    }); //end function
    </script>








    {{-- ----------------------------------------------------- --}}
    {{-- ----------------------------------------------------- --}}








</form>
{{-- endForm --}}