Как обойти input:-internal-autofill-selected?

Question

[podushka]

Здравствуйте. Есть вот такой input:

<div class="input">
    <div class="icon before">
        <i class="fa-solid fa-wallet"></i>
    </div>
    <input type="text" name="name" placeholder="placeholder">
    <div class="icon after">
        <i class="fa-solid fa-user"></i>
    </div>
</div>

при вводе данных с помощью выбора их из списка (autocomplete), происходит это:

все из-за input:-internal-autofill-selected. Я пытался сделать так:

.input input:-internal-autofill-selected {
    background-color: var(--yui--color_field_background) !important;
}

но это все равно не помогает. Как можно исправить это?

Comments

[Сергей delphinpro]

Пользователь должен видеть, что данные подставлены автоматически, а не руками вбиты.

[podushka]

Сергей delphinpro, я понимаю, но это выглядит как минимум некрасиво, поэтому хочется изменить это, но не получается :(

[Сергей delphinpro]

podushka, поэтому и не получается =)
Дай версталам такую возможность - они просто сделают одинаковый вид с обычным состоянием, и отличия видно не будет. Мало кто будет заморачиваться с отличающимся дизайном.

Может быть где-то, в параллельной вселенной, где 100% разработчиков ответственно относятся к делу, браузеры и разрешают менять это.