How to give border color to input fields of ng-otp-input package in Angular?-CodePudding

I am using ng-otp-input package and I want to change the border color of the input field to red when they are focused.
Package Reference link https://github.com/code-farmz/ng-otp-input
Below is my code
HTML

     <ng-otp-input (onInputChange)="pinModelChange('otp',$event)" [config]="otpConfig"
                ></ng-otp-input>

TYPESCRIPT

 otpConfig :NgOtpInputConfig = {
    allowNumbersOnly: true,
    length: 6,
    isPasswordInput: false,
    disableAutoFocus: false,
    placeholder: '',
    inputStyles:{
      'display':'flex'
    },
    containerStyles:{
      'display':'flex'
    },
    inputClass:'each_input',
    containerClass:'all_inputs'
  };

CSS

.each_input:focus{
  border: 2px solid red!important;
}

I unable to remove the solid black border when the input field is in focused state

CodePudding user response：

try

.each_input:focus {
    outline-style: solid;
    outline-color: red;
}