Enhance the accessibility for colors on the default theme of JoyUI

[samislam]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Summary 💡

The selected Items in the sidebar are not obvious.

Link to live example: https://mui.com/joy-ui/getting-started/templates/order-dashboard/

Steps:

<ListItemButton  selected>
  {item?.icon}
  <ListItemContent>
    <Typography level="title-sm">{item.label}</Typography>
  </ListItemContent>
</ListItemButton>

Examples 🌈

On my old laptop screen, I see this:

While on my new monitor I see this:

When it should be the other way around 😅

I am using the same browser (brave) on both devices, the latest version.
But I am not really sure quite yet if it's related to the monitor itself or if it's related to browser differences.

[samislam]

It turned out that it's a bug, so I made another issue here:

#40327