@php use Carbon\Carbon;

@endphp

<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>PIN</small>
                <p class="field-value user-field-data">
                    {{ $human->pid ?? '-' }}
                </p>
            </div>

            <div class="col-3">
                <small>First name</small>
                <p class="field-value user-field-data">
                    {{ $human->name ?? '-' }}
                </p>
            </div>

            <div class="col-3">
                <small>Other names</small>
                <p class="field-value user-field-data">
                    {{ $human->last_name ?? '-' }}
                </p>
            </div>

            <div class="col-3">
                <small>Sur name</small>
                <p class="field-value user-field-data">
                    {{ $human->surn ?? '-' }}
                </p>
            </div>

        </div>

        <div class="row">
            <div class="col-3">
                <small>ID Number</small>
                <p class="field-value user-field-data">
                    {{ $human->o_pid ?? '-' }}
                </p>
            </div>
            <div class="col-3">
                <small>Gender</small>
                <p class="field-value user-field-data">
                    {{ $human->sex ?? '-' }}
                </p>
            </div>
            <div class="col-3">
                <small>Date of Birth</small>
                <p class="field-value user-field-data">
                    @if(isset($human->date_birth))
                        {{ Carbon::parse($human->date_birth)->format("d-m-Y") }}
                    @else
                        -
                    @endif
                </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>
