<div>
    
    <div style="display: flex; justify-content: start; align-items: center; gap: 40px;">

        <div style="display: flex; flex: 0 0 auto; align-items: center; flex-direction: column;">
            <img src="{{ asset('images/coat-of-arms.png') }}"
                alt="IPRS Logo" class="brand-image" style=" width: 8em;">
            <h3 style="margin-top: 20px;">IPRS</h3>
        </div>

        <div style="flex: 1;">

            <form class="form-inline" wire:submit="search" method="POST">
                @csrf
                @method('POST')

                <div class="container">

                    <div class="form-row">
                        <div class="col-6 mb-3">
                            <label for="passnumber">Passport Number</label>
                            <input type="text" wire:model="passnumber" class="form-control adv-form-input capitalize"  id="passnumber" name="passnumber" placeholder="Enter Passport Number" title="Enter Passport Number">
                        </div>

                        <div class="col-6 mb-3">
                            <label for="idnumber">ID Number</label>
                            <input type="text" wire:model="idnumber" class="form-control adv-form-input capitalize"  id="idnumber" name="idnumber" placeholder="Enter ID Number" title="Enter ID Number">
                        </div>

                        <div class="col-6 mb-3">
                            <label for="dateissue">Date of Issue</label>
                            <input type="date" class="form-control adv-form-input" id="dateissue" name="dateissue" placeholder="Date of Issue">
                        </div>

                        <div class="col-6 mb-3">
                            <label for="dateexpiry">Date of Expiry</label>
                            <input type="date" class="form-control adv-form-input" id="dateexpiry" name="dateexpiry" placeholder="Date of Expiry">
                        </div>
                    </div>

                    <!-- button -->
                    <div class="row" >
                        <div class="form-group col-md-2 d-flex">
                            <button type="submit" id="submitSearch" class="btn btn-block bg-gradient-success">Search</button>
                        </div>
                        <div class="form-group col-md-2 d-flex">
                            <button type="submit" id="submitSearch" class="btn btn-block btn-outline-light">Reset</button>
                        </div>
                    </div>

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