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

    <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="idnumber">Document number</label>
                    <input type="text" wire:model="docnumber" class="form-control adv-form-input capitalize"  id="docnumber" name="docnumber">
                </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">
                </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>