So as you can see I added a blur effect as well as to the Level 2 dropdown list on the Navigation bar but it seems like I am not able to add the same effect to the Level 3 and Level 4 for some reason even though its under the same class.

The CSS selector I used for the Level 2 Dropdown list container was "div.wds-is-not-scrollable.wds-dropdown__content" adding the necessary properties.

On inspecting (F12) although it shows that the CSS selector for the Level 3 and 4 are both "wds-is-not-scrollable wds-dropdown-level-nested__content" and even though I added the properties, it doesn't seem to reflect the properties even after repeated cache clearing.

I have seen other wikis like the Cyberpunk 2077 Wiki do this customization for all their levels of Navigation Bar so I am curious to know how it was done exactly ? A comprehensive solution would be helpful !!!

Thanks in advance. I have also posted the same thing in Community Central. Also for anyone curious about the properties I am using as follows :-

  background-color: rgba(25, 25, 25, 0.5);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 8px;
  border-color: #786C42;
  border-width: 2px;
  color: white;