@php use Carbon\Carbon;

@endphp

@foreach($passport as $human_passport)
    <div class="row">
        <div class="col-2" style="text-align: center;border: 1px solid #e2e5e9; border-radius: 10px;">
            <img src="{{ asset('images/coat-of-arms.webp') }}"
                 alt="IPRS Logo" class="brand-image" style=" width: 10em;">
        </div>
        <div class="col-10">
            <div class="row">
                <div class="col-3">
                    <small>UPI Number</small>
                    <p class="field-value user-field-data">
                        {{ $human_passport['identity_card_no'] }}
                    </p>
                </div>

                <div class="col-3">
                    <small>First names</small>
                    <p class="field-value user-field-data">
                        {{ $human_passport['first_names'] }}
                    </p>
                </div>

                <div class="col-3">
                    <small>Last name</small>
                    <p class="field-value user-field-data">
                        {{ $human_passport['last_name'] }}
                    </p>
                </div>

            </div>

            <div class="row">
                <div class="col-3">
                    <small>Passport Number</small>
                    <p class="field-value user-field-data">
                        {{ $human_passport['passport_no'] }}
                    </p>
                </div>
                <div class="col-3">
                    <small>Gender</small>
                    <p class="field-value user-field-data">
                        {{ ($human_passport['gender']) ?? '-' }}
                    </p>
                </div>
                <div class="col-3">
                    <small>Date of Birth</small>
                    <p class="field-value user-field-data">
                        {{ Carbon::parse($human_passport['birth_date'])->format("d-m-Y") ?? '-' }}
                    </p>
                </div>
                <div class="col-3">
                    <small>Citizenship</small>
                    <p class="field-value user-field-data">
                        KENYAN <span class="fi fi-ke" style="font-size: 1rem;"></span>
                    </p>
                </div>
            </div>
        </div>

        <div style="width: 100%;height: 1px;background-color: #e2e5e9;margin-bottom: 2rem;margin-top: 1rem;"></div>
    </div>
@endforeach

