<?xml version="1.0" encoding="utf-8"?>
<odoo>
    <!-- Express Assessment Form Template -->
    <template id="portal_assessment_express" name="ADP Assessment Express Form">
        <t t-call="portal.portal_layout">
            <t t-set="breadcrumbs_searchbar" t-value="False"/>
            <t t-set="no_breadcrumbs" t-value="True"/>
            
            <!-- Breadcrumbs -->
            <div class="container mt-3">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb mb-0">
                        <li class="breadcrumb-item"><a href="/my/home">Home</a></li>
                        <li class="breadcrumb-item"><a href="/my/assessments">Assessments</a></li>
                        <li class="breadcrumb-item active" aria-current="page">
                            <t t-if="assessment"><t t-out="assessment.reference"/></t>
                            <t t-else="">New Express Assessment</t>
                        </li>
                    </ol>
                </nav>
            </div>
            
            <!-- Compact form styling -->
            <style>
                .assessment-express-form .card {
                    margin-bottom: 1rem !important;
                }
                .assessment-express-form .card-body {
                    padding: 1.25rem !important;
                }
                .assessment-express-form .card-header {
                    padding: 0.75rem 1.25rem !important;
                }
                .assessment-express-form .mb-4 {
                    margin-bottom: 0.75rem !important;
                }
                .assessment-express-form .mb-3 {
                    margin-bottom: 0.5rem !important;
                }
                .assessment-express-form .form-label {
                    margin-bottom: 0.25rem !important;
                    font-size: 0.9rem;
                }
                .assessment-express-form .form-control,
                .assessment-express-form .form-select {
                    padding: 0.375rem 0.75rem !important;
                    font-size: 0.95rem;
                }
                .assessment-express-form .form-select-lg {
                    padding: 0.5rem 1rem !important;
                    font-size: 1rem;
                }
                .assessment-express-form .form-check {
                    margin-bottom: 0.25rem !important;
                }
                .assessment-express-form .row {
                    margin-bottom: 0 !important;
                }
                .assessment-express-form h2 {
                    font-size: 1.4rem;
                    margin-bottom: 1rem !important;
                }
                .assessment-express-form h4 {
                    font-size: 1.1rem;
                    margin-bottom: 0 !important;
                }
                .assessment-express-form .input-group-text {
                    padding: 0.375rem 0.5rem;
                    font-size: 0.9rem;
                }
                .assessment-express-form .gap-4 {
                    gap: 1rem !important;
                }
            </style>
            
            <div class="container py-3">
                <!-- Header -->
                <div class="text-center mb-3">
                    <h1 class="h3 fw-bold text-primary">ADP Assessment Express Form</h1>
                    <p class="text-muted small mb-0" t-if="assessment">Reference: <strong t-esc="assessment.reference"/></p>
                </div>
                
                <!-- Form -->
                <form method="POST" action="/my/assessment/express/save" class="assessment-express-form" enctype="multipart/form-data">
                    <input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
                    <input type="hidden" name="assessment_id" t-att-value="assessment.id if assessment else ''"/>
                    <input type="hidden" name="current_page" value="1"/>
                    
                    <!-- Equipment Selection Section -->
                    <div class="card shadow-sm">
                        <div class="card-body">
                            
                            <!-- Equipment Type Selection -->
                            <div class="mb-4">
                                <label class="form-label fw-bold">Choose Equipment <span class="text-danger">*</span></label>
                                <select name="equipment_type" id="equipment_type" class="form-select form-select-lg" required="required">
                                    <option value="">-- Select Equipment --</option>
                                    <option value="rollator" t-att-selected="assessment.equipment_type == 'rollator' if assessment else False">Rollator</option>
                                    <option value="wheelchair" t-att-selected="assessment.equipment_type == 'wheelchair' if assessment else False">Wheelchair</option>
                                    <option value="powerchair" t-att-selected="assessment.equipment_type == 'powerchair' if assessment else False">Powerchair</option>
                                </select>
                            </div>
                            
                            <!-- ============================================ -->
                            <!-- ROLLATOR FORM -->
                            <!-- ============================================ -->
                            <div id="rollator_form" class="equipment-form" style="display: none;">
                                <h2 class="text-center fw-bold text-uppercase mb-4">Rollator Assessment</h2>
                                
                                <!-- Rollator Type -->
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Rollator Type</label>
                                    <select name="rollator_type" class="form-select">
                                        <option value="">-- Select Type --</option>
                                        <option value="type_1" t-att-selected="assessment.rollator_type == 'type_1' if assessment else False">Type 1</option>
                                        <option value="type_2" t-att-selected="assessment.rollator_type == 'type_2' if assessment else False">Type 2</option>
                                        <option value="type_3" t-att-selected="assessment.rollator_type == 'type_3' if assessment else False">Type 3</option>
                                    </select>
                                </div>
                                
                                <!-- Rollator Measurements -->
                                <div class="row mb-4">
                                    <div class="col-12 col-md-6">
                                        <label class="form-label fw-bold">Handle Height</label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="rollator_handle_height" class="form-control" placeholder="in Inches"
                                                   t-att-value="assessment.rollator_handle_height if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                    <div class="col-12 col-md-6">
                                        <label class="form-label fw-bold">Seat Height</label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="rollator_seat_height" class="form-control" placeholder="in Inches"
                                                   t-att-value="assessment.rollator_seat_height if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Rollator Addons -->
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Choose Addons</label>
                                    <div class="d-flex flex-wrap gap-4">
                                        <t t-set="rollator_addon_list" t-value="(assessment.rollator_addons or '').split(',') if assessment else []"/>
                                        <div class="form-check">
                                            <input type="checkbox" name="rollator_addons" value="Curb Climber" class="form-check-input" id="addon_curb"
                                                   t-att-checked="'Curb Climber' in rollator_addon_list"/>
                                            <label class="form-check-label" for="addon_curb">Curb Climber</label>
                                        </div>
                                        <div class="form-check">
                                            <input type="checkbox" name="rollator_addons" value="Cane Holder" class="form-check-input" id="addon_cane"
                                                   t-att-checked="'Cane Holder' in rollator_addon_list"/>
                                            <label class="form-check-label" for="addon_cane">Cane Holder</label>
                                        </div>
                                        <div class="form-check">
                                            <input type="checkbox" name="rollator_addons" value="Cup Holder" class="form-check-input" id="addon_cup"
                                                   t-att-checked="'Cup Holder' in rollator_addon_list"/>
                                            <label class="form-check-label" for="addon_cup">Cup Holder</label>
                                        </div>
                                        <div class="form-check">
                                            <input type="checkbox" name="rollator_addons" value="Slow Down Brakes" class="form-check-input" id="addon_brakes"
                                                   t-att-checked="'Slow Down Brakes' in rollator_addon_list"/>
                                            <label class="form-check-label" for="addon_brakes">Slow Down Brakes</label>
                                        </div>
                                        <div class="form-check">
                                            <input type="checkbox" name="rollator_addons" value="Footrest" class="form-check-input" id="addon_footrest"
                                                   t-att-checked="'Footrest' in rollator_addon_list"/>
                                            <label class="form-check-label" for="addon_footrest">Footrest</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                            <!-- ============================================ -->
                            <!-- WHEELCHAIR FORM -->
                            <!-- ============================================ -->
                            <div id="wheelchair_form" class="equipment-form" style="display: none;">
                                <h2 class="text-center fw-bold text-uppercase mb-4">Wheelchair Assessment</h2>
                                
                                <!-- Wheelchair Type -->
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Wheelchair Type <span class="text-danger">*</span></label>
                                    <select name="wheelchair_type" class="form-select">
                                        <option value="">-- Select Type --</option>
                                        <option value="type_1" t-att-selected="assessment.wheelchair_type == 'type_1' if assessment else False">Type 1 - Adult Manual Standard Wheelchair</option>
                                        <option value="type_2" t-att-selected="assessment.wheelchair_type == 'type_2' if assessment else False">Type 2 - Adult Manual Lightweight Wheelchair</option>
                                        <option value="type_3" t-att-selected="assessment.wheelchair_type == 'type_3' if assessment else False">Type 3 - Adult Manual Ultra Lightweight Wheelchair</option>
                                        <option value="type_4" t-att-selected="assessment.wheelchair_type == 'type_4' if assessment else False">Type 4 - Adult Manual Tilt Wheelchair</option>
                                        <option value="type_5" t-att-selected="assessment.wheelchair_type == 'type_5' if assessment else False">Type 5 - Adult Manual Dynamic Tilt Wheelchair</option>
                                    </select>
                                </div>
                                
                                <!-- Wheelchair Measurements -->
                                <div class="row mb-3">
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Seat Width (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="seat_width" class="form-control" required="required"
                                                   t-att-value="assessment.seat_width if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Seat Depth (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="seat_depth" class="form-control" required="required"
                                                   t-att-value="assessment.seat_depth if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb-3">
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Legrest Length (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="legrest_length" class="form-control" required="required"
                                                   t-att-value="assessment.legrest_length if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Seat to Floor Height (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="seat_to_floor_height" class="form-control" placeholder="Including Cushion" required="required"
                                                   t-att-value="assessment.seat_to_floor_height if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb-4">
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Cane Height (floor to handle) (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="cane_height" class="form-control" placeholder="Ground to Canes" required="required"
                                                   t-att-value="assessment.cane_height if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Back Height (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="back_height" class="form-control" required="required"
                                                   t-att-value="assessment.back_height if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Frame Options -->
                                <t t-set="frame_options_list" t-value="(assessment.frame_options or '').split(',') if assessment else []"/>
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Frame Options – ADP Funded Options (Rationale Required for these options)</label>
                                    <div class="d-flex flex-wrap gap-4">
                                        <div class="form-check">
                                            <input type="checkbox" name="frame_options" value="Recliner Option" class="form-check-input" id="frame_recliner"
                                                   t-att-checked="'Recliner Option' in frame_options_list"/>
                                            <label class="form-check-label" for="frame_recliner">Recliner Option</label>
                                        </div>
                                        <div class="form-check">
                                            <input type="checkbox" name="frame_options" value="Dynamic Tilt Frame" class="form-check-input" id="frame_tilt"
                                                   t-att-checked="'Dynamic Tilt Frame' in frame_options_list"/>
                                            <label class="form-check-label" for="frame_tilt">Dynamic Tilt Frame</label>
                                        </div>
                                        <div class="form-check">
                                            <input type="checkbox" name="frame_options" value="Titanium Frame" class="form-check-input" id="frame_titanium"
                                                   t-att-checked="'Titanium Frame' in frame_options_list"/>
                                            <label class="form-check-label" for="frame_titanium">Titanium Frame</label>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Wheel Options -->
                                <t t-set="wheel_options_list" t-value="(assessment.wheel_options or '').split(',') if assessment else []"/>
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Wheel Options/Addons – ADP Funded Options</label>
                                    <div class="row">
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="wheel_options" value="Caster Pin Locks (pair)" class="form-check-input" id="wheel_caster"
                                                       t-att-checked="'Caster Pin Locks (pair)' in wheel_options_list"/>
                                                <label class="form-check-label" for="wheel_caster">Caster Pin Locks (pair)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="wheel_options" value="Spoke Protectors (pair)" class="form-check-input" id="wheel_spoke"
                                                       t-att-checked="'Spoke Protectors (pair)' in wheel_options_list"/>
                                                <label class="form-check-label" for="wheel_spoke">Spoke Protectors (pair)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="wheel_options" value="Amputee Axle Plates (pair)" class="form-check-input" id="wheel_amputee"
                                                       t-att-checked="'Amputee Axle Plates (pair)' in wheel_options_list"/>
                                                <label class="form-check-label" for="wheel_amputee">Amputee Axle Plates (pair)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="wheel_options" value="Quick Release Axles (pair)" class="form-check-input" id="wheel_quick"
                                                       t-att-checked="'Quick Release Axles (pair)' in wheel_options_list"/>
                                                <label class="form-check-label" for="wheel_quick">Quick Release Axles (pair)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="wheel_options" value="Uni-Lateral Wheel Lock" class="form-check-input" id="wheel_uni"
                                                       t-att-checked="'Uni-Lateral Wheel Lock' in wheel_options_list"/>
                                                <label class="form-check-label" for="wheel_uni">Uni-Lateral Wheel Lock</label>
                                            </div>
                                        </div>
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="wheel_options" value="One Arm/Lever Drive" class="form-check-input" id="wheel_onearm"
                                                       t-att-checked="'One Arm/Lever Drive' in wheel_options_list"/>
                                                <label class="form-check-label" for="wheel_onearm">One Arm/Lever Drive</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="wheel_options" value="Plastic Coated Handrims" class="form-check-input" id="wheel_plastic"
                                                       t-att-checked="'Plastic Coated Handrims' in wheel_options_list"/>
                                                <label class="form-check-label" for="wheel_plastic">Plastic Coated Handrims</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="wheel_options" value="Projected Handrims (pair)" class="form-check-input" id="wheel_projected"
                                                       t-att-checked="'Projected Handrims (pair)' in wheel_options_list"/>
                                                <label class="form-check-label" for="wheel_projected">Projected Handrims (pair)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="wheel_options" value="Grade Aids (pair)" class="form-check-input" id="wheel_grade"
                                                       t-att-checked="'Grade Aids (pair)' in wheel_options_list"/>
                                                <label class="form-check-label" for="wheel_grade">Grade Aids (pair)</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Legrest Accessories -->
                                <t t-set="legrest_options_list" t-value="(assessment.legrest_options or '').split(',') if assessment else []"/>
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Legrest Accessories – ADP Funded Options</label>
                                    <div class="row">
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="legrest_options" value="Angle Adjustable Footplates" class="form-check-input" id="leg_angle"
                                                       t-att-checked="'Angle Adjustable Footplates' in legrest_options_list"/>
                                                <label class="form-check-label" for="leg_angle">Angle Adjustable Footplates</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="legrest_options" value="Elevating Legrests (pair)" class="form-check-input" id="leg_elevating"
                                                       t-att-checked="'Elevating Legrests (pair)' in legrest_options_list"/>
                                                <label class="form-check-label" for="leg_elevating">Elevating Legrests (pair)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="legrest_options" value="Legrest Padding – Foot/Leg Support Options (Modular)" class="form-check-input" id="leg_padding"
                                                       t-att-checked="'Legrest Padding' in legrest_options_list"/>
                                                <label class="form-check-label" for="leg_padding">Legrest Padding – Foot/Leg Support Options (Modular)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="legrest_options" value="Footrest Padding – Foot/Leg Support Options (Custom)" class="form-check-input" id="leg_footrest_pad"
                                                       t-att-checked="'Footrest Padding' in legrest_options_list"/>
                                                <label class="form-check-label" for="leg_footrest_pad">Footrest Padding – Foot/Leg Support Options (Custom)</label>
                                            </div>
                                        </div>
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="legrest_options" value="Calf Panel – Foot/Leg Support (Modular)" class="form-check-input" id="leg_calf"
                                                       t-att-checked="'Calf Panel' in legrest_options_list"/>
                                                <label class="form-check-label" for="leg_calf">Calf Panel – Foot/Leg Support (Modular)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="legrest_options" value="Calf Panel (Custom) – Foot/Leg Support (Custom)" class="form-check-input" id="leg_calf_custom"
                                                       t-att-checked="'Calf Panel (Custom)' in legrest_options_list"/>
                                                <label class="form-check-label" for="leg_calf_custom">Calf Panel (Custom) – Foot/Leg Support (Custom)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="legrest_options" value="Flip Forward Calf Panel – Foot/Leg Support (Custom)" class="form-check-input" id="leg_flip"
                                                       t-att-checked="'Flip Forward Calf Panel' in legrest_options_list"/>
                                                <label class="form-check-label" for="leg_flip">Flip Forward Calf Panel – Foot/Leg Support (Custom)</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Additional ADP Options -->
                                <t t-set="additional_options_list" t-value="(assessment.additional_adp_options or '').split(',') if assessment else []"/>
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Additional ADP Funded Options</label>
                                    <div class="row">
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="additional_adp_options" value="Adjustable Tension Back Upholstery" class="form-check-input" id="add_tension"
                                                       t-att-checked="'Adjustable Tension Back Upholstery' in additional_options_list"/>
                                                <label class="form-check-label" for="add_tension">Adjustable Tension Back Upholstery</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="additional_adp_options" value="Heavy Duty Cross Braces &amp; Upholstery" class="form-check-input" id="add_heavy"
                                                       t-att-checked="'Heavy Duty Cross Braces' in additional_options_list"/>
                                                <label class="form-check-label" for="add_heavy">Heavy Duty Cross Braces &amp; Upholstery</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="additional_adp_options" value="Stroller Handles/Paediatric" class="form-check-input" id="add_stroller"
                                                       t-att-checked="'Stroller Handles' in additional_options_list"/>
                                                <label class="form-check-label" for="add_stroller">Stroller Handles/Paediatric</label>
                                            </div>
                                        </div>
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="additional_adp_options" value="Oxygen Tank Holder" class="form-check-input" id="add_o2"
                                                       t-att-checked="'Oxygen Tank Holder' in additional_options_list"/>
                                                <label class="form-check-label" for="add_o2">Oxygen Tank Holder</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="additional_adp_options" value="Ventilator Tray" class="form-check-input" id="add_vent"
                                                       t-att-checked="'Ventilator Tray' in additional_options_list"/>
                                                <label class="form-check-label" for="add_vent">Ventilator Tray</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Cushion and Backrest -->
                                <div class="row mb-4">
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Cushion</label>
                                        <input type="text" name="cushion_info" class="form-control" placeholder="Enter cushion details..."
                                               t-att-value="assessment.cushion_info if assessment else ''"/>
                                    </div>
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Backrest</label>
                                        <input type="text" name="backrest_info" class="form-control" placeholder="Enter backrest details..."
                                               t-att-value="assessment.backrest_info if assessment else ''"/>
                                    </div>
                                </div>
                                
                                <!-- Seat Belt Type -->
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Seat Belt Type – ADP Funded Options</label>
                                    <div class="row">
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="standard" class="form-check-input" id="belt_standard"
                                                       t-att-checked="assessment.seatbelt_type == 'standard' if assessment else False"/>
                                                <label class="form-check-label" for="belt_standard">Standard Belt – No Padding</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="padded" class="form-check-input" id="belt_padded"
                                                       t-att-checked="assessment.seatbelt_type == 'padded' if assessment else False"/>
                                                <label class="form-check-label" for="belt_padded">Padded Belt – Positioning Belts (Modular)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="4point" class="form-check-input" id="belt_4point"
                                                       t-att-checked="assessment.seatbelt_type == '4point' if assessment else False"/>
                                                <label class="form-check-label" for="belt_4point">4 Point Seat Belt – Positioning Belts (Modular)</label>
                                            </div>
                                        </div>
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="chest_harness" class="form-check-input" id="belt_chest"
                                                       t-att-checked="assessment.seatbelt_type == 'chest_harness' if assessment else False"/>
                                                <label class="form-check-label" for="belt_chest">Chest Harness – Positioning Belts (Modular)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="additional_pads" class="form-check-input" id="belt_pads"
                                                       t-att-checked="assessment.seatbelt_type == 'additional_pads' if assessment else False"/>
                                                <label class="form-check-label" for="belt_pads">Additional Pads – Positioning Belts (Custom)</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Additional Information -->
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Additional Information/Customization</label>
                                    <textarea name="additional_customization" class="form-control" rows="4" placeholder="Enter any additional requirements or customization notes..."><t t-esc="assessment.additional_customization if assessment else ''"/></textarea>
                                </div>
                            </div>
                            
                            <!-- ============================================ -->
                            <!-- POWERCHAIR FORM -->
                            <!-- ============================================ -->
                            <div id="powerchair_form" class="equipment-form" style="display: none;">
                                <h2 class="text-center fw-bold text-uppercase mb-4">Powerchair Assessment</h2>
                                
                                <!-- Powerchair Type -->
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Powerchair Type <span class="text-danger">*</span></label>
                                    <select name="powerchair_type" class="form-select">
                                        <option value="">-- Select Type --</option>
                                        <option value="type_1" t-att-selected="assessment.powerchair_type == 'type_1' if assessment else False">Adult Power Base Type 1</option>
                                        <option value="type_2" t-att-selected="assessment.powerchair_type == 'type_2' if assessment else False">Adult Power Base Type 2</option>
                                        <option value="type_3" t-att-selected="assessment.powerchair_type == 'type_3' if assessment else False">Adult Power Base Type 3</option>
                                    </select>
                                </div>
                                
                                <!-- Powerchair Measurements -->
                                <div class="row mb-3">
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Seat Width (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="seat_width" class="form-control powerchair-field"
                                                   t-att-value="assessment.seat_width if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Seat Depth (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="seat_depth" class="form-control powerchair-field"
                                                   t-att-value="assessment.seat_depth if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb-3">
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Legrest Length (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="legrest_length" class="form-control powerchair-field"
                                                   t-att-value="assessment.legrest_length if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Seat to Floor Height (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="seat_to_floor_height" class="form-control powerchair-field"
                                                   t-att-value="assessment.seat_to_floor_height if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb-4">
                                    <div class="col-12 col-md-6 mb-3">
                                        <label class="form-label fw-bold">Back Height (Inches) <span class="text-danger">*</span></label>
                                        <div class="input-group">
                                            <input type="number" step="0.5" name="back_height" class="form-control powerchair-field"
                                                   t-att-value="assessment.back_height if assessment else ''"/>
                                            <span class="input-group-text">Inch</span>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Powerchair Seat Belt Type (same as wheelchair) -->
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Seat Belt Type – ADP Funded Options</label>
                                    <div class="row">
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="standard" class="form-check-input" id="pc_belt_standard"
                                                       t-att-checked="assessment.seatbelt_type == 'standard' if assessment else False"/>
                                                <label class="form-check-label" for="pc_belt_standard">Standard Belt – No Padding</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="padded" class="form-check-input" id="pc_belt_padded"
                                                       t-att-checked="assessment.seatbelt_type == 'padded' if assessment else False"/>
                                                <label class="form-check-label" for="pc_belt_padded">Padded Belt – Positioning Belts (Modular)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="4point" class="form-check-input" id="pc_belt_4point"
                                                       t-att-checked="assessment.seatbelt_type == '4point' if assessment else False"/>
                                                <label class="form-check-label" for="pc_belt_4point">4 Point Seat Belt – Positioning Belts (Modular)</label>
                                            </div>
                                        </div>
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="chest_harness" class="form-check-input" id="pc_belt_chest"
                                                       t-att-checked="assessment.seatbelt_type == 'chest_harness' if assessment else False"/>
                                                <label class="form-check-label" for="pc_belt_chest">Chest Harness – Positioning Belts (Modular)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="radio" name="seatbelt_type" value="additional_pads" class="form-check-input" id="pc_belt_pads"
                                                       t-att-checked="assessment.seatbelt_type == 'additional_pads' if assessment else False"/>
                                                <label class="form-check-label" for="pc_belt_pads">Additional Pads – Positioning Belts (Custom)</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Powerchair Additional Options -->
                                <t t-set="powerchair_options_list" t-value="(assessment.powerchair_options or '').split(',') if assessment else []"/>
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Powerchair – Additional ADP Funded Options</label>
                                    <div class="row">
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Adjustable Tension Back Upholstery" class="form-check-input" id="pc_tension"
                                                       t-att-checked="'Adjustable Tension Back Upholstery' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_tension">Adjustable Tension Back Upholstery</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Midline Control" class="form-check-input" id="pc_midline"
                                                       t-att-checked="'Midline Control' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_midline">Midline Control</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Manual Recline Option" class="form-check-input" id="pc_recline"
                                                       t-att-checked="'Manual Recline Option' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_recline">Manual Recline Option</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Angle Adjustable Footplates (pair)" class="form-check-input" id="pc_angle"
                                                       t-att-checked="'Angle Adjustable Footplates' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_angle">Angle Adjustable Footplates (pair)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Manual Elevating Legrests (pair)" class="form-check-input" id="pc_elevating"
                                                       t-att-checked="'Manual Elevating Legrests' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_elevating">Manual Elevating Legrests (pair)</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Swingaway Mounting Bracket" class="form-check-input" id="pc_swingaway"
                                                       t-att-checked="'Swingaway Mounting Bracket' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_swingaway">Swingaway Mounting Bracket - Required**</label>
                                            </div>
                                        </div>
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="One Piece 90/90 Front Riggings" class="form-check-input" id="pc_onepiece"
                                                       t-att-checked="'One Piece 90/90 Front Riggings' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_onepiece">One Piece 90/90 Front Riggings - Required**</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Seat Package 1 for Power Bases" class="form-check-input" id="pc_seat1"
                                                       t-att-checked="'Seat Package 1 for Power Bases' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_seat1">Seat Package 1 for Power Bases - Required**</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Seat Package 2 for Power Bases" class="form-check-input" id="pc_seat2"
                                                       t-att-checked="'Seat Package 2 for Power Bases' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_seat2">Seat Package 2 for Power Bases</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Oxygen Tank Holder" class="form-check-input" id="pc_o2"
                                                       t-att-checked="'Oxygen Tank Holder' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_o2">Oxygen Tank Holder</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="powerchair_options" value="Ventilator Tray" class="form-check-input" id="pc_vent"
                                                       t-att-checked="'Ventilator Tray' in powerchair_options_list"/>
                                                <label class="form-check-label" for="pc_vent">Ventilator Tray</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Specialty Components -->
                                <t t-set="specialty_list" t-value="(assessment.specialty_controls or '').split(',') if assessment else []"/>
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Specialty Components (Rationale Required for these options)</label>
                                    <div class="row">
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="specialty_controls" value="Specialty Controls 1 Non Standard Joystick" class="form-check-input" id="spec_1"
                                                       t-att-checked="'Specialty Controls 1' in specialty_list"/>
                                                <label class="form-check-label" for="spec_1">Specialty Controls 1 Non Standard Joystick</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="specialty_controls" value="Specialty Controls 2 Chin/Rim Control" class="form-check-input" id="spec_2"
                                                       t-att-checked="'Specialty Controls 2' in specialty_list"/>
                                                <label class="form-check-label" for="spec_2">Specialty Controls 2 Chin/Rim Control</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="specialty_controls" value="Specialty Controls 3 Simple Touch" class="form-check-input" id="spec_3"
                                                       t-att-checked="'Specialty Controls 3' in specialty_list"/>
                                                <label class="form-check-label" for="spec_3">Specialty Controls 3 Simple Touch</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="specialty_controls" value="Specialty Controls 4 Proximity Control" class="form-check-input" id="spec_4"
                                                       t-att-checked="'Specialty Controls 4' in specialty_list"/>
                                                <label class="form-check-label" for="spec_4">Specialty Controls 4 Proximity Control</label>
                                            </div>
                                        </div>
                                        <div class="col-12 col-md-6">
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="specialty_controls" value="Specialty Controls 5 Breath Control" class="form-check-input" id="spec_5"
                                                       t-att-checked="'Specialty Controls 5' in specialty_list"/>
                                                <label class="form-check-label" for="spec_5">Specialty Controls 5 Breath Control</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="specialty_controls" value="Specialty Controls 6 Scanners" class="form-check-input" id="spec_6"
                                                       t-att-checked="'Specialty Controls 6' in specialty_list"/>
                                                <label class="form-check-label" for="spec_6">Specialty Controls 6 Scanners</label>
                                            </div>
                                            <div class="form-check mb-2">
                                                <input type="checkbox" name="specialty_controls" value="Auto Correction System" class="form-check-input" id="spec_auto"
                                                       t-att-checked="'Auto Correction System' in specialty_list"/>
                                                <label class="form-check-label" for="spec_auto">Auto Correction System</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <!-- Additional Information -->
                                <div class="mb-4">
                                    <label class="form-label fw-bold">Additional Information/Customization</label>
                                    <textarea name="additional_customization" class="form-control powerchair-field" rows="4" placeholder="Enter any additional requirements or customization notes..."><t t-esc="assessment.additional_customization if assessment else ''"/></textarea>
                                </div>
                            </div>
                            
                        </div>
                    </div>
                    
                    <!-- Client Biographic Information Section -->
                    <div class="card shadow-sm">
                        <div class="card-header bg-primary text-white">
                            <h4 class="mb-0"><i class="fa fa-user me-2"/>Client Information</h4>
                        </div>
                        <div class="card-body">
                            
                            <!-- Name Fields -->
                            <div class="row mb-3">
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">First Name <span class="text-danger">*</span></label>
                                    <input type="text" name="client_first_name" class="form-control" required="required"
                                           t-att-value="assessment.client_first_name if assessment else ''"/>
                                </div>
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Middle Name</label>
                                    <input type="text" name="client_middle_name" class="form-control"
                                           t-att-value="assessment.client_middle_name if assessment else ''"/>
                                </div>
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Last Name <span class="text-danger">*</span></label>
                                    <input type="text" name="client_last_name" class="form-control" required="required"
                                           t-att-value="assessment.client_last_name if assessment else ''"/>
                                </div>
                            </div>
                            
                            <!-- Client Type -->
                            <div class="row mb-3">
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Client Type <span class="text-danger">*</span></label>
                                    <select name="client_type" class="form-select" required="required">
                                        <option value="reg" t-att-selected="(assessment.client_type if assessment else 'reg') == 'reg'">REG - Regular ADP</option>
                                        <option value="ods" t-att-selected="assessment.client_type == 'ods' if assessment else False">ODS - ODSP</option>
                                        <option value="acs" t-att-selected="assessment.client_type == 'acs' if assessment else False">ACS - ACSD</option>
                                        <option value="owp" t-att-selected="assessment.client_type == 'owp' if assessment else False">OWP - Ontario Works</option>
                                    </select>
                                </div>
                                <div class="col-12 col-md-5 mb-3">
                                    <label class="form-label fw-bold">Health Card Number <span class="text-danger">*</span></label>
                                    <input type="text" name="client_health_card" class="form-control" required="required" placeholder="e.g. 1234-567-890"
                                           t-att-value="assessment.client_health_card if assessment else ''"/>
                                </div>
                                <div class="col-6 col-md-3 mb-3">
                                    <label class="form-label fw-bold">Version Code</label>
                                    <input type="text" name="client_health_card_version" class="form-control" placeholder="e.g. AB"
                                           t-att-value="assessment.client_health_card_version if assessment else ''"/>
                                </div>
                            </div>
                            
                            <!-- Address -->
                            <div class="row mb-3">
                                <div class="col-12 col-md-8 mb-3">
                                    <label class="form-label fw-bold">Street Address <span class="text-danger">*</span></label>
                                    <input type="text" name="client_street" class="form-control" required="required"
                                           t-att-value="assessment.client_street if assessment else ''"/>
                                </div>
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Unit/Apt/Suite</label>
                                    <input type="text" name="client_unit" class="form-control" placeholder="e.g., Unit 5, Apt 302"
                                           t-att-value="assessment.client_unit if assessment else ''"/>
                                </div>
                            </div>
                            
                            <div class="row mb-3">
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">City <span class="text-danger">*</span></label>
                                    <input type="text" name="client_city" class="form-control" required="required"
                                           t-att-value="assessment.client_city if assessment else ''"/>
                                </div>
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Province <span class="text-danger">*</span></label>
                                    <select name="client_state" class="form-select" required="required">
                                        <t t-foreach="provinces" t-as="prov">
                                            <option t-att-value="prov[0]" t-att-selected="(assessment.client_state if assessment else 'Ontario') == prov[0]">
                                                <t t-esc="prov[1]"/>
                                            </option>
                                        </t>
                                    </select>
                                </div>
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Postal Code <span class="text-danger">*</span></label>
                                    <input type="text" name="client_postal_code" class="form-control" required="required" placeholder="A1A 1A1"
                                           t-att-value="assessment.client_postal_code if assessment else ''"/>
                                </div>
                            </div>
                            
                            <!-- Contact -->
                            <div class="row mb-3">
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Phone Number <span class="text-danger">*</span></label>
                                    <input type="tel" name="client_phone" class="form-control" required="required" placeholder="(416) 555-1234"
                                           t-att-value="assessment.client_phone if assessment else ''"/>
                                </div>
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Email</label>
                                    <input type="email" name="client_email" class="form-control" placeholder="client@example.com"
                                           t-att-value="assessment.client_email if assessment else ''"/>
                                </div>
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Client Weight (lbs)</label>
                                    <input type="number" step="1" name="client_weight" class="form-control" placeholder="e.g., 180"
                                           t-att-value="int(assessment.client_weight) if assessment and assessment.client_weight else ''"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <!-- Assessment Dates and Details Section -->
                    <div class="card shadow-sm">
                        <div class="card-header bg-primary text-white">
                            <h4 class="mb-0"><i class="fa fa-calendar me-2"/>Assessment Details</h4>
                        </div>
                        <div class="card-body">
                            
                            <!-- Key Dates -->
                            <div class="row mb-3">
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Assessment Start Date <span class="text-danger">*</span></label>
                                    <input type="date" name="assessment_start_date" id="assessment_start_date" class="form-control" required="required"
                                           t-att-value="assessment.assessment_start_date if assessment else ''"/>
                                </div>
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Assessment End Date</label>
                                    <input type="date" name="assessment_end_date" class="form-control"
                                           t-att-value="assessment.assessment_end_date if assessment else ''"/>
                                </div>
                                <div class="col-12 col-md-4 mb-3">
                                    <label class="form-label fw-bold">Claim Authorization Date</label>
                                    <input type="date" name="claim_authorization_date" class="form-control"
                                           t-att-value="assessment.claim_authorization_date if assessment else ''"/>
                                </div>
                            </div>
                            
                            <!-- Reason for Application -->
                            <div class="row mb-3">
                                <div class="col-12 col-md-6 mb-3">
                                    <label class="form-label fw-bold">Reason for Application</label>
                                    <select name="reason_for_application" id="reason_for_application" class="form-select">
                                        <option value="">-- Select Reason --</option>
                                        <option value="first_access" t-att-selected="assessment.reason_for_application == 'first_access' if assessment else False">First Time Access - NO previous ADP</option>
                                        <option value="additions" t-att-selected="assessment.reason_for_application == 'additions' if assessment else False">Additions</option>
                                        <option value="mod_non_adp" t-att-selected="assessment.reason_for_application == 'mod_non_adp' if assessment else False">Modification/Upgrade - Original NOT through ADP</option>
                                        <option value="mod_adp" t-att-selected="assessment.reason_for_application == 'mod_adp' if assessment else False">Modification/Upgrade - Original through ADP</option>
                                        <option value="replace_status" t-att-selected="assessment.reason_for_application == 'replace_status' if assessment else False">Replacement - Change in Status</option>
                                        <option value="replace_size" t-att-selected="assessment.reason_for_application == 'replace_size' if assessment else False">Replacement - Change in Body Size</option>
                                        <option value="replace_worn" t-att-selected="assessment.reason_for_application == 'replace_worn' if assessment else False">Replacement - Worn out (past useful life)</option>
                                        <option value="replace_lost" t-att-selected="assessment.reason_for_application == 'replace_lost' if assessment else False">Replacement - Lost</option>
                                        <option value="replace_stolen" t-att-selected="assessment.reason_for_application == 'replace_stolen' if assessment else False">Replacement - Stolen</option>
                                        <option value="replace_damaged" t-att-selected="assessment.reason_for_application == 'replace_damaged' if assessment else False">Replacement - Damaged beyond repair</option>
                                        <option value="replace_no_longer_meets" t-att-selected="assessment.reason_for_application == 'replace_no_longer_meets' if assessment else False">Replacement - No longer meets needs</option>
                                        <option value="growth" t-att-selected="assessment.reason_for_application == 'growth' if assessment else False">Growth/Change in condition</option>
                                    </select>
                                </div>
                                <div class="col-12 col-md-6 mb-3" id="previous_funding_date_container" style="display: none;">
                                    <label class="form-label fw-bold">Previous Funding Date (for replacements)</label>
                                    <input type="date" name="previous_funding_date" class="form-control"
                                           t-att-value="assessment.previous_funding_date if assessment else ''"/>
                                </div>
                            </div>
                            
                            <!-- Authorizer Selection (searchable) -->
                            <div class="mb-3">
                                <label class="form-label fw-bold">Authorizer/OT <span class="text-danger">*</span></label>
                                <input type="hidden" name="authorizer_id" id="authorizer_id_value"
                                       t-att-value="assessment.authorizer_id.id if assessment and assessment.authorizer_id else ''"/>
                                <div class="position-relative" id="authorizer-search-wrapper">
                                    <input type="text" id="authorizer-search" class="form-control"
                                           placeholder="Type to search authorizer..."
                                           autocomplete="off"
                                           t-att-value="(assessment.authorizer_id.name + (' - ' + assessment.authorizer_id.email if assessment.authorizer_id.email else '')) if assessment and assessment.authorizer_id else ''"/>
                                    <div id="authorizer-dropdown" class="dropdown-menu w-100 shadow-sm" style="max-height:220px;overflow-y:auto;display:none;"/>
                                </div>
                                <!-- Authorizer data passed to JS (JSON-safe from controller) -->
                                <script type="application/json" id="authorizer-data">
                                    <t t-out="authorizers_json"/>
                                </script>
                            </div>
                            
                            <!-- Assessment Photos -->
                            <div class="mb-3">
                                <label class="form-label fw-bold">
                                    <i class="fa fa-camera me-1"/>Assessment Photos
                                </label>
                                <p class="text-muted small mb-2">Upload photos from the assessment (client measurements, equipment, etc.). These will be attached to the case.</p>
                                <input type="file" name="assessment_photos" class="form-control" accept="image/*" multiple="multiple"/>
                                <small class="text-muted">You can select multiple photos. Accepted formats: JPG, PNG, GIF</small>
                            </div>
                            
                        </div>
                    </div>
                    
                    <!-- ============================================= -->
                    <!-- Page 11: Consent & Declaration Section      -->
                    <!-- ============================================= -->
                    <div class="card shadow-sm">
                        <div class="card-header" style="background: linear-gradient(135deg, #2c3e50 0%, #3498db 100%); cursor: pointer;"
                             data-bs-toggle="collapse" data-bs-target="#page11Section">
                            <h4 class="mb-0 text-white">
                                <i class="fa fa-file-text me-2"/>ADP Consent &amp; Declaration (Page 11)
                                <small class="ms-2 opacity-75">(Optional - click to expand)</small>
                            </h4>
                        </div>
                        <div id="page11Section" class="collapse">
                            <div class="card-body">
                                <div class="alert alert-info">
                                    <i class="fa fa-info-circle me-1"/>
                                    Complete this section to digitally sign Page 11 of the ADP application.
                                    The client name and details are auto-filled from the information above.
                                </div>

                                <!-- Client Name Display (auto-filled) -->
                                <div class="mb-3 p-2 bg-light rounded">
                                    <label class="form-label fw-bold small text-muted">Client Name (from above)</label>
                                    <div id="page11_client_name_display" class="fw-bold" style="font-size: 16px;">
                                        <t t-if="assessment and assessment.client_name">
                                            <t t-esc="assessment.client_name"/>
                                        </t>
                                    </div>
                                </div>

                                <!-- Signed By: Applicant or Agent -->
                                <div class="mb-3">
                                    <label class="form-label fw-bold">
                                        Application signed by <span class="text-danger">*</span>
                                    </label>
                                    <div>
                                        <div class="form-check form-check-inline">
                                            <input type="radio" class="form-check-input" name="consent_signed_by"
                                                   id="consent_applicant" value="applicant"
                                                   t-att-checked="'checked' if not assessment or not assessment.consent_signed_by or assessment.consent_signed_by == 'applicant' else None"/>
                                            <label class="form-check-label" for="consent_applicant">Applicant</label>
                                        </div>
                                        <div class="form-check form-check-inline">
                                            <input type="radio" class="form-check-input" name="consent_signed_by"
                                                   id="consent_agent" value="agent"
                                                   t-att-checked="'checked' if assessment and assessment.consent_signed_by == 'agent' else None"/>
                                            <label class="form-check-label" for="consent_agent">Agent (on behalf of applicant)</label>
                                        </div>
                                    </div>
                                </div>

                                <!-- Agent Details (shown only when Agent is selected) -->
                                <div id="agent_details_section" style="display: none;">
                                    <div class="card mb-3" style="border-color: #3498db;">
                                        <div class="card-header bg-light">
                                            <h6 class="mb-0"><i class="fa fa-user me-1"/>Agent Information</h6>
                                        </div>
                                        <div class="card-body">
                                            <!-- Relationship -->
                                            <div class="mb-3">
                                                <label class="form-label fw-bold">Relationship to Applicant</label>
                                                <select name="agent_relationship" class="form-select">
                                                    <option value="">-- Select --</option>
                                                    <option value="spouse"
                                                        t-att-selected="'selected' if assessment and assessment.agent_relationship == 'spouse' else None">Spouse</option>
                                                    <option value="parent"
                                                        t-att-selected="'selected' if assessment and assessment.agent_relationship == 'parent' else None">Parent(s)</option>
                                                    <option value="child"
                                                        t-att-selected="'selected' if assessment and assessment.agent_relationship == 'child' else None">Child</option>
                                                    <option value="power_of_attorney"
                                                        t-att-selected="'selected' if assessment and assessment.agent_relationship == 'power_of_attorney' else None">Power of Attorney</option>
                                                    <option value="public_guardian"
                                                        t-att-selected="'selected' if assessment and assessment.agent_relationship == 'public_guardian' else None">Public Guardian/Trustee</option>
                                                </select>
                                            </div>

                                            <!-- Agent Name -->
                                            <div class="row">
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">Last Name</label>
                                                    <input type="text" name="agent_last_name" class="form-control"
                                                           t-att-value="assessment.agent_last_name if assessment else ''"/>
                                                </div>
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">First Name</label>
                                                    <input type="text" name="agent_first_name" class="form-control"
                                                           t-att-value="assessment.agent_first_name if assessment else ''"/>
                                                </div>
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">Middle Initial</label>
                                                    <input type="text" name="agent_middle_initial" class="form-control" maxlength="2"
                                                           t-att-value="assessment.agent_middle_initial if assessment else ''"/>
                                                </div>
                                            </div>

                                            <!-- Agent Address -->
                                            <div class="row">
                                                <div class="col-md-2 mb-3">
                                                    <label class="form-label fw-bold">Unit</label>
                                                    <input type="text" name="agent_unit" class="form-control"
                                                           t-att-value="assessment.agent_unit if assessment else ''"/>
                                                </div>
                                                <div class="col-md-2 mb-3">
                                                    <label class="form-label fw-bold">Street No.</label>
                                                    <input type="text" name="agent_street_number" class="form-control"
                                                           t-att-value="assessment.agent_street_number if assessment else ''"/>
                                                </div>
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">Street Name</label>
                                                    <input type="text" name="agent_street_name" class="form-control"
                                                           t-att-value="assessment.agent_street_name if assessment else ''"/>
                                                </div>
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">City</label>
                                                    <input type="text" name="agent_city" class="form-control"
                                                           t-att-value="assessment.agent_city if assessment else ''"/>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">Province</label>
                                                    <input type="text" name="agent_province" class="form-control"
                                                           t-att-value="assessment.agent_province if assessment else 'Ontario'"/>
                                                </div>
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">Postal Code</label>
                                                    <input type="text" name="agent_postal_code" class="form-control"
                                                           t-att-value="assessment.agent_postal_code if assessment else ''"/>
                                                </div>
                                            </div>

                                            <!-- Agent Phone -->
                                            <div class="row">
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">Home Phone</label>
                                                    <input type="tel" name="agent_home_phone" class="form-control"
                                                           t-att-value="assessment.agent_home_phone if assessment else ''"/>
                                                </div>
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">Business Phone</label>
                                                    <input type="tel" name="agent_business_phone" class="form-control"
                                                           t-att-value="assessment.agent_business_phone if assessment else ''"/>
                                                </div>
                                                <div class="col-md-4 mb-3">
                                                    <label class="form-label fw-bold">Extension</label>
                                                    <input type="text" name="agent_phone_ext" class="form-control"
                                                           t-att-value="assessment.agent_phone_ext if assessment else ''"/>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Consent Declaration -->
                                <div class="mb-3">
                                    <div class="card" style="border-color: #2c3e50;">
                                        <div class="card-body" style="background: #f8f9fa; font-size: 13px; line-height: 1.6;">
                                            <p class="mb-2"><strong>Declaration and Consent</strong></p>
                                            <p class="mb-2">
                                                I declare that the information I have given in this Application for Funding
                                                Assistance is true and correct. I agree to repay any overpayment that may be
                                                required if the information is not correct or complete. I authorize the Assistive
                                                Devices Program to collect and use my personal information as described on the
                                                Information Sheet.
                                            </p>
                                            <p class="mb-0">
                                                I understand that this application will be reviewed by the Assistive Devices
                                                Program and that I will be notified of the decision.
                                            </p>
                                        </div>
                                    </div>
                                    <div class="form-check mt-2">
                                        <input type="checkbox" class="form-check-input" name="consent_declaration_accepted"
                                               id="consent_declaration_accepted" value="1"
                                               t-att-checked="'checked' if assessment and assessment.consent_declaration_accepted else None"/>
                                        <label class="form-check-label fw-bold" for="consent_declaration_accepted">
                                            I have read and agree to the above declaration
                                        </label>
                                    </div>
                                </div>

                                <!-- Signature Pad -->
                                <div class="mb-3">
                                    <label class="form-label fw-bold">
                                        <i class="fa fa-pencil me-1"/>Signature
                                    </label>
                                    <div class="signature-pad-container" style="border: 2px solid #2c3e50; border-radius: 8px; background: white; max-width: 400px;">
                                        <canvas id="consent_signature_canvas" 
                                                style="width: 100%; height: 120px; cursor: crosshair; touch-action: none;"/>
                                    </div>
                                    <div class="mt-1">
                                        <button type="button" class="btn btn-sm btn-outline-secondary" id="btn_clear_consent_signature">
                                            <i class="fa fa-eraser me-1"/>Clear Signature
                                        </button>
                                    </div>
                                    <input type="hidden" name="signature_page_11_data" id="signature_page_11_data"/>
                                </div>

                                <!-- Consent Date -->
                                <div class="row">
                                    <div class="col-md-4 mb-3">
                                        <label class="form-label fw-bold">Consent Date</label>
                                        <input type="date" name="consent_date" id="consent_date" class="form-control"
                                               t-att-value="str(assessment.consent_date) if assessment and assessment.consent_date else ''"/>
                                    </div>
                                </div>

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

                    <!-- Loaner Equipment Section -->
                    <div class="card shadow-sm">
                        <div class="card-header" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); cursor: pointer;"
                             data-bs-toggle="collapse" data-bs-target="#loanerSection">
                            <h4 class="mb-0 text-white">
                                <i class="fa fa-wheelchair me-2"/>Loaner Equipment
                                <small class="ms-2 opacity-75">(Optional - click to expand)</small>
                            </h4>
                        </div>
                        <div id="loanerSection" class="collapse">
                            <div class="card-body">
                                <div class="alert alert-info">
                                    <i class="fa fa-info-circle me-1"/> Assign a loaner device to the client during the assessment. 
                                    You can select an existing product or quickly create a new one.
                                </div>

                                <!-- Toggle: Use existing or create new -->
                                <div class="mb-3">
                                    <div class="form-check form-check-inline">
                                        <input type="radio" class="form-check-input" name="loaner_mode" id="loaner_existing" value="existing" checked="checked"/>
                                        <label class="form-check-label" for="loaner_existing">Select Existing Product</label>
                                    </div>
                                    <div class="form-check form-check-inline">
                                        <input type="radio" class="form-check-input" name="loaner_mode" id="loaner_new" value="new"/>
                                        <label class="form-check-label" for="loaner_new">Quick Create New Product</label>
                                    </div>
                                </div>

                                <!-- Existing Product Selection -->
                                <div id="loaner_existing_fields">
                                    <div class="row">
                                        <div class="col-md-6 mb-3">
                                            <label class="form-label fw-bold">Loaner Product</label>
                                            <select name="loaner_product_id" id="loaner_product_id" class="form-select">
                                                <option value="">-- Select Product --</option>
                                            </select>
                                        </div>
                                        <div class="col-md-6 mb-3">
                                            <label class="form-label fw-bold">Serial Number</label>
                                            <select name="loaner_lot_id" id="loaner_lot_id" class="form-select">
                                                <option value="">-- Select Serial --</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>

                                <!-- Quick Create New Product -->
                                <div id="loaner_new_fields" style="display: none;">
                                    <div class="row">
                                        <div class="col-md-6 mb-3">
                                            <label class="form-label fw-bold">Product Name</label>
                                            <input type="text" name="loaner_new_product_name" id="loaner_new_product_name" 
                                                   class="form-control" placeholder="e.g., Rollator Type 2"/>
                                        </div>
                                        <div class="col-md-6 mb-3">
                                            <label class="form-label fw-bold">Serial Number</label>
                                            <input type="text" name="loaner_new_serial" id="loaner_new_serial" 
                                                   class="form-control" placeholder="e.g., SN-2024-001"/>
                                        </div>
                                    </div>
                                    <button type="button" id="btn_create_loaner_product" class="btn btn-outline-primary mb-3">
                                        <i class="fa fa-plus me-1"/> Create Product
                                    </button>
                                    <div id="loaner_create_result" style="display: none;"></div>
                                </div>

                                <!-- Common Loaner Fields -->
                                <div class="row">
                                    <div class="col-md-4 mb-3">
                                        <label class="form-label fw-bold">Loaner Period (Days)</label>
                                        <input type="number" name="loaner_period_days" id="loaner_period_days" 
                                               class="form-control" value="7" min="1"/>
                                    </div>
                                    <div class="col-md-4 mb-3">
                                        <label class="form-label fw-bold">Checkout Condition</label>
                                        <select name="loaner_condition" class="form-select">
                                            <option value="excellent">Excellent</option>
                                            <option value="good" selected="selected">Good</option>
                                            <option value="fair">Fair</option>
                                            <option value="needs_repair">Needs Repair</option>
                                        </select>
                                    </div>
                                    <div class="col-md-4 mb-3">
                                        <label class="form-label fw-bold">Notes</label>
                                        <input type="text" name="loaner_notes" class="form-control" placeholder="Optional notes..."/>
                                    </div>
                                </div>

                                <input type="hidden" name="loaner_checkout" id="loaner_checkout" value="0"/>
                            </div>
                        </div>
                    </div>

                    <!-- Submit Button -->
                    <div class="card shadow-sm">
                        <div class="card-body text-center">
                            <button type="submit" name="action" value="submit" class="btn btn-success btn-lg px-5">
                                <i class="fa fa-check me-2"/>Submit Assessment
                            </button>
                            <a href="/my/assessments" class="btn btn-outline-secondary btn-lg px-4 ms-3">
                                Cancel
                            </a>
                        </div>
                    </div>
                    
                </form>
            </div>
            
            <!-- JavaScript for dynamic form -->
            <script type="text/javascript">
                document.addEventListener('DOMContentLoaded', function() {
                    // ── Authorizer searchable dropdown ──
                    (function() {
                        var dataEl = document.getElementById('authorizer-data');
                        var searchInput = document.getElementById('authorizer-search');
                        var hiddenInput = document.getElementById('authorizer_id_value');
                        var dropdown = document.getElementById('authorizer-dropdown');
                        if (!dataEl || !searchInput || !hiddenInput || !dropdown) return;

                        var authorizers = [];
                        try { authorizers = JSON.parse(dataEl.textContent); } catch(e) {}

                        function renderDropdown(query) {
                            var q = (query || '').toLowerCase();
                            var matches = authorizers.filter(function(a) {
                                return a.name.toLowerCase().indexOf(q) !== -1 ||
                                       (a.email &amp;&amp; a.email.toLowerCase().indexOf(q) !== -1);
                            });
                            if (!q) matches = authorizers;  // show all when empty
                            dropdown.innerHTML = '';
                            if (!matches.length) {
                                dropdown.innerHTML = '<div class="dropdown-item text-muted">No matching authorizer</div>';
                                dropdown.style.display = 'block';
                                return;
                            }
                            matches.forEach(function(a) {
                                var item = document.createElement('a');
                                item.href = '#';
                                item.className = 'dropdown-item';
                                item.textContent = a.name + (a.email ? ' - ' + a.email : '');
                                item.dataset.id = a.id;
                                item.addEventListener('mousedown', function(e) {
                                    e.preventDefault();
                                    hiddenInput.value = a.id;
                                    searchInput.value = a.name + (a.email ? ' - ' + a.email : '');
                                    dropdown.style.display = 'none';
                                });
                                dropdown.appendChild(item);
                            });
                            dropdown.style.display = 'block';
                        }

                        searchInput.addEventListener('focus', function() {
                            renderDropdown(searchInput.value);
                        });
                        searchInput.addEventListener('input', function() {
                            hiddenInput.value = '';  // clear selection until they pick
                            renderDropdown(searchInput.value);
                        });
                        searchInput.addEventListener('blur', function() {
                            // Small delay so mousedown on dropdown fires first
                            setTimeout(function() { dropdown.style.display = 'none'; }, 200);
                        });

                        // Form validation: require a valid selection
                        var form = searchInput.closest('form');
                        if (form) {
                            form.addEventListener('submit', function(e) {
                                if (!hiddenInput.value) {
                                    e.preventDefault();
                                    searchInput.classList.add('is-invalid');
                                    searchInput.focus();
                                    alert('Please select an Authorizer/OT from the suggestions.');
                                } else {
                                    searchInput.classList.remove('is-invalid');
                                }
                            });
                        }
                    })();

                    var equipmentSelect = document.getElementById('equipment_type');
                    var rollatorForm = document.getElementById('rollator_form');
                    var wheelchairForm = document.getElementById('wheelchair_form');
                    var powerchairForm = document.getElementById('powerchair_form');
                    var wheelchairTypeSelect = document.querySelector('select[name="wheelchair_type"]');
                    var reasonSelect = document.getElementById('reason_for_application');
                    var previousFundingContainer = document.getElementById('previous_funding_date_container');
                    var assessmentStartDate = document.getElementById('assessment_start_date');
                    
                    // Set default assessment start date to today if empty
                    if (assessmentStartDate &amp;&amp; !assessmentStartDate.value) {
                        var today = new Date();
                        var year = today.getFullYear();
                        var month = String(today.getMonth() + 1).padStart(2, '0');
                        var day = String(today.getDate()).padStart(2, '0');
                        assessmentStartDate.value = year + '-' + month + '-' + day;
                    }
                    
                    // Show/hide previous funding date based on reason for application
                    function handleReasonChange() {
                        if (!reasonSelect || !previousFundingContainer) return;
                        var reason = reasonSelect.value;
                        // Show previous funding date for all reasons EXCEPT first_access and empty
                        if (reason &amp;&amp; reason !== 'first_access') {
                            previousFundingContainer.style.display = 'block';
                        } else {
                            previousFundingContainer.style.display = 'none';
                        }
                    }
                    
                    if (reasonSelect) {
                        reasonSelect.addEventListener('change', handleReasonChange);
                        // Check on page load
                        handleReasonChange();
                    }
                    
                    function disableFormInputs(form) {
                        if (!form) return;
                        form.style.display = 'none';
                        form.querySelectorAll('input, select, textarea').forEach(function(el) {
                            el.disabled = true;
                            if (el.hasAttribute('required')) {
                                el.removeAttribute('required');
                                el.dataset.wasRequired = 'true';
                            }
                        });
                    }

                    function enableFormInputs(form) {
                        if (!form) return;
                        form.style.display = 'block';
                        form.querySelectorAll('input, select, textarea').forEach(function(el) {
                            el.disabled = false;
                            if (el.dataset.wasRequired === 'true') {
                                el.setAttribute('required', 'required');
                            }
                        });
                    }

                    function showEquipmentForm() {
                        var value = equipmentSelect ? equipmentSelect.value : '';
                        
                        disableFormInputs(rollatorForm);
                        disableFormInputs(wheelchairForm);
                        disableFormInputs(powerchairForm);
                        
                        if (value === 'rollator') {
                            enableFormInputs(rollatorForm);
                        } else if (value === 'wheelchair') {
                            enableFormInputs(wheelchairForm);
                        } else if (value === 'powerchair') {
                            enableFormInputs(powerchairForm);
                        }
                    }
                    
                    // Auto-select options for wheelchair types 2, 3, 4
                    function handleWheelchairTypeChange() {
                        if (!wheelchairTypeSelect) return;
                        var wcType = wheelchairTypeSelect.value;
                        
                        // Types 2, 3, 4 should auto-select these options
                        if (wcType === 'type_2' || wcType === 'type_3' || wcType === 'type_4') {
                            // Quick Release Axles (pair)
                            var quickRelease = document.getElementById('wheel_quick');
                            if (quickRelease) quickRelease.checked = true;
                            
                            // Angle Adjustable Footplates
                            var angleFootplates = document.getElementById('leg_angle');
                            if (angleFootplates) angleFootplates.checked = true;
                            
                            // Padded Belt – Positioning Belts (Modular)
                            var paddedBelt = document.getElementById('belt_padded');
                            if (paddedBelt) paddedBelt.checked = true;
                        }
                    }
                    
                    if (equipmentSelect) {
                        equipmentSelect.addEventListener('change', showEquipmentForm);
                        // Show initial form if value is set
                        showEquipmentForm();
                    }
                    
                    if (wheelchairTypeSelect) {
                        wheelchairTypeSelect.addEventListener('change', handleWheelchairTypeChange);
                        // Apply on load if already set
                        handleWheelchairTypeChange();
                    }
                });
            </script>
            
            <!-- Google Maps Places API for Address Autocomplete -->
            <t t-if="google_maps_api_key">
                <script t-attf-src="https://maps.googleapis.com/maps/api/js?key=#{google_maps_api_key}&amp;libraries=places&amp;callback=initExpressAddressAutocomplete" async="async" defer="defer"></script>
            </t>
            
            <script type="text/javascript">
                function initExpressAddressAutocomplete() {
                    var streetInput = document.querySelector('input[name="client_street"]');
                    if (!streetInput) return;
                    
                    var autocomplete = new google.maps.places.Autocomplete(streetInput, {
                        componentRestrictions: { country: 'ca' },
                        types: ['address']
                    });
                    
                    autocomplete.addListener('place_changed', function() {
                        var place = autocomplete.getPlace();
                        if (!place.address_components) return;
                        
                        var streetNumber = '';
                        var streetName = '';
                        var city = '';
                        var province = '';
                        var postalCode = '';
                        
                        for (var i = 0; i &lt; place.address_components.length; i++) {
                            var component = place.address_components[i];
                            var types = component.types;
                            
                            if (types.includes('street_number')) {
                                streetNumber = component.long_name;
                            } else if (types.includes('route')) {
                                streetName = component.long_name;
                            } else if (types.includes('locality')) {
                                city = component.long_name;
                            } else if (types.includes('administrative_area_level_1')) {
                                province = component.long_name;
                            } else if (types.includes('postal_code')) {
                                postalCode = component.long_name;
                            }
                        }
                        
                        // Update street address field with full street
                        streetInput.value = (streetNumber + ' ' + streetName).trim();
                        
                        // Update city field
                        var cityInput = document.querySelector('input[name="client_city"]');
                        if (cityInput) cityInput.value = city;
                        
                        // Update province select
                        var provinceSelect = document.querySelector('select[name="client_state"]');
                        if (provinceSelect) {
                            // Try to match province name
                            for (var j = 0; j &lt; provinceSelect.options.length; j++) {
                                if (provinceSelect.options[j].text.toLowerCase() === province.toLowerCase() ||
                                    provinceSelect.options[j].value.toLowerCase() === province.toLowerCase()) {
                                    provinceSelect.selectedIndex = j;
                                    break;
                                }
                            }
                        }
                        
                        // Update postal code field
                        var postalInput = document.querySelector('input[name="client_postal_code"]');
                        if (postalInput) postalInput.value = postalCode;
                    });
                }
                
                // Fallback if Google Maps not loaded
                window.initExpressAddressAutocomplete = window.initExpressAddressAutocomplete || function() {};
                
                // ============================================================
                // PAGE 11: Consent &amp; Declaration Section Logic
                // ============================================================
                (function() {
                    var consentApplicant = document.getElementById('consent_applicant');
                    var consentAgent = document.getElementById('consent_agent');
                    var agentSection = document.getElementById('agent_details_section');
                    var consentDateInput = document.getElementById('consent_date');
                    var signatureCanvas = document.getElementById('consent_signature_canvas');
                    var signatureDataInput = document.getElementById('signature_page_11_data');
                    var clearBtn = document.getElementById('btn_clear_consent_signature');
                    var consentSignaturePad = null;
                    
                    // Toggle agent details based on signer selection
                    function handleSignerChange() {
                        if (!agentSection) return;
                        var isAgent = consentAgent &amp;&amp; consentAgent.checked;
                        agentSection.style.display = isAgent ? 'block' : 'none';
                    }
                    
                    if (consentApplicant) {
                        consentApplicant.addEventListener('change', handleSignerChange);
                    }
                    if (consentAgent) {
                        consentAgent.addEventListener('change', handleSignerChange);
                    }
                    // Check on load (for edit mode)
                    handleSignerChange();
                    
                    // Default consent date to today
                    if (consentDateInput &amp;&amp; !consentDateInput.value) {
                        var today = new Date();
                        consentDateInput.value = today.getFullYear() + '-' + 
                            String(today.getMonth() + 1).padStart(2, '0') + '-' + 
                            String(today.getDate()).padStart(2, '0');
                    }
                    
                    // Initialize signature pad
                    // Strategy: try on collapse show, on click/touch of canvas, and with a retry
                    function initSignaturePad() {
                        if (consentSignaturePad) return true;
                        if (!signatureCanvas) return false;
                        // Canvas must be visible and have dimensions
                        var rect = signatureCanvas.getBoundingClientRect();
                        if (rect.width &lt; 10 || rect.height &lt; 10) return false;
                        // Try window.SignaturePad (set by signature_pad.js)
                        if (window.SignaturePad) {
                            consentSignaturePad = new window.SignaturePad(signatureCanvas);
                            return true;
                        }
                        // Fallback: build a minimal inline signature pad
                        var ctx = signatureCanvas.getContext('2d');
                        var ratio = window.devicePixelRatio || 1;
                        signatureCanvas.width = rect.width * ratio;
                        signatureCanvas.height = rect.height * ratio;
                        ctx.scale(ratio, ratio);
                        signatureCanvas.style.width = rect.width + 'px';
                        signatureCanvas.style.height = rect.height + 'px';
                        ctx.strokeStyle = '#000';
                        ctx.lineWidth = 2;
                        ctx.lineCap = 'round';
                        ctx.lineJoin = 'round';
                        ctx.fillStyle = '#fff';
                        ctx.fillRect(0, 0, signatureCanvas.width, signatureCanvas.height);
                        var drawing = false;
                        var lastX = 0, lastY = 0;
                        var hasPoints = false;
                        function getPos(e) {
                            var r = signatureCanvas.getBoundingClientRect();
                            var t = e.touches ? e.touches[0] : e;
                            return { x: t.clientX - r.left, y: t.clientY - r.top };
                        }
                        function down(e) { e.preventDefault(); drawing = true; var p = getPos(e); lastX = p.x; lastY = p.y; hasPoints = true; }
                        function move(e) { e.preventDefault(); if (!drawing) return; var p = getPos(e); ctx.beginPath(); ctx.moveTo(lastX, lastY); ctx.lineTo(p.x, p.y); ctx.stroke(); lastX = p.x; lastY = p.y; }
                        function up(e) { e.preventDefault(); drawing = false; }
                        signatureCanvas.addEventListener('mousedown', down);
                        signatureCanvas.addEventListener('mousemove', move);
                        signatureCanvas.addEventListener('mouseup', up);
                        signatureCanvas.addEventListener('mouseout', up);
                        signatureCanvas.addEventListener('touchstart', down, {passive:false});
                        signatureCanvas.addEventListener('touchmove', move, {passive:false});
                        signatureCanvas.addEventListener('touchend', up, {passive:false});
                        // Create a compatible API
                        consentSignaturePad = {
                            clear: function() { ctx.fillStyle='#fff'; ctx.fillRect(0,0,signatureCanvas.width,signatureCanvas.height); hasPoints=false; ctx.strokeStyle='#000'; ctx.lineWidth=2; ctx.lineCap='round'; },
                            isEmpty: function() { return !hasPoints; },
                            toDataURL: function(type) { return signatureCanvas.toDataURL(type || 'image/png'); }
                        };
                        return true;
                    }
                    
                    // Try init on collapse show
                    var page11Section = document.getElementById('page11Section');
                    if (page11Section) {
                        page11Section.addEventListener('shown.bs.collapse', function() {
                            setTimeout(initSignaturePad, 100);
                        });
                        // Also try on any click inside the section
                        page11Section.addEventListener('click', function() {
                            initSignaturePad();
                        });
                    }
                    
                    // Also try init when canvas is touched/clicked directly
                    if (signatureCanvas) {
                        signatureCanvas.addEventListener('mousedown', function() { initSignaturePad(); }, { once: true });
                        signatureCanvas.addEventListener('touchstart', function() { initSignaturePad(); }, { once: true });
                    }
                    
                    // Retry a few times after page load
                    var retryCount = 0;
                    var retryInterval = setInterval(function() {
                        retryCount++;
                        if (initSignaturePad() || retryCount > 20) {
                            clearInterval(retryInterval);
                        }
                    }, 500);
                    
                    // Clear signature button
                    if (clearBtn) {
                        clearBtn.addEventListener('click', function() {
                            if (consentSignaturePad) {
                                consentSignaturePad.clear();
                            }
                        });
                    }
                    
                    // Auto-populate client name display in Page 11
                    function updatePage11ClientName() {
                        var display = document.getElementById('page11_client_name_display');
                        if (!display) return;
                        var first = document.querySelector('input[name="client_first_name"]');
                        var middle = document.querySelector('input[name="client_middle_name"]');
                        var last = document.querySelector('input[name="client_last_name"]');
                        var parts = [];
                        if (first &amp;&amp; first.value) parts.push(first.value);
                        if (middle &amp;&amp; middle.value) parts.push(middle.value);
                        if (last &amp;&amp; last.value) parts.push(last.value);
                        display.textContent = parts.join(' ') || '(enter client name above)';
                    }
                    
                    // Listen for name field changes
                    ['client_first_name', 'client_middle_name', 'client_last_name'].forEach(function(fieldName) {
                        var el = document.querySelector('input[name="' + fieldName + '"]');
                        if (el) {
                            el.addEventListener('input', updatePage11ClientName);
                        }
                    });
                    updatePage11ClientName();
                    
                    // Before form submit: capture signature as base64
                    var form = document.querySelector('form[action*="express/save"]');
                    if (form) {
                        form.addEventListener('submit', function() {
                            if (consentSignaturePad &amp;&amp; !consentSignaturePad.isEmpty() &amp;&amp; signatureDataInput) {
                                signatureDataInput.value = consentSignaturePad.toDataURL('image/png');
                            }
                        });
                    }
                })();
            </script>
        </t>
    </template>
    
</odoo>
