fix(ui5-tokenizer): Fix invisble texts styling (#3394)

Resolves #2259

Tokenizer is a component which (for now) is not used standalone. Its main use case is to be used within MultiInput & MultiCombobox.
The wrapping controls (MultiInput & MultiCombobox) style their layout using a flexbox, Tokenizer does the same in order to align the tokens. So, we end up with nested flexboxes.

The Tokenizer however, has hidden texts within the flex elements and this leads to some strange behaviour where the whole wrapping control missalignes to its base line.
The CSS Styles which are responsible for hidden texts (Acc), are defined globally and are reused within the Tokenizer. They rely on some absolute positioning with big dimesnisons, so the element won't fit in the visible area of the window. This solution breaks the nested flexboxes and for that case in the Tokenizer, we need to workaround it and implement an own, custom solution.
This solution aligns the hidden texts along with the other flex elements without breaking the layout.

Co-authored-by: ilhan <ilhan.myumyun@sap.com>

Author: d3xter666

packages/main/src/themes/Tokenizer.css

@@ -1,12 +1,16 @@
-@import "./InvisibleTextStyles.css";
-
 :host {
 	display: inline-block;
 	box-sizing: border-box;
 	border: 1px solid black;
 	height: 2.25rem;
 }
 
+.ui5-hidden-text {
+	width: 1px;
+	overflow: hidden;
+	color: transparent;
+}
+
 .ui5-tokenizer-root {
 	height: 100%;
 	display: flex;