{{-- Step 2: Personal Details --}}
<div class="step-content">
    <div class="mb-4 border rounded p-3">
        <h6 class="fw-bold">{{$formMaster['personal_details']['c_sno']}}. Personal Details</h6>
        <div class="row mt-3">
            <div class="col-md-4 mb-3">
                <span class="c-label">Date of Birth</span>
                <div class="c-value">{{ $userDetails && $userDetails->d_birth_dt ? \Carbon\Carbon::parse($userDetails->d_birth_dt)->format('d-m-Y') : '-' }}</div>
            </div>
            <div class="col-md-4 mb-3">
                <span class="c-label">Place of Birth</span>
                <div class="c-value">{{ $userDetails->c_birth_place ?? '-' }}</div>
            </div>
            <div class="col-md-4 mb-3">
                <span class="c-label">Height</span>
                <div class="c-value">{{ $userDetails->c_height ?? '-' }} {{ $userDetails->c_height ? 'Cms' : '' }}</div>
            </div>
            <div class="col-md-4 mb-3">
                <span class="c-label">Color of Eyes</span>
                <div class="c-value">{{ $userDetails->c_eyes_clr ?? '-' }}</div>
            </div>
            <div class="col-md-4 mb-3">
                <span class="c-label">Color of Hair</span>
                <div class="c-value">{{ $userDetails->c_hair_clr ?? '-' }}</div>
            </div>
            <div class="col-md-4 mb-3">
                <span class="c-label">Qualification</span>
                <div class="c-value">{{ $userDetails->c_qualification ?? '-' }}</div>
            </div>
            <div class="col-md-4 mb-3">
                <span class="c-label">Complexion</span>
                <div class="c-value">{{ $userDetails->c_complexion ?? '-' }}</div>
            </div>
            <div class="col-md-4 mb-3">
                <span class="c-label">Marks of Identification</span>
                <div class="c-value">{{ $userDetails->c_id_mark ?? '-' }}</div>
            </div>
            <div class="col-md-4 mb-3">
                <span class="c-label">Nationality</span>
                <div class="c-value">{{ $userDetails->c_nationality ?? '-' }}</div>
            </div>
        </div>
    </div>

    {{-- 2B. Passport Details --}}
    <div class="mb-4 border rounded p-3">
        <h6 class="fw-bold">{{$formMaster['passport_details']['c_sno']}}. Passport Details <span class="text-danger">*</span></h6>
        <div class="row mt-3">
            <div class="col-md-6 mb-3">
                <span class="c-label">Passport No</span>
                <input type="text" {{ $readOnly['passport_details'] ? 'readonly' : '' }} class="form-control form-control-sm @error('application.c_passport_no') is-invalid @enderror"
                    wire:model.blur="application.c_passport_no"
                    oninput="this.value = this.value.toUpperCase()" maxlength="9" />
                @error('application.c_passport_no')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
          
            <div class="col-md-6 mb-3">
                <span class="c-label">Date of Passport Issue</span>
                <input type="date" {{ $readOnly['passport_details'] ? 'readonly' : '' }}
                    class="form-control form-control-sm @error('application.d_passport_issue_dt') is-invalid @enderror"
                    wire:model.blur="application.d_passport_issue_dt"
                    max="{{ date('Y-m-d') }}" />
                @error('application.d_passport_issue_dt')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-6 mb-3">
                <span class="c-label">Date of Passport Expiry</span>
                <input type="date" {{ $readOnly['passport_details'] ? 'readonly' : '' }}
                    class="form-control form-control-sm @error('application.d_passport_expiry_dt') is-invalid @enderror"
                    wire:model.blur="application.d_passport_expiry_dt" />
                @error('application.d_passport_expiry_dt')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
            <div class="col-md-6 mb-3">
                <span class="c-label">Place where Passport Issued</span>
                <input type="text" {{ $readOnly['passport_details'] ? 'readonly' : '' }} class="form-control form-control-sm @error('application.c_passport_issueplace') is-invalid @enderror"
                    wire:model.blur="application.c_passport_issueplace" maxlength="40" />
                @error('application.c_passport_issueplace')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
        </div>
    </div>

   
</div>