{{--
    ANC Booking Labs drawer.
    Read-only summary of the ANC profile once recorded; editable form to
    enter or update lab values. Like history, saves go to the visit draft.

    Expected vars: $registration (to find $labsSource)
--}}
@php
    $labsSource = $registration->visits
        ->filter(fn($v) => $v->hemoglobin || $v->urine_protein || $v->vdrl_result || $v->hiv_result || $v->hep_b_result || $v->blood_group_visit)
        ->sortByDesc('visit_date')
        ->first();
    $lh = $labsSource ?? $draftVisit;
@endphp

<div id="anc-drawer-labs" class="anc-drawer" aria-hidden="true">
    <div class="anc-drawer-backdrop" onclick="ancCloseDrawer('labs')"></div>
    <aside class="anc-drawer-panel">
        <header class="anc-drawer-head">
            <div>
                <h3 style="margin:0;font-size:14px;color:#3b1054">Booking Labs / ANC Profile</h3>
                <p style="margin:2px 0 0;font-size:11px;color:#6b7280">
                    @if($labsSource)
                        Recorded {{ $labsSource->visit_date?->format('d M Y') }}
                    @else
                        Not yet recorded
                    @endif
                </p>
            </div>
            <button type="button" class="anc-drawer-close" onclick="ancCloseDrawer('labs')">&times;</button>
        </header>

        <div class="anc-drawer-body">
            {{-- Read-only --}}
            <div id="anc-labs-readonly">
                @if($labsSource)
                    <div style="display:grid;grid-template-columns:repeat(2,1fr);gap:8px;font-size:11.5px;margin-bottom:14px">
                        <div><span style="color:#6b7280">Haemoglobin:</span> <strong>{{ $lh->hemoglobin ?? '—' }} g/dL</strong></div>
                        <div><span style="color:#6b7280">Blood Group:</span> <strong>{{ $lh->blood_group_visit ?? '—' }} {{ $lh->rhesus_visit ?? '' }}</strong></div>
                        <div><span style="color:#6b7280">Urine protein:</span> <strong>{{ $lh->urine_protein ?? '—' }}</strong></div>
                        <div><span style="color:#6b7280">Urine glucose:</span> <strong>{{ $lh->urine_glucose ?? '—' }}</strong></div>
                        <div><span style="color:#6b7280">VDRL:</span> <strong>{{ $lh->vdrl_result ?? '—' }}</strong></div>
                        <div><span style="color:#6b7280">HIV:</span> <strong>{{ $lh->hiv_result ?? '—' }}</strong></div>
                        <div><span style="color:#6b7280">Hep B:</span> <strong>{{ $lh->hep_b_result ?? '—' }}</strong></div>
                        <div><span style="color:#6b7280">RBS:</span> <strong>{{ $lh->rbs ?? '—' }} mmol/L</strong></div>
                    </div>
                    @if($lh->other_lab_findings)
                        <p style="font-size:11.5px;margin:0 0 14px"><span style="color:#6b7280">Other findings:</span> {{ $lh->other_lab_findings }}</p>
                    @endif
                @else
                    <p style="font-size:12px;color:#9ca3af;text-align:center;padding:20px 0">
                        ANC profile labs not yet recorded. Click <strong>Record Labs</strong> below.
                    </p>
                @endif
                <div style="display:flex;justify-content:center">
                    <button type="button" class="enc-btn-primary" onclick="ancToggleLabsEdit(true)">
                        {{ $labsSource ? 'Update Labs' : 'Record Labs' }}
                    </button>
                </div>
            </div>

            {{-- Edit form --}}
            <div id="anc-labs-edit" style="display:none">
                <p style="font-size:10.5px;color:#9ca3af;margin:0 0 10px">
                    Enter booking labs. Once saved, these values show up in the top banner on every visit.
                </p>

                <div style="display:grid;grid-template-columns:repeat(2,1fr);gap:10px">
                    @include('maternity.partials._fields.input',  ['name'=>'hemoglobin',        'label'=>'Haemoglobin', 'unit'=>'g/dL', 'type'=>'number', 'step'=>'0.1'])
                    @include('maternity.partials._fields.input',  ['name'=>'blood_group_visit', 'label'=>'Blood group'])
                    @include('maternity.partials._fields.input',  ['name'=>'rhesus_visit',      'label'=>'Rhesus'])
                    @include('maternity.partials._fields.select', ['name'=>'urine_protein',     'label'=>'Urine protein', 'options'=>['Nil'=>'Nil','Trace'=>'Trace','+'=>'+','++'=>'++','+++'=>'+++']])
                    @include('maternity.partials._fields.select', ['name'=>'urine_glucose',     'label'=>'Urine glucose', 'options'=>['Nil'=>'Nil','Trace'=>'Trace','+'=>'+','++'=>'++']])
                    @include('maternity.partials._fields.input',  ['name'=>'vdrl_result',       'label'=>'VDRL / RPR'])
                    @include('maternity.partials._fields.input',  ['name'=>'hiv_result',        'label'=>'HIV'])
                    @include('maternity.partials._fields.input',  ['name'=>'hep_b_result',      'label'=>'Hep B'])
                    @include('maternity.partials._fields.input',  ['name'=>'rbs',               'label'=>'RBS', 'unit'=>'mmol/L', 'type'=>'number', 'step'=>'0.1'])
                </div>
                <div style="margin-top:10px">
                    @include('maternity.partials._fields.compact_input', ['name'=>'other_lab_findings', 'label'=>'Other lab findings'])
                </div>

                <div style="margin-top:16px;display:flex;gap:8px;justify-content:flex-end">
                    <button type="button" class="enc-btn-cancel" onclick="ancToggleLabsEdit(false)">Cancel</button>
                    <button type="button" class="enc-btn-primary" data-anc-save-btn="labs-drawer">Save</button>
                    <span data-anc-save-status="labs-drawer" style="align-self:center;font-size:10.5px"></span>
                </div>
            </div>
        </div>
    </aside>
</div>