How to style native html elements

I’ve an ion-input element which is a wrapper around a native html input element
I want to style that native input element, how can I achieve this ?
I"m able to style it using developer tools, but from code this seems to be very difficult
<ion-input type='search' [(ngModel)]='searchProduct' (ionBlur)="searchFor($event)" placeholder='Search here' class='search-bar'> <ion-icon name='search'></ion-icon> </ion-input>
Basically I Just want to show my input like this in image
style
I did this using chrome developer tools, but from html I’m unable to do.
From html it puts the background to whole input including the icon, where I want to appear it like above.
how can I do this from code ?