{{-- Shared officer card for Part E §2 (single matrix or one unit in unit-wise mode) --}}
@php
    $uIdx = $unitIdx ?? null;
    $bracketBase = $rrmBracketBase ?? 'report[part_e][risk_rated_matrix]';
    $dotPrefix = $rrmDotBase ?? 'report.part_e.risk_rated_matrix';
    $nameBracket = $uIdx === null
        ? $bracketBase.'[officers]['.$oIdx.']'
        : $bracketBase.'[units]['.$uIdx.'][officers]['.$oIdx.']';
    $dotBase = $uIdx === null
        ? $dotPrefix.'.officers.'.$oIdx
        : $dotPrefix.'.units.'.$uIdx.'.officers.'.$oIdx;
    $applyRiskColors = (bool) ($rrmApplyRiskColors ?? false);
@endphp
<section class="report-e2-officer-block mb-5 mec-wf-allow--{{ $officer['key'] }}" data-officer-key="{{ $officer['key'] }}">
    <div class="mb-3">
        <span class="report-e2-officer-title-main d-inline-block">{{ $officer['title'] }}</span>
        <span class="report-e2-officer-title-sub d-block">Risk-Rated Observations</span>
    </div>
    <input type="hidden" name="{{ $nameBracket }}[field_officer]" value="{{ $officer['key'] }}" data-rrm-input="field_officer">

    <div class="report-e2-categories-wrap">
        @foreach ($officer['categories'] as $cIdx => $cat)
            @php
                $catKey = old($dotBase.'.categories.'.$cIdx.'.category', $cat['category'] ?? '');
                $catOther = old($dotBase.'.categories.'.$cIdx.'.category_other', $cat['category_other'] ?? '');
                $lines = is_array($cat['lines'] ?? null) ? $cat['lines'] : [];
                if (count($lines) === 0) {
                    $lines = [['observation' => '', 'risk' => '', 'recommendation' => '', 'deadline_type' => '', 'deadline_amount' => '', 'deadline_date' => '']];
                }
            @endphp
            <div class="report-e2-category-block report-e2-category-panel">
                <div class="d-flex flex-wrap align-items-start gap-2 mb-3">
                    <div class="flex-grow-1" style="min-width: 220px;">
                        <div class="report-e2-cat-section-label">OBSERVATION CATEGORY</div>
                        <select
                            name="{{ $nameBracket }}[categories][{{ $cIdx }}][category]"
                            class="form-control report-b1-input report-e2-category-select"
                            aria-label="Observation category for {{ $officer['title'] }}"
                        >
                            <option value="">— Select category —</option>
                            @foreach ($rrmCategoryOptions as $cv => $clabel)
                                <option value="{{ $cv }}" @selected((string) $catKey === (string) $cv)>{{ $clabel }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="flex-grow-1 report-e2-category-other-wrap" style="min-width: 200px; {{ (string) $catKey === 'other' ? '' : 'display:none' }}">
                        <div class="report-e2-cat-section-label">SPECIFY</div>
                        <input
                            type="text"
                            name="{{ $nameBracket }}[categories][{{ $cIdx }}][category_other]"
                            value="{{ $catOther }}"
                            class="form-control form-control-sm report-b1-input report-e2-category-other-input"
                            placeholder="Describe category"
                            autocomplete="off"
                        >
                    </div>
                    <button type="button" class="report-e2-remove-category" title="Remove category" aria-label="Remove category">
                        <i class="fas fa-trash-alt" aria-hidden="true"></i>
                    </button>
                </div>

                <div class="table-responsive">
                    <table class="table table-sm report-e2-lines-table report-e2-matrix-table mb-0">
                        <thead>
                            <tr>
                                <th scope="col" class="report-e2-matrix-th report-e2-matrix-th--obs">OBSERVATION DETAILS</th>
                                <th scope="col" class="report-e2-matrix-th report-e2-matrix-th--risk">RISK LEVEL</th>
                                <th scope="col" class="report-e2-matrix-th report-e2-matrix-th--rec">RECOMMENDATION</th>
                                <th scope="col" class="report-e2-matrix-th report-e2-matrix-th--deadline">DEADLINE</th>
                                <th scope="col" class="report-e2-matrix-th report-b1-th-actions" style="width: 3rem;"></th>
                            </tr>
                        </thead>
                        <tbody class="report-e2-lines-tbody">
                            @foreach ($lines as $lIdx => $line)
                                @php
                                    $obs = old($dotBase.'.categories.'.$cIdx.'.lines.'.$lIdx.'.observation', $line['observation'] ?? '');
                                    $risk = old($dotBase.'.categories.'.$cIdx.'.lines.'.$lIdx.'.risk', $line['risk'] ?? '');
                                    $rec = old($dotBase.'.categories.'.$cIdx.'.lines.'.$lIdx.'.recommendation', $line['recommendation'] ?? '');
                                    $dt = old($dotBase.'.categories.'.$cIdx.'.lines.'.$lIdx.'.deadline_type', $line['deadline_type'] ?? '');
                                    $damt = old($dotBase.'.categories.'.$cIdx.'.lines.'.$lIdx.'.deadline_amount', $line['deadline_amount'] ?? '');
                                    $ddate = old($dotBase.'.categories.'.$cIdx.'.lines.'.$lIdx.'.deadline_date', $line['deadline_date'] ?? '');
                                    $showAmt = in_array((string) $dt, ['days', 'weeks', 'months'], true);
                                    $showDate = (string) $dt === 'date';
                                    $riskNorm = strtolower(trim((string) $risk));
                                    $riskCellClass = '';
                                    if ($applyRiskColors) {
                                        if ($riskNorm === 'low') {
                                            $riskCellClass = 'mec-drr-risk--low';
                                        } elseif ($riskNorm === 'medium') {
                                            $riskCellClass = 'mec-drr-risk--medium';
                                        } elseif ($riskNorm === 'high') {
                                            $riskCellClass = 'mec-drr-risk--high';
                                        }
                                    }
                                @endphp
                                <tr class="report-e2-line-row">
                                    <td>
                                        @include('reports.partials.rrm-observation-rtf-field', [
                                            'name' => $nameBracket.'[categories]['.$cIdx.'][lines]['.$lIdx.'][observation]',
                                            'value' => $obs,
                                            'inputKey' => 'observation',
                                            'placeholder' => __('Describe the finding...'),
                                            'toolbarAria' => __('Observation formatting'),
                                        ])
                                    </td>
                                    <td class="{{ $riskCellClass }}">
                                        <select name="{{ $nameBracket }}[categories][{{ $cIdx }}][lines][{{ $lIdx }}][risk]" class="form-control form-control-sm report-b1-input{{ $applyRiskColors ? ' report-drr-risk-level-select' : '' }}" data-rrm-input="risk" aria-label="Risk level">
                                            <option value="">—</option>
                                            <option value="High" @selected($risk === 'High')>High</option>
                                            <option value="Medium" @selected($risk === 'Medium')>Medium</option>
                                            <option value="Low" @selected($risk === 'Low')>Low</option>
                                            <option value="N/A" @selected($risk === 'N/A')>N/A</option>
                                        </select>
                                    </td>
                                    <td>
                                        @include('reports.partials.rrm-observation-rtf-field', [
                                            'name' => $nameBracket.'[categories]['.$cIdx.'][lines]['.$lIdx.'][recommendation]',
                                            'value' => $rec,
                                            'inputKey' => 'recommendation',
                                            'placeholder' => __('Action to be taken...'),
                                            'toolbarAria' => __('Recommendation formatting'),
                                        ])
                                    </td>
                                    <td>
                                        <div class="report-e2-deadline-stack">
                                            <select name="{{ $nameBracket }}[categories][{{ $cIdx }}][lines][{{ $lIdx }}][deadline_type]" class="form-control form-control-sm report-b1-input mb-1 report-e2-deadline-type" data-rrm-input="deadline_type" aria-label="Deadline unit">
                                                <option value="">—</option>
                                                <option value="days" @selected($dt === 'days')>Days</option>
                                                <option value="weeks" @selected($dt === 'weeks')>Weeks</option>
                                                <option value="months" @selected($dt === 'months')>Months</option>
                                                <option value="date" @selected($dt === 'date')>Specific date</option>
                                            </select>
                                            <input type="number" name="{{ $nameBracket }}[categories][{{ $cIdx }}][lines][{{ $lIdx }}][deadline_amount]" value="{{ $damt }}" class="form-control form-control-sm report-b1-input report-e2-deadline-amount" placeholder="#" min="1" step="1" data-rrm-input="deadline_amount" @unless ($showAmt) style="display:none" @endunless>
                                            <input type="date" name="{{ $nameBracket }}[categories][{{ $cIdx }}][lines][{{ $lIdx }}][deadline_date]" value="{{ $ddate }}" class="form-control form-control-sm report-b1-input report-e2-deadline-date" data-rrm-input="deadline_date" @unless ($showDate) style="display:none" @endunless>
                                        </div>
                                    </td>
                                    <td class="text-center align-top pt-2">
                                        <button type="button" class="report-e2-remove-line" title="Remove line" aria-label="Remove line">&times;</button>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
                <button type="button" class="btn btn-sm report-e2-add-line-btn report-e2-add-line w-100">+ ADD OBSERVATION LINE</button>
            </div>
        @endforeach
    </div>
    <div class="report-e2-officer-footer">
        <button type="button" class="btn btn-sm report-e2-btn-add-category report-e2-add-category" data-officer-index="{{ $oIdx }}">
            ADD CATEGORY
        </button>
    </div>
</section>