Select2 hover color with CSS

Question

I've been trying to change the default blue hover color to something different in the Select2 elements in the website I'm designing, but no success so far. What's the correct, working css selector which would allow me to change the background color and font color of the hovered choice in the Select2 elements? Thank you in advance!

Edit:

.select2-drop:hover {
background-color: #efefef;
}

I've tried .select2-container, choice but no success. The added code changes the whole dropdown color on hover, but I need it to only change the hovered option.

Answer 1

Try this

.select2-results .select2-highlighted {
    background: #f00;
    color: #fff;
}

Answer 2

You can use this to change the hover color, works for the Select2 V4.0.1

.select2-container--default .select2-results__option--highlighted[aria-selected] {
     background-color: #F0F1F2;
     color: #393A3B; 
}