<div class="card mb-4 shadow-sm" wire:ignore.self>
    <div class="card-body">

        {{-- HEADER --}}
        <h4 class="fw-bold mb-3 d-flex justify-content-between align-items-center">
            Further Information
        </h4>
        <div class="row g-4">
            <div class="col-md-12 radio-lg">
                {{-- Added wire:model and changed keys to integers for reliable Livewire state --}}
                <x-ui.radio
                        label="Did you apply to the Advance Payment Scheme?"
                        name="aps"
                        wire:model="aps"
                        :options="[1 => 'Yes', 0 => 'No']"
                />
            </div>
            <div class="col-md-12 radio-lg">
                <x-ui.radio
                        label="If Yes, do you give permission to confirm that you were resident in a relevant care setting as a child in Scotland?"
                        name="confirm_aps"
                        wire:model="confirm_aps"
                        :options="[1 => 'Yes', 0 => 'No']"
                />
            </div>
            <div class="col-12 col-md-6">
                {{-- Added wire:model bindings so data reaches Livewire --}}
                <x-ui.input name="name_in_care"
                            wire:model="name_in_care"
                            placeholder="Enter here..."
                            label="When you were in care, were you known by a different name by the one you now use?"/>
            </div>
            <div class="col-12 col-md-6">
                <x-ui.input name="legal_name_change"
                            wire:model="legal_name_change"
                            placeholder="Enter here..."
                            label="Have you legally changed your name at any time? (eg by deed poll or marriage)"/>
            </div>
            <div class="col-12">
                {{-- Fixed Double ?? in label and added wire:model --}}
                <x-ui.select
                        label="How would you like to provide your supporting documents which shows your name change?"
                        name="supporting_documents"
                        wire:model="supporting_documents"
                        :options="[
                     'NA' => 'Not Applicable',
                     'Help' => 'I need help finding a supporting document (a case worker will contact you)',
                     'Yes' => 'I have provided a supporting document with this form'
                ]"/>
            </div>
        </div>
    </div>
    <div class="card-footer text-end bg-light">
        <button
                wire:click="save"
                class="btn btn-success"
        >
            Save
        </button>
    </div>
</div>