@salutejs/sdds-netology 0.358.0-next-sbcom.0 → 0.359.0-dev.0

package/dist/styled-components/cjs/components/TimePicker/TimePicker.config.js

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _plasma_b2c = require("@salutejs/plasma-themes/tokens/plasma_b2c");
 const config = {
     defaults: {
         view: 'default',
@@ -19,45 +20,45 @@ const config = {
     variations: {
         view: {
             default: (0, _styledcomponents.css)`
-                ${_styledcomponents.timePickerTokens.background}: var(--surface-transparent-primary);
-                ${_styledcomponents.timePickerTokens.backgroundError}: var(--surface-transparent-negative);
-                ${_styledcomponents.timePickerTokens.backgroundSuccess}: var(--surface-transparent-positive);
+                ${_styledcomponents.timePickerTokens.background}: ${_plasma_b2c.surfaceTransparentPrimary};
+                ${_styledcomponents.timePickerTokens.backgroundError}: ${_plasma_b2c.surfaceTransparentNegative};
+                ${_styledcomponents.timePickerTokens.backgroundSuccess}: ${_plasma_b2c.surfaceTransparentPositive};
 
-                ${_styledcomponents.timePickerTokens.labelColor}: var(--text-primary);
+                ${_styledcomponents.timePickerTokens.labelColor}: ${_plasma_b2c.textPrimary};
 
-                ${_styledcomponents.timePickerTokens.textFieldColor}: var(--text-primary);
-                ${_styledcomponents.timePickerTokens.textFieldPlaceholderColor}: var(--text-secondary);
-                ${_styledcomponents.timePickerTokens.textFieldCaretColor}: var(--text-accent);
+                ${_styledcomponents.timePickerTokens.textFieldColor}: ${_plasma_b2c.textPrimary};
+                ${_styledcomponents.timePickerTokens.textFieldPlaceholderColor}: ${_plasma_b2c.textSecondary};
+                ${_styledcomponents.timePickerTokens.textFieldCaretColor}: ${_plasma_b2c.textAccent};
 
-                ${_styledcomponents.timePickerTokens.indicatorColor}: var(--surface-negative);
+                ${_styledcomponents.timePickerTokens.indicatorColor}: ${_plasma_b2c.surfaceNegative};
 
-                ${_styledcomponents.timePickerTokens.timePickerShadow}: var(--shadow-down-soft-s);
+                ${_styledcomponents.timePickerTokens.timePickerShadow}: ${_plasma_b2c.shadowDownSoftS};
 
-                ${_styledcomponents.timePickerTokens.textFieldBackgroundColor}: var(--surface-transparent-primary);
-                ${_styledcomponents.timePickerTokens.textFieldBackgroundColorFocus}: var(--surface-transparent-secondary);
-                ${_styledcomponents.timePickerTokens.textFieldBackgroundErrorColor}: var(--surface-transparent-negative);
-                ${_styledcomponents.timePickerTokens.textFieldBackgroundErrorColorFocus}: var(--surface-transparent-negative-active);
-                ${_styledcomponents.timePickerTokens.textFieldBackgroundSuccessColor}: var(--surface-transparent-positive);
-                ${_styledcomponents.timePickerTokens.textFieldBackgroundSuccessColorFocus}: var(--surface-transparent-positive-active);
+                ${_styledcomponents.timePickerTokens.textFieldBackgroundColor}: ${_plasma_b2c.surfaceTransparentPrimary};
+                ${_styledcomponents.timePickerTokens.textFieldBackgroundColorFocus}: ${_plasma_b2c.surfaceTransparentSecondary};
+                ${_styledcomponents.timePickerTokens.textFieldBackgroundErrorColor}: ${_plasma_b2c.surfaceTransparentNegative};
+                ${_styledcomponents.timePickerTokens.textFieldBackgroundErrorColorFocus}: ${_plasma_b2c.surfaceTransparentNegativeActive};
+                ${_styledcomponents.timePickerTokens.textFieldBackgroundSuccessColor}: ${_plasma_b2c.surfaceTransparentPositive};
+                ${_styledcomponents.timePickerTokens.textFieldBackgroundSuccessColorFocus}: ${_plasma_b2c.surfaceTransparentPositiveActive};
 
-                ${_styledcomponents.timePickerTokens.textFieldTextBeforeColor}: var(--text-tertiary);
-                ${_styledcomponents.timePickerTokens.textFieldTextAfterColor}: var(--text-tertiary);
+                ${_styledcomponents.timePickerTokens.textFieldTextBeforeColor}: ${_plasma_b2c.textTertiary};
+                ${_styledcomponents.timePickerTokens.textFieldTextAfterColor}: ${_plasma_b2c.textTertiary};
 
-                ${_styledcomponents.timePickerTokens.textFieldPlaceholderColorFocus}: var(--text-tertiary);
+                ${_styledcomponents.timePickerTokens.textFieldPlaceholderColorFocus}: ${_plasma_b2c.textTertiary};
 
-                ${_styledcomponents.timePickerTokens.timePickerBackground}: var(--surface-solid-card);
-                ${_styledcomponents.timePickerTokens.itemBackgroundHover}: var(--surface-transparent-secondary);
-                ${_styledcomponents.timePickerTokens.itemBackgroundActive}: var(--surface-transparent-secondary);
-                ${_styledcomponents.timePickerTokens.itemFocusColor}: var(--surface-accent);
+                ${_styledcomponents.timePickerTokens.timePickerBackground}: ${_plasma_b2c.surfaceSolidCard};
+                ${_styledcomponents.timePickerTokens.itemBackgroundHover}: ${_plasma_b2c.surfaceTransparentSecondary};
+                ${_styledcomponents.timePickerTokens.itemBackgroundActive}: ${_plasma_b2c.surfaceTransparentSecondary};
+                ${_styledcomponents.timePickerTokens.itemFocusColor}: ${_plasma_b2c.surfaceAccent};
 
-                ${_styledcomponents.timePickerTokens.scrollbarColor}: var(--surface-transparent-tertiary);
-                ${_styledcomponents.timePickerTokens.scrollbarTrackColor}: var(--surface-transparent-primary);
+                ${_styledcomponents.timePickerTokens.scrollbarColor}: ${_plasma_b2c.surfaceTransparentTertiary};
+                ${_styledcomponents.timePickerTokens.scrollbarTrackColor}: ${_plasma_b2c.surfaceTransparentPrimary};
 
-                ${_styledcomponents.timePickerTokens.leftHelperColor}: var(--text-secondary);
-                ${_styledcomponents.timePickerTokens.leftHelperColorError}: var(--text-negative);
-                ${_styledcomponents.timePickerTokens.leftHelperColorSuccess}: var(--text-positive);
+                ${_styledcomponents.timePickerTokens.leftHelperColor}: ${_plasma_b2c.textSecondary};
+                ${_styledcomponents.timePickerTokens.leftHelperColorError}: ${_plasma_b2c.textNegative};
+                ${_styledcomponents.timePickerTokens.leftHelperColorSuccess}: ${_plasma_b2c.textPositive};
 
-                ${_styledcomponents.timePickerTokens.hintIconColor}: var(--text-secondary);
+                ${_styledcomponents.timePickerTokens.hintIconColor}: ${_plasma_b2c.textSecondary};
             `
         },
         size: {
@@ -72,12 +73,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.labelInnerPadding}: 0.5625rem 0 0.125rem 0;
                 ${_styledcomponents.timePickerTokens.contentLabelInnerPadding}: 1.5625rem 0 0.5625rem 0;
 
-                ${_styledcomponents.timePickerTokens.labelFontFamily}: var(--plasma-typo-body-l-font-family);
-                ${_styledcomponents.timePickerTokens.labelFontStyle}: var(--plasma-typo-body-l-font-style);
-                ${_styledcomponents.timePickerTokens.labelFontSize}: var(--plasma-typo-body-l-font-size);
-                ${_styledcomponents.timePickerTokens.labelFontWeight}: var(--plasma-typo-body-l-font-weight);
-                ${_styledcomponents.timePickerTokens.labelLetterSpacing}: var(--plasma-typo-body-l-letter-spacing);
-                ${_styledcomponents.timePickerTokens.labelLineHeight}: var(--plasma-typo-body-l-line-height);
+                ${_styledcomponents.timePickerTokens.labelFontFamily}: ${_plasma_b2c.bodyL.fontFamily};
+                ${_styledcomponents.timePickerTokens.labelFontStyle}: ${_plasma_b2c.bodyL.fontStyle};
+                ${_styledcomponents.timePickerTokens.labelFontSize}: ${_plasma_b2c.bodyL.fontSize};
+                ${_styledcomponents.timePickerTokens.labelFontWeight}: ${_plasma_b2c.bodyL.fontWeight};
+                ${_styledcomponents.timePickerTokens.labelLetterSpacing}: ${_plasma_b2c.bodyL.letterSpacing};
+                ${_styledcomponents.timePickerTokens.labelLineHeight}: ${_plasma_b2c.bodyL.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.indicatorSize}: 0.5rem;
                 ${_styledcomponents.timePickerTokens.indicatorSizeOuter}: 0.375rem;
@@ -89,12 +90,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.textFieldHeight}: 3.5rem;
                 ${_styledcomponents.timePickerTokens.textFieldBorderRadius}: 0.875rem;
                 ${_styledcomponents.timePickerTokens.textFieldPadding}: 1.0625rem 1.125rem 1.0625rem 1.125rem;
-                ${_styledcomponents.timePickerTokens.textFieldFontFamily}: var(--plasma-typo-body-l-font-family);
-                ${_styledcomponents.timePickerTokens.textFieldFontStyle}: var(--plasma-typo-body-l-font-style);
-                ${_styledcomponents.timePickerTokens.textFieldFontSize}: var(--plasma-typo-body-l-font-size);
-                ${_styledcomponents.timePickerTokens.textFieldFontWeight}: var(--plasma-typo-body-l-font-weight);
-                ${_styledcomponents.timePickerTokens.textFieldLetterSpacing}: var(--plasma-typo-body-l-letter-spacing);
-                ${_styledcomponents.timePickerTokens.textFieldLineHeight}: var(--plasma-typo-body-l-line-height);
+                ${_styledcomponents.timePickerTokens.textFieldFontFamily}: ${_plasma_b2c.bodyL.fontFamily};
+                ${_styledcomponents.timePickerTokens.textFieldFontStyle}: ${_plasma_b2c.bodyL.fontStyle};
+                ${_styledcomponents.timePickerTokens.textFieldFontSize}: ${_plasma_b2c.bodyL.fontSize};
+                ${_styledcomponents.timePickerTokens.textFieldFontWeight}: ${_plasma_b2c.bodyL.fontWeight};
+                ${_styledcomponents.timePickerTokens.textFieldLetterSpacing}: ${_plasma_b2c.bodyL.letterSpacing};
+                ${_styledcomponents.timePickerTokens.textFieldLineHeight}: ${_plasma_b2c.bodyL.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.textFieldLeftContentMargin}: -0.0625rem 0.5rem -0.0625rem -0.125rem;
                 ${_styledcomponents.timePickerTokens.textFieldRightContentMargin}: -0.0625rem -0.125rem -0.0625rem 0.75rem;
@@ -112,34 +113,34 @@ const config = {
 
                 ${_styledcomponents.timePickerTokens.columnHeight}: 36.25rem;
 
-                ${_styledcomponents.timePickerTokens.itemFontFamily}: var(--plasma-typo-body-l-font-family);
-                ${_styledcomponents.timePickerTokens.itemFontSize}: var(--plasma-typo-body-l-font-size);
-                ${_styledcomponents.timePickerTokens.itemFontStyle}: var(--plasma-typo-body-l-font-style);
-                ${_styledcomponents.timePickerTokens.itemFontWeight}: var(--plasma-typo-body-l-font-weight);
-                ${_styledcomponents.timePickerTokens.itemLetterSpacing}: var(--plasma-typo-body-l-letter-spacing);
-                ${_styledcomponents.timePickerTokens.itemLineHeight}: var(--plasma-typo-body-l-line-height);
+                ${_styledcomponents.timePickerTokens.itemFontFamily}: ${_plasma_b2c.bodyL.fontFamily};
+                ${_styledcomponents.timePickerTokens.itemFontSize}: ${_plasma_b2c.bodyL.fontSize};
+                ${_styledcomponents.timePickerTokens.itemFontStyle}: ${_plasma_b2c.bodyL.fontStyle};
+                ${_styledcomponents.timePickerTokens.itemFontWeight}: ${_plasma_b2c.bodyL.fontWeight};
+                ${_styledcomponents.timePickerTokens.itemLetterSpacing}: ${_plasma_b2c.bodyL.letterSpacing};
+                ${_styledcomponents.timePickerTokens.itemLineHeight}: ${_plasma_b2c.bodyL.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.itemHeight}: 3.5rem;
                 ${_styledcomponents.timePickerTokens.itemBorderRadius}: 0.75rem;
                 ${_styledcomponents.timePickerTokens.itemPadding}: 0rem;
 
-                ${_styledcomponents.timePickerTokens.labelInnerFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.labelInnerFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.labelInnerFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.labelInnerFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.labelInnerLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.labelInnerLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.labelInnerFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.labelInnerFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.labelInnerFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.labelInnerFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.labelInnerLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.labelInnerLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
                 ${_styledcomponents.timePickerTokens.hintMargin}: -0.688rem -0.5rem;
                 ${_styledcomponents.timePickerTokens.hintTargetSize}: 2.375rem;
                 ${_styledcomponents.timePickerTokens.hintInnerLabelPlacementOffset}: 0.563rem -2.938rem auto auto;
 
                 ${_styledcomponents.timePickerTokens.leftHelperOffset}: 0.25rem 0 0 0;
-                ${_styledcomponents.timePickerTokens.leftHelperFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.leftHelperFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.leftHelperFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.leftHelperFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.leftHelperLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.leftHelperLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.leftHelperFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.leftHelperFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.leftHelperFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.leftHelperFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.leftHelperLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.leftHelperLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.scrollbarWidth}: 0.125rem;
                 ${_styledcomponents.timePickerTokens.scrollbarMargin}: 0.5rem;
@@ -155,12 +156,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.labelInnerPadding}: 0.375rem 0 0.125rem 0;
                 ${_styledcomponents.timePickerTokens.contentLabelInnerPadding}: 1.375rem 0 0.375rem 0;
 
-                ${_styledcomponents.timePickerTokens.labelFontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_styledcomponents.timePickerTokens.labelFontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_styledcomponents.timePickerTokens.labelFontSize}: var(--plasma-typo-body-m-font-size);
-                ${_styledcomponents.timePickerTokens.labelFontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_styledcomponents.timePickerTokens.labelLetterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_styledcomponents.timePickerTokens.labelLineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_styledcomponents.timePickerTokens.labelFontFamily}: ${_plasma_b2c.bodyM.fontFamily};
+                ${_styledcomponents.timePickerTokens.labelFontStyle}: ${_plasma_b2c.bodyM.fontStyle};
+                ${_styledcomponents.timePickerTokens.labelFontSize}: ${_plasma_b2c.bodyM.fontSize};
+                ${_styledcomponents.timePickerTokens.labelFontWeight}: ${_plasma_b2c.bodyM.fontWeight};
+                ${_styledcomponents.timePickerTokens.labelLetterSpacing}: ${_plasma_b2c.bodyM.letterSpacing};
+                ${_styledcomponents.timePickerTokens.labelLineHeight}: ${_plasma_b2c.bodyM.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.indicatorSize}: 0.5rem;
                 ${_styledcomponents.timePickerTokens.indicatorSizeOuter}: 0.375rem;
@@ -172,12 +173,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.textFieldHeight}: 3rem;
                 ${_styledcomponents.timePickerTokens.textFieldBorderRadius}: 0.75rem;
                 ${_styledcomponents.timePickerTokens.textFieldPadding}: 0.875rem 1rem 0.875rem 1rem;
-                ${_styledcomponents.timePickerTokens.textFieldFontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_styledcomponents.timePickerTokens.textFieldFontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_styledcomponents.timePickerTokens.textFieldFontSize}: var(--plasma-typo-body-m-font-size);
-                ${_styledcomponents.timePickerTokens.textFieldFontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_styledcomponents.timePickerTokens.textFieldLetterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_styledcomponents.timePickerTokens.textFieldLineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_styledcomponents.timePickerTokens.textFieldFontFamily}: ${_plasma_b2c.bodyM.fontFamily};
+                ${_styledcomponents.timePickerTokens.textFieldFontStyle}: ${_plasma_b2c.bodyM.fontStyle};
+                ${_styledcomponents.timePickerTokens.textFieldFontSize}: ${_plasma_b2c.bodyM.fontSize};
+                ${_styledcomponents.timePickerTokens.textFieldFontWeight}: ${_plasma_b2c.bodyM.fontWeight};
+                ${_styledcomponents.timePickerTokens.textFieldLetterSpacing}: ${_plasma_b2c.bodyM.letterSpacing};
+                ${_styledcomponents.timePickerTokens.textFieldLineHeight}: ${_plasma_b2c.bodyM.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.textFieldLeftContentMargin}: -0.125rem 0.375rem -0.125rem -0.125rem;
                 ${_styledcomponents.timePickerTokens.textFieldRightContentMargin}: -0.125rem -0.125rem -0.125rem 0.75rem;
@@ -195,34 +196,34 @@ const config = {
 
                 ${_styledcomponents.timePickerTokens.columnHeight}: 31.25rem;
 
-                ${_styledcomponents.timePickerTokens.itemFontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_styledcomponents.timePickerTokens.itemFontSize}: var(--plasma-typo-body-m-font-size);
-                ${_styledcomponents.timePickerTokens.itemFontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_styledcomponents.timePickerTokens.itemFontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_styledcomponents.timePickerTokens.itemLetterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_styledcomponents.timePickerTokens.itemLineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_styledcomponents.timePickerTokens.itemFontFamily}: ${_plasma_b2c.bodyM.fontFamily};
+                ${_styledcomponents.timePickerTokens.itemFontSize}: ${_plasma_b2c.bodyM.fontSize};
+                ${_styledcomponents.timePickerTokens.itemFontStyle}: ${_plasma_b2c.bodyM.fontStyle};
+                ${_styledcomponents.timePickerTokens.itemFontWeight}: ${_plasma_b2c.bodyM.fontWeight};
+                ${_styledcomponents.timePickerTokens.itemLetterSpacing}: ${_plasma_b2c.bodyM.letterSpacing};
+                ${_styledcomponents.timePickerTokens.itemLineHeight}: ${_plasma_b2c.bodyM.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.itemHeight}: 3rem;
                 ${_styledcomponents.timePickerTokens.itemBorderRadius}: 0.625rem;
                 ${_styledcomponents.timePickerTokens.itemPadding}: 0rem;
 
-                ${_styledcomponents.timePickerTokens.labelInnerFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.labelInnerFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.labelInnerFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.labelInnerFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.labelInnerLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.labelInnerLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.labelInnerFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.labelInnerFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.labelInnerFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.labelInnerFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.labelInnerLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.labelInnerLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
                 ${_styledcomponents.timePickerTokens.hintMargin}: -0.688rem -0.5rem;
                 ${_styledcomponents.timePickerTokens.hintTargetSize}: 2.375rem;
                 ${_styledcomponents.timePickerTokens.hintInnerLabelPlacementOffset}: 0.312rem -2.938rem auto auto;
 
                 ${_styledcomponents.timePickerTokens.leftHelperOffset}: 0.25rem 0 0 0;
-                ${_styledcomponents.timePickerTokens.leftHelperFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.leftHelperFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.leftHelperFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.leftHelperFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.leftHelperLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.leftHelperLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.leftHelperFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.leftHelperFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.leftHelperFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.leftHelperFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.leftHelperLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.leftHelperLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.scrollbarWidth}: 0.125rem;
                 ${_styledcomponents.timePickerTokens.scrollbarMargin}: 0.375rem;
@@ -238,12 +239,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.labelInnerPadding}: 0.3125rem 0 0 0;
                 ${_styledcomponents.timePickerTokens.contentLabelInnerPadding}: 1.0625rem 0 0.3125rem 0;
 
-                ${_styledcomponents.timePickerTokens.labelFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.timePickerTokens.labelFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.timePickerTokens.labelFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.timePickerTokens.labelFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.timePickerTokens.labelLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.timePickerTokens.labelLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_styledcomponents.timePickerTokens.labelFontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.timePickerTokens.labelFontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.timePickerTokens.labelFontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.timePickerTokens.labelFontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.timePickerTokens.labelLetterSpacing}: ${_plasma_b2c.bodyS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.labelLineHeight}: ${_plasma_b2c.bodyS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.indicatorSize}: 0.375rem;
                 ${_styledcomponents.timePickerTokens.indicatorSizeOuter}: 0.375rem;
@@ -255,12 +256,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.textFieldHeight}: 2.5rem;
                 ${_styledcomponents.timePickerTokens.textFieldBorderRadius}: 0.625rem;
                 ${_styledcomponents.timePickerTokens.textFieldPadding}: 0.6875rem 0.875rem 0.6875rem 0.875rem;
-                ${_styledcomponents.timePickerTokens.textFieldFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.timePickerTokens.textFieldFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.timePickerTokens.textFieldFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.timePickerTokens.textFieldFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.timePickerTokens.textFieldLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.timePickerTokens.textFieldLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_styledcomponents.timePickerTokens.textFieldFontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.timePickerTokens.textFieldFontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.timePickerTokens.textFieldFontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.timePickerTokens.textFieldFontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.timePickerTokens.textFieldLetterSpacing}: ${_plasma_b2c.bodyS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.textFieldLineHeight}: ${_plasma_b2c.bodyS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.textFieldLeftContentMargin}: -0.1875rem 0.25rem -0.1875rem -0.125rem;
                 ${_styledcomponents.timePickerTokens.textFieldRightContentMargin}: -0.1875rem -0.125rem -0.1875rem 0.75rem;
@@ -278,34 +279,34 @@ const config = {
 
                 ${_styledcomponents.timePickerTokens.columnHeight}: 26.25rem;
 
-                ${_styledcomponents.timePickerTokens.itemFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.timePickerTokens.itemFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.timePickerTokens.itemFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.timePickerTokens.itemFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.timePickerTokens.itemLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.timePickerTokens.itemLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_styledcomponents.timePickerTokens.itemFontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.timePickerTokens.itemFontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.timePickerTokens.itemFontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.timePickerTokens.itemFontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.timePickerTokens.itemLetterSpacing}: ${_plasma_b2c.bodyS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.itemLineHeight}: ${_plasma_b2c.bodyS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.itemHeight}: 2.5rem;
                 ${_styledcomponents.timePickerTokens.itemBorderRadius}: 0.5rem;
                 ${_styledcomponents.timePickerTokens.itemPadding}: 0rem;
 
-                ${_styledcomponents.timePickerTokens.labelInnerFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.labelInnerFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.labelInnerFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.labelInnerFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.labelInnerLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.labelInnerLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.labelInnerFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.labelInnerFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.labelInnerFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.labelInnerFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.labelInnerLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.labelInnerLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
                 ${_styledcomponents.timePickerTokens.hintMargin}: -0.688rem -0.5rem;
                 ${_styledcomponents.timePickerTokens.hintTargetSize}: 2.375rem;
                 ${_styledcomponents.timePickerTokens.hintInnerLabelPlacementOffset}: 0.062rem -2.813rem auto auto;
 
                 ${_styledcomponents.timePickerTokens.leftHelperOffset}: 0.25rem 0 0 0;
-                ${_styledcomponents.timePickerTokens.leftHelperFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.leftHelperFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.leftHelperFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.leftHelperFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.leftHelperLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.leftHelperLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.leftHelperFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.leftHelperFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.leftHelperFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.leftHelperFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.leftHelperLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.leftHelperLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.scrollbarWidth}: 0.125rem;
                 ${_styledcomponents.timePickerTokens.scrollbarMargin}: 0.25rem;
@@ -321,12 +322,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.labelInnerPadding}: 0.3125rem 0 0 0;
                 ${_styledcomponents.timePickerTokens.contentLabelInnerPadding}: 1.0625rem 0 0.3125rem 0;
 
-                ${_styledcomponents.timePickerTokens.labelFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.labelFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.labelFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.labelFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.labelLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.labelLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.labelFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.labelFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.labelFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.labelFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.labelLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.labelLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.indicatorSize}: 0.375rem;
                 ${_styledcomponents.timePickerTokens.indicatorSizeOuter}: 0.375rem;
@@ -338,12 +339,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.textFieldHeight}: 2rem;
                 ${_styledcomponents.timePickerTokens.textFieldBorderRadius}: 0.5rem;
                 ${_styledcomponents.timePickerTokens.textFieldPadding}: 0.5625rem 0.625rem 0.5625rem 0.625rem;
-                ${_styledcomponents.timePickerTokens.textFieldFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.textFieldFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.textFieldFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.textFieldFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.textFieldLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.textFieldLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.textFieldFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.textFieldFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.textFieldFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.textFieldFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.textFieldLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.textFieldLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.textFieldLeftContentMargin}: -0.0625rem 0.25rem -0.0625rem -0.125rem;
                 ${_styledcomponents.timePickerTokens.textFieldRightContentMargin}: -0.0625rem -0.125rem -0.0625rem 0.75rem;
@@ -361,34 +362,34 @@ const config = {
 
                 ${_styledcomponents.timePickerTokens.columnHeight}: 21.25rem;
 
-                ${_styledcomponents.timePickerTokens.itemFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.itemFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.itemFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.itemFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.itemLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.itemLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.itemFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.itemFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.itemFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.itemFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.itemLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.itemLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.itemHeight}: 2rem;
                 ${_styledcomponents.timePickerTokens.itemBorderRadius}: 0.375rem;
                 ${_styledcomponents.timePickerTokens.itemPadding}: 0rem;
 
-                ${_styledcomponents.timePickerTokens.labelInnerFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.labelInnerFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.labelInnerFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.labelInnerFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.labelInnerLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.labelInnerLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.labelInnerFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.labelInnerFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.labelInnerFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.labelInnerFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.labelInnerLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.labelInnerLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
                 ${_styledcomponents.timePickerTokens.hintMargin}: -0.75rem -0.625rem -0.75rem -0.5rem;
                 ${_styledcomponents.timePickerTokens.hintTargetSize}: 2.375rem;
                 ${_styledcomponents.timePickerTokens.hintInnerLabelPlacementOffset}: -0.188rem -2.1875rem auto auto;
 
                 ${_styledcomponents.timePickerTokens.leftHelperOffset}: 0.25rem 0 0 0;
-                ${_styledcomponents.timePickerTokens.leftHelperFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.leftHelperFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.leftHelperFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.leftHelperFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.leftHelperLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.leftHelperLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.leftHelperFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.leftHelperFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.leftHelperFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.leftHelperFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.leftHelperLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.leftHelperLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.scrollbarWidth}: 0.125rem;
                 ${_styledcomponents.timePickerTokens.scrollbarMargin}: 0.25rem;
@@ -401,10 +402,10 @@ const config = {
         },
         hintView: {
             default: (0, _styledcomponents.css)`
-                ${_styledcomponents.timePickerTokens.hintTooltipBackgroundColor}: var(--surface-solid-card-brightness);
-                ${_styledcomponents.timePickerTokens.hintTooltipBoxShadow}: var(--shadow-down-hard-m);
-                ${_styledcomponents.timePickerTokens.hintTooltipColor}: var(--text-primary);
-                ${_styledcomponents.timePickerTokens.hintTooltipArrowBackground}: var(--surface-solid-card-brightness);
+                ${_styledcomponents.timePickerTokens.hintTooltipBackgroundColor}: ${_plasma_b2c.surfaceSolidCardBrightness};
+                ${_styledcomponents.timePickerTokens.hintTooltipBoxShadow}: ${_plasma_b2c.shadowDownHardM};
+                ${_styledcomponents.timePickerTokens.hintTooltipColor}: ${_plasma_b2c.textPrimary};
+                ${_styledcomponents.timePickerTokens.hintTooltipArrowBackground}: ${_plasma_b2c.surfaceSolidCardBrightness};
             `
         },
         hintSize: {
@@ -417,12 +418,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.hintTooltipMinHeight}: 2.5rem;
                 ${_styledcomponents.timePickerTokens.hintTooltipBorderRadius}: 0.625rem;
 
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontLetterSpacing}: ${_plasma_b2c.bodyS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontLineHeight}: ${_plasma_b2c.bodyS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.hintTooltipContentLeftMargin}: 0.375rem;
 
@@ -441,12 +442,12 @@ const config = {
                 ${_styledcomponents.timePickerTokens.hintTooltipMinHeight}: 2rem;
                 ${_styledcomponents.timePickerTokens.hintTooltipBorderRadius}: 0.5rem;
 
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.timePickerTokens.hintTooltipTextFontLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.timePickerTokens.hintTooltipTextFontLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
 
                 ${_styledcomponents.timePickerTokens.hintTooltipContentLeftMargin}: 0.25rem;
 
@@ -459,13 +460,13 @@ const config = {
         },
         readonly: {
             true: (0, _styledcomponents.css)`
-                ${_styledcomponents.timePickerTokens.backgroundReadOnly}: var(--surface-transparent-primary);
-                ${_styledcomponents.timePickerTokens.labelColorReadOnly}: var(--text-secondary);
-                ${_styledcomponents.timePickerTokens.leftHelperColorReadOnly}: var(--text-secondary);
+                ${_styledcomponents.timePickerTokens.backgroundReadOnly}: ${_plasma_b2c.surfaceTransparentPrimary};
+                ${_styledcomponents.timePickerTokens.labelColorReadOnly}: ${_plasma_b2c.textSecondary};
+                ${_styledcomponents.timePickerTokens.leftHelperColorReadOnly}: ${_plasma_b2c.textSecondary};
 
-                ${_styledcomponents.timePickerTokens.textFieldColorReadOnly}: var(--text-secondary);
-                ${_styledcomponents.timePickerTokens.textFieldBackgroundColorReadOnly}: var(--surface-transparent-primary);
-                ${_styledcomponents.timePickerTokens.textFieldPlaceholderColorReadOnly}: var(--text-secondary);
+                ${_styledcomponents.timePickerTokens.textFieldColorReadOnly}: ${_plasma_b2c.textSecondary};
+                ${_styledcomponents.timePickerTokens.textFieldBackgroundColorReadOnly}: ${_plasma_b2c.surfaceTransparentPrimary};
+                ${_styledcomponents.timePickerTokens.textFieldPlaceholderColorReadOnly}: ${_plasma_b2c.textSecondary};
             `
         }
     }