Change Autocomplete Styles in WebKit Browsers

What we mean by autocomplete

Many browsers (including Chrome and Safari) provide a setting that allows users to automatically fill in details for common form fields. You have seen this when completing a form that asks for things like name, address, and email.

The catch is that users must have enabled this setting in order for this snippet to be effective. If the setting is enabled, then WebKit browsers will style the fields it has autocompleted for the user, like so:

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
/*border color*/
    border: 1px solid #1e2023;
/*text color*/
   -webkit-text-fill-color: #1e2023;
/* shadow color */
   -webkit-box-shadow: 0 0 0px 1000px #1e2023 inset;
   transition: background-color 5000s ease-in-out 0s;
}