The different shades of blue in the menu are not working

In the latest version the different shades of blue that are stronger when more sub menus are expanded are not working:

applayout-styles.css is imported as a theme for fc-applayout

AppLayoutAddon/src/main/java/com/flowingcode/addons/applayout/AppLayout.java

Line 42 in 7e05f8b

@CssImport(value = "./styles/applayout-styles.css", themeFor = "fc-applayout")

The following style, however, has to apply to the ligth DOM

AppLayoutAddon/src/main/resources/META-INF/resources/frontend/styles/applayout-styles.css

Lines 20 to 22 in 7e05f8b

    
           fc-menuitem fc-menuitem { 
        
             background-color: var(--lumo-primary-color-10pct); 
        
           }

Even better add ::slotted(fc-menuitem) { background-color: var(--lumo-primary-color-10pct); } in fc-menuitem (but that requires version 0.9.6 that hasn't been released)

I closed the earlier PR since I think it would be better to implement it in the shadow DOM of fc-menuitem (so that the style can be distributed with the addon). I'm undecided however on whether it should go into fc-menuitem itself, or as a themeFor in this component.

My opinion is that it should go to fc-menuitem, because according to the description it is a "Web Component that displays a hierarchical menu", so that means that the concept of hierarchy is part of its scope, so it should show different shades when the submenus are opened, despite of where it is used (in this addon on a different context like a context menu or something like that).

The suggestion above #75 (comment) will be implemented in fc-menuitem 0.9.6

	fc-menuitem fc-menuitem {
	background-color: var(--lumo-primary-color-10pct);
	}