Unable to set Text Alignment for lightning-input (Number) LWC component

Question

I am using lightning-input of type number (LWC) and trying to have input text center aligned.

At the end, element's class is being set to "slds-input", So I cannot use custom class to add css.

I am not able to override text-align with css mentioned below. What am I missing? Please help.

<lightning-input
     type="number"
     name="inputNumber"
     class="inputNumberCenter"
     value={answer}
     onchange={handleValueChange}
     step="1">
</lightning-input>


input.slds-input {
    text-align: center
};

Rendered HTML

Answer 1

After spending a lot of time, the below approach got worked (which is written in connectedcallback method).

Apply input-text-align_right class name to lightning-input tag.

const inputAligncenter = document.createElement('style');
inputAligncenter.innerText = `.input-text-align_right input{ text-align: center!important; }`;
document.body.appendChild(inputAligncenter);

Answer 2

Try to add "slds-align_absolute-center"right afer the slds-input. If it doesn't work to add a div in top:

<div class="slds-align_absolute-center">
 <input lightning-input ....... />
</div>