<div>
    <div class="card">
        <div class="card-body">
            <form wire:submit="register">
                <div class="mb-3 row">
                    <label for="name" class="col-md-5 col-form-label text-start fw-bold">Name</label>
                    <div class="col-md-7">
                        <input type="text" class="form-control @error('name') is-invalid @enderror" id="name" wire:model="name">
                        @if ($errors->has('name'))
                            <span class="text-danger">{{ $errors->first('name') }}</span>
                        @endif
                    </div>
                </div>
                <div class="mb-3 row">
                    <label for="name" class="col-md-5 col-form-label text-start fw-bold">Role</label>
                    <div class="col-md-7">
                        <select class="form-control @error('name') is-invalid @enderror" id="role" wire:model="role">
                            <option value="">--select--</option>
                            <option value="User">User</option>
                            <option value="Admin">Admin</option>
                            <option value="Super Admin">Super Admin</option>
                        </select>
                        @if ($errors->has('role'))
                            <span class="text-danger">{{ $errors->first('role') }}</span>
                        @endif
                    </div>
                </div>
                <div class="mb-3 row">
                    <label for="nid" class="col-md-5 col-form-label text-start fw-bold">NID</label>
                    <div class="col-md-7">
                        <input type="number" min="0" class="form-control @error('nid') is-invalid @enderror" id="nid" wire:model="nid">
                        @if ($errors->has('nid'))
                            <span class="text-danger">{{ $errors->first('nid') }}</span>
                        @endif
                    </div>
                </div>
                <div class="mb-3 row">
                    <label for="nid" class="col-md-5 col-form-label text-start fw-bold">Phone</label>
                    <div class="col-md-7">
                        <input type="tel" min="0" class="form-control @error('phone') is-invalid @enderror" id="phone" wire:model="phone">
                        @if ($errors->has('phone'))
                            <span class="text-danger">{{ $errors->first('phone') }}</span>
                        @endif
                    </div>
                </div>
                <div class="mb-3 row">
                    <label for="email" class="col-md-5 col-form-label text-start fw-bold">Email (Login ID)</label>
                    <div class="col-md-7">
                        <input type="email" class="form-control @error('email') is-invalid @enderror" id="email" wire:model="email">
                        @if ($errors->has('email'))
                            <span class="text-danger">{{ $errors->first('email') }}</span>
                        @endif
                    </div>
                </div>
                <div class="mb-3 row">
                    <label for="password" class="col-md-5 col-form-label text-start fw-bold">Password</label>
                    <div class="col-md-7">
                        <input type="password" class="form-control @error('password') is-invalid @enderror" id="password" wire:model="password">
                        @if ($errors->has('password'))
                            <span class="text-danger">{{ $errors->first('password') }}</span>
                        @endif
                    </div>
                </div>   
 
                <div class="mb-3 row">
                    <label for="password_confirmation" class="col-md-5 col-form-label text-start fw-bold">Confirm Password</label>
                    <div class="col-md-7">
                        <input type="password" class="form-control" id="password_confirmation" wire:model="password_confirmation">
                    </div>
                </div>
                <div class="mb-3 row">
                    <label for="photo" class="col-md-5 col-form-label text-start fw-bold">Photo</label>
                    <div class="col-md-7">
                        <input type="file" class="form-control" id="photo" wire:model="photo">
                        @if ($photo) 
                            <img src="{{ $photo->temporaryUrl() }}" style="width:200px;height:200px">
                        @endif
                        @error('photo') <span class="text-danger">{{ $message }}</span> @enderror
                    </div>
                </div>
                <div class="mb-3 row">
                    <button type="submit" class="col-md-3 offset-md-5 btn btn-primary">
                        Register
                    </button>
                </div>
            </form>
            <div class="mb-3 row"> 
                <span wire:loading class="col-md-3 offset-md-5 text-primary">Processing...</span>
            </div>
        </div>
    </div>
</div>    