Chrome browser form autofill default style - autofill setting

1. The error display status is as follows : because the Input input box does not use [autocomplete="off"] to turn off the browser's built-in form filling function, so the style becomes like this when automatic filling occurs~

Then locate the style of the input box and find that the auto-fill style is shown in Figure 2

2. Solve the first step: modify the style as follows, and cover the background color with the shadow of the solid color.

Although the display is normal after the selection is completed; however, there is still a problem with the selected state when the mouse is clicked, as shown in Figure 3

input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #202123 inset;
  -webkit-text-fill-color: #C9E5FF;
}

3. Solve the second step : continue to add and set the input style animation. finally done~

input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #202123 inset;
  -webkit-text-fill-color: #C9E5FF;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-transition-delay: 99999s;
    -webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
}