@props(['item' => new \App\Models\Item()])

<div class="card mt-4">
    <div class="card-header d-flex">
        <h3 class="fw-bold w-100 mt-4">{{ $alphabet[$alphabetIndex] }}. {{ $formSection->section_name }}</h3>
    </div>
    <div class="col-md-12 mt-4">
        <div class="card-body">
            @foreach ($formSection->formSubSections->sortBy('order_index') ?? [] as $formSubSection)
                <div class="row mb-4">
                    <div class="col-md-6">
                        <div class="border rounded p-3">
                            <div class="card-header d-flex justify-content-between align-items-center mb-3">
                                <h6 class="mb-0">{{ $formSubSection->section_name }}</h6>
                            </div>

                            <div class="card-subbody">
                                @if ($formSubSection->section_name == 'Service Classification')
                                    <div class="row">
                                        <label class="col-lg-3 col-form-label fw-semibold fs-6 text-gray-600">Category</label>
                                        <div class="col-lg-8">
                                            <p class="form-control form-control-transparent mb-0">
                                                {{ $application->product_group->parent->parent->name }}</p>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <label class="col-lg-3 col-form-label fw-semibold fs-6 text-gray-600">Sub
                                            Category</label>
                                        <div class="col-lg-8">
                                            <p class="form-control form-control-transparent mb-0">
                                                {{ $application->product_group->parent->name }}</p>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <label class="col-lg-3 col-form-label fw-semibold fs-6 text-gray-600">Product
                                            Group</label>
                                        <div class="col-lg-8">
                                            <p class="form-control form-control-transparent mb-0">
                                                {{ $application->product_group->name }}</p>
                                        </div>
                                    </div>
                                @else
                                    @foreach ($formSubSection->formDetails->where('is_deprecated', false)->sortBy('order_index') as $formDetail)
                                        @if (View::exists('pages.apps.evaluation.form-input.input-evaluator.' . $formDetail->input_type))
                                            @include('pages.apps.evaluation.form-input.input-evaluator.' . $formDetail->input_type)
                                        @elseif ($formDetail->input_type == 'image')
                                            {{-- Do Nothing --}}
                                        @else
                                            @include('pages.apps.evaluation.form-input.input-evaluator.common')
                                        @endif
                                    @endforeach
                                @endif
                            </div>
                        </div>
                    </div>
                    @php
                        $sectionReview = null;
                        if ($application_section && $application_section->review) {
                            $sectionReview = $application_section->review
                                ->where(
                                    'type',
                                    'section_' . $formSubSection->id,
                                )
                                ->first();
                        }
                    @endphp
                    <div class="col-md-6">
                        <div class="border rounded p-3">
                            <div class="card-header bg-light-success d-flex">
                                <h5 class="fw-bold w-100 mt-4">Evaluator Review</h5>
                            </div>
                            <div class="mb-3 mt-3">
                                <label class="form-label">Review Status</label>
                                <div class="d-flex gap-4">
                                    <div class="form-check form-check-xs form-check-success form-check-inline">
                                        <input class="form-check-input" type="radio"
                                            name="section_{{ $formSubSection->id }}_is_comply" id="section_{{ $formSubSection->id }}_is_comply_yes"
                                            value="1"
                                            {{ old('section_' . $formSubSection->id . '_is_comply', optional($sectionReview)->is_comply) == '1' ? 'checked' : '' }}
                                            onchange="updateLabel('section_{{ $formSubSection->id }}')">
                                        <label class="form-check-label"
                                            for="section_{{ $formSubSection->id }}_is_comply_yes">Comply</label>
                                    </div>

                                    <div class="form-check form-check-xs form-check-success form-check-inline">
                                        <input class="form-check-input" type="radio"
                                            name="section_{{ $formSubSection->id }}_is_comply" id="section_{{ $formSubSection->id }}_is_comply_no"
                                            value="0"
                                            {{ old('section_' . $formSubSection->id . '_is_comply', optional($sectionReview)->is_comply) == '0' ? 'checked' : '' }}
                                            onchange="updateLabel('section_{{ $formSubSection->id }}')">
                                        <label class="form-check-label" for="section_{{ $formSubSection->id }}_is_comply_no">Not
                                            Comply</label>
                                    </div>
                                    @error('section_' . $formSubSection->id . '_is_comply')
                                        <span class="text-sm text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>
                            </div>

                            <!-- Not Comply Remarks (Shown only when "Not Comply" is selected) -->
                            <div class="mb-3" id="section_{{ $formSubSection->id }}_remarksContainer"
                                style="{{ optional($sectionReview)->is_comply == '1' ? 'display: none;' : '' }}">
                                <label id="section_{{ $formSubSection->id }}_remarksLabel" class="form-label">
                                    Not Comply Remarks <span class="text-danger">*</span>
                                </label>
                                <input type="text" id="section_{{ $formSubSection->id }}_remarks" name="section_{{ $formSubSection->id }}_remarks"
                                    value="{{ old('section_' . $formSubSection->id . '_remarks', optional($sectionReview)->remarks) }}"
                                    class="form-control"
                                    {{ optional($sectionReview)->is_comply == '0' ? 'required' : '' }} />
                            </div>

                            <!-- Section Notes (Shown only when "Comply" is selected) -->
                            <div class="mb-3" id="section_{{ $formSubSection->id }}_notesContainer"
                                style="{{ optional($sectionReview)->is_comply == '0' ? 'display: none;' : '' }}">
                                <label class="form-label">{{ $formSubSection->section_name }} Notes <span
                                        class="text-danger">*</span></label>
                                <input type="text" id="section_{{ $formSubSection->id }}_notes" name="section_{{ $formSubSection->id }}_notes"
                                    value="{{ old('section_' . $formSubSection->id . '_notes', optional($sectionReview)->notes) }}"
                                    class="form-control"
                                    {{ optional($sectionReview)->is_comply == '1' ? 'required' : '' }} />
                            </div>
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
</div>