I have a requirement to highlight the focused element with custom background color from the suggestions when the user navigates through the suggestions using keyboard up/down arrow keys.

Currently the background color of the focused element is changed when user focuses the element by mouse(when user hovers the element with mouse) using CSS with :hover. But the background color of the focused element is not changed when the user focuses the element using keyboard up/down arrows.

I want to achieve the same using keyboard navigation.

Want to achieve below result on Keyboard navigation.