change p-menuitem hover background

[icemanww15]

i know that this:

Code: Select all

.p-menuitem:hover{
    background-color: red!important;
}

works
but the problem is it seems like it does not affect the right element. all i can see is a tiny red pixel in every corner and everything else still becomes grey-ish white. when i inspect the elements of the site though, it says that im referring to menuitem.
what i think happens is that primevue has somewhere embeded something else that gets layed on top of the menuitem when its hovered. the problem is i have no idea how that element thats put on top is called and therefore cant change it. (or its something else entirely)
in any case i hope someone knows how to do it.
(custom theme is not an option cause i cant afford the licence)

thanks in advance

[tugce.kucukoglu]

You could try to use this

Code: Select all

.p-menu .p-menuitem .p-menuitem-link:hover {
    background-color: red;
}

[icemanww15]

sadly does not work
same thing as with the lines above