Adding custom css to only one lightning input in LWC [duplicate]

Question

Not a duplicate question, Question is 'how to apply custom css to only one lightning input without affecting css of any other lightning input elements.

I am trying to apply custom css to lightning input but it is not working.

HTML

<lightning-input class ="lastName" name="lastName" onblur={handleEmptyValidation} >

JS

export default class registration extends LightningElement {
handleEmptyValidation(event) {
            let srcElement = this.template.querySelector('.lastName');
            const style = document.createElement('style');
            style.innerText = `c-registration lightning-input input {
                border-color: #54C2B2;
                }`;
            srcElement.appendChild(style);
    }

It works when I use .slds-input instead of lightning-input input but for some reason it gets applied to all lightning-inputeven though when I am using srcElement.appendChild(style);

Answer 1

I was able to change css only for 'lastName'

const style = document.createElement('style');
        style.innerText = `c-self-registration .lastName .slds-input {
            border-color: #54C2B2;

            }`;
        srcElement.appendChild(style);