fix(ui5-color-palette): show tooltip on focused hovered items (#11519)

There was a bug where upon hovering on a focused item, the tooltip (if such is present) was not showing.
The reason behind that was a CSS property disabling all events - pointer-events: none.

We fix that by ensuring that the property pointer-events: none is present when the ui5-color-palette-item (swatch) is focused but NOT hovered. This ensures that:

 - The tooltip is visible when the user hovers over a focused ui5-color-palette-item;
 - The focus/hover visual appearance is maintained;

Author: hinzzx

packages/main/src/themes/ColorPaletteItem.css

@@ -66,7 +66,7 @@
 	outline: none;
 }
 
-:host(:not([_disabled]):not([on-phone]):focus) .ui5-cp-item {
+:host(:not([_disabled]):not([on-phone]):focus:not(:hover)) .ui5-cp-item {
 	pointer-events: none;
 }
 
@@ -90,7 +90,7 @@
 	pointer-events: none;
 }
 
-:host(:not([_disabled]):not([on-phone]):hover:focus) .ui5-cp-item:focus:not(:hover)::before {
+:host(:not([_disabled]):not([on-phone]):focus:hover) .ui5-cp-item::before {
 	content: "";
 	box-sizing: border-box;
 	position: absolute;
@@ -100,7 +100,7 @@
 	pointer-events: none;
 }
 
-:host(:not([_disabled]):not([on-phone]):focus:not(:hover)) .ui5-cp-item:focus:not(:hover)::after {
+:host(:not([_disabled]):not([on-phone]):focus:hover) .ui5-cp-item::after {
 	content: "";
 	box-sizing: border-box;
 	position: absolute;