@php
    //   echo $idno = (isset(old('idno')) old('idno') ? : auth()->user()->firstname )
    //                <input type="text" name="fieldName" value="{{ old('fieldName') ?? '' }}">

    // echo auth()->user()->idno . '  ID NO';
@endphp

        <x-validation-errors class="mb-4" />

        <form method="POST" action="{{ url('/update-details') }}" class="">
            @csrf

            <h4>Personal Details</h4>

            <div class="row">

                <div>
                    <x-label for="idno" value="{{ __('ID Number') }}" />
                    <x-input id="idno" class="block mt-1 w-full" type="text" name="idno" :value="old('idno') ?? auth()->user()->idno" required autofocus autocomplete="idno" />
                </div>
            </div>

            <div class="row mt-4">

                <div class="col-md-4">
                    <x-label for="firstname" value="{{ __('First name') }}" />
                    <x-input id="firstname" class="block mt-1 w-full" type="text" name="firstname" :value="old('firstname') ?? auth()->user()->firstname" required autofocus autocomplete="firstname" />
                </div>

                <div class="col-md-4">
                    <x-label for="middlename" value="{{ __('Middle name') }}" />
                    <x-input id="middlename" class="block mt-1 w-full" type="text" name="middlename" :value="old('middlename') ?? auth()->user()->middlename" required autofocus autocomplete="middlename" />
                </div>
                <div class="col-md-4">
                    <x-label for="surname" value="{{ __('Surname') }}" />
                    <x-input id="surname" class="block mt-1 w-full" type="text" name="surname" :value="old('surname') ?? auth()->user()->surname" required autofocus autocomplete="surname" />
                </div>
            </div>

            <div class="row mt-4 ">

                <div class="col-md-6">
                    <x-label for="contactno" value="{{ __('Contact No') }}" />
                    <x-input id="contactno" class="block mt-1 w-full" type="text" name="contactno" :value="old('contactno') ?? auth()->user()->contactno" required autofocus autocomplete="contactno" />
                </div>

                <div class="col-md-6">
                    <x-label for="email" value="{{ __('Email') }}" />
                    <x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email') ?? auth()->user()->email" required autocomplete="username" />
                </div>

            </div>

            <div class="col-sm-3 mt-4">
                <label class="visually-hidden" for="specificSizeSelect">Marital status</label>
                <select class="form-select" id="specificSizeSelect">
                  <option selected>Marital status</option>
                  <option value="1">Single</option>
                  <option value="2">Maried</option>
                  <option value="3">Divorced</option>
                  <option value="3">Widow</option>
                  <option value="3">Widower</option>
                </select>
              </div>

            <h4 class="mt-4">References</h4>

            <span>First</span>

            <div class="row mt-4 ">

                <div class="col-md-4">
                    <x-label for="refirstname" value="{{ __('Firstname') }}" />
                    <x-input id="refirstname" class="block mt-1 w-full" type="text" name="refirstname[]" :value="old('refirstname')" required autofocus autocomplete="refirstname" />
                </div>

                <div class="col-md-4">
                    <x-label for="refsurname" value="{{ __('Surname') }}" />
                    <x-input id="refsurname" class="block mt-1 w-full" type="text" name="refsurname[]" :value="old('refsurname')" required autofocus autocomplete="refsurname" />
                </div>

                <div class="col-md-4">
                    <x-label for="refcontact" value="{{ __('Contact No') }}" />
                    <x-input id="refcontact" class="block mt-1 w-full" type="text" name="refcontact[]" :value="old('refcontact')" required autocomplete="refcontact" />
                </div>

            </div>

            <span>Second</span>

            <div class="row mt-4 ">

                <div class="col-md-4">
                    <x-label for="refirstname" value="{{ __('Firstname') }}" />
                    <x-input id="refirstname" class="block mt-1 w-full" type="text" name="refirstname" :value="old('refirstname')" required autofocus autocomplete="refirstname" />
                </div>

                <div class="col-md-4">
                    <x-label for="refsurname" value="{{ __('Surname') }}" />
                    <x-input id="refsurname" class="block mt-1 w-full" type="text" name="refsurname" :value="old('refsurname')" required autofocus autocomplete="refsurname" />
                </div>

                <div class="col-md-4">
                    <x-label for="refcontact" value="{{ __('Contact No') }}" />
                    <x-input id="refcontact" class="block mt-1 w-full" type="text" name="refcontact" :value="old('refcontact')" required autocomplete="refcontact" />
                </div>

            </div>

            <div class="nameko-flex justify-between mt-4">

            <x-button-back >{{ __('Back') }}</x-button-back>
            <x-button-next >{{ __('Next') }}</x-button-next>

            </div>


        </form>