genesys-spark 4.80.0 → 4.80.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/css/flare/global.css +744 -664
  2. package/dist/css/flare/global.css.map +1 -1
  3. package/dist/css/flare/ui.css +1242 -436
  4. package/dist/css/flare/ui.css.map +1 -1
  5. package/dist/css/legacy/global.css +380 -339
  6. package/dist/css/legacy/global.css.map +1 -1
  7. package/dist/css/legacy/ui.css +632 -229
  8. package/dist/css/legacy/ui.css.map +1 -1
  9. package/dist/index.js +2 -2
  10. package/package.json +1 -1
package/dist/css/flare/ui.css CHANGED
@@ -1,12 +1,25 @@
1
1
  :root {
2
- --gse-ui-color-focus: #7b88f7; /* Created to support the legacy border focus token */
3
- --gse-ui-formControl-input-contentText: 400 12px/18px "Noto Sans";
4
- --gse-ui-formControl-input-default-border: 1px solid #a3a7b0;
5
- --gse-ui-formControl-input-hover-border: 1px solid #3742a2;
6
- --gse-ui-formControl-input-active-border: 1px solid #252e78;
7
- --gse-ui-formControl-input-error-border: 1px solid #e22245;
8
- --gse-ui-formControl-input-disabled-border: 1px solid #a3a7b0;
9
- --gse-ui-formControl-input-disabled-opacity: 0.5;
2
+ --gse-ui-color-focus: #7b88f7;
3
+ --gse-ui-formControl-input-contentText-fontFamily: "Noto Sans";
4
+ --gse-ui-formControl-input-contentText-fontWeight: 400;
5
+ --gse-ui-formControl-input-contentText-fontSize: 12px;
6
+ --gse-ui-formControl-input-contentText-lineHeight: 18px;
7
+ --gse-ui-formControl-input-default-border-color: #a3a7b0;
8
+ --gse-ui-formControl-input-default-border-width: 1px;
9
+ --gse-ui-formControl-input-default-border-style: solid;
10
+ --gse-ui-formControl-input-hover-border-color: #3742a2;
11
+ --gse-ui-formControl-input-hover-border-width: 1px;
12
+ --gse-ui-formControl-input-hover-border-style: solid;
13
+ --gse-ui-formControl-input-active-border-color: #252e78;
14
+ --gse-ui-formControl-input-active-border-width: 1px;
15
+ --gse-ui-formControl-input-active-border-style: solid;
16
+ --gse-ui-formControl-input-error-border-color: #e22245;
17
+ --gse-ui-formControl-input-error-border-width: 1px;
18
+ --gse-ui-formControl-input-error-border-style: solid;
19
+ --gse-ui-formControl-input-disabled-border-color: #a3a7b0;
20
+ --gse-ui-formControl-input-disabled-border-width: 1px;
21
+ --gse-ui-formControl-input-disabled-border-style: solid;
22
+ --gse-ui-formControl-input-disabled-opacity: .5;
10
23
  --gse-ui-formControl-input-borderRadius: 4px;
11
24
  --gse-ui-formControl-input-backgroundColor: #ffffff;
12
25
  --gse-ui-formControl-input-placeholderColor: #626e84;
@@ -17,7 +30,10 @@
17
30
  --gse-ui-formControl-input-gap: 12px;
18
31
  --gse-ui-formControl-input-top: 8px;
19
32
  --gse-ui-formControl-input-padding: 8px 12px;
20
- --gse-ui-formControl-input-prefixSufix-text: 700 14px/20px "Noto Sans";
33
+ --gse-ui-formControl-input-prefixSufix-text-fontFamily: "Noto Sans";
34
+ --gse-ui-formControl-input-prefixSufix-text-fontWeight: 700;
35
+ --gse-ui-formControl-input-prefixSufix-text-fontSize: 14px;
36
+ --gse-ui-formControl-input-prefixSufix-text-lineHeight: 20px;
21
37
  --gse-ui-formControl-input-prefixSufix-height: 32px;
22
38
  --gse-ui-formControl-input-prefixSufix-defaultColor: #626e84;
23
39
  --gse-ui-formControl-input-textfield-height: 32px;
@@ -28,14 +44,25 @@
28
44
  --gse-ui-formControl-input-inputIcon-iconEndColor: #626e84;
29
45
  --gse-ui-formControl-input-focusRing-defaultColor: #7b88f7;
30
46
  --gse-ui-formControl-input-textarea-height: 98px;
31
- --gse-ui-formControl-input-focus-border: 2px solid #7b88f7;
47
+ --gse-ui-formControl-input-focus-border-color: #7b88f7;
48
+ --gse-ui-formControl-input-focus-border-width: 2px;
49
+ --gse-ui-formControl-input-focus-border-style: solid;
32
50
  --gse-ui-formControl-input-spinbuttonIcon-size: 16px;
33
51
  --gse-ui-formControl-input-focusSelection-backgroundColor: #7b88f7;
34
52
  --gse-ui-formControl-label-padding: 0 0 8px 0;
35
- --gse-ui-formControl-label-text: 400 12px/18px "Noto Sans";
36
- --gse-ui-formControl-label-textBold: 600 12px/18px "Noto Sans";
53
+ --gse-ui-formControl-label-text-fontFamily: "Noto Sans";
54
+ --gse-ui-formControl-label-text-fontWeight: 400;
55
+ --gse-ui-formControl-label-text-fontSize: 12px;
56
+ --gse-ui-formControl-label-text-lineHeight: 18px;
57
+ --gse-ui-formControl-label-textBold-fontFamily: "Noto Sans";
58
+ --gse-ui-formControl-label-textBold-fontWeight: 600;
59
+ --gse-ui-formControl-label-textBold-fontSize: 12px;
60
+ --gse-ui-formControl-label-textBold-lineHeight: 18px;
37
61
  --gse-ui-formControl-label-labelColor: #1b2c48;
38
- --gse-ui-formControl-label-indicator-text: 400 12px/18px "Noto Sans";
62
+ --gse-ui-formControl-label-indicator-text-fontFamily: "Noto Sans";
63
+ --gse-ui-formControl-label-indicator-text-fontWeight: 400;
64
+ --gse-ui-formControl-label-indicator-text-fontSize: 12px;
65
+ --gse-ui-formControl-label-indicator-text-lineHeight: 18px;
39
66
  --gse-ui-formControl-label-indicator-requiredColor: #e22245;
40
67
  --gse-ui-formControl-label-indicator-optionalColor: #3e5374;
41
68
  --gse-ui-formControl-label-iconSize: 16px;
@@ -44,7 +71,10 @@
44
71
  --gse-ui-formControl-formField-gap: 4px;
45
72
  --gse-ui-formControl-group-gapItems: 8px;
46
73
  --gse-ui-formControl-helper-gap: 4px;
47
- --gse-ui-formControl-helper-helperText: 400 12px/18px "Noto Sans";
74
+ --gse-ui-formControl-helper-helperText-fontFamily: "Noto Sans";
75
+ --gse-ui-formControl-helper-helperText-fontWeight: 400;
76
+ --gse-ui-formControl-helper-helperText-fontSize: 12px;
77
+ --gse-ui-formControl-helper-helperText-lineHeight: 18px;
48
78
  --gse-ui-formControl-helper-padding: 8px 0 0 0;
49
79
  --gse-ui-formControl-helper-icon-padding: 1px 0 1px 0;
50
80
  --gse-ui-formControl-helper-paddingSmall: 4px 0 0 0;
@@ -60,100 +90,129 @@
60
90
  --gse-ui-card-backgroundColor: #ffffff;
61
91
  --gse-ui-card-borderRadius: 16px;
62
92
  --gse-ui-card-borderRadiusCopy: 16px;
63
- --gse-ui-card-default-border: 1px solid #c6c8ce;
64
- --gse-ui-card-raised-border: 1px solid #c6c8ce;
65
- --gse-ui-card-raised-boxShadow: 0 0 6px 1px rgba(35,57,92,0.12);
93
+ --gse-ui-card-default-border-color: #c6c8ce;
94
+ --gse-ui-card-default-border-width: 1px;
95
+ --gse-ui-card-default-border-style: solid;
96
+ --gse-ui-card-raised-border-color: #c6c8ce;
97
+ --gse-ui-card-raised-border-width: 1px;
98
+ --gse-ui-card-raised-border-style: solid;
99
+ --gse-ui-card-raised-boxShadow-blur: 6px;
100
+ --gse-ui-card-raised-boxShadow-spread: 1px;
101
+ --gse-ui-card-raised-boxShadow-color: rgba(35, 57, 92, 0.12);
102
+ --gse-ui-card-raised-boxShadow-type: dropShadow;
103
+ --gse-ui-card-raised-boxShadow-offsetX: 0;
104
+ --gse-ui-card-raised-boxShadow-offsetY: 0;
66
105
  --gse-ui-card-padding: 24px;
67
- --gse-ui-card-borderless-border: 1px solid transparent;
68
- --gse-ui-tooltip-light-border: 1px solid #c6c8ce;
106
+ --gse-ui-card-borderless-border-color: rgba(0, 0, 0, 0);
107
+ --gse-ui-card-borderless-border-width: 1px;
108
+ --gse-ui-card-borderless-border-style: solid;
109
+ --gse-ui-tooltip-light-border-color: #c6c8ce;
110
+ --gse-ui-tooltip-light-border-width: 1px;
111
+ --gse-ui-tooltip-light-border-style: solid;
69
112
  --gse-ui-tooltip-light-backgroundColor: #ffffff;
70
113
  --gse-ui-tooltip-light-foregroundColor: #1b2c48;
71
- --gse-ui-tooltip-dark-border: 1px solid #1b2c48;
114
+ --gse-ui-tooltip-dark-border-color: #1b2c48;
115
+ --gse-ui-tooltip-dark-border-width: 1px;
116
+ --gse-ui-tooltip-dark-border-style: solid;
72
117
  --gse-ui-tooltip-dark-backgroundColor: #1b2c48;
73
118
  --gse-ui-tooltip-dark-foregroundColor: #ffffff;
74
119
  --gse-ui-tooltip-dark-iconColor: #ffffff;
75
- --gse-ui-tooltip-boxShadow: 0 0 6px 1px rgba(35,57,92,0.12);
120
+ --gse-ui-tooltip-boxShadow-blur: 6px;
121
+ --gse-ui-tooltip-boxShadow-spread: 1px;
122
+ --gse-ui-tooltip-boxShadow-color: rgba(35, 57, 92, 0.12);
123
+ --gse-ui-tooltip-boxShadow-type: dropShadow;
124
+ --gse-ui-tooltip-boxShadow-offsetX: 0;
125
+ --gse-ui-tooltip-boxShadow-offsetY: 0;
76
126
  --gse-ui-tooltip-padding: 8px 12px;
77
127
  --gse-ui-tooltip-height: 32px;
78
128
  --gse-ui-tooltip-gap: 8px;
79
129
  --gse-ui-tooltip-borderRadius: 4px;
80
- --gse-ui-tooltip-text: 400 12px/18px "Noto Sans";
130
+ --gse-ui-tooltip-text-fontFamily: "Noto Sans";
131
+ --gse-ui-tooltip-text-fontWeight: 400;
132
+ --gse-ui-tooltip-text-fontSize: 12px;
133
+ --gse-ui-tooltip-text-lineHeight: 18px;
81
134
  --gse-ui-tag-borderRadius: 16px;
82
- --gse-ui-tag-default-backgroundColor: #23395d; /* To be deprecated in V5 */
83
- --gse-ui-tag-default-foregroundColor: #ffffff; /* To be deprecated in V5 */
135
+ --gse-ui-tag-default-backgroundColor: #23395d;
136
+ --gse-ui-tag-default-foregroundColor: #ffffff;
84
137
  --gse-ui-tag-default-bold-backgroundColor: #3e5374;
85
138
  --gse-ui-tag-default-bold-foregroundColor: #ffffff;
86
139
  --gse-ui-tag-default-subtle-backgroundColor: #c6c8ce;
87
140
  --gse-ui-tag-default-subtle-foregroundColor: #1b2c48;
88
- --gse-ui-tag-accent1-backgroundColor: #e4e5e7; /* To be deprecated in V5 */
89
- --gse-ui-tag-accent1-foregroundColor: #1b2c48; /* To be deprecated in V5 */
141
+ --gse-ui-tag-accent1-backgroundColor: #e4e5e7;
142
+ --gse-ui-tag-accent1-foregroundColor: #1b2c48;
90
143
  --gse-ui-tag-accent1-bold-backgroundColor: #626d97;
91
144
  --gse-ui-tag-accent1-bold-foregroundColor: #ffffff;
92
145
  --gse-ui-tag-accent1-subtle-backgroundColor: #d1d7ef;
93
146
  --gse-ui-tag-accent1-subtle-foregroundColor: #1b2c48;
94
- --gse-ui-tag-accent2-backgroundColor: #90d3dd; /* To be deprecated in V5 */
95
- --gse-ui-tag-accent2-foregroundColor: #1b2c48; /* To be deprecated in V5 */
147
+ --gse-ui-tag-accent2-backgroundColor: #90d3dd;
148
+ --gse-ui-tag-accent2-foregroundColor: #1b2c48;
96
149
  --gse-ui-tag-accent2-bold-backgroundColor: #3ac49a;
97
150
  --gse-ui-tag-accent2-bold-foregroundColor: #1b2c48;
98
151
  --gse-ui-tag-accent2-subtle-backgroundColor: #9de1cd;
99
152
  --gse-ui-tag-accent2-subtle-foregroundColor: #1b2c48;
100
- --gse-ui-tag-accent3-backgroundColor: #0c6d7e; /* To be deprecated in V5 */
101
- --gse-ui-tag-accent3-foregroundColor: #ffffff; /* To be deprecated in V5 */
153
+ --gse-ui-tag-accent3-backgroundColor: #0c6d7e;
154
+ --gse-ui-tag-accent3-foregroundColor: #ffffff;
102
155
  --gse-ui-tag-accent3-bold-backgroundColor: #0c6d7e;
103
156
  --gse-ui-tag-accent3-bold-foregroundColor: #ffffff;
104
157
  --gse-ui-tag-accent3-subtle-backgroundColor: #90d3dd;
105
158
  --gse-ui-tag-accent3-subtle-foregroundColor: #1b2c48;
106
- --gse-ui-tag-accent4-backgroundColor: #547688; /* To be deprecated in V5 */
107
- --gse-ui-tag-accent4-foregroundColor: #ffffff; /* To be deprecated in V5 */
159
+ --gse-ui-tag-accent4-backgroundColor: #547688;
160
+ --gse-ui-tag-accent4-foregroundColor: #ffffff;
108
161
  --gse-ui-tag-accent4-bold-backgroundColor: #607732;
109
162
  --gse-ui-tag-accent4-bold-foregroundColor: #ffffff;
110
163
  --gse-ui-tag-accent4-subtle-backgroundColor: #c6dd98;
111
164
  --gse-ui-tag-accent4-subtle-foregroundColor: #1b2c48;
112
- --gse-ui-tag-accent5-backgroundColor: #a5cae0; /* To be deprecated in V5 */
113
- --gse-ui-tag-accent5-foregroundColor: #1b2c48; /* To be deprecated in V5 */
165
+ --gse-ui-tag-accent5-backgroundColor: #a5cae0;
166
+ --gse-ui-tag-accent5-foregroundColor: #1b2c48;
114
167
  --gse-ui-tag-accent5-bold-backgroundColor: #5798d9;
115
168
  --gse-ui-tag-accent5-bold-foregroundColor: #1b2c48;
116
169
  --gse-ui-tag-accent5-subtle-backgroundColor: #9ac1e8;
117
170
  --gse-ui-tag-accent5-subtle-foregroundColor: #1b2c48;
118
- --gse-ui-tag-accent6-backgroundColor: #b5bfe6; /* To be deprecated in V5 */
119
- --gse-ui-tag-accent6-foregroundColor: #1b2c48; /* To be deprecated in V5 */
171
+ --gse-ui-tag-accent6-backgroundColor: #b5bfe6;
172
+ --gse-ui-tag-accent6-foregroundColor: #1b2c48;
120
173
  --gse-ui-tag-accent6-subtle-backgroundColor: #cdacff;
121
174
  --gse-ui-tag-accent6-subtle-foregroundColor: #1b2c48;
122
175
  --gse-ui-tag-accent6-bold-backgroundColor: #8a5ecc;
123
176
  --gse-ui-tag-accent6-bold-foregroundColor: #ffffff;
124
- --gse-ui-tag-text: 600 14px/20px "Noto Sans";
177
+ --gse-ui-tag-text-fontFamily: "Noto Sans";
178
+ --gse-ui-tag-text-fontWeight: 600;
179
+ --gse-ui-tag-text-fontSize: 14px;
180
+ --gse-ui-tag-text-lineHeight: 20px;
125
181
  --gse-ui-tag-padding: 0 12px;
126
182
  --gse-ui-tag-removable-padding: 0 8px 0 12px;
127
183
  --gse-ui-tag-removable-gap: 4px;
128
- --gse-ui-tag-accent7-backgroundColor: #a05195; /* To be deprecated in V5 */
129
- --gse-ui-tag-accent7-foregroundColor: #ffffff; /* To be deprecated in V5 */
184
+ --gse-ui-tag-accent7-backgroundColor: #a05195;
185
+ --gse-ui-tag-accent7-foregroundColor: #ffffff;
130
186
  --gse-ui-tag-accent7-bold-backgroundColor: #89387b;
131
187
  --gse-ui-tag-accent7-bold-foregroundColor: #ffffff;
132
188
  --gse-ui-tag-accent7-subtle-backgroundColor: #ef9ee1;
133
189
  --gse-ui-tag-accent7-subtle-foregroundColor: #1b2c48;
134
190
  --gse-ui-tag-height: 20px;
135
- --gse-ui-tag-accent8-backgroundColor: #f95d6a; /* To be deprecated in V5 */
136
- --gse-ui-tag-accent8-foregroundColor: #1b2c48; /* To be deprecated in V5 */
191
+ --gse-ui-tag-accent8-backgroundColor: #f95d6a;
192
+ --gse-ui-tag-accent8-foregroundColor: #1b2c48;
137
193
  --gse-ui-tag-accent8-bold-backgroundColor: #ff5c77;
138
194
  --gse-ui-tag-accent8-bold-foregroundColor: #1b2c48;
139
195
  --gse-ui-tag-accent8-subtle-backgroundColor: #ff9dad;
140
196
  --gse-ui-tag-accent8-subtle-foregroundColor: #1b2c48;
141
- --gse-ui-tag-accent9-backgroundColor: #fe8f85; /* To be deprecated in V5 */
142
- --gse-ui-tag-accent9-foregroundColor: #1b2c48; /* To be deprecated in V5 */
197
+ --gse-ui-tag-accent9-backgroundColor: #fe8f85;
198
+ --gse-ui-tag-accent9-foregroundColor: #1b2c48;
143
199
  --gse-ui-tag-accent9-bold-backgroundColor: #c44b3b;
144
200
  --gse-ui-tag-accent9-bold-foregroundColor: #ffffff;
145
201
  --gse-ui-tag-accent9-subtle-backgroundColor: #feb2ab;
146
202
  --gse-ui-tag-accent9-subtle-foregroundColor: #1b2c48;
147
- --gse-ui-tag-accent10-backgroundColor: #ffc650; /* To be deprecated in V5 */
148
- --gse-ui-tag-accent10-foregroundColor: #1b2c48; /* To be deprecated in V5 */
203
+ --gse-ui-tag-accent10-backgroundColor: #ffc650;
204
+ --gse-ui-tag-accent10-foregroundColor: #1b2c48;
149
205
  --gse-ui-tag-accent10-bold-backgroundColor: #ffc650;
150
206
  --gse-ui-tag-accent10-bold-foregroundColor: #1b2c48;
151
207
  --gse-ui-tag-accent10-subtle-backgroundColor: #ffdd96;
152
208
  --gse-ui-tag-accent10-subtle-foregroundColor: #1b2c48;
153
209
  --gse-ui-tag-button-size: 16px;
154
- --gse-ui-tag-disabled-opacity: 0.5;
210
+ --gse-ui-tag-disabled-opacity: .5;
155
211
  --gse-ui-badge-borderRadius: 16px;
156
- --gse-ui-badge-text: 600 12px/18px "Noto Sans";
212
+ --gse-ui-badge-text-fontFamily: "Noto Sans";
213
+ --gse-ui-badge-text-fontWeight: 600;
214
+ --gse-ui-badge-text-fontSize: 12px;
215
+ --gse-ui-badge-text-lineHeight: 18px;
157
216
  --gse-ui-badge-height: 20px;
158
217
  --gse-ui-badge-padding: 2px 12px;
159
218
  --gse-ui-badge-gap: 4px;
@@ -182,43 +241,63 @@
182
241
  --gse-ui-alert-info-backgroundColor: #e2dff8;
183
242
  --gse-ui-alert-info-foregroundColor: #1b2c48;
184
243
  --gse-ui-alert-info-iconColor: #6e5ddb;
185
- --gse-ui-alert-info-border: 1px solid #c5bef1;
244
+ --gse-ui-alert-info-border-color: #c5bef1;
245
+ --gse-ui-alert-info-border-width: 1px;
246
+ --gse-ui-alert-info-border-style: solid;
186
247
  --gse-ui-alert-success-backgroundColor: #cef0e6;
187
248
  --gse-ui-alert-success-foregroundColor: #1b2c48;
188
249
  --gse-ui-alert-success-iconColor: #09b581;
189
- --gse-ui-alert-success-border: 1px solid #9de1cd;
250
+ --gse-ui-alert-success-border-color: #9de1cd;
251
+ --gse-ui-alert-success-border-width: 1px;
252
+ --gse-ui-alert-success-border-style: solid;
190
253
  --gse-ui-alert-warning-backgroundColor: #fef4d8;
191
254
  --gse-ui-alert-warning-foregroundColor: #1b2c48;
192
255
  --gse-ui-alert-warning-iconColor: #f8c73e;
193
- --gse-ui-alert-warning-border: 1px solid #fce9b2;
256
+ --gse-ui-alert-warning-border-color: #fce9b2;
257
+ --gse-ui-alert-warning-border-width: 1px;
258
+ --gse-ui-alert-warning-border-style: solid;
194
259
  --gse-ui-alert-error-backgroundColor: #f9d3da;
195
260
  --gse-ui-alert-error-foregroundColor: #1b2c48;
196
261
  --gse-ui-alert-error-iconColor: #e22245;
197
- --gse-ui-alert-error-border: 1px solid #f3a7b5;
198
- --gse-ui-alert-text: 400 12px/18px "Noto Sans";
199
- --gse-ui-alert-emphasisText: 700 12px/18px "Noto Sans";
262
+ --gse-ui-alert-error-border-color: #f3a7b5;
263
+ --gse-ui-alert-error-border-width: 1px;
264
+ --gse-ui-alert-error-border-style: solid;
265
+ --gse-ui-alert-text-fontFamily: "Noto Sans";
266
+ --gse-ui-alert-text-fontWeight: 400;
267
+ --gse-ui-alert-text-fontSize: 12px;
268
+ --gse-ui-alert-text-lineHeight: 18px;
269
+ --gse-ui-alert-emphasisText-fontFamily: "Noto Sans";
270
+ --gse-ui-alert-emphasisText-fontWeight: 700;
271
+ --gse-ui-alert-emphasisText-fontSize: 12px;
272
+ --gse-ui-alert-emphasisText-lineHeight: 18px;
200
273
  --gse-ui-alert-borderRadius: 4px;
201
274
  --gse-ui-rating-default-color: #767c8d;
202
275
  --gse-ui-rating-active-color: #4856cb;
203
276
  --gse-ui-rating-hover-color: #3742a2;
204
277
  --gse-ui-rating-disabled-color: #767c8d;
205
- --gse-ui-rating-disabled-opacity: 0.5;
278
+ --gse-ui-rating-disabled-opacity: .5;
206
279
  --gse-ui-rating-size: 16px;
207
280
  --gse-ui-rating-star-gap: 8px;
208
281
  --gse-ui-breadcrumbs-primary-height: 20px;
209
282
  --gse-ui-breadcrumbs-primary-separator-padding: 0 12px;
210
- --gse-ui-breadcrumbs-primary-separator-typography: 700 14px/20px "Noto Sans";
283
+ --gse-ui-breadcrumbs-primary-separator-typography-fontFamily: "Noto Sans";
284
+ --gse-ui-breadcrumbs-primary-separator-typography-fontWeight: 700;
285
+ --gse-ui-breadcrumbs-primary-separator-typography-fontSize: 14px;
286
+ --gse-ui-breadcrumbs-primary-separator-typography-lineHeight: 20px;
211
287
  --gse-ui-breadcrumbs-secondary-height: 16px;
212
288
  --gse-ui-breadcrumbs-secondary-separator-padding: 0 8px;
213
- --gse-ui-breadcrumbs-secondary-separator-typography: 700 14px/20px "Noto Sans";
289
+ --gse-ui-breadcrumbs-secondary-separator-typography-fontFamily: "Noto Sans";
290
+ --gse-ui-breadcrumbs-secondary-separator-typography-fontWeight: 700;
291
+ --gse-ui-breadcrumbs-secondary-separator-typography-fontSize: 14px;
292
+ --gse-ui-breadcrumbs-secondary-separator-typography-lineHeight: 20px;
214
293
  --gse-ui-breadcrumbs-separator-color: #c6c8ce;
215
- --gse-ui-breadcrumbs-borderRadius: 0rem;
294
+ --gse-ui-breadcrumbs-borderRadius: 0;
216
295
  --gse-ui-segmentedControl-button-padding: 0 12px;
217
296
  --gse-ui-segmentedControl-button-gap: 8px;
218
297
  --gse-ui-segmentedControl-button-start-borderRadius: 4px 0 0 4px;
219
- --gse-ui-segmentedControl-button-middle-borderRadius: 0rem;
298
+ --gse-ui-segmentedControl-button-middle-borderRadius: 0;
220
299
  --gse-ui-segmentedControl-button-end-borderRadius: 0 4px 4px 0;
221
- --gse-ui-segmentedControl-button-disabled-opacity: 0.5;
300
+ --gse-ui-segmentedControl-button-disabled-opacity: .5;
222
301
  --gse-ui-segmentedControl-button-disabled-backgroundColor: rgba(0, 0, 0, 0);
223
302
  --gse-ui-segmentedControl-button-disabled-foregroundColor: #4856cb;
224
303
  --gse-ui-segmentedControl-button-default-backgroundColor: rgba(0, 0, 0, 0);
@@ -229,34 +308,46 @@
229
308
  --gse-ui-segmentedControl-button-active-foregroundColor: #ffffff;
230
309
  --gse-ui-segmentedControl-borderRadius: 4px;
231
310
  --gse-ui-segmentedControl-height: 32px;
232
- --gse-ui-segmentedControl-border: 1px solid #4856cb;
233
- --gse-ui-segmentedControl-divider: 1px solid #4856cb;
311
+ --gse-ui-segmentedControl-border-color: #4856cb;
312
+ --gse-ui-segmentedControl-border-width: 1px;
313
+ --gse-ui-segmentedControl-border-style: solid;
314
+ --gse-ui-segmentedControl-divider-color: #4856cb;
315
+ --gse-ui-segmentedControl-divider-width: 1px;
316
+ --gse-ui-segmentedControl-divider-style: solid;
234
317
  --gse-ui-segmentedControl-iconOnly-padding: 0 8px;
235
- --gse-ui-segmentedControl-focus-offset: 0rem;
236
- --gse-ui-formFooter-page-desktop-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
237
- --gse-ui-formFooter-page-desktop-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
238
- --gse-ui-formFooter-page-desktop-horizontalPadding: 32px; /* The recommended vertical padding for the form footer content. */
239
- --gse-ui-formFooter-page-desktop-gap: 16px; /* The recommended vertical padding for the form footer content. */
240
- --gse-ui-formFooter-page-mobile-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
241
- --gse-ui-formFooter-page-mobile-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
242
- --gse-ui-formFooter-page-mobile-horizontalPadding: 16px; /* The recommended vertical padding for the form footer content. */
243
- --gse-ui-formFooter-page-mobile-gap: 16px; /* The recommended vertical padding for the form footer content. */
244
- --gse-ui-formFooter-separator: 1px solid #c6c8ce; /* This is the recommended style for the form fotter separator/divider. */
245
- --gse-ui-formFooter-sideSheet-desktop-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
246
- --gse-ui-formFooter-sideSheet-desktop-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
247
- --gse-ui-formFooter-sideSheet-desktop-horizontalPadding: 24px; /* The recommended vertical padding for the form footer content. */
248
- --gse-ui-formFooter-sideSheet-desktop-gap: 16px; /* The recommended vertical padding for the form footer content. */
249
- --gse-ui-formFooter-modal-desktop-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
250
- --gse-ui-formFooter-modal-desktop-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
251
- --gse-ui-formFooter-modal-desktop-horizontalPadding: 32px; /* The recommended vertical padding for the form footer content. */
252
- --gse-ui-formFooter-modal-desktop-gap: 16px; /* The recommended vertical padding for the form footer content. */
318
+ --gse-ui-segmentedControl-focus-offset: 0;
319
+ --gse-ui-formFooter-page-desktop-bottomPadding: 16px;
320
+ --gse-ui-formFooter-page-desktop-topPadding: 16px;
321
+ --gse-ui-formFooter-page-desktop-horizontalPadding: 32px;
322
+ --gse-ui-formFooter-page-desktop-gap: 16px;
323
+ --gse-ui-formFooter-page-mobile-bottomPadding: 16px;
324
+ --gse-ui-formFooter-page-mobile-topPadding: 16px;
325
+ --gse-ui-formFooter-page-mobile-horizontalPadding: 16px;
326
+ --gse-ui-formFooter-page-mobile-gap: 16px;
327
+ --gse-ui-formFooter-separator-color: #c6c8ce;
328
+ --gse-ui-formFooter-separator-width: 1px;
329
+ --gse-ui-formFooter-separator-style: solid;
330
+ --gse-ui-formFooter-sideSheet-desktop-bottomPadding: 16px;
331
+ --gse-ui-formFooter-sideSheet-desktop-topPadding: 16px;
332
+ --gse-ui-formFooter-sideSheet-desktop-horizontalPadding: 24px;
333
+ --gse-ui-formFooter-sideSheet-desktop-gap: 16px;
334
+ --gse-ui-formFooter-modal-desktop-bottomPadding: 16px;
335
+ --gse-ui-formFooter-modal-desktop-topPadding: 16px;
336
+ --gse-ui-formFooter-modal-desktop-horizontalPadding: 32px;
337
+ --gse-ui-formFooter-modal-desktop-gap: 16px;
253
338
  --gse-ui-formFooter-backgroundColor: #ffffff;
254
- --gse-ui-formFooter-border: 1px solid #3742a2;
339
+ --gse-ui-formFooter-border-color: #3742a2;
340
+ --gse-ui-formFooter-border-width: 1px;
341
+ --gse-ui-formFooter-border-style: solid;
255
342
  --gse-ui-copyToClipboard-label-active-backgroundColor: #ced2fc;
256
343
  --gse-ui-copyToClipboard-label-foregroundColor: #1b2c48;
257
344
  --gse-ui-copyToClipboard-label-padding: 2px 4px;
258
345
  --gse-ui-copyToClipboard-label-borderRadius: 4px;
259
- --gse-ui-copyToClipboard-label-text: 600 14px/20px "Noto Sans";
346
+ --gse-ui-copyToClipboard-label-text-fontFamily: "Noto Sans";
347
+ --gse-ui-copyToClipboard-label-text-fontWeight: 600;
348
+ --gse-ui-copyToClipboard-label-text-fontSize: 14px;
349
+ --gse-ui-copyToClipboard-label-text-lineHeight: 20px;
350
+ --gse-ui-copyToClipboard-label-text-textDecoration: underline;
260
351
  --gse-ui-copyToClipboard-gap: 8px;
261
352
  --gse-ui-copyToClipboard-contentContainer-gap: 4px;
262
353
  --gse-ui-copyToClipboard-iconContainer-padding: 4px;
@@ -286,7 +377,9 @@
286
377
  --gse-ui-button-secondary-active-foregroundColor: #252e78;
287
378
  --gse-ui-button-tertiary-default-backgroundColor: rgba(0, 0, 0, 0);
288
379
  --gse-ui-button-tertiary-default-foregroundColor: #4856cb;
289
- --gse-ui-button-tertiary-default-border: 1px solid #4856cb;
380
+ --gse-ui-button-tertiary-default-border-color: #4856cb;
381
+ --gse-ui-button-tertiary-default-border-width: 1px;
382
+ --gse-ui-button-tertiary-default-border-style: solid;
290
383
  --gse-ui-button-tertiary-hover-backgroundColor: #3742a2;
291
384
  --gse-ui-button-tertiary-hover-foregroundColor: #ffffff;
292
385
  --gse-ui-button-tertiary-active-backgroundColor: #252e78;
@@ -304,8 +397,11 @@
304
397
  --gse-ui-button-danger-active-backgroundColor: #440a15;
305
398
  --gse-ui-button-danger-active-foregroundColor: #ffffff;
306
399
  --gse-ui-button-borderRadius: 4px;
307
- --gse-ui-button-disabled-opacity: 0.5;
308
- --gse-ui-button-text: 700 12px/18px "Noto Sans";
400
+ --gse-ui-button-disabled-opacity: .5;
401
+ --gse-ui-button-text-fontFamily: "Noto Sans";
402
+ --gse-ui-button-text-fontWeight: 700;
403
+ --gse-ui-button-text-fontSize: 12px;
404
+ --gse-ui-button-text-lineHeight: 18px;
309
405
  --gse-ui-actionButton-rightSegment-size: 32px;
310
406
  --gse-ui-actionButton-rightSegment-padding: 0 8px;
311
407
  --gse-ui-actionButton-rightSegment-borderRadius: 0 4px 4px 0;
@@ -317,21 +413,50 @@
317
413
  --gse-ui-actionButton-leftSegment-focusBorderRadius: 16px 0 0 16px;
318
414
  --gse-ui-actionButton-leftSegment-borderRadius: 4px 0 0 4px;
319
415
  --gse-ui-actionButton-borderRadius: 4px;
320
- --gse-ui-actionButton-tertiary-divider: 2px solid #4856cb;
321
- --gse-ui-actionButton-primary-divider: 2px solid #ffffff;
322
- --gse-ui-actionButton-secondary-divider: 2px solid #ffffff;
323
- --gse-ui-actionButton-danger-divider: 2px solid #ffffff;
416
+ --gse-ui-actionButton-tertiary-divider-color: #4856cb;
417
+ --gse-ui-actionButton-tertiary-divider-width: 2px;
418
+ --gse-ui-actionButton-tertiary-divider-style: solid;
419
+ --gse-ui-actionButton-primary-divider-color: #ffffff;
420
+ --gse-ui-actionButton-primary-divider-width: 2px;
421
+ --gse-ui-actionButton-primary-divider-style: solid;
422
+ --gse-ui-actionButton-secondary-divider-color: #ffffff;
423
+ --gse-ui-actionButton-secondary-divider-width: 2px;
424
+ --gse-ui-actionButton-secondary-divider-style: solid;
425
+ --gse-ui-actionButton-danger-divider-color: #ffffff;
426
+ --gse-ui-actionButton-danger-divider-width: 2px;
427
+ --gse-ui-actionButton-danger-divider-style: solid;
324
428
  --gse-ui-links-asButton-height: 32px;
325
429
  --gse-ui-links-asButton-padding: 12px;
326
430
  --gse-ui-links-asButton-gap: 8px;
327
- --gse-ui-links-asButton-text: 600 14px/20px "Noto Sans";
328
- --gse-ui-links-asButton-underlinedText: 600 14px/20px "Noto Sans";
431
+ --gse-ui-links-asButton-text-fontFamily: "Noto Sans";
432
+ --gse-ui-links-asButton-text-fontWeight: 600;
433
+ --gse-ui-links-asButton-text-fontSize: 14px;
434
+ --gse-ui-links-asButton-text-lineHeight: 20px;
435
+ --gse-ui-links-asButton-underlinedText-fontFamily: "Noto Sans";
436
+ --gse-ui-links-asButton-underlinedText-fontWeight: 600;
437
+ --gse-ui-links-asButton-underlinedText-fontSize: 14px;
438
+ --gse-ui-links-asButton-underlinedText-lineHeight: 20px;
439
+ --gse-ui-links-asButton-underlinedText-textDecoration: underline;
329
440
  --gse-ui-links-inLine-medium-height: 24px;
330
- --gse-ui-links-inLine-medium-text: 600 14px/20px "Noto Sans";
331
- --gse-ui-links-inLine-medium-underlinedText: 600 14px/20px "Noto Sans";
441
+ --gse-ui-links-inLine-medium-text-fontFamily: "Noto Sans";
442
+ --gse-ui-links-inLine-medium-text-fontWeight: 600;
443
+ --gse-ui-links-inLine-medium-text-fontSize: 14px;
444
+ --gse-ui-links-inLine-medium-text-lineHeight: 20px;
445
+ --gse-ui-links-inLine-medium-underlinedText-fontFamily: "Noto Sans";
446
+ --gse-ui-links-inLine-medium-underlinedText-fontWeight: 600;
447
+ --gse-ui-links-inLine-medium-underlinedText-fontSize: 14px;
448
+ --gse-ui-links-inLine-medium-underlinedText-lineHeight: 20px;
449
+ --gse-ui-links-inLine-medium-underlinedText-textDecoration: underline;
332
450
  --gse-ui-links-inLine-small-height: 20px;
333
- --gse-ui-links-inLine-small-text: 600 12px/18px "Noto Sans";
334
- --gse-ui-links-inLine-small-underlinedText: 600 12px/18px "Noto Sans";
451
+ --gse-ui-links-inLine-small-text-fontFamily: "Noto Sans";
452
+ --gse-ui-links-inLine-small-text-fontWeight: 600;
453
+ --gse-ui-links-inLine-small-text-fontSize: 12px;
454
+ --gse-ui-links-inLine-small-text-lineHeight: 18px;
455
+ --gse-ui-links-inLine-small-underlinedText-fontFamily: "Noto Sans";
456
+ --gse-ui-links-inLine-small-underlinedText-fontWeight: 600;
457
+ --gse-ui-links-inLine-small-underlinedText-fontSize: 12px;
458
+ --gse-ui-links-inLine-small-underlinedText-lineHeight: 18px;
459
+ --gse-ui-links-inLine-small-underlinedText-textDecoration: underline;
335
460
  --gse-ui-links-inLine-padding: 4px;
336
461
  --gse-ui-links-icon: 16px;
337
462
  --gse-ui-links-default-foregroundColor: #4856cb;
@@ -339,7 +464,7 @@
339
464
  --gse-ui-links-hover-foregroundColor: #3742a2;
340
465
  --gse-ui-links-active-foregroundColor: #252e78;
341
466
  --gse-ui-links-visited-foregroundColor: #8a5ecc;
342
- --gse-ui-links-borderRadius: 0rem;
467
+ --gse-ui-links-borderRadius: 0;
343
468
  --gse-ui-radioButton-icon-default-unselectedForegroundColor: #767c8d;
344
469
  --gse-ui-radioButton-icon-default-selectedForegroundColor: #4856cb;
345
470
  --gse-ui-radioButton-icon-hover-foregroundColor: #3742a2;
@@ -348,12 +473,17 @@
348
473
  --gse-ui-radioButton-icon-height: 16px;
349
474
  --gse-ui-radioButton-icon-width: 16px;
350
475
  --gse-ui-radioButton-label-foregroundColor: #1b2c48;
351
- --gse-ui-radioButton-label-text: 400 12px/18px "Noto Sans";
476
+ --gse-ui-radioButton-label-text-fontFamily: "Noto Sans";
477
+ --gse-ui-radioButton-label-text-fontWeight: 400;
478
+ --gse-ui-radioButton-label-text-fontSize: 12px;
479
+ --gse-ui-radioButton-label-text-lineHeight: 18px;
352
480
  --gse-ui-radioButton-gap: 8px;
353
481
  --gse-ui-radioButton-helper-padding: 4px 0 0 24px;
354
482
  --gse-ui-radioButton-helper-gap: 8px;
355
- --gse-ui-radioButton-disabled-opacity: 0.5;
356
- --gse-ui-radioButton-focus-border: 2px solid #7b88f7;
483
+ --gse-ui-radioButton-disabled-opacity: .5;
484
+ --gse-ui-radioButton-focus-border-color: #7b88f7;
485
+ --gse-ui-radioButton-focus-border-width: 2px;
486
+ --gse-ui-radioButton-focus-border-style: solid;
357
487
  --gse-ui-radioButton-focus-borderRadius: 100%;
358
488
  --gse-ui-radioButton-focus-offset: 1px;
359
489
  --gse-ui-checkbox-icon-default-unselectedForegroundColor: #767c8d;
@@ -364,12 +494,17 @@
364
494
  --gse-ui-checkbox-icon-height: 16px;
365
495
  --gse-ui-checkbox-icon-width: 16px;
366
496
  --gse-ui-checkbox-label-foregroundColor: #1b2c48;
367
- --gse-ui-checkbox-label-text: 400 12px/18px "Noto Sans";
497
+ --gse-ui-checkbox-label-text-fontFamily: "Noto Sans";
498
+ --gse-ui-checkbox-label-text-fontWeight: 400;
499
+ --gse-ui-checkbox-label-text-fontSize: 12px;
500
+ --gse-ui-checkbox-label-text-lineHeight: 18px;
368
501
  --gse-ui-checkbox-helper-padding: 4px 0 0 24px;
369
502
  --gse-ui-checkbox-helper-gap: 8px;
370
503
  --gse-ui-checkbox-gap: 8px;
371
- --gse-ui-checkbox-disabled-opacity: 0.5;
372
- --gse-ui-checkbox-focus-border: 2px solid #7b88f7;
504
+ --gse-ui-checkbox-disabled-opacity: .5;
505
+ --gse-ui-checkbox-focus-border-color: #7b88f7;
506
+ --gse-ui-checkbox-focus-border-width: 2px;
507
+ --gse-ui-checkbox-focus-border-style: solid;
373
508
  --gse-ui-checkbox-focus-borderRadius: 4px;
374
509
  --gse-ui-checkbox-focus-borderRadiusSmall: 2px;
375
510
  --gse-ui-checkbox-focus-offset: 1px;
@@ -379,15 +514,24 @@
379
514
  --gse-ui-menu-option-height: 32px;
380
515
  --gse-ui-menu-option-startIcon-height: 16px;
381
516
  --gse-ui-menu-option-startIcon-width: 16px;
382
- --gse-ui-menu-option-label-default-text: 400 12px/18px "Noto Sans";
383
- --gse-ui-menu-option-label-active-text: 700 12px/18px "Noto Sans";
517
+ --gse-ui-menu-option-label-default-text-fontFamily: "Noto Sans";
518
+ --gse-ui-menu-option-label-default-text-fontWeight: 400;
519
+ --gse-ui-menu-option-label-default-text-fontSize: 12px;
520
+ --gse-ui-menu-option-label-default-text-lineHeight: 18px;
521
+ --gse-ui-menu-option-label-active-text-fontFamily: "Noto Sans";
522
+ --gse-ui-menu-option-label-active-text-fontWeight: 700;
523
+ --gse-ui-menu-option-label-active-text-fontSize: 12px;
524
+ --gse-ui-menu-option-label-active-text-lineHeight: 18px;
384
525
  --gse-ui-menu-option-label-foregroundColor: #1b2c48;
385
- --gse-ui-menu-option-shortcut-text: 400 14px/20px "Noto Sans";
526
+ --gse-ui-menu-option-shortcut-text-fontFamily: "Noto Sans";
527
+ --gse-ui-menu-option-shortcut-text-fontWeight: 400;
528
+ --gse-ui-menu-option-shortcut-text-fontSize: 14px;
529
+ --gse-ui-menu-option-shortcut-text-lineHeight: 20px;
386
530
  --gse-ui-menu-option-shortcut-default-foregroundColor: #626e84;
387
531
  --gse-ui-menu-option-shortcut-selected-foregroundColor: #1b2c48;
388
532
  --gse-ui-menu-option-hover-backgroundColor: #eff0fe;
389
533
  --gse-ui-menu-option-selected-backgroundColor: #ced2fc;
390
- --gse-ui-menu-option-disabled-opacity: 0.5;
534
+ --gse-ui-menu-option-disabled-opacity: .5;
391
535
  --gse-ui-menu-option-checkbox-unchecked-default-foregroundColor: #767c8d;
392
536
  --gse-ui-menu-option-checkbox-unchecked-hover-foregroundColor: #3742a2;
393
537
  --gse-ui-menu-option-checkbox-unchecked-selected-foregroundColor: #252e78;
@@ -399,36 +543,59 @@
399
543
  --gse-ui-menu-option-parentIcon-default-foregroundColor: #3e5374;
400
544
  --gse-ui-menu-option-parentIcon-hover-foregroundColor: #23395d;
401
545
  --gse-ui-menu-option-parentIcon-selected-foregroundColor: #1b2c48;
402
- --gse-ui-menu-option-focus-border: 1px solid #7b88f7;
546
+ --gse-ui-menu-option-focus-border-color: #7b88f7;
547
+ --gse-ui-menu-option-focus-border-width: 1px;
548
+ --gse-ui-menu-option-focus-border-style: solid;
403
549
  --gse-ui-menu-option-default-backgroundColor: #ffffff;
404
550
  --gse-ui-menu-maxHeight: 344px;
405
551
  --gse-ui-menu-borderRadius: 4px;
406
- --gse-ui-menu-border: 1px solid #c6c8ce;
407
- --gse-ui-menu-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
552
+ --gse-ui-menu-border-color: #c6c8ce;
553
+ --gse-ui-menu-border-width: 1px;
554
+ --gse-ui-menu-border-style: solid;
555
+ --gse-ui-menu-boxShadow-blur: 4px;
556
+ --gse-ui-menu-boxShadow-spread: 1px;
557
+ --gse-ui-menu-boxShadow-color: rgba(35, 57, 92, 0.1);
558
+ --gse-ui-menu-boxShadow-type: dropShadow;
559
+ --gse-ui-menu-boxShadow-offsetX: 0;
560
+ --gse-ui-menu-boxShadow-offsetY: 0;
408
561
  --gse-ui-menu-padding: 8px 1px;
409
562
  --gse-ui-menu-backgroundColor: #ffffff;
410
563
  --gse-ui-menu-scrollbar-foregroundColor: #3e5374;
411
- --gse-ui-menu-divider-backgroundColor: #c6c8ce; /* Color for the divider that separates the day picker and the time picker inside the calendar menu. */
564
+ --gse-ui-menu-divider-backgroundColor: #c6c8ce;
412
565
  --gse-ui-menu-divider-margin: 4px 0 8px 0;
413
566
  --gse-ui-menu-divider-height: 1px;
414
567
  --gse-ui-menu-groupedMenu-title-padding: 8px 12px 4px;
415
568
  --gse-ui-menu-groupedMenu-title-height: 32px;
416
569
  --gse-ui-menu-groupedMenu-title-foregroundColor: #626e84;
417
- --gse-ui-menu-groupedMenu-title-text: 600 12px/16px Urbanist;
570
+ --gse-ui-menu-groupedMenu-title-text-fontFamily: Urbanist;
571
+ --gse-ui-menu-groupedMenu-title-text-fontWeight: 600;
572
+ --gse-ui-menu-groupedMenu-title-text-fontSize: 12px;
573
+ --gse-ui-menu-groupedMenu-title-text-lineHeight: 16px;
574
+ --gse-ui-menu-groupedMenu-title-text-textCase: uppercase;
575
+ --gse-ui-menu-groupedMenu-title-text-letterSpacing: 1px;
418
576
  --gse-ui-menu-groupedMenu-padding: 8px 2px;
419
577
  --gse-ui-menu-groupedMenu-divider-padding: 4px 0px 8px;
420
578
  --gse-ui-menu-groupedMenu-divider-height: 13px;
421
579
  --gse-ui-menu-groupedMenu-subtext-foregroundColor: #626e84;
422
- --gse-ui-dropdown-menu-emptyState-header-text: 700 12px/18px Roboto;
580
+ --gse-ui-dropdown-menu-emptyState-header-text-fontFamily: Roboto;
581
+ --gse-ui-dropdown-menu-emptyState-header-text-fontWeight: 700;
582
+ --gse-ui-dropdown-menu-emptyState-header-text-lineHeight: 18px;
583
+ --gse-ui-dropdown-menu-emptyState-header-text-fontSize: 12px;
423
584
  --gse-ui-dropdown-menu-emptyState-header-foregroundColor: #23395d;
424
- --gse-ui-dropdown-menu-emptyState-subheader-text: 400 12px/18px Roboto;
585
+ --gse-ui-dropdown-menu-emptyState-subheader-text-fontFamily: Roboto;
586
+ --gse-ui-dropdown-menu-emptyState-subheader-text-fontWeight: 400;
587
+ --gse-ui-dropdown-menu-emptyState-subheader-text-lineHeight: 18px;
588
+ --gse-ui-dropdown-menu-emptyState-subheader-text-fontSize: 12px;
425
589
  --gse-ui-dropdown-menu-emptyState-subheader-foregroundColor: #626e84;
426
590
  --gse-ui-dropdown-gap: 4px;
427
591
  --gse-ui-calendarMenu-day-range-width: 16px;
428
592
  --gse-ui-calendarMenu-day-range-height: 32px;
429
593
  --gse-ui-calendarMenu-day-input-height: 32px;
430
594
  --gse-ui-calendarMenu-day-input-width: 160px;
431
- --gse-ui-calendarMenu-day-headerText: 700 12px/18px "Noto Sans";
595
+ --gse-ui-calendarMenu-day-headerText-fontFamily: "Noto Sans";
596
+ --gse-ui-calendarMenu-day-headerText-fontWeight: 700;
597
+ --gse-ui-calendarMenu-day-headerText-fontSize: 12px;
598
+ --gse-ui-calendarMenu-day-headerText-lineHeight: 18px;
432
599
  --gse-ui-calendarMenu-day-date-size: 32px;
433
600
  --gse-ui-calendarMenu-height: 234px;
434
601
  --gse-ui-calendarMenu-width: 250px;
@@ -438,11 +605,20 @@
438
605
  --gse-ui-calendarMenu-month-single-header-height: 48px;
439
606
  --gse-ui-calendarMenu-month-monthCell-width: 66px;
440
607
  --gse-ui-calendarMenu-month-monthCell-height: 48px;
441
- --gse-ui-calendarMenu-month-headerText: 400 16px/24px "Noto Sans";
608
+ --gse-ui-calendarMenu-month-headerText-fontFamily: "Noto Sans";
609
+ --gse-ui-calendarMenu-month-headerText-fontWeight: 400;
610
+ --gse-ui-calendarMenu-month-headerText-fontSize: 16px;
611
+ --gse-ui-calendarMenu-month-headerText-lineHeight: 24px;
442
612
  --gse-ui-calendarMenu-month-range-vertical-width: 272px;
443
613
  --gse-ui-calendarMenu-month-range-vertical-height: 652px;
444
- --gse-ui-calendarMenu-month-defaultText: 400 12px/18px "Noto Sans";
445
- --gse-ui-calendarMenu-month-currentText: 700 12px/18px "Noto Sans";
614
+ --gse-ui-calendarMenu-month-defaultText-fontFamily: "Noto Sans";
615
+ --gse-ui-calendarMenu-month-defaultText-fontWeight: 400;
616
+ --gse-ui-calendarMenu-month-defaultText-fontSize: 12px;
617
+ --gse-ui-calendarMenu-month-defaultText-lineHeight: 18px;
618
+ --gse-ui-calendarMenu-month-currentText-fontFamily: "Noto Sans";
619
+ --gse-ui-calendarMenu-month-currentText-fontWeight: 700;
620
+ --gse-ui-calendarMenu-month-currentText-fontSize: 12px;
621
+ --gse-ui-calendarMenu-month-currentText-lineHeight: 18px;
446
622
  --gse-ui-calendarMenu-month-focusBorderRadius: 20px;
447
623
  --gse-ui-calendarMenu-month-borderRadius: 16px;
448
624
  --gse-ui-calendarMenu-month-calendarButton-focusBorderRadius: 4px;
@@ -458,8 +634,14 @@
458
634
  --gse-ui-calendarMenu-header-padding: 12px 16px;
459
635
  --gse-ui-calendarMenu-header-arrow-padding: 8px;
460
636
  --gse-ui-calendarMenu-backgroundColor: #ffffff;
461
- --gse-ui-calendarMenu-date-defaultText: 400 12px/18px "Noto Sans";
462
- --gse-ui-calendarMenu-date-currentText: 700 12px/18px "Noto Sans";
637
+ --gse-ui-calendarMenu-date-defaultText-fontFamily: "Noto Sans";
638
+ --gse-ui-calendarMenu-date-defaultText-fontWeight: 400;
639
+ --gse-ui-calendarMenu-date-defaultText-fontSize: 12px;
640
+ --gse-ui-calendarMenu-date-defaultText-lineHeight: 18px;
641
+ --gse-ui-calendarMenu-date-currentText-fontFamily: "Noto Sans";
642
+ --gse-ui-calendarMenu-date-currentText-fontWeight: 700;
643
+ --gse-ui-calendarMenu-date-currentText-fontSize: 12px;
644
+ --gse-ui-calendarMenu-date-currentText-lineHeight: 18px;
463
645
  --gse-ui-calendarMenu-date-selected-foregroundColor: #ffffff;
464
646
  --gse-ui-calendarMenu-date-selected-backgroundColor: #4856cb;
465
647
  --gse-ui-calendarMenu-date-selected-hoverBackgroundColor: #3742a2;
@@ -474,19 +656,27 @@
474
656
  --gse-ui-calendarMenu-range-body-secondMonth-borderRadius: 0 0 8px 0;
475
657
  --gse-ui-calendarMenu-range-date-endDate-borderRadius: 0 16px 16px 0;
476
658
  --gse-ui-calendarMenu-range-date-startDate-borderRadius: 16px 0 0 16px;
477
- --gse-ui-calendarMenu-disabled-opacity: 0.5;
659
+ --gse-ui-calendarMenu-disabled-opacity: .5;
478
660
  --gse-ui-calendarMenu-monthBody-padding: 16px 24px;
479
661
  --gse-ui-calendarMenu-monthBody-gap: 2px;
480
- --gse-ui-calendarMenu-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
662
+ --gse-ui-calendarMenu-boxShadow-blur: 4px;
663
+ --gse-ui-calendarMenu-boxShadow-spread: 1px;
664
+ --gse-ui-calendarMenu-boxShadow-color: rgba(35, 57, 92, 0.1);
665
+ --gse-ui-calendarMenu-boxShadow-type: dropShadow;
666
+ --gse-ui-calendarMenu-boxShadow-offsetX: 0;
667
+ --gse-ui-calendarMenu-boxShadow-offsetY: 0;
481
668
  --gse-ui-datePicker-range-gap: 24px;
482
669
  --gse-ui-datePicker-startEndInput-gap: 8px;
483
670
  --gse-ui-datePicker-dateTyped-gap: 10px;
484
671
  --gse-ui-datePicker-dateTyped-backgroundColor: #dee1fd;
485
- --gse-ui-datePicker-disabled-opacity: 0.5;
672
+ --gse-ui-datePicker-disabled-opacity: .5;
486
673
  --gse-ui-datePicker-focusCalendar-gap: 2px;
487
674
  --gse-ui-datePicker-iconHover: #3742a2;
488
675
  --gse-ui-datePicker-iconFocus: #3742a2;
489
- --gse-ui-toggle-label: 400 12px/18px "Noto Sans";
676
+ --gse-ui-toggle-label-fontFamily: "Noto Sans";
677
+ --gse-ui-toggle-label-fontWeight: 400;
678
+ --gse-ui-toggle-label-fontSize: 12px;
679
+ --gse-ui-toggle-label-lineHeight: 18px;
490
680
  --gse-ui-toggle-gap: 8px;
491
681
  --gse-ui-toggle-padding: 8px;
492
682
  --gse-ui-toggle-track-width: 32px;
@@ -502,32 +692,51 @@
502
692
  --gse-ui-toggle-track-borderRadius: 100%;
503
693
  --gse-ui-toggle-handle-width: 16px;
504
694
  --gse-ui-toggle-handle-height: 16px;
505
- --gse-ui-toggle-handle-hover-border: 2px solid #7b88f7;
506
- --gse-ui-toggle-handle-enabled-border: 2px solid #4856cb;
507
- --gse-ui-toggle-handle-disabled-border: 2px solid #4856cb;
508
- --gse-ui-toggle-handle-error-border: 2px solid #e22245;
695
+ --gse-ui-toggle-handle-hover-border-width: 2px;
696
+ --gse-ui-toggle-handle-hover-border-style: solid;
697
+ --gse-ui-toggle-handle-hover-border-color: #7b88f7;
698
+ --gse-ui-toggle-handle-enabled-border-width: 2px;
699
+ --gse-ui-toggle-handle-enabled-border-color: #4856cb;
700
+ --gse-ui-toggle-handle-enabled-border-style: solid;
701
+ --gse-ui-toggle-handle-disabled-border-width: 2px;
702
+ --gse-ui-toggle-handle-disabled-border-color: #4856cb;
703
+ --gse-ui-toggle-handle-disabled-border-style: solid;
704
+ --gse-ui-toggle-handle-error-border-color: #e22245;
705
+ --gse-ui-toggle-handle-error-border-width: 2px;
706
+ --gse-ui-toggle-handle-error-border-style: solid;
509
707
  --gse-ui-toggle-handle-backgroundColor: #ffffff;
510
708
  --gse-ui-toggle-handle-foregroundColor: #4856cb;
511
709
  --gse-ui-toggle-handle-borderRadius: 16px;
512
- --gse-ui-toggle-disabled-opacity: 0.5;
513
- --gse-ui-toggle-focus-border: 2px solid #7b88f7;
710
+ --gse-ui-toggle-disabled-opacity: .5;
711
+ --gse-ui-toggle-focus-border-color: #7b88f7;
712
+ --gse-ui-toggle-focus-border-width: 2px;
713
+ --gse-ui-toggle-focus-border-style: solid;
514
714
  --gse-ui-toggle-focus-borderRadius: 100%;
515
715
  --gse-ui-toggle-focus-offset: 1px;
516
716
  --gse-ui-timePicker-clock-padding: 2px;
517
717
  --gse-ui-timePicker-clockStates-defaultColor: #3e5374;
518
718
  --gse-ui-timePicker-clockStates-hoverColor: #23395d;
519
719
  --gse-ui-timePicker-clockStates-activeColor: #1b2c48;
520
- --gse-ui-timePicker-clockStates-disabledColor: lch(34.7 21.7 268 / 0.5);
521
- --gse-ui-timePicker-focusClock-border: 2px solid #7b88f7;
720
+ --gse-ui-timePicker-clockStates-disabledColor: #3e537480;
721
+ --gse-ui-timePicker-focusClock-border-color: #7b88f7;
722
+ --gse-ui-timePicker-focusClock-border-width: 2px;
723
+ --gse-ui-timePicker-focusClock-border-style: solid;
522
724
  --gse-ui-timePicker-focusClock-borderRadius: 4px;
523
- --gse-ui-timePicker-focusAmpm-border: 2px solid #7b88f7;
725
+ --gse-ui-timePicker-focusAmpm-border-color: #7b88f7;
726
+ --gse-ui-timePicker-focusAmpm-border-width: 2px;
727
+ --gse-ui-timePicker-focusAmpm-border-style: solid;
524
728
  --gse-ui-timePicker-focusAmpm-borderRadius: 4px;
525
- --gse-ui-timePicker-focusTime-border: 2px solid #7b88f7;
729
+ --gse-ui-timePicker-focusTime-border-color: #7b88f7;
730
+ --gse-ui-timePicker-focusTime-border-width: 2px;
731
+ --gse-ui-timePicker-focusTime-border-style: solid;
526
732
  --gse-ui-timePicker-focusTime-borderRadius: 4px;
527
733
  --gse-ui-timePicker-ampm-padding: 2px;
528
734
  --gse-ui-colorPicker-label-requiredSymbolColor: #e22245;
529
735
  --gse-ui-colorPicker-label-textColor: #1b2c48;
530
- --gse-ui-colorPicker-label-text: 400 12px/18px "Noto Sans";
736
+ --gse-ui-colorPicker-label-text-fontFamily: "Noto Sans";
737
+ --gse-ui-colorPicker-label-text-fontWeight: 400;
738
+ --gse-ui-colorPicker-label-text-fontSize: 12px;
739
+ --gse-ui-colorPicker-label-text-lineHeight: 18px;
531
740
  --gse-ui-colorPicker-inputContainer-backgroundColor: #ffffff;
532
741
  --gse-ui-colorPicker-inputContainer-border-defaultColor: #a3a7b0;
533
742
  --gse-ui-colorPicker-inputContainer-border-hoverColor: #3742a2;
@@ -544,8 +753,11 @@
544
753
  --gse-ui-slider-handle-active-backgroundColor: #252e78;
545
754
  --gse-ui-slider-handle-disabled-backgroundColor: #4856cb;
546
755
  --gse-ui-slider-handle-borderRadius: 100%;
547
- --gse-ui-slider-disabled-opacity: 0.5;
548
- --gse-ui-slider-label-text: 600 14px/20px "Noto Sans";
756
+ --gse-ui-slider-disabled-opacity: .5;
757
+ --gse-ui-slider-label-text-fontFamily: "Noto Sans";
758
+ --gse-ui-slider-label-text-fontWeight: 600;
759
+ --gse-ui-slider-label-text-fontSize: 14px;
760
+ --gse-ui-slider-label-text-lineHeight: 20px;
549
761
  --gse-ui-slider-label-foregroundColor: #1b2c48;
550
762
  --gse-ui-slider-bar-selected-backgroundColor: #4856cb;
551
763
  --gse-ui-slider-bar-default-backgroundColor: #c6c8ce;
@@ -583,8 +795,10 @@
583
795
  --gse-ui-monthPicker-calendarStates-defaultColor: #3e5374;
584
796
  --gse-ui-monthPicker-calendarStates-hoverColor: #23395d;
585
797
  --gse-ui-monthPicker-calendarStates-activeColor: #1b2c48;
586
- --gse-ui-monthPicker-calendarStates-disabledColor: lch(34.7 21.7 268 / 0.5);
587
- --gse-ui-monthPicker-calendarStates-focus-border: 2px solid #7b88f7;
798
+ --gse-ui-monthPicker-calendarStates-disabledColor: #3e537480;
799
+ --gse-ui-monthPicker-calendarStates-focus-border-color: #7b88f7;
800
+ --gse-ui-monthPicker-calendarStates-focus-border-width: 2px;
801
+ --gse-ui-monthPicker-calendarStates-focus-border-style: solid;
588
802
  --gse-ui-selectorCard-ilustrativeIcon-foregroundColor: #3e5374;
589
803
  --gse-ui-selectorCard-text-foregroundColor: #1b2c48;
590
804
  --gse-ui-selectorCard-default-backgroundColor: #ffffff;
@@ -596,7 +810,9 @@
596
810
  --gse-ui-selectorCard-active-selectedIndicator-foregroundColor: #252e78;
597
811
  --gse-ui-selectorCard-error-backgroundColor: #f3a7b5;
598
812
  --gse-ui-selectorCard-error-selectedIndicator-foregroundColor: #e22245;
599
- --gse-ui-selectorCard-error-border: 1px solid #e22245;
813
+ --gse-ui-selectorCard-error-border-color: #e22245;
814
+ --gse-ui-selectorCard-error-border-width: 1px;
815
+ --gse-ui-selectorCard-error-border-style: solid;
600
816
  --gse-ui-selectorCard-simple-minWidth: 108px;
601
817
  --gse-ui-selectorCard-simple-maxWidth: 316px;
602
818
  --gse-ui-selectorCard-simple-minHeight: 76px;
@@ -604,7 +820,10 @@
604
820
  --gse-ui-selectorCard-simple-padding: 12px;
605
821
  --gse-ui-selectorCard-simple-gap: 8px;
606
822
  --gse-ui-selectorCard-simple-borderRadius: 8px;
607
- --gse-ui-selectorCard-simple-label: 700 14px/24px Urbanist;
823
+ --gse-ui-selectorCard-simple-label-fontFamily: Urbanist;
824
+ --gse-ui-selectorCard-simple-label-fontWeight: 700;
825
+ --gse-ui-selectorCard-simple-label-fontSize: 14px;
826
+ --gse-ui-selectorCard-simple-label-lineHeight: 24px;
608
827
  --gse-ui-selectorCard-descriptive-minWidth: 216px;
609
828
  --gse-ui-selectorCard-descriptive-maxWidth: 316px;
610
829
  --gse-ui-selectorCard-descriptive-minHeight: 118px;
@@ -614,20 +833,35 @@
614
833
  --gse-ui-selectorCard-descriptive-text-gap: 4px;
615
834
  --gse-ui-selectorCard-descriptive-badge-marginTop: 8px;
616
835
  --gse-ui-selectorCard-descriptive-borderRadius: 16px;
617
- --gse-ui-selectorCard-descriptive-label: 700 16px/24px Urbanist;
618
- --gse-ui-selectorCard-descriptive-description: 400 12px/18px "Noto Sans";
619
- --gse-ui-selectorCard-unselected-border: 1px solid #c6c8ce;
620
- --gse-ui-selectorCard-selected-border: 1px solid #3742a2;
621
- --gse-ui-selectorCard-disabled-opacity: 0.5;
836
+ --gse-ui-selectorCard-descriptive-label-fontFamily: Urbanist;
837
+ --gse-ui-selectorCard-descriptive-label-fontWeight: 700;
838
+ --gse-ui-selectorCard-descriptive-label-fontSize: 16px;
839
+ --gse-ui-selectorCard-descriptive-label-lineHeight: 24px;
840
+ --gse-ui-selectorCard-descriptive-description-fontFamily: "Noto Sans";
841
+ --gse-ui-selectorCard-descriptive-description-fontWeight: 400;
842
+ --gse-ui-selectorCard-descriptive-description-fontSize: 12px;
843
+ --gse-ui-selectorCard-descriptive-description-lineHeight: 18px;
844
+ --gse-ui-selectorCard-unselected-border-color: #c6c8ce;
845
+ --gse-ui-selectorCard-unselected-border-width: 1px;
846
+ --gse-ui-selectorCard-unselected-border-style: solid;
847
+ --gse-ui-selectorCard-selected-border-color: #3742a2;
848
+ --gse-ui-selectorCard-selected-border-width: 1px;
849
+ --gse-ui-selectorCard-selected-border-style: solid;
850
+ --gse-ui-selectorCard-disabled-opacity: .5;
622
851
  --gse-ui-selectorCard-disabled-backgroundColor: #ffffff;
623
852
  --gse-ui-selectorCard-disabled-selectedIndicator-selected-foregroundColor: #4856cb;
624
853
  --gse-ui-selectorCard-disabled-selectedIndicator-unselected-foregroundColor: #767c8d;
625
854
  --gse-ui-ctaGroup-gap: 8px;
626
855
  --gse-ui-search-counter-default-foregroundColor: #626e84;
627
856
  --gse-ui-search-counter-hover-foregroundColor: #3742a2;
628
- --gse-ui-search-counter-divider-border: 1px solid #a3a7b0;
857
+ --gse-ui-search-counter-divider-border-color: #a3a7b0;
858
+ --gse-ui-search-counter-divider-border-width: 1px;
859
+ --gse-ui-search-counter-divider-border-style: solid;
629
860
  --gse-ui-search-counter-divider-foregroundColor: #a3a7b0;
630
- --gse-ui-search-counter-text: 400 12px/18px "Noto Sans";
861
+ --gse-ui-search-counter-text-fontFamily: "Noto Sans";
862
+ --gse-ui-search-counter-text-fontWeight: 400;
863
+ --gse-ui-search-counter-text-fontSize: 12px;
864
+ --gse-ui-search-counter-text-lineHeight: 18px;
631
865
  --gse-ui-search-counter-gap: 4px;
632
866
  --gse-ui-search-counter-icon-height: 16px;
633
867
  --gse-ui-search-counter-icon-width: 16px;
@@ -637,7 +871,10 @@
637
871
  --gse-ui-search-match-subsequentLevel-foregroundColour: #1b2c48;
638
872
  --gse-ui-search-match-subsequentLevel-backgroundColor: #daf0f4;
639
873
  --gse-ui-simpleFilter-gap: 16px;
640
- --gse-ui-dataTableItems-header-text: 700 12px/18px "Noto Sans";
874
+ --gse-ui-dataTableItems-header-text-fontFamily: "Noto Sans";
875
+ --gse-ui-dataTableItems-header-text-fontWeight: 700;
876
+ --gse-ui-dataTableItems-header-text-fontSize: 12px;
877
+ --gse-ui-dataTableItems-header-text-lineHeight: 18px;
641
878
  --gse-ui-dataTableItems-header-multiselect-default-height: 40px;
642
879
  --gse-ui-dataTableItems-header-multiselect-default-width: 41px;
643
880
  --gse-ui-dataTableItems-header-multiselect-default-selectedBar-height: 3px;
@@ -659,7 +896,9 @@
659
896
  --gse-ui-dataTableItems-header-gap: 8px;
660
897
  --gse-ui-dataTableItems-header-selectedBar-height: 3px;
661
898
  --gse-ui-dataTableItems-header-selectedBar-width: 229px;
662
- --gse-ui-dataTableItems-divider: 1px solid #e8ebf7;
899
+ --gse-ui-dataTableItems-divider-color: #e8ebf7;
900
+ --gse-ui-dataTableItems-divider-width: 1px;
901
+ --gse-ui-dataTableItems-divider-style: solid;
663
902
  --gse-ui-dataTableItems-scrollbar-borderRadius: 45px;
664
903
  --gse-ui-dataTableItems-scrollbar-foregroundColor: #626e84;
665
904
  --gse-ui-dataTableItems-cell-altBackgroundColor: #f3f5fb;
@@ -682,7 +921,10 @@
682
921
  --gse-ui-dataTableItems-cell-padding: 0 12px;
683
922
  --gse-ui-dataTableItems-cell-gap: 8px;
684
923
  --gse-ui-dataTableItems-cell-icon-foregroundColor: #1b2c48;
685
- --gse-ui-dataTableItems-cell-text: 400 12px/18px "Noto Sans";
924
+ --gse-ui-dataTableItems-cell-text-fontFamily: "Noto Sans";
925
+ --gse-ui-dataTableItems-cell-text-fontWeight: 400;
926
+ --gse-ui-dataTableItems-cell-text-fontSize: 12px;
927
+ --gse-ui-dataTableItems-cell-text-lineHeight: 18px;
686
928
  --gse-ui-dataTableItems-cell-tablePagination-width: 727px;
687
929
  --gse-ui-dataTableItems-cell-tablePagination-height: 56px;
688
930
  --gse-ui-dataTableItems-cell-contextMenu-default-height: 40px;
@@ -702,9 +944,17 @@
702
944
  --gse-ui-dataTableItems-tableToolbar-height: 32px;
703
945
  --gse-ui-dataTableItems-tablePagination-recordsetControls-gap: 10px;
704
946
  --gse-ui-dataTableItems-tablePagination-padding: 12px;
705
- --gse-ui-dataTableItems-tablePagination-divider: 1px solid #c6c8ce;
706
- --gse-ui-dataTableItems-tablePagination-defaultText: 400 12px/18px "Noto Sans";
707
- --gse-ui-dataTableItems-tablePagination-currentResultText: 700 12px/18px "Noto Sans";
947
+ --gse-ui-dataTableItems-tablePagination-divider-color: #c6c8ce;
948
+ --gse-ui-dataTableItems-tablePagination-divider-width: 1px;
949
+ --gse-ui-dataTableItems-tablePagination-divider-style: solid;
950
+ --gse-ui-dataTableItems-tablePagination-defaultText-fontFamily: "Noto Sans";
951
+ --gse-ui-dataTableItems-tablePagination-defaultText-fontWeight: 400;
952
+ --gse-ui-dataTableItems-tablePagination-defaultText-fontSize: 12px;
953
+ --gse-ui-dataTableItems-tablePagination-defaultText-lineHeight: 18px;
954
+ --gse-ui-dataTableItems-tablePagination-currentResultText-fontFamily: "Noto Sans";
955
+ --gse-ui-dataTableItems-tablePagination-currentResultText-fontWeight: 700;
956
+ --gse-ui-dataTableItems-tablePagination-currentResultText-fontSize: 12px;
957
+ --gse-ui-dataTableItems-tablePagination-currentResultText-lineHeight: 18px;
708
958
  --gse-ui-dataTableItems-tablePagination-defaultBackgroundColor: #ffffff;
709
959
  --gse-ui-dataTableItems-tablePagination-foregroundColor: #1b2c48;
710
960
  --gse-ui-dataTableItems-tablePagination-countDisplay-gap: 4px;
@@ -713,7 +963,10 @@
713
963
  --gse-ui-avatar-large-badge-size: 24px;
714
964
  --gse-ui-avatar-large-focusRing-size: 98px;
715
965
  --gse-ui-avatar-large-content-size: 84px;
716
- --gse-ui-avatar-large-initials: 600 36px/1 Urbanist;
966
+ --gse-ui-avatar-large-initials-fontFamily: Urbanist;
967
+ --gse-ui-avatar-large-initials-fontWeight: 600;
968
+ --gse-ui-avatar-large-initials-fontSize: 36px;
969
+ --gse-ui-avatar-large-initials-lineHeight: 1;
717
970
  --gse-ui-avatar-large-presenceRing-width: 4px;
718
971
  --gse-ui-avatar-large-ucIntegration-size: 32px;
719
972
  --gse-ui-avatar-presenceRing-available: linear-gradient(135deg, #09b581 0%, #9de1cd 100%);
@@ -726,19 +979,28 @@
726
979
  --gse-ui-avatar-medium-badge-size: 16px;
727
980
  --gse-ui-avatar-medium-focusRing-size: 50px;
728
981
  --gse-ui-avatar-medium-content-size: 40px;
729
- --gse-ui-avatar-medium-initials: 600 18px/1 Urbanist;
982
+ --gse-ui-avatar-medium-initials-fontFamily: Urbanist;
983
+ --gse-ui-avatar-medium-initials-lineHeight: 1;
984
+ --gse-ui-avatar-medium-initials-fontSize: 18px;
985
+ --gse-ui-avatar-medium-initials-fontWeight: 600;
730
986
  --gse-ui-avatar-medium-presenceRing-width: 3px;
731
987
  --gse-ui-avatar-small-size: 32px;
732
988
  --gse-ui-avatar-small-badge-size: 8px;
733
989
  --gse-ui-avatar-small-focusRing-size: 34px;
734
990
  --gse-ui-avatar-small-content-size: 26px;
735
- --gse-ui-avatar-small-initials: 600 12px/1 Urbanist;
991
+ --gse-ui-avatar-small-initials-fontFamily: Urbanist;
992
+ --gse-ui-avatar-small-initials-lineHeight: 1;
993
+ --gse-ui-avatar-small-initials-fontSize: 12px;
994
+ --gse-ui-avatar-small-initials-fontWeight: 600;
736
995
  --gse-ui-avatar-small-substract-size: 30px;
737
996
  --gse-ui-avatar-small-presenceRing-width: 2px;
738
997
  --gse-ui-avatar-xsmall-size: 24px;
739
998
  --gse-ui-avatar-xsmall-focusRing-size: 26px;
740
999
  --gse-ui-avatar-xsmall-content-size: 18px;
741
- --gse-ui-avatar-xsmall-initials: 600 8px/1 Urbanist;
1000
+ --gse-ui-avatar-xsmall-initials-fontFamily: Urbanist;
1001
+ --gse-ui-avatar-xsmall-initials-lineHeight: 1;
1002
+ --gse-ui-avatar-xsmall-initials-fontSize: 8px;
1003
+ --gse-ui-avatar-xsmall-initials-fontWeight: 600;
742
1004
  --gse-ui-avatar-xsmall-presenceRing-width: 2px;
743
1005
  --gse-ui-avatar-badge-available-color: #09b581;
744
1006
  --gse-ui-avatar-badge-busy-color: #e22245;
@@ -770,28 +1032,51 @@
770
1032
  --gse-ui-avatar-media-initialsForeground-default: #1b2c48;
771
1033
  --gse-ui-avatar-media-initialsForeground-inverse: #ffffff;
772
1034
  --gse-ui-avatar-media-initialsForeground-add: #4856cb;
773
- --gse-ui-avatar-hoverModal-shroudColor: rgb(24.3% 32.5% 45.5% / 0.8);
1035
+ --gse-ui-avatar-hoverModal-shroudColor: #3e5374cc;
774
1036
  --gse-ui-avatar-hoverModal-foregroundColor: #ffffff;
775
- --gse-ui-avatar-hoverModal-opacity: 0.8;
1037
+ --gse-ui-avatar-hoverModal-opacity: .8;
776
1038
  --gse-ui-avatar-content-borderRadius: 100%;
777
- --gse-ui-avatar-content-default-border: 1px solid #ffffff;
778
- --gse-ui-avatar-content-large-border: 2px solid #ffffff;
1039
+ --gse-ui-avatar-content-default-border-color: #ffffff;
1040
+ --gse-ui-avatar-content-default-border-width: 1px;
1041
+ --gse-ui-avatar-content-default-border-style: solid;
1042
+ --gse-ui-avatar-content-large-border-color: #ffffff;
1043
+ --gse-ui-avatar-content-large-border-width: 2px;
1044
+ --gse-ui-avatar-content-large-border-style: solid;
779
1045
  --gse-ui-avatar-groupSet-gap: -2px;
780
1046
  --gse-ui-avatar-focusRing-large-borderRadius: 100%;
781
- --gse-ui-avatar-focusRing-large-border: 2px solid #7b88f7;
1047
+ --gse-ui-avatar-focusRing-large-border-color: #7b88f7;
1048
+ --gse-ui-avatar-focusRing-large-border-width: 2px;
1049
+ --gse-ui-avatar-focusRing-large-border-style: solid;
782
1050
  --gse-ui-avatar-focusRing-mediumSmall-borderRadius: 100%;
783
- --gse-ui-avatar-focusRing-medium-border: 2px solid #7b88f7;
784
- --gse-ui-avatar-focusRing-small-border: 2px solid #7b88f7;
785
- --gse-ui-avatar-focusRing-xsmall-border: 2px solid #7b88f7;
1051
+ --gse-ui-avatar-focusRing-medium-border-color: #7b88f7;
1052
+ --gse-ui-avatar-focusRing-medium-border-width: 2px;
1053
+ --gse-ui-avatar-focusRing-medium-border-style: solid;
1054
+ --gse-ui-avatar-focusRing-small-border-color: #7b88f7;
1055
+ --gse-ui-avatar-focusRing-small-border-width: 2px;
1056
+ --gse-ui-avatar-focusRing-small-border-style: solid;
1057
+ --gse-ui-avatar-focusRing-xsmall-border-color: #7b88f7;
1058
+ --gse-ui-avatar-focusRing-xsmall-border-width: 2px;
1059
+ --gse-ui-avatar-focusRing-xsmall-border-style: solid;
786
1060
  --gse-ui-avatar-focus: #7b88f7;
787
1061
  --gse-ui-avatar-addChangeImage-hoverModal-shroudSize: 84px;
788
1062
  --gse-ui-avatar-addChangeImage-icon-size: 16px;
789
1063
  --gse-ui-globalNav-sideMenu: linear-gradient(135deg, #09b581 0%, #9de1cd 100%);
790
- --gse-ui-globalNav-text: 700 12px/16px Roboto;
791
- --gse-ui-globalNav-toggle-onQueue-text: 600 12px/16px Roboto;
1064
+ --gse-ui-globalNav-text-fontFamily: Roboto;
1065
+ --gse-ui-globalNav-text-lineHeight: 16px;
1066
+ --gse-ui-globalNav-text-fontSize: 12px;
1067
+ --gse-ui-globalNav-text-fontWeight: 700;
1068
+ --gse-ui-globalNav-toggle-onQueue-text-fontFamily: Roboto;
1069
+ --gse-ui-globalNav-toggle-onQueue-text-lineHeight: 16px;
1070
+ --gse-ui-globalNav-toggle-onQueue-text-fontSize: 12px;
1071
+ --gse-ui-globalNav-toggle-onQueue-text-fontWeight: 600;
792
1072
  --gse-ui-globalNav-toggle-gap: 16px;
793
- --gse-ui-globalNav-toggle-offQueue-text: 400 12px/16px Roboto;
794
- --gse-ui-globalNav-focus-border: 3px solid #7b88f7;
1073
+ --gse-ui-globalNav-toggle-offQueue-text-fontFamily: Roboto;
1074
+ --gse-ui-globalNav-toggle-offQueue-text-lineHeight: 16px;
1075
+ --gse-ui-globalNav-toggle-offQueue-text-fontSize: 12px;
1076
+ --gse-ui-globalNav-toggle-offQueue-text-fontWeight: 400;
1077
+ --gse-ui-globalNav-focus-border-color: #7b88f7;
1078
+ --gse-ui-globalNav-focus-border-width: 3px;
1079
+ --gse-ui-globalNav-focus-border-style: solid;
795
1080
  --gse-ui-globalNav-menuOption-height: 32px;
796
1081
  --gse-ui-globalNav-menuOption-width: 248px;
797
1082
  --gse-ui-globalNav-menuOption-padding: 0px 12px;
@@ -818,7 +1103,9 @@
818
1103
  --gse-ui-globalNav-buttonReturn-width: 280px;
819
1104
  --gse-ui-globalNav-buttonReturn-padding: 16px 28px;
820
1105
  --gse-ui-globalNav-buttonReturn-gap: 12px;
821
- --gse-ui-globalNav-treeView-border: 2px solid #3e5374;
1106
+ --gse-ui-globalNav-treeView-border-color: #3e5374;
1107
+ --gse-ui-globalNav-treeView-border-width: 2px;
1108
+ --gse-ui-globalNav-treeView-border-style: solid;
822
1109
  --gse-ui-globalNav-treeView-gap: 8px;
823
1110
  --gse-ui-globalNav-treeView-width: 224px;
824
1111
  --gse-ui-globalNav-bar-padding: 8px 12px;
@@ -827,7 +1114,7 @@
827
1114
  --gse-ui-globalNav-topBar-height: 64px;
828
1115
  --gse-ui-globalNav-topBar-frame-backgroundColor: #ffffff;
829
1116
  --gse-ui-globalNav-topBar-frame-stroke: #c6ceec;
830
- --gse-ui-globalNav-topBar-logo: #ff4f1f; /* Brand Orange from Spark 1.0 */
1117
+ --gse-ui-globalNav-topBar-logo: #ff4f1f;
831
1118
  --gse-ui-globalNav-topBar-menuButton-closed-default-foregroundColor: #4856cb;
832
1119
  --gse-ui-globalNav-topBar-menuButton-closed-hover-backgroundColor: #3742a2;
833
1120
  --gse-ui-globalNav-topBar-menuButton-closed-hover-foregroundColorStroke: #4856cb;
@@ -838,14 +1125,24 @@
838
1125
  --gse-ui-globalNav-panel-panelTitle: #ffffff;
839
1126
  --gse-ui-globalNav-panel-primary: linear-gradient(127deg, #23395d 3.19%, #3e5374 225.06%);
840
1127
  --gse-ui-globalNav-panel-secondary: linear-gradient(358deg, #1b2b48 0.16%, #23395d 98.45%);
841
- --gse-ui-dataTableComposed-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
1128
+ --gse-ui-dataTableComposed-boxShadow-blur: 4px;
1129
+ --gse-ui-dataTableComposed-boxShadow-spread: 1px;
1130
+ --gse-ui-dataTableComposed-boxShadow-color: rgba(35, 57, 92, 0.1);
1131
+ --gse-ui-dataTableComposed-boxShadow-type: dropShadow;
1132
+ --gse-ui-dataTableComposed-boxShadow-offsetX: 0;
1133
+ --gse-ui-dataTableComposed-boxShadow-offsetY: 0;
842
1134
  --gse-ui-dataTableComposed-width: 1440px;
843
- --gse-ui-focus: 2px solid #7b88f7;
1135
+ --gse-ui-focus-color: #7b88f7;
1136
+ --gse-ui-focus-width: 2px;
1137
+ --gse-ui-focus-style: solid;
844
1138
  --gse-ui-tabs-item-height: 40px;
845
1139
  --gse-ui-tabs-item-horizontal-fixedHeight: 40px;
846
1140
  --gse-ui-tabs-item-horizontal-padding: 11px 12px 10px;
847
- --gse-ui-tabs-item-disableOpacity: 0.5;
848
- --gse-ui-tabs-item-itemText: 400 12px/18px "Noto Sans";
1141
+ --gse-ui-tabs-item-disableOpacity: .5;
1142
+ --gse-ui-tabs-item-itemText-fontFamily: "Noto Sans";
1143
+ --gse-ui-tabs-item-itemText-fontWeight: 400;
1144
+ --gse-ui-tabs-item-itemText-fontSize: 12px;
1145
+ --gse-ui-tabs-item-itemText-lineHeight: 18px;
849
1146
  --gse-ui-tabs-item-itemTextColor: #1b2c48;
850
1147
  --gse-ui-tabs-item-divider-horizontal-height: 1px;
851
1148
  --gse-ui-tabs-item-divider-vertical-height: 40px;
@@ -871,13 +1168,17 @@
871
1168
  --gse-ui-tabs-set-gap: -1px;
872
1169
  --gse-ui-tabs-set-divider-horizontal-height: 1px;
873
1170
  --gse-ui-tabs-set-divider-vertical-width: 1px;
874
- --gse-ui-tabs-focusRing-border: 2px solid #7b88f7;
1171
+ --gse-ui-tabs-focusRing-border-color: #7b88f7;
1172
+ --gse-ui-tabs-focusRing-border-width: 2px;
1173
+ --gse-ui-tabs-focusRing-border-style: solid;
875
1174
  --gse-ui-tabs-focusRing-borderRadius: 4px;
876
1175
  --gse-ui-advancedTabs-divider-dividerColor: #c6c8ce;
877
1176
  --gse-ui-advancedTabs-item-padding: 11px 12px 10px;
878
1177
  --gse-ui-advancedTabs-item-gap: 8px;
879
1178
  --gse-ui-advancedTabs-item-focus-borderRadius: 8px;
880
- --gse-ui-advancedTabs-item-focus-border: 2px solid #7b88f7;
1179
+ --gse-ui-advancedTabs-item-focus-border-color: #7b88f7;
1180
+ --gse-ui-advancedTabs-item-focus-border-width: 2px;
1181
+ --gse-ui-advancedTabs-item-focus-border-style: solid;
881
1182
  --gse-ui-advancedTabs-item-focus-borderCopy: 4px;
882
1183
  --gse-ui-advancedTabs-item-backgroundColor: #ffffff;
883
1184
  --gse-ui-advancedTabs-item-borderRadius: 4px 4px 0 0;
@@ -902,7 +1203,10 @@
902
1203
  --gse-ui-advancedTabs-item-menuButton-activeColor: #1b2c48;
903
1204
  --gse-ui-advancedTabs-item-menuButton-focus-height: 53px;
904
1205
  --gse-ui-advancedTabs-item-menuButton-focus-width: 40px;
905
- --gse-ui-advancedTabs-item-itemText: 400 12px/18px "Noto Sans";
1206
+ --gse-ui-advancedTabs-item-itemText-fontFamily: "Noto Sans";
1207
+ --gse-ui-advancedTabs-item-itemText-fontWeight: 400;
1208
+ --gse-ui-advancedTabs-item-itemText-fontSize: 12px;
1209
+ --gse-ui-advancedTabs-item-itemText-lineHeight: 18px;
906
1210
  --gse-ui-advancedTabs-button-add-height: 45px;
907
1211
  --gse-ui-advancedTabs-button-arrow-height: 48px;
908
1212
  --gse-ui-advancedTabs-set-backgroundColor: #f3f5fb;
@@ -923,38 +1227,62 @@
923
1227
  --gse-ui-toast-error-backgroundColor: #ffffff;
924
1228
  --gse-ui-toast-error-foregroundColor: #1b2c48;
925
1229
  --gse-ui-toast-error-iconColor: #e22245;
926
- --gse-ui-toast-heading: 700 16px/24px Urbanist;
927
- --gse-ui-toast-text: 400 14px/20px "Noto Sans";
1230
+ --gse-ui-toast-heading-fontFamily: Urbanist;
1231
+ --gse-ui-toast-heading-fontWeight: 700;
1232
+ --gse-ui-toast-heading-fontSize: 16px;
1233
+ --gse-ui-toast-heading-lineHeight: 24px;
1234
+ --gse-ui-toast-text-fontFamily: "Noto Sans";
1235
+ --gse-ui-toast-text-fontWeight: 400;
1236
+ --gse-ui-toast-text-fontSize: 14px;
1237
+ --gse-ui-toast-text-lineHeight: 20px;
928
1238
  --gse-ui-toast-margin: 16px;
929
1239
  --gse-ui-toast-gap: 12px;
930
1240
  --gse-ui-toast-gapText: 4px;
931
1241
  --gse-ui-toast-gapButton: 16px;
932
1242
  --gse-ui-toast-buttonBar-gap: 8px;
933
1243
  --gse-ui-toast-borderRadius: 8px;
934
- --gse-ui-toast-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
1244
+ --gse-ui-toast-boxShadow-blur: 4px;
1245
+ --gse-ui-toast-boxShadow-spread: 1px;
1246
+ --gse-ui-toast-boxShadow-color: rgba(35, 57, 92, 0.1);
1247
+ --gse-ui-toast-boxShadow-type: dropShadow;
1248
+ --gse-ui-toast-boxShadow-offsetX: 0;
1249
+ --gse-ui-toast-boxShadow-offsetY: 0;
935
1250
  --gse-ui-toast-icon: 24px;
936
1251
  --gse-ui-toast-wrappingWidth: 320px;
937
1252
  --gse-ui-toast-stacking-gap: 4px;
938
1253
  --gse-ui-modal-closeButtonColor: #3e5374;
939
1254
  --gse-ui-modal-headerColor: #1b2c48;
940
1255
  --gse-ui-modal-backgroundColor: #ffffff;
941
- --gse-ui-modal-shroudColor: rgb(24.3% 32.5% 45.5% / 0.8);
1256
+ --gse-ui-modal-shroudColor: #3e5374cc;
942
1257
  --gse-ui-modal-header-gap: 12px;
943
1258
  --gse-ui-modal-padding: 32px;
944
1259
  --gse-ui-modal-gap: 16px;
945
- --gse-ui-modal-heading: 700 24px/32px Urbanist;
1260
+ --gse-ui-modal-heading-fontFamily: Urbanist;
1261
+ --gse-ui-modal-heading-fontWeight: 700;
1262
+ --gse-ui-modal-heading-fontSize: 24px;
1263
+ --gse-ui-modal-heading-lineHeight: 32px;
946
1264
  --gse-ui-modal-icon: 32px;
947
1265
  --gse-ui-modal-small-width: 420px;
948
1266
  --gse-ui-modal-medium-width: 680px;
949
1267
  --gse-ui-modal-large-width: 800px;
950
1268
  --gse-ui-modal-buttonBar-gap: 8px;
951
- --gse-ui-modal-boxShadow: 0 0 8px 1px rgba(35,57,92,0.15);
1269
+ --gse-ui-modal-boxShadow-blur: 8px;
1270
+ --gse-ui-modal-boxShadow-spread: 1px;
1271
+ --gse-ui-modal-boxShadow-color: rgba(35, 57, 92, 0.15);
1272
+ --gse-ui-modal-boxShadow-type: dropShadow;
1273
+ --gse-ui-modal-boxShadow-offsetX: 0;
1274
+ --gse-ui-modal-boxShadow-offsetY: 0;
952
1275
  --gse-ui-modal-borderRadius: 16px;
953
- --gse-ui-modal-shroud-opacity: 0.8;
1276
+ --gse-ui-modal-shroud-opacity: .8;
954
1277
  --gse-ui-modal-dismissButton-paddingTop: 16px;
955
1278
  --gse-ui-modal-dismissButton-paddingRight: 8px;
956
1279
  --gse-ui-popover-borderRadius: 8px;
957
- --gse-ui-popover-boxShadow: 0 0 8px 1px rgba(35,57,92,0.15);
1280
+ --gse-ui-popover-boxShadow-blur: 8px;
1281
+ --gse-ui-popover-boxShadow-spread: 1px;
1282
+ --gse-ui-popover-boxShadow-color: rgba(35, 57, 92, 0.15);
1283
+ --gse-ui-popover-boxShadow-type: dropShadow;
1284
+ --gse-ui-popover-boxShadow-offsetX: 0;
1285
+ --gse-ui-popover-boxShadow-offsetY: 0;
958
1286
  --gse-ui-popover-closeButtonColor: #3e5374;
959
1287
  --gse-ui-popover-headerColor: #1b2c48;
960
1288
  --gse-ui-popover-backgroundColor: #ffffff;
@@ -963,24 +1291,51 @@
963
1291
  --gse-ui-popover-buttonsBar-gap: 8px;
964
1292
  --gse-ui-popover-header-gap: 4px;
965
1293
  --gse-ui-popover-spacer-height: 16px;
966
- --gse-ui-popover-body-text: 400 14px/20px "Noto Sans";
967
- --gse-ui-popover-title-text: 700 16px/24px Urbanist;
1294
+ --gse-ui-popover-body-text-fontFamily: "Noto Sans";
1295
+ --gse-ui-popover-body-text-fontWeight: 400;
1296
+ --gse-ui-popover-body-text-fontSize: 14px;
1297
+ --gse-ui-popover-body-text-lineHeight: 20px;
1298
+ --gse-ui-popover-title-text-fontFamily: Urbanist;
1299
+ --gse-ui-popover-title-text-fontWeight: 700;
1300
+ --gse-ui-popover-title-text-fontSize: 16px;
1301
+ --gse-ui-popover-title-text-lineHeight: 24px;
968
1302
  --gse-ui-popover-anchor-width: 20px;
969
1303
  --gse-ui-popover-anchor-height: 8px;
970
1304
  --gse-ui-progressAndLoading-spinner-foreground: #4856cb;
971
1305
  --gse-ui-progressAndLoading-spinner-base: #dee1fd;
972
- --gse-ui-progressAndLoading-spinner-large: 48px; /* keeping hard code as it cant have "px" */
973
- --gse-ui-progressAndLoading-spinner-small: 16px; /* keeping hard code as it cant have "px" */
974
- --gse-ui-progressAndLoading-spinner-text: 600 12px/18px "Noto Sans";
1306
+ --gse-ui-progressAndLoading-spinner-large: 48px;
1307
+ --gse-ui-progressAndLoading-spinner-small: 16px;
1308
+ --gse-ui-progressAndLoading-spinner-text-fontFamily: "Noto Sans";
1309
+ --gse-ui-progressAndLoading-spinner-text-fontWeight: 600;
1310
+ --gse-ui-progressAndLoading-spinner-text-fontSize: 12px;
1311
+ --gse-ui-progressAndLoading-spinner-text-lineHeight: 18px;
975
1312
  --gse-ui-progressAndLoading-textColor: #1b2c48;
976
- --gse-ui-progressAndLoading-loadingState-large-header: 700 24px/32px Urbanist;
977
- --gse-ui-progressAndLoading-loadingState-large-subheader: 600 16px/24px "Noto Sans";
1313
+ --gse-ui-progressAndLoading-loadingState-large-header-fontFamily: Urbanist;
1314
+ --gse-ui-progressAndLoading-loadingState-large-header-fontWeight: 700;
1315
+ --gse-ui-progressAndLoading-loadingState-large-header-fontSize: 24px;
1316
+ --gse-ui-progressAndLoading-loadingState-large-header-lineHeight: 32px;
1317
+ --gse-ui-progressAndLoading-loadingState-large-subheader-fontFamily: "Noto Sans";
1318
+ --gse-ui-progressAndLoading-loadingState-large-subheader-fontWeight: 600;
1319
+ --gse-ui-progressAndLoading-loadingState-large-subheader-fontSize: 16px;
1320
+ --gse-ui-progressAndLoading-loadingState-large-subheader-lineHeight: 24px;
978
1321
  --gse-ui-progressAndLoading-loadingState-large-width: 600px;
979
- --gse-ui-progressAndLoading-loadingState-medium-header: 700 18px/27px Urbanist;
980
- --gse-ui-progressAndLoading-loadingState-medium-subheader: 600 14px/20px "Noto Sans";
1322
+ --gse-ui-progressAndLoading-loadingState-medium-header-fontFamily: Urbanist;
1323
+ --gse-ui-progressAndLoading-loadingState-medium-header-fontWeight: 700;
1324
+ --gse-ui-progressAndLoading-loadingState-medium-header-fontSize: 18px;
1325
+ --gse-ui-progressAndLoading-loadingState-medium-header-lineHeight: 27px;
1326
+ --gse-ui-progressAndLoading-loadingState-medium-subheader-fontFamily: "Noto Sans";
1327
+ --gse-ui-progressAndLoading-loadingState-medium-subheader-fontWeight: 600;
1328
+ --gse-ui-progressAndLoading-loadingState-medium-subheader-fontSize: 14px;
1329
+ --gse-ui-progressAndLoading-loadingState-medium-subheader-lineHeight: 20px;
981
1330
  --gse-ui-progressAndLoading-loadingState-medium-width: 400px;
982
- --gse-ui-progressAndLoading-loadingState-small-header: 700 16px/24px Urbanist;
983
- --gse-ui-progressAndLoading-loadingState-small-subheader: 600 12px/18px "Noto Sans";
1331
+ --gse-ui-progressAndLoading-loadingState-small-header-fontFamily: Urbanist;
1332
+ --gse-ui-progressAndLoading-loadingState-small-header-fontWeight: 700;
1333
+ --gse-ui-progressAndLoading-loadingState-small-header-fontSize: 16px;
1334
+ --gse-ui-progressAndLoading-loadingState-small-header-lineHeight: 24px;
1335
+ --gse-ui-progressAndLoading-loadingState-small-subheader-fontFamily: "Noto Sans";
1336
+ --gse-ui-progressAndLoading-loadingState-small-subheader-fontWeight: 600;
1337
+ --gse-ui-progressAndLoading-loadingState-small-subheader-fontSize: 12px;
1338
+ --gse-ui-progressAndLoading-loadingState-small-subheader-lineHeight: 18px;
984
1339
  --gse-ui-progressAndLoading-loadingState-small-width: 200px;
985
1340
  --gse-ui-progressAndLoading-large-gap: 24px;
986
1341
  --gse-ui-progressAndLoading-large-gapText: 4px;
@@ -989,13 +1344,25 @@
989
1344
  --gse-ui-progressAndLoading-medium-gapText: 4px;
990
1345
  --gse-ui-progressAndLoading-small-gap: 12px;
991
1346
  --gse-ui-progressAndLoading-small-gapText: 4px;
992
- --gse-ui-progressAndLoading-blankState-large-header: 700 18px/27px Urbanist;
993
- --gse-ui-progressAndLoading-blankState-large-subheader: 600 14px/20px "Noto Sans";
994
- --gse-ui-progressAndLoading-blankState-small-header: 700 14px/24px Urbanist;
995
- --gse-ui-progressAndLoading-blankState-small-subheader: 600 12px/18px "Noto Sans";
996
- --gse-ui-progressAndLoading-largeBorder: 4px; /* Remove px because of SVG issues from COMUI-2226 */
997
- --gse-ui-progressAndLoading-smallBorder: 2px; /* Remove px because of SVG issues from COMUI-2226 */
998
- --gse-ui-progressAndLoading-thinBorder: 1px; /* Remove px because of SVG issues from COMUI-2226 */
1347
+ --gse-ui-progressAndLoading-blankState-large-header-fontFamily: Urbanist;
1348
+ --gse-ui-progressAndLoading-blankState-large-header-fontWeight: 700;
1349
+ --gse-ui-progressAndLoading-blankState-large-header-fontSize: 18px;
1350
+ --gse-ui-progressAndLoading-blankState-large-header-lineHeight: 27px;
1351
+ --gse-ui-progressAndLoading-blankState-large-subheader-fontFamily: "Noto Sans";
1352
+ --gse-ui-progressAndLoading-blankState-large-subheader-fontWeight: 600;
1353
+ --gse-ui-progressAndLoading-blankState-large-subheader-fontSize: 14px;
1354
+ --gse-ui-progressAndLoading-blankState-large-subheader-lineHeight: 20px;
1355
+ --gse-ui-progressAndLoading-blankState-small-header-fontFamily: Urbanist;
1356
+ --gse-ui-progressAndLoading-blankState-small-header-fontWeight: 700;
1357
+ --gse-ui-progressAndLoading-blankState-small-header-fontSize: 14px;
1358
+ --gse-ui-progressAndLoading-blankState-small-header-lineHeight: 24px;
1359
+ --gse-ui-progressAndLoading-blankState-small-subheader-fontFamily: "Noto Sans";
1360
+ --gse-ui-progressAndLoading-blankState-small-subheader-fontWeight: 600;
1361
+ --gse-ui-progressAndLoading-blankState-small-subheader-fontSize: 12px;
1362
+ --gse-ui-progressAndLoading-blankState-small-subheader-lineHeight: 18px;
1363
+ --gse-ui-progressAndLoading-largeBorder: 4px;
1364
+ --gse-ui-progressAndLoading-smallBorder: 2px;
1365
+ --gse-ui-progressAndLoading-thinBorder: 1px;
999
1366
  --gse-ui-blankState-small-width: 250px;
1000
1367
  --gse-ui-blankState-small-maxWidth: 569px;
1001
1368
  --gse-ui-blankState-large-minWidth: 570px;
@@ -1013,11 +1380,17 @@
1013
1380
  --gse-ui-modalSideSheet-headerColor: #1b2c48;
1014
1381
  --gse-ui-modalSideSheet-closeColor: #3e5374;
1015
1382
  --gse-ui-modalSideSheet-dividerColor: #c6c8ce;
1016
- --gse-ui-modalSideSheet-shroudColor: rgb(24.3% 32.5% 45.5% / 0.8);
1017
- --gse-ui-modalSideSheet-shroud-opacity: 0.8;
1383
+ --gse-ui-modalSideSheet-shroudColor: #3e5374cc;
1384
+ --gse-ui-modalSideSheet-shroud-opacity: .8;
1018
1385
  --gse-ui-modalSideSheet-descriptionColor: #3e5374;
1019
- --gse-ui-modalSideSheet-heading: 600 18px/27px Urbanist;
1020
- --gse-ui-modalSideSheet-description: 400 12px/18px "Noto Sans";
1386
+ --gse-ui-modalSideSheet-heading-fontFamily: Urbanist;
1387
+ --gse-ui-modalSideSheet-heading-fontWeight: 600;
1388
+ --gse-ui-modalSideSheet-heading-fontSize: 18px;
1389
+ --gse-ui-modalSideSheet-heading-lineHeight: 27px;
1390
+ --gse-ui-modalSideSheet-description-fontFamily: "Noto Sans";
1391
+ --gse-ui-modalSideSheet-description-fontWeight: 400;
1392
+ --gse-ui-modalSideSheet-description-fontSize: 12px;
1393
+ --gse-ui-modalSideSheet-description-lineHeight: 18px;
1021
1394
  --gse-ui-modalSideSheet-header-interiorGap: 12px;
1022
1395
  --gse-ui-modalSideSheet-header-paddingTop: 24px;
1023
1396
  --gse-ui-modalSideSheet-header-paddingLeft: 24px;
@@ -1034,10 +1407,21 @@
1034
1407
  --gse-ui-dynamicSideSheet-headerColor: #1b2c48;
1035
1408
  --gse-ui-dynamicSideSheet-closeColor: #3e5374;
1036
1409
  --gse-ui-dynamicSideSheet-dividerColor: #c6c8ce;
1037
- --gse-ui-dynamicSideSheet-boxShadow: 0 0 6px 1px rgba(35,57,92,0.12);
1410
+ --gse-ui-dynamicSideSheet-boxShadow-blur: 6px;
1411
+ --gse-ui-dynamicSideSheet-boxShadow-spread: 1px;
1412
+ --gse-ui-dynamicSideSheet-boxShadow-color: rgba(35, 57, 92, 0.12);
1413
+ --gse-ui-dynamicSideSheet-boxShadow-type: dropShadow;
1414
+ --gse-ui-dynamicSideSheet-boxShadow-offsetX: 0;
1415
+ --gse-ui-dynamicSideSheet-boxShadow-offsetY: 0;
1038
1416
  --gse-ui-dynamicSideSheet-descriptionColor: #3e5374;
1039
- --gse-ui-dynamicSideSheet-heading: 600 18px/27px Urbanist;
1040
- --gse-ui-dynamicSideSheet-description: 400 12px/18px "Noto Sans";
1417
+ --gse-ui-dynamicSideSheet-heading-fontFamily: Urbanist;
1418
+ --gse-ui-dynamicSideSheet-heading-fontWeight: 600;
1419
+ --gse-ui-dynamicSideSheet-heading-fontSize: 18px;
1420
+ --gse-ui-dynamicSideSheet-heading-lineHeight: 27px;
1421
+ --gse-ui-dynamicSideSheet-description-fontFamily: "Noto Sans";
1422
+ --gse-ui-dynamicSideSheet-description-fontWeight: 400;
1423
+ --gse-ui-dynamicSideSheet-description-fontSize: 12px;
1424
+ --gse-ui-dynamicSideSheet-description-lineHeight: 18px;
1041
1425
  --gse-ui-dynamicSideSheet-header-interiorGap: 12px;
1042
1426
  --gse-ui-dynamicSideSheet-header-paddingTop: 24px;
1043
1427
  --gse-ui-dynamicSideSheet-header-paddingLeft: 24px;
@@ -1057,7 +1441,10 @@
1057
1441
  --gse-ui-accordion-header-default-foreground-chevronIcon-closed: #3e5374;
1058
1442
  --gse-ui-accordion-header-default-foreground-chevronIcon-open: #1b2c48;
1059
1443
  --gse-ui-accordion-header-default-foreground-chevronIcon-hover: #23395d;
1060
- --gse-ui-accordion-header-label-defaultText: 700 14px/20px "Noto Sans";
1444
+ --gse-ui-accordion-header-label-defaultText-fontFamily: "Noto Sans";
1445
+ --gse-ui-accordion-header-label-defaultText-fontWeight: 700;
1446
+ --gse-ui-accordion-header-label-defaultText-fontSize: 14px;
1447
+ --gse-ui-accordion-header-label-defaultText-lineHeight: 20px;
1061
1448
  --gse-ui-accordion-reversedHeader-padding: 2px;
1062
1449
  --gse-ui-accordion-menuItem-height: 32px;
1063
1450
  --gse-ui-accordion-menuItem-padding: 0 12px 0 24px;
@@ -1079,30 +1466,59 @@
1079
1466
  --gse-ui-accordion-menuItem-selected-foreground-parentIconColor: #1b2c48;
1080
1467
  --gse-ui-accordion-menuItem-selected-backgroundColor: #ced2fc;
1081
1468
  --gse-ui-accordion-menuItem-focus-borderRadius: 4px;
1082
- --gse-ui-accordion-menuItem-label-defaultText: 400 12px/18px "Noto Sans";
1083
- --gse-ui-accordion-menuItem-label-selectedText: 600 12px/18px "Noto Sans";
1084
- --gse-ui-accordion-menuItem-shortcut-text: 400 14px/20px "Noto Sans";
1085
- --gse-ui-accordion-focusBorder: 2px solid #7b88f7;
1469
+ --gse-ui-accordion-menuItem-label-defaultText-fontFamily: "Noto Sans";
1470
+ --gse-ui-accordion-menuItem-label-defaultText-fontWeight: 400;
1471
+ --gse-ui-accordion-menuItem-label-defaultText-fontSize: 12px;
1472
+ --gse-ui-accordion-menuItem-label-defaultText-lineHeight: 18px;
1473
+ --gse-ui-accordion-menuItem-label-selectedText-fontFamily: "Noto Sans";
1474
+ --gse-ui-accordion-menuItem-label-selectedText-fontWeight: 600;
1475
+ --gse-ui-accordion-menuItem-label-selectedText-fontSize: 12px;
1476
+ --gse-ui-accordion-menuItem-label-selectedText-lineHeight: 18px;
1477
+ --gse-ui-accordion-menuItem-shortcut-text-fontFamily: "Noto Sans";
1478
+ --gse-ui-accordion-menuItem-shortcut-text-fontWeight: 400;
1479
+ --gse-ui-accordion-menuItem-shortcut-text-fontSize: 14px;
1480
+ --gse-ui-accordion-menuItem-shortcut-text-lineHeight: 20px;
1481
+ --gse-ui-accordion-focusBorder-color: #7b88f7;
1482
+ --gse-ui-accordion-focusBorder-style: solid;
1483
+ --gse-ui-accordion-focusBorder-width: 2px;
1086
1484
  --gse-ui-accordion-contentItem-padding: 16px;
1087
1485
  --gse-ui-accordion-contentItem-gap: 16px;
1088
1486
  --gse-ui-accordion-contentItem-foregroundColor: #1b2c48;
1089
1487
  --gse-ui-accordion-contentItem-backgroundColor: #ffffff;
1090
- --gse-ui-accordion-contentItem-defaultText: 400 12px/18px "Noto Sans";
1091
- --gse-ui-accordion-wrapper-dividerBorder: 1px solid #c6c8ce;
1488
+ --gse-ui-accordion-contentItem-defaultText-fontFamily: "Noto Sans";
1489
+ --gse-ui-accordion-contentItem-defaultText-fontWeight: 400;
1490
+ --gse-ui-accordion-contentItem-defaultText-fontSize: 12px;
1491
+ --gse-ui-accordion-contentItem-defaultText-lineHeight: 18px;
1492
+ --gse-ui-accordion-wrapper-dividerBorder-color: #c6c8ce;
1493
+ --gse-ui-accordion-wrapper-dividerBorder-width: 1px;
1494
+ --gse-ui-accordion-wrapper-dividerBorder-style: solid;
1092
1495
  --gse-ui-accordion-focus-offset-gap: 1px;
1093
1496
  --gse-ui-accordion-contentPanel-paddingBottom: 8px;
1094
- --gse-ui-accordion-label-disabled-opacity: 0.5;
1497
+ --gse-ui-accordion-label-disabled-opacity: .5;
1095
1498
  }
1096
1499
 
1097
1500
  [flare-mode=dark] {
1098
- --gse-ui-color-focus: #7b88f7; /* Created to support the legacy border focus token */
1099
- --gse-ui-formControl-input-contentText: 400 12px/18px "Noto Sans";
1100
- --gse-ui-formControl-input-default-border: 1px solid #a3a7b0;
1101
- --gse-ui-formControl-input-hover-border: 1px solid #3742a2;
1102
- --gse-ui-formControl-input-active-border: 1px solid #252e78;
1103
- --gse-ui-formControl-input-error-border: 1px solid #e22245;
1104
- --gse-ui-formControl-input-disabled-border: 1px solid #a3a7b0;
1105
- --gse-ui-formControl-input-disabled-opacity: 0.5;
1501
+ --gse-ui-color-focus: #7b88f7;
1502
+ --gse-ui-formControl-input-contentText-fontFamily: "Noto Sans";
1503
+ --gse-ui-formControl-input-contentText-fontWeight: 400;
1504
+ --gse-ui-formControl-input-contentText-fontSize: 12px;
1505
+ --gse-ui-formControl-input-contentText-lineHeight: 18px;
1506
+ --gse-ui-formControl-input-default-border-color: #a3a7b0;
1507
+ --gse-ui-formControl-input-default-border-width: 1px;
1508
+ --gse-ui-formControl-input-default-border-style: solid;
1509
+ --gse-ui-formControl-input-hover-border-color: #3742a2;
1510
+ --gse-ui-formControl-input-hover-border-width: 1px;
1511
+ --gse-ui-formControl-input-hover-border-style: solid;
1512
+ --gse-ui-formControl-input-active-border-color: #252e78;
1513
+ --gse-ui-formControl-input-active-border-width: 1px;
1514
+ --gse-ui-formControl-input-active-border-style: solid;
1515
+ --gse-ui-formControl-input-error-border-color: #e22245;
1516
+ --gse-ui-formControl-input-error-border-width: 1px;
1517
+ --gse-ui-formControl-input-error-border-style: solid;
1518
+ --gse-ui-formControl-input-disabled-border-color: #a3a7b0;
1519
+ --gse-ui-formControl-input-disabled-border-width: 1px;
1520
+ --gse-ui-formControl-input-disabled-border-style: solid;
1521
+ --gse-ui-formControl-input-disabled-opacity: .5;
1106
1522
  --gse-ui-formControl-input-borderRadius: 4px;
1107
1523
  --gse-ui-formControl-input-backgroundColor: #ffffff;
1108
1524
  --gse-ui-formControl-input-placeholderColor: #626e84;
@@ -1113,7 +1529,10 @@
1113
1529
  --gse-ui-formControl-input-gap: 12px;
1114
1530
  --gse-ui-formControl-input-top: 8px;
1115
1531
  --gse-ui-formControl-input-padding: 8px 12px;
1116
- --gse-ui-formControl-input-prefixSufix-text: 700 14px/20px "Noto Sans";
1532
+ --gse-ui-formControl-input-prefixSufix-text-fontFamily: "Noto Sans";
1533
+ --gse-ui-formControl-input-prefixSufix-text-fontWeight: 700;
1534
+ --gse-ui-formControl-input-prefixSufix-text-fontSize: 14px;
1535
+ --gse-ui-formControl-input-prefixSufix-text-lineHeight: 20px;
1117
1536
  --gse-ui-formControl-input-prefixSufix-height: 32px;
1118
1537
  --gse-ui-formControl-input-prefixSufix-defaultColor: #626e84;
1119
1538
  --gse-ui-formControl-input-textfield-height: 32px;
@@ -1124,14 +1543,25 @@
1124
1543
  --gse-ui-formControl-input-inputIcon-iconEndColor: #626e84;
1125
1544
  --gse-ui-formControl-input-focusRing-defaultColor: #7b88f7;
1126
1545
  --gse-ui-formControl-input-textarea-height: 98px;
1127
- --gse-ui-formControl-input-focus-border: 2px solid #7b88f7;
1546
+ --gse-ui-formControl-input-focus-border-color: #7b88f7;
1547
+ --gse-ui-formControl-input-focus-border-width: 2px;
1548
+ --gse-ui-formControl-input-focus-border-style: solid;
1128
1549
  --gse-ui-formControl-input-spinbuttonIcon-size: 16px;
1129
1550
  --gse-ui-formControl-input-focusSelection-backgroundColor: #7b88f7;
1130
1551
  --gse-ui-formControl-label-padding: 0 0 8px 0;
1131
- --gse-ui-formControl-label-text: 400 12px/18px "Noto Sans";
1132
- --gse-ui-formControl-label-textBold: 600 12px/18px "Noto Sans";
1552
+ --gse-ui-formControl-label-text-fontFamily: "Noto Sans";
1553
+ --gse-ui-formControl-label-text-fontWeight: 400;
1554
+ --gse-ui-formControl-label-text-fontSize: 12px;
1555
+ --gse-ui-formControl-label-text-lineHeight: 18px;
1556
+ --gse-ui-formControl-label-textBold-fontFamily: "Noto Sans";
1557
+ --gse-ui-formControl-label-textBold-fontWeight: 600;
1558
+ --gse-ui-formControl-label-textBold-fontSize: 12px;
1559
+ --gse-ui-formControl-label-textBold-lineHeight: 18px;
1133
1560
  --gse-ui-formControl-label-labelColor: #1b2c48;
1134
- --gse-ui-formControl-label-indicator-text: 400 12px/18px "Noto Sans";
1561
+ --gse-ui-formControl-label-indicator-text-fontFamily: "Noto Sans";
1562
+ --gse-ui-formControl-label-indicator-text-fontWeight: 400;
1563
+ --gse-ui-formControl-label-indicator-text-fontSize: 12px;
1564
+ --gse-ui-formControl-label-indicator-text-lineHeight: 18px;
1135
1565
  --gse-ui-formControl-label-indicator-requiredColor: #e22245;
1136
1566
  --gse-ui-formControl-label-indicator-optionalColor: #3e5374;
1137
1567
  --gse-ui-formControl-label-iconSize: 16px;
@@ -1140,7 +1570,10 @@
1140
1570
  --gse-ui-formControl-formField-gap: 4px;
1141
1571
  --gse-ui-formControl-group-gapItems: 8px;
1142
1572
  --gse-ui-formControl-helper-gap: 4px;
1143
- --gse-ui-formControl-helper-helperText: 400 12px/18px "Noto Sans";
1573
+ --gse-ui-formControl-helper-helperText-fontFamily: "Noto Sans";
1574
+ --gse-ui-formControl-helper-helperText-fontWeight: 400;
1575
+ --gse-ui-formControl-helper-helperText-fontSize: 12px;
1576
+ --gse-ui-formControl-helper-helperText-lineHeight: 18px;
1144
1577
  --gse-ui-formControl-helper-padding: 8px 0 0 0;
1145
1578
  --gse-ui-formControl-helper-icon-padding: 1px 0 1px 0;
1146
1579
  --gse-ui-formControl-helper-paddingSmall: 4px 0 0 0;
@@ -1156,100 +1589,129 @@
1156
1589
  --gse-ui-card-backgroundColor: #ffffff;
1157
1590
  --gse-ui-card-borderRadius: 16px;
1158
1591
  --gse-ui-card-borderRadiusCopy: 16px;
1159
- --gse-ui-card-default-border: 1px solid #c6c8ce;
1160
- --gse-ui-card-raised-border: 1px solid #c6c8ce;
1161
- --gse-ui-card-raised-boxShadow: 0 0 6px 1px rgba(35,57,92,0.12);
1592
+ --gse-ui-card-default-border-color: #c6c8ce;
1593
+ --gse-ui-card-default-border-width: 1px;
1594
+ --gse-ui-card-default-border-style: solid;
1595
+ --gse-ui-card-raised-border-color: #c6c8ce;
1596
+ --gse-ui-card-raised-border-width: 1px;
1597
+ --gse-ui-card-raised-border-style: solid;
1598
+ --gse-ui-card-raised-boxShadow-blur: 6px;
1599
+ --gse-ui-card-raised-boxShadow-spread: 1px;
1600
+ --gse-ui-card-raised-boxShadow-color: rgba(35, 57, 92, 0.12);
1601
+ --gse-ui-card-raised-boxShadow-type: dropShadow;
1602
+ --gse-ui-card-raised-boxShadow-offsetX: 0;
1603
+ --gse-ui-card-raised-boxShadow-offsetY: 0;
1162
1604
  --gse-ui-card-padding: 24px;
1163
- --gse-ui-card-borderless-border: 1px solid transparent;
1164
- --gse-ui-tooltip-light-border: 1px solid #c6c8ce;
1605
+ --gse-ui-card-borderless-border-color: rgba(0, 0, 0, 0);
1606
+ --gse-ui-card-borderless-border-width: 1px;
1607
+ --gse-ui-card-borderless-border-style: solid;
1608
+ --gse-ui-tooltip-light-border-color: #c6c8ce;
1609
+ --gse-ui-tooltip-light-border-width: 1px;
1610
+ --gse-ui-tooltip-light-border-style: solid;
1165
1611
  --gse-ui-tooltip-light-backgroundColor: #ffffff;
1166
1612
  --gse-ui-tooltip-light-foregroundColor: #1b2c48;
1167
- --gse-ui-tooltip-dark-border: 1px solid #1b2c48;
1613
+ --gse-ui-tooltip-dark-border-color: #1b2c48;
1614
+ --gse-ui-tooltip-dark-border-width: 1px;
1615
+ --gse-ui-tooltip-dark-border-style: solid;
1168
1616
  --gse-ui-tooltip-dark-backgroundColor: #1b2c48;
1169
1617
  --gse-ui-tooltip-dark-foregroundColor: #ffffff;
1170
1618
  --gse-ui-tooltip-dark-iconColor: #ffffff;
1171
- --gse-ui-tooltip-boxShadow: 0 0 6px 1px rgba(35,57,92,0.12);
1619
+ --gse-ui-tooltip-boxShadow-blur: 6px;
1620
+ --gse-ui-tooltip-boxShadow-spread: 1px;
1621
+ --gse-ui-tooltip-boxShadow-color: rgba(35, 57, 92, 0.12);
1622
+ --gse-ui-tooltip-boxShadow-type: dropShadow;
1623
+ --gse-ui-tooltip-boxShadow-offsetX: 0;
1624
+ --gse-ui-tooltip-boxShadow-offsetY: 0;
1172
1625
  --gse-ui-tooltip-padding: 8px 12px;
1173
1626
  --gse-ui-tooltip-height: 32px;
1174
1627
  --gse-ui-tooltip-gap: 8px;
1175
1628
  --gse-ui-tooltip-borderRadius: 4px;
1176
- --gse-ui-tooltip-text: 400 12px/18px "Noto Sans";
1629
+ --gse-ui-tooltip-text-fontFamily: "Noto Sans";
1630
+ --gse-ui-tooltip-text-fontWeight: 400;
1631
+ --gse-ui-tooltip-text-fontSize: 12px;
1632
+ --gse-ui-tooltip-text-lineHeight: 18px;
1177
1633
  --gse-ui-tag-borderRadius: 16px;
1178
- --gse-ui-tag-default-backgroundColor: #23395d; /* To be deprecated in V5 */
1179
- --gse-ui-tag-default-foregroundColor: #ffffff; /* To be deprecated in V5 */
1634
+ --gse-ui-tag-default-backgroundColor: #23395d;
1635
+ --gse-ui-tag-default-foregroundColor: #ffffff;
1180
1636
  --gse-ui-tag-default-bold-backgroundColor: #3e5374;
1181
1637
  --gse-ui-tag-default-bold-foregroundColor: #ffffff;
1182
1638
  --gse-ui-tag-default-subtle-backgroundColor: #c6c8ce;
1183
1639
  --gse-ui-tag-default-subtle-foregroundColor: #1b2c48;
1184
- --gse-ui-tag-accent1-backgroundColor: #e4e5e7; /* To be deprecated in V5 */
1185
- --gse-ui-tag-accent1-foregroundColor: #1b2c48; /* To be deprecated in V5 */
1640
+ --gse-ui-tag-accent1-backgroundColor: #e4e5e7;
1641
+ --gse-ui-tag-accent1-foregroundColor: #1b2c48;
1186
1642
  --gse-ui-tag-accent1-bold-backgroundColor: #626d97;
1187
1643
  --gse-ui-tag-accent1-bold-foregroundColor: #ffffff;
1188
1644
  --gse-ui-tag-accent1-subtle-backgroundColor: #d1d7ef;
1189
1645
  --gse-ui-tag-accent1-subtle-foregroundColor: #1b2c48;
1190
- --gse-ui-tag-accent2-backgroundColor: #90d3dd; /* To be deprecated in V5 */
1191
- --gse-ui-tag-accent2-foregroundColor: #1b2c48; /* To be deprecated in V5 */
1646
+ --gse-ui-tag-accent2-backgroundColor: #90d3dd;
1647
+ --gse-ui-tag-accent2-foregroundColor: #1b2c48;
1192
1648
  --gse-ui-tag-accent2-bold-backgroundColor: #3ac49a;
1193
1649
  --gse-ui-tag-accent2-bold-foregroundColor: #1b2c48;
1194
1650
  --gse-ui-tag-accent2-subtle-backgroundColor: #9de1cd;
1195
1651
  --gse-ui-tag-accent2-subtle-foregroundColor: #1b2c48;
1196
- --gse-ui-tag-accent3-backgroundColor: #0c6d7e; /* To be deprecated in V5 */
1197
- --gse-ui-tag-accent3-foregroundColor: #ffffff; /* To be deprecated in V5 */
1652
+ --gse-ui-tag-accent3-backgroundColor: #0c6d7e;
1653
+ --gse-ui-tag-accent3-foregroundColor: #ffffff;
1198
1654
  --gse-ui-tag-accent3-bold-backgroundColor: #0c6d7e;
1199
1655
  --gse-ui-tag-accent3-bold-foregroundColor: #ffffff;
1200
1656
  --gse-ui-tag-accent3-subtle-backgroundColor: #90d3dd;
1201
1657
  --gse-ui-tag-accent3-subtle-foregroundColor: #1b2c48;
1202
- --gse-ui-tag-accent4-backgroundColor: #547688; /* To be deprecated in V5 */
1203
- --gse-ui-tag-accent4-foregroundColor: #ffffff; /* To be deprecated in V5 */
1658
+ --gse-ui-tag-accent4-backgroundColor: #547688;
1659
+ --gse-ui-tag-accent4-foregroundColor: #ffffff;
1204
1660
  --gse-ui-tag-accent4-bold-backgroundColor: #607732;
1205
1661
  --gse-ui-tag-accent4-bold-foregroundColor: #ffffff;
1206
1662
  --gse-ui-tag-accent4-subtle-backgroundColor: #c6dd98;
1207
1663
  --gse-ui-tag-accent4-subtle-foregroundColor: #1b2c48;
1208
- --gse-ui-tag-accent5-backgroundColor: #a5cae0; /* To be deprecated in V5 */
1209
- --gse-ui-tag-accent5-foregroundColor: #1b2c48; /* To be deprecated in V5 */
1664
+ --gse-ui-tag-accent5-backgroundColor: #a5cae0;
1665
+ --gse-ui-tag-accent5-foregroundColor: #1b2c48;
1210
1666
  --gse-ui-tag-accent5-bold-backgroundColor: #5798d9;
1211
1667
  --gse-ui-tag-accent5-bold-foregroundColor: #1b2c48;
1212
1668
  --gse-ui-tag-accent5-subtle-backgroundColor: #9ac1e8;
1213
1669
  --gse-ui-tag-accent5-subtle-foregroundColor: #1b2c48;
1214
- --gse-ui-tag-accent6-backgroundColor: #b5bfe6; /* To be deprecated in V5 */
1215
- --gse-ui-tag-accent6-foregroundColor: #1b2c48; /* To be deprecated in V5 */
1670
+ --gse-ui-tag-accent6-backgroundColor: #b5bfe6;
1671
+ --gse-ui-tag-accent6-foregroundColor: #1b2c48;
1216
1672
  --gse-ui-tag-accent6-subtle-backgroundColor: #cdacff;
1217
1673
  --gse-ui-tag-accent6-subtle-foregroundColor: #1b2c48;
1218
1674
  --gse-ui-tag-accent6-bold-backgroundColor: #8a5ecc;
1219
1675
  --gse-ui-tag-accent6-bold-foregroundColor: #ffffff;
1220
- --gse-ui-tag-text: 600 14px/20px "Noto Sans";
1676
+ --gse-ui-tag-text-fontFamily: "Noto Sans";
1677
+ --gse-ui-tag-text-fontWeight: 600;
1678
+ --gse-ui-tag-text-fontSize: 14px;
1679
+ --gse-ui-tag-text-lineHeight: 20px;
1221
1680
  --gse-ui-tag-padding: 0 12px;
1222
1681
  --gse-ui-tag-removable-padding: 0 8px 0 12px;
1223
1682
  --gse-ui-tag-removable-gap: 4px;
1224
- --gse-ui-tag-accent7-backgroundColor: #a05195; /* To be deprecated in V5 */
1225
- --gse-ui-tag-accent7-foregroundColor: #ffffff; /* To be deprecated in V5 */
1683
+ --gse-ui-tag-accent7-backgroundColor: #a05195;
1684
+ --gse-ui-tag-accent7-foregroundColor: #ffffff;
1226
1685
  --gse-ui-tag-accent7-bold-backgroundColor: #89387b;
1227
1686
  --gse-ui-tag-accent7-bold-foregroundColor: #ffffff;
1228
1687
  --gse-ui-tag-accent7-subtle-backgroundColor: #ef9ee1;
1229
1688
  --gse-ui-tag-accent7-subtle-foregroundColor: #1b2c48;
1230
1689
  --gse-ui-tag-height: 20px;
1231
- --gse-ui-tag-accent8-backgroundColor: #f95d6a; /* To be deprecated in V5 */
1232
- --gse-ui-tag-accent8-foregroundColor: #1b2c48; /* To be deprecated in V5 */
1690
+ --gse-ui-tag-accent8-backgroundColor: #f95d6a;
1691
+ --gse-ui-tag-accent8-foregroundColor: #1b2c48;
1233
1692
  --gse-ui-tag-accent8-bold-backgroundColor: #ff5c77;
1234
1693
  --gse-ui-tag-accent8-bold-foregroundColor: #1b2c48;
1235
1694
  --gse-ui-tag-accent8-subtle-backgroundColor: #ff9dad;
1236
1695
  --gse-ui-tag-accent8-subtle-foregroundColor: #1b2c48;
1237
- --gse-ui-tag-accent9-backgroundColor: #fe8f85; /* To be deprecated in V5 */
1238
- --gse-ui-tag-accent9-foregroundColor: #1b2c48; /* To be deprecated in V5 */
1696
+ --gse-ui-tag-accent9-backgroundColor: #fe8f85;
1697
+ --gse-ui-tag-accent9-foregroundColor: #1b2c48;
1239
1698
  --gse-ui-tag-accent9-bold-backgroundColor: #c44b3b;
1240
1699
  --gse-ui-tag-accent9-bold-foregroundColor: #ffffff;
1241
1700
  --gse-ui-tag-accent9-subtle-backgroundColor: #feb2ab;
1242
1701
  --gse-ui-tag-accent9-subtle-foregroundColor: #1b2c48;
1243
- --gse-ui-tag-accent10-backgroundColor: #ffc650; /* To be deprecated in V5 */
1244
- --gse-ui-tag-accent10-foregroundColor: #1b2c48; /* To be deprecated in V5 */
1702
+ --gse-ui-tag-accent10-backgroundColor: #ffc650;
1703
+ --gse-ui-tag-accent10-foregroundColor: #1b2c48;
1245
1704
  --gse-ui-tag-accent10-bold-backgroundColor: #ffc650;
1246
1705
  --gse-ui-tag-accent10-bold-foregroundColor: #1b2c48;
1247
1706
  --gse-ui-tag-accent10-subtle-backgroundColor: #ffdd96;
1248
1707
  --gse-ui-tag-accent10-subtle-foregroundColor: #1b2c48;
1249
1708
  --gse-ui-tag-button-size: 16px;
1250
- --gse-ui-tag-disabled-opacity: 0.5;
1709
+ --gse-ui-tag-disabled-opacity: .5;
1251
1710
  --gse-ui-badge-borderRadius: 16px;
1252
- --gse-ui-badge-text: 600 12px/18px "Noto Sans";
1711
+ --gse-ui-badge-text-fontFamily: "Noto Sans";
1712
+ --gse-ui-badge-text-fontWeight: 600;
1713
+ --gse-ui-badge-text-fontSize: 12px;
1714
+ --gse-ui-badge-text-lineHeight: 18px;
1253
1715
  --gse-ui-badge-height: 20px;
1254
1716
  --gse-ui-badge-padding: 2px 12px;
1255
1717
  --gse-ui-badge-gap: 4px;
@@ -1278,43 +1740,63 @@
1278
1740
  --gse-ui-alert-info-backgroundColor: #e2dff8;
1279
1741
  --gse-ui-alert-info-foregroundColor: #1b2c48;
1280
1742
  --gse-ui-alert-info-iconColor: #6e5ddb;
1281
- --gse-ui-alert-info-border: 1px solid #c5bef1;
1743
+ --gse-ui-alert-info-border-color: #c5bef1;
1744
+ --gse-ui-alert-info-border-width: 1px;
1745
+ --gse-ui-alert-info-border-style: solid;
1282
1746
  --gse-ui-alert-success-backgroundColor: #cef0e6;
1283
1747
  --gse-ui-alert-success-foregroundColor: #1b2c48;
1284
1748
  --gse-ui-alert-success-iconColor: #09b581;
1285
- --gse-ui-alert-success-border: 1px solid #9de1cd;
1749
+ --gse-ui-alert-success-border-color: #9de1cd;
1750
+ --gse-ui-alert-success-border-width: 1px;
1751
+ --gse-ui-alert-success-border-style: solid;
1286
1752
  --gse-ui-alert-warning-backgroundColor: #fef4d8;
1287
1753
  --gse-ui-alert-warning-foregroundColor: #1b2c48;
1288
1754
  --gse-ui-alert-warning-iconColor: #f8c73e;
1289
- --gse-ui-alert-warning-border: 1px solid #fce9b2;
1755
+ --gse-ui-alert-warning-border-color: #fce9b2;
1756
+ --gse-ui-alert-warning-border-width: 1px;
1757
+ --gse-ui-alert-warning-border-style: solid;
1290
1758
  --gse-ui-alert-error-backgroundColor: #f9d3da;
1291
1759
  --gse-ui-alert-error-foregroundColor: #1b2c48;
1292
1760
  --gse-ui-alert-error-iconColor: #e22245;
1293
- --gse-ui-alert-error-border: 1px solid #f3a7b5;
1294
- --gse-ui-alert-text: 400 12px/18px "Noto Sans";
1295
- --gse-ui-alert-emphasisText: 700 12px/18px "Noto Sans";
1761
+ --gse-ui-alert-error-border-color: #f3a7b5;
1762
+ --gse-ui-alert-error-border-width: 1px;
1763
+ --gse-ui-alert-error-border-style: solid;
1764
+ --gse-ui-alert-text-fontFamily: "Noto Sans";
1765
+ --gse-ui-alert-text-fontWeight: 400;
1766
+ --gse-ui-alert-text-fontSize: 12px;
1767
+ --gse-ui-alert-text-lineHeight: 18px;
1768
+ --gse-ui-alert-emphasisText-fontFamily: "Noto Sans";
1769
+ --gse-ui-alert-emphasisText-fontWeight: 700;
1770
+ --gse-ui-alert-emphasisText-fontSize: 12px;
1771
+ --gse-ui-alert-emphasisText-lineHeight: 18px;
1296
1772
  --gse-ui-alert-borderRadius: 4px;
1297
1773
  --gse-ui-rating-default-color: #767c8d;
1298
1774
  --gse-ui-rating-active-color: #4856cb;
1299
1775
  --gse-ui-rating-hover-color: #3742a2;
1300
1776
  --gse-ui-rating-disabled-color: #767c8d;
1301
- --gse-ui-rating-disabled-opacity: 0.5;
1777
+ --gse-ui-rating-disabled-opacity: .5;
1302
1778
  --gse-ui-rating-size: 16px;
1303
1779
  --gse-ui-rating-star-gap: 8px;
1304
1780
  --gse-ui-breadcrumbs-primary-height: 20px;
1305
1781
  --gse-ui-breadcrumbs-primary-separator-padding: 0 12px;
1306
- --gse-ui-breadcrumbs-primary-separator-typography: 700 14px/20px "Noto Sans";
1782
+ --gse-ui-breadcrumbs-primary-separator-typography-fontFamily: "Noto Sans";
1783
+ --gse-ui-breadcrumbs-primary-separator-typography-fontWeight: 700;
1784
+ --gse-ui-breadcrumbs-primary-separator-typography-fontSize: 14px;
1785
+ --gse-ui-breadcrumbs-primary-separator-typography-lineHeight: 20px;
1307
1786
  --gse-ui-breadcrumbs-secondary-height: 16px;
1308
1787
  --gse-ui-breadcrumbs-secondary-separator-padding: 0 8px;
1309
- --gse-ui-breadcrumbs-secondary-separator-typography: 700 14px/20px "Noto Sans";
1788
+ --gse-ui-breadcrumbs-secondary-separator-typography-fontFamily: "Noto Sans";
1789
+ --gse-ui-breadcrumbs-secondary-separator-typography-fontWeight: 700;
1790
+ --gse-ui-breadcrumbs-secondary-separator-typography-fontSize: 14px;
1791
+ --gse-ui-breadcrumbs-secondary-separator-typography-lineHeight: 20px;
1310
1792
  --gse-ui-breadcrumbs-separator-color: #c6c8ce;
1311
- --gse-ui-breadcrumbs-borderRadius: 0rem;
1793
+ --gse-ui-breadcrumbs-borderRadius: 0;
1312
1794
  --gse-ui-segmentedControl-button-padding: 0 12px;
1313
1795
  --gse-ui-segmentedControl-button-gap: 8px;
1314
1796
  --gse-ui-segmentedControl-button-start-borderRadius: 4px 0 0 4px;
1315
- --gse-ui-segmentedControl-button-middle-borderRadius: 0rem;
1797
+ --gse-ui-segmentedControl-button-middle-borderRadius: 0;
1316
1798
  --gse-ui-segmentedControl-button-end-borderRadius: 0 4px 4px 0;
1317
- --gse-ui-segmentedControl-button-disabled-opacity: 0.5;
1799
+ --gse-ui-segmentedControl-button-disabled-opacity: .5;
1318
1800
  --gse-ui-segmentedControl-button-disabled-backgroundColor: rgba(0, 0, 0, 0);
1319
1801
  --gse-ui-segmentedControl-button-disabled-foregroundColor: #4856cb;
1320
1802
  --gse-ui-segmentedControl-button-default-backgroundColor: rgba(0, 0, 0, 0);
@@ -1325,34 +1807,46 @@
1325
1807
  --gse-ui-segmentedControl-button-active-foregroundColor: #ffffff;
1326
1808
  --gse-ui-segmentedControl-borderRadius: 4px;
1327
1809
  --gse-ui-segmentedControl-height: 32px;
1328
- --gse-ui-segmentedControl-border: 1px solid #4856cb;
1329
- --gse-ui-segmentedControl-divider: 1px solid #4856cb;
1810
+ --gse-ui-segmentedControl-border-color: #4856cb;
1811
+ --gse-ui-segmentedControl-border-width: 1px;
1812
+ --gse-ui-segmentedControl-border-style: solid;
1813
+ --gse-ui-segmentedControl-divider-color: #4856cb;
1814
+ --gse-ui-segmentedControl-divider-width: 1px;
1815
+ --gse-ui-segmentedControl-divider-style: solid;
1330
1816
  --gse-ui-segmentedControl-iconOnly-padding: 0 8px;
1331
- --gse-ui-segmentedControl-focus-offset: 0rem;
1332
- --gse-ui-formFooter-page-desktop-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
1333
- --gse-ui-formFooter-page-desktop-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
1334
- --gse-ui-formFooter-page-desktop-horizontalPadding: 32px; /* The recommended vertical padding for the form footer content. */
1335
- --gse-ui-formFooter-page-desktop-gap: 16px; /* The recommended vertical padding for the form footer content. */
1336
- --gse-ui-formFooter-page-mobile-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
1337
- --gse-ui-formFooter-page-mobile-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
1338
- --gse-ui-formFooter-page-mobile-horizontalPadding: 16px; /* The recommended vertical padding for the form footer content. */
1339
- --gse-ui-formFooter-page-mobile-gap: 16px; /* The recommended vertical padding for the form footer content. */
1340
- --gse-ui-formFooter-separator: 1px solid #c6c8ce; /* This is the recommended style for the form fotter separator/divider. */
1341
- --gse-ui-formFooter-sideSheet-desktop-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
1342
- --gse-ui-formFooter-sideSheet-desktop-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
1343
- --gse-ui-formFooter-sideSheet-desktop-horizontalPadding: 24px; /* The recommended vertical padding for the form footer content. */
1344
- --gse-ui-formFooter-sideSheet-desktop-gap: 16px; /* The recommended vertical padding for the form footer content. */
1345
- --gse-ui-formFooter-modal-desktop-bottomPadding: 16px; /* The recommended vertical padding for the form footer content. */
1346
- --gse-ui-formFooter-modal-desktop-topPadding: 16px; /* The recommended vertical padding for the form footer content. */
1347
- --gse-ui-formFooter-modal-desktop-horizontalPadding: 32px; /* The recommended vertical padding for the form footer content. */
1348
- --gse-ui-formFooter-modal-desktop-gap: 16px; /* The recommended vertical padding for the form footer content. */
1817
+ --gse-ui-segmentedControl-focus-offset: 0;
1818
+ --gse-ui-formFooter-page-desktop-bottomPadding: 16px;
1819
+ --gse-ui-formFooter-page-desktop-topPadding: 16px;
1820
+ --gse-ui-formFooter-page-desktop-horizontalPadding: 32px;
1821
+ --gse-ui-formFooter-page-desktop-gap: 16px;
1822
+ --gse-ui-formFooter-page-mobile-bottomPadding: 16px;
1823
+ --gse-ui-formFooter-page-mobile-topPadding: 16px;
1824
+ --gse-ui-formFooter-page-mobile-horizontalPadding: 16px;
1825
+ --gse-ui-formFooter-page-mobile-gap: 16px;
1826
+ --gse-ui-formFooter-separator-color: #c6c8ce;
1827
+ --gse-ui-formFooter-separator-width: 1px;
1828
+ --gse-ui-formFooter-separator-style: solid;
1829
+ --gse-ui-formFooter-sideSheet-desktop-bottomPadding: 16px;
1830
+ --gse-ui-formFooter-sideSheet-desktop-topPadding: 16px;
1831
+ --gse-ui-formFooter-sideSheet-desktop-horizontalPadding: 24px;
1832
+ --gse-ui-formFooter-sideSheet-desktop-gap: 16px;
1833
+ --gse-ui-formFooter-modal-desktop-bottomPadding: 16px;
1834
+ --gse-ui-formFooter-modal-desktop-topPadding: 16px;
1835
+ --gse-ui-formFooter-modal-desktop-horizontalPadding: 32px;
1836
+ --gse-ui-formFooter-modal-desktop-gap: 16px;
1349
1837
  --gse-ui-formFooter-backgroundColor: #ffffff;
1350
- --gse-ui-formFooter-border: 1px solid #3742a2;
1838
+ --gse-ui-formFooter-border-color: #3742a2;
1839
+ --gse-ui-formFooter-border-width: 1px;
1840
+ --gse-ui-formFooter-border-style: solid;
1351
1841
  --gse-ui-copyToClipboard-label-active-backgroundColor: #ced2fc;
1352
1842
  --gse-ui-copyToClipboard-label-foregroundColor: #1b2c48;
1353
1843
  --gse-ui-copyToClipboard-label-padding: 2px 4px;
1354
1844
  --gse-ui-copyToClipboard-label-borderRadius: 4px;
1355
- --gse-ui-copyToClipboard-label-text: 600 14px/20px "Noto Sans";
1845
+ --gse-ui-copyToClipboard-label-text-fontFamily: "Noto Sans";
1846
+ --gse-ui-copyToClipboard-label-text-fontWeight: 600;
1847
+ --gse-ui-copyToClipboard-label-text-fontSize: 14px;
1848
+ --gse-ui-copyToClipboard-label-text-lineHeight: 20px;
1849
+ --gse-ui-copyToClipboard-label-text-textDecoration: underline;
1356
1850
  --gse-ui-copyToClipboard-gap: 8px;
1357
1851
  --gse-ui-copyToClipboard-contentContainer-gap: 4px;
1358
1852
  --gse-ui-copyToClipboard-iconContainer-padding: 4px;
@@ -1382,7 +1876,9 @@
1382
1876
  --gse-ui-button-secondary-active-foregroundColor: #252e78;
1383
1877
  --gse-ui-button-tertiary-default-backgroundColor: rgba(0, 0, 0, 0);
1384
1878
  --gse-ui-button-tertiary-default-foregroundColor: #4856cb;
1385
- --gse-ui-button-tertiary-default-border: 1px solid #4856cb;
1879
+ --gse-ui-button-tertiary-default-border-color: #4856cb;
1880
+ --gse-ui-button-tertiary-default-border-width: 1px;
1881
+ --gse-ui-button-tertiary-default-border-style: solid;
1386
1882
  --gse-ui-button-tertiary-hover-backgroundColor: #3742a2;
1387
1883
  --gse-ui-button-tertiary-hover-foregroundColor: #ffffff;
1388
1884
  --gse-ui-button-tertiary-active-backgroundColor: #252e78;
@@ -1400,8 +1896,11 @@
1400
1896
  --gse-ui-button-danger-active-backgroundColor: #440a15;
1401
1897
  --gse-ui-button-danger-active-foregroundColor: #ffffff;
1402
1898
  --gse-ui-button-borderRadius: 4px;
1403
- --gse-ui-button-disabled-opacity: 0.5;
1404
- --gse-ui-button-text: 700 12px/18px "Noto Sans";
1899
+ --gse-ui-button-disabled-opacity: .5;
1900
+ --gse-ui-button-text-fontFamily: "Noto Sans";
1901
+ --gse-ui-button-text-fontWeight: 700;
1902
+ --gse-ui-button-text-fontSize: 12px;
1903
+ --gse-ui-button-text-lineHeight: 18px;
1405
1904
  --gse-ui-actionButton-rightSegment-size: 32px;
1406
1905
  --gse-ui-actionButton-rightSegment-padding: 0 8px;
1407
1906
  --gse-ui-actionButton-rightSegment-borderRadius: 0 4px 4px 0;
@@ -1413,21 +1912,50 @@
1413
1912
  --gse-ui-actionButton-leftSegment-focusBorderRadius: 16px 0 0 16px;
1414
1913
  --gse-ui-actionButton-leftSegment-borderRadius: 4px 0 0 4px;
1415
1914
  --gse-ui-actionButton-borderRadius: 4px;
1416
- --gse-ui-actionButton-tertiary-divider: 2px solid #4856cb;
1417
- --gse-ui-actionButton-primary-divider: 2px solid #ffffff;
1418
- --gse-ui-actionButton-secondary-divider: 2px solid #ffffff;
1419
- --gse-ui-actionButton-danger-divider: 2px solid #ffffff;
1915
+ --gse-ui-actionButton-tertiary-divider-color: #4856cb;
1916
+ --gse-ui-actionButton-tertiary-divider-width: 2px;
1917
+ --gse-ui-actionButton-tertiary-divider-style: solid;
1918
+ --gse-ui-actionButton-primary-divider-color: #ffffff;
1919
+ --gse-ui-actionButton-primary-divider-width: 2px;
1920
+ --gse-ui-actionButton-primary-divider-style: solid;
1921
+ --gse-ui-actionButton-secondary-divider-color: #ffffff;
1922
+ --gse-ui-actionButton-secondary-divider-width: 2px;
1923
+ --gse-ui-actionButton-secondary-divider-style: solid;
1924
+ --gse-ui-actionButton-danger-divider-color: #ffffff;
1925
+ --gse-ui-actionButton-danger-divider-width: 2px;
1926
+ --gse-ui-actionButton-danger-divider-style: solid;
1420
1927
  --gse-ui-links-asButton-height: 32px;
1421
1928
  --gse-ui-links-asButton-padding: 12px;
1422
1929
  --gse-ui-links-asButton-gap: 8px;
1423
- --gse-ui-links-asButton-text: 600 14px/20px "Noto Sans";
1424
- --gse-ui-links-asButton-underlinedText: 600 14px/20px "Noto Sans";
1930
+ --gse-ui-links-asButton-text-fontFamily: "Noto Sans";
1931
+ --gse-ui-links-asButton-text-fontWeight: 600;
1932
+ --gse-ui-links-asButton-text-fontSize: 14px;
1933
+ --gse-ui-links-asButton-text-lineHeight: 20px;
1934
+ --gse-ui-links-asButton-underlinedText-fontFamily: "Noto Sans";
1935
+ --gse-ui-links-asButton-underlinedText-fontWeight: 600;
1936
+ --gse-ui-links-asButton-underlinedText-fontSize: 14px;
1937
+ --gse-ui-links-asButton-underlinedText-lineHeight: 20px;
1938
+ --gse-ui-links-asButton-underlinedText-textDecoration: underline;
1425
1939
  --gse-ui-links-inLine-medium-height: 24px;
1426
- --gse-ui-links-inLine-medium-text: 600 14px/20px "Noto Sans";
1427
- --gse-ui-links-inLine-medium-underlinedText: 600 14px/20px "Noto Sans";
1940
+ --gse-ui-links-inLine-medium-text-fontFamily: "Noto Sans";
1941
+ --gse-ui-links-inLine-medium-text-fontWeight: 600;
1942
+ --gse-ui-links-inLine-medium-text-fontSize: 14px;
1943
+ --gse-ui-links-inLine-medium-text-lineHeight: 20px;
1944
+ --gse-ui-links-inLine-medium-underlinedText-fontFamily: "Noto Sans";
1945
+ --gse-ui-links-inLine-medium-underlinedText-fontWeight: 600;
1946
+ --gse-ui-links-inLine-medium-underlinedText-fontSize: 14px;
1947
+ --gse-ui-links-inLine-medium-underlinedText-lineHeight: 20px;
1948
+ --gse-ui-links-inLine-medium-underlinedText-textDecoration: underline;
1428
1949
  --gse-ui-links-inLine-small-height: 20px;
1429
- --gse-ui-links-inLine-small-text: 600 12px/18px "Noto Sans";
1430
- --gse-ui-links-inLine-small-underlinedText: 600 12px/18px "Noto Sans";
1950
+ --gse-ui-links-inLine-small-text-fontFamily: "Noto Sans";
1951
+ --gse-ui-links-inLine-small-text-fontWeight: 600;
1952
+ --gse-ui-links-inLine-small-text-fontSize: 12px;
1953
+ --gse-ui-links-inLine-small-text-lineHeight: 18px;
1954
+ --gse-ui-links-inLine-small-underlinedText-fontFamily: "Noto Sans";
1955
+ --gse-ui-links-inLine-small-underlinedText-fontWeight: 600;
1956
+ --gse-ui-links-inLine-small-underlinedText-fontSize: 12px;
1957
+ --gse-ui-links-inLine-small-underlinedText-lineHeight: 18px;
1958
+ --gse-ui-links-inLine-small-underlinedText-textDecoration: underline;
1431
1959
  --gse-ui-links-inLine-padding: 4px;
1432
1960
  --gse-ui-links-icon: 16px;
1433
1961
  --gse-ui-links-default-foregroundColor: #4856cb;
@@ -1435,7 +1963,7 @@
1435
1963
  --gse-ui-links-hover-foregroundColor: #3742a2;
1436
1964
  --gse-ui-links-active-foregroundColor: #252e78;
1437
1965
  --gse-ui-links-visited-foregroundColor: #8a5ecc;
1438
- --gse-ui-links-borderRadius: 0rem;
1966
+ --gse-ui-links-borderRadius: 0;
1439
1967
  --gse-ui-radioButton-icon-default-unselectedForegroundColor: #767c8d;
1440
1968
  --gse-ui-radioButton-icon-default-selectedForegroundColor: #4856cb;
1441
1969
  --gse-ui-radioButton-icon-hover-foregroundColor: #3742a2;
@@ -1444,12 +1972,17 @@
1444
1972
  --gse-ui-radioButton-icon-height: 16px;
1445
1973
  --gse-ui-radioButton-icon-width: 16px;
1446
1974
  --gse-ui-radioButton-label-foregroundColor: #1b2c48;
1447
- --gse-ui-radioButton-label-text: 400 12px/18px "Noto Sans";
1975
+ --gse-ui-radioButton-label-text-fontFamily: "Noto Sans";
1976
+ --gse-ui-radioButton-label-text-fontWeight: 400;
1977
+ --gse-ui-radioButton-label-text-fontSize: 12px;
1978
+ --gse-ui-radioButton-label-text-lineHeight: 18px;
1448
1979
  --gse-ui-radioButton-gap: 8px;
1449
1980
  --gse-ui-radioButton-helper-padding: 4px 0 0 24px;
1450
1981
  --gse-ui-radioButton-helper-gap: 8px;
1451
- --gse-ui-radioButton-disabled-opacity: 0.5;
1452
- --gse-ui-radioButton-focus-border: 2px solid #7b88f7;
1982
+ --gse-ui-radioButton-disabled-opacity: .5;
1983
+ --gse-ui-radioButton-focus-border-color: #7b88f7;
1984
+ --gse-ui-radioButton-focus-border-width: 2px;
1985
+ --gse-ui-radioButton-focus-border-style: solid;
1453
1986
  --gse-ui-radioButton-focus-borderRadius: 100%;
1454
1987
  --gse-ui-radioButton-focus-offset: 1px;
1455
1988
  --gse-ui-checkbox-icon-default-unselectedForegroundColor: #767c8d;
@@ -1460,12 +1993,17 @@
1460
1993
  --gse-ui-checkbox-icon-height: 16px;
1461
1994
  --gse-ui-checkbox-icon-width: 16px;
1462
1995
  --gse-ui-checkbox-label-foregroundColor: #1b2c48;
1463
- --gse-ui-checkbox-label-text: 400 12px/18px "Noto Sans";
1996
+ --gse-ui-checkbox-label-text-fontFamily: "Noto Sans";
1997
+ --gse-ui-checkbox-label-text-fontWeight: 400;
1998
+ --gse-ui-checkbox-label-text-fontSize: 12px;
1999
+ --gse-ui-checkbox-label-text-lineHeight: 18px;
1464
2000
  --gse-ui-checkbox-helper-padding: 4px 0 0 24px;
1465
2001
  --gse-ui-checkbox-helper-gap: 8px;
1466
2002
  --gse-ui-checkbox-gap: 8px;
1467
- --gse-ui-checkbox-disabled-opacity: 0.5;
1468
- --gse-ui-checkbox-focus-border: 2px solid #7b88f7;
2003
+ --gse-ui-checkbox-disabled-opacity: .5;
2004
+ --gse-ui-checkbox-focus-border-color: #7b88f7;
2005
+ --gse-ui-checkbox-focus-border-width: 2px;
2006
+ --gse-ui-checkbox-focus-border-style: solid;
1469
2007
  --gse-ui-checkbox-focus-borderRadius: 4px;
1470
2008
  --gse-ui-checkbox-focus-borderRadiusSmall: 2px;
1471
2009
  --gse-ui-checkbox-focus-offset: 1px;
@@ -1475,15 +2013,24 @@
1475
2013
  --gse-ui-menu-option-height: 32px;
1476
2014
  --gse-ui-menu-option-startIcon-height: 16px;
1477
2015
  --gse-ui-menu-option-startIcon-width: 16px;
1478
- --gse-ui-menu-option-label-default-text: 400 12px/18px "Noto Sans";
1479
- --gse-ui-menu-option-label-active-text: 700 12px/18px "Noto Sans";
2016
+ --gse-ui-menu-option-label-default-text-fontFamily: "Noto Sans";
2017
+ --gse-ui-menu-option-label-default-text-fontWeight: 400;
2018
+ --gse-ui-menu-option-label-default-text-fontSize: 12px;
2019
+ --gse-ui-menu-option-label-default-text-lineHeight: 18px;
2020
+ --gse-ui-menu-option-label-active-text-fontFamily: "Noto Sans";
2021
+ --gse-ui-menu-option-label-active-text-fontWeight: 700;
2022
+ --gse-ui-menu-option-label-active-text-fontSize: 12px;
2023
+ --gse-ui-menu-option-label-active-text-lineHeight: 18px;
1480
2024
  --gse-ui-menu-option-label-foregroundColor: #1b2c48;
1481
- --gse-ui-menu-option-shortcut-text: 400 14px/20px "Noto Sans";
2025
+ --gse-ui-menu-option-shortcut-text-fontFamily: "Noto Sans";
2026
+ --gse-ui-menu-option-shortcut-text-fontWeight: 400;
2027
+ --gse-ui-menu-option-shortcut-text-fontSize: 14px;
2028
+ --gse-ui-menu-option-shortcut-text-lineHeight: 20px;
1482
2029
  --gse-ui-menu-option-shortcut-default-foregroundColor: #626e84;
1483
2030
  --gse-ui-menu-option-shortcut-selected-foregroundColor: #1b2c48;
1484
2031
  --gse-ui-menu-option-hover-backgroundColor: #eff0fe;
1485
2032
  --gse-ui-menu-option-selected-backgroundColor: #ced2fc;
1486
- --gse-ui-menu-option-disabled-opacity: 0.5;
2033
+ --gse-ui-menu-option-disabled-opacity: .5;
1487
2034
  --gse-ui-menu-option-checkbox-unchecked-default-foregroundColor: #767c8d;
1488
2035
  --gse-ui-menu-option-checkbox-unchecked-hover-foregroundColor: #3742a2;
1489
2036
  --gse-ui-menu-option-checkbox-unchecked-selected-foregroundColor: #252e78;
@@ -1495,36 +2042,59 @@
1495
2042
  --gse-ui-menu-option-parentIcon-default-foregroundColor: #3e5374;
1496
2043
  --gse-ui-menu-option-parentIcon-hover-foregroundColor: #23395d;
1497
2044
  --gse-ui-menu-option-parentIcon-selected-foregroundColor: #1b2c48;
1498
- --gse-ui-menu-option-focus-border: 1px solid #7b88f7;
2045
+ --gse-ui-menu-option-focus-border-color: #7b88f7;
2046
+ --gse-ui-menu-option-focus-border-width: 1px;
2047
+ --gse-ui-menu-option-focus-border-style: solid;
1499
2048
  --gse-ui-menu-option-default-backgroundColor: #ffffff;
1500
2049
  --gse-ui-menu-maxHeight: 344px;
1501
2050
  --gse-ui-menu-borderRadius: 4px;
1502
- --gse-ui-menu-border: 1px solid #c6c8ce;
1503
- --gse-ui-menu-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
2051
+ --gse-ui-menu-border-color: #c6c8ce;
2052
+ --gse-ui-menu-border-width: 1px;
2053
+ --gse-ui-menu-border-style: solid;
2054
+ --gse-ui-menu-boxShadow-blur: 4px;
2055
+ --gse-ui-menu-boxShadow-spread: 1px;
2056
+ --gse-ui-menu-boxShadow-color: rgba(35, 57, 92, 0.1);
2057
+ --gse-ui-menu-boxShadow-type: dropShadow;
2058
+ --gse-ui-menu-boxShadow-offsetX: 0;
2059
+ --gse-ui-menu-boxShadow-offsetY: 0;
1504
2060
  --gse-ui-menu-padding: 8px 1px;
1505
2061
  --gse-ui-menu-backgroundColor: #ffffff;
1506
2062
  --gse-ui-menu-scrollbar-foregroundColor: #3e5374;
1507
- --gse-ui-menu-divider-backgroundColor: #c6c8ce; /* Color for the divider that separates the day picker and the time picker inside the calendar menu. */
2063
+ --gse-ui-menu-divider-backgroundColor: #c6c8ce;
1508
2064
  --gse-ui-menu-divider-margin: 4px 0 8px 0;
1509
2065
  --gse-ui-menu-divider-height: 1px;
1510
2066
  --gse-ui-menu-groupedMenu-title-padding: 8px 12px 4px;
1511
2067
  --gse-ui-menu-groupedMenu-title-height: 32px;
1512
2068
  --gse-ui-menu-groupedMenu-title-foregroundColor: #626e84;
1513
- --gse-ui-menu-groupedMenu-title-text: 600 12px/16px Urbanist;
2069
+ --gse-ui-menu-groupedMenu-title-text-fontFamily: Urbanist;
2070
+ --gse-ui-menu-groupedMenu-title-text-fontWeight: 600;
2071
+ --gse-ui-menu-groupedMenu-title-text-fontSize: 12px;
2072
+ --gse-ui-menu-groupedMenu-title-text-lineHeight: 16px;
2073
+ --gse-ui-menu-groupedMenu-title-text-textCase: uppercase;
2074
+ --gse-ui-menu-groupedMenu-title-text-letterSpacing: 1px;
1514
2075
  --gse-ui-menu-groupedMenu-padding: 8px 2px;
1515
2076
  --gse-ui-menu-groupedMenu-divider-padding: 4px 0px 8px;
1516
2077
  --gse-ui-menu-groupedMenu-divider-height: 13px;
1517
2078
  --gse-ui-menu-groupedMenu-subtext-foregroundColor: #626e84;
1518
- --gse-ui-dropdown-menu-emptyState-header-text: 700 12px/18px Roboto;
2079
+ --gse-ui-dropdown-menu-emptyState-header-text-fontFamily: Roboto;
2080
+ --gse-ui-dropdown-menu-emptyState-header-text-fontWeight: 700;
2081
+ --gse-ui-dropdown-menu-emptyState-header-text-lineHeight: 18px;
2082
+ --gse-ui-dropdown-menu-emptyState-header-text-fontSize: 12px;
1519
2083
  --gse-ui-dropdown-menu-emptyState-header-foregroundColor: #23395d;
1520
- --gse-ui-dropdown-menu-emptyState-subheader-text: 400 12px/18px Roboto;
2084
+ --gse-ui-dropdown-menu-emptyState-subheader-text-fontFamily: Roboto;
2085
+ --gse-ui-dropdown-menu-emptyState-subheader-text-fontWeight: 400;
2086
+ --gse-ui-dropdown-menu-emptyState-subheader-text-lineHeight: 18px;
2087
+ --gse-ui-dropdown-menu-emptyState-subheader-text-fontSize: 12px;
1521
2088
  --gse-ui-dropdown-menu-emptyState-subheader-foregroundColor: #626e84;
1522
2089
  --gse-ui-dropdown-gap: 4px;
1523
2090
  --gse-ui-calendarMenu-day-range-width: 16px;
1524
2091
  --gse-ui-calendarMenu-day-range-height: 32px;
1525
2092
  --gse-ui-calendarMenu-day-input-height: 32px;
1526
2093
  --gse-ui-calendarMenu-day-input-width: 160px;
1527
- --gse-ui-calendarMenu-day-headerText: 700 12px/18px "Noto Sans";
2094
+ --gse-ui-calendarMenu-day-headerText-fontFamily: "Noto Sans";
2095
+ --gse-ui-calendarMenu-day-headerText-fontWeight: 700;
2096
+ --gse-ui-calendarMenu-day-headerText-fontSize: 12px;
2097
+ --gse-ui-calendarMenu-day-headerText-lineHeight: 18px;
1528
2098
  --gse-ui-calendarMenu-day-date-size: 32px;
1529
2099
  --gse-ui-calendarMenu-height: 234px;
1530
2100
  --gse-ui-calendarMenu-width: 250px;
@@ -1534,11 +2104,20 @@
1534
2104
  --gse-ui-calendarMenu-month-single-header-height: 48px;
1535
2105
  --gse-ui-calendarMenu-month-monthCell-width: 66px;
1536
2106
  --gse-ui-calendarMenu-month-monthCell-height: 48px;
1537
- --gse-ui-calendarMenu-month-headerText: 400 16px/24px "Noto Sans";
2107
+ --gse-ui-calendarMenu-month-headerText-fontFamily: "Noto Sans";
2108
+ --gse-ui-calendarMenu-month-headerText-fontWeight: 400;
2109
+ --gse-ui-calendarMenu-month-headerText-fontSize: 16px;
2110
+ --gse-ui-calendarMenu-month-headerText-lineHeight: 24px;
1538
2111
  --gse-ui-calendarMenu-month-range-vertical-width: 272px;
1539
2112
  --gse-ui-calendarMenu-month-range-vertical-height: 652px;
1540
- --gse-ui-calendarMenu-month-defaultText: 400 12px/18px "Noto Sans";
1541
- --gse-ui-calendarMenu-month-currentText: 700 12px/18px "Noto Sans";
2113
+ --gse-ui-calendarMenu-month-defaultText-fontFamily: "Noto Sans";
2114
+ --gse-ui-calendarMenu-month-defaultText-fontWeight: 400;
2115
+ --gse-ui-calendarMenu-month-defaultText-fontSize: 12px;
2116
+ --gse-ui-calendarMenu-month-defaultText-lineHeight: 18px;
2117
+ --gse-ui-calendarMenu-month-currentText-fontFamily: "Noto Sans";
2118
+ --gse-ui-calendarMenu-month-currentText-fontWeight: 700;
2119
+ --gse-ui-calendarMenu-month-currentText-fontSize: 12px;
2120
+ --gse-ui-calendarMenu-month-currentText-lineHeight: 18px;
1542
2121
  --gse-ui-calendarMenu-month-focusBorderRadius: 20px;
1543
2122
  --gse-ui-calendarMenu-month-borderRadius: 16px;
1544
2123
  --gse-ui-calendarMenu-month-calendarButton-focusBorderRadius: 4px;
@@ -1554,8 +2133,14 @@
1554
2133
  --gse-ui-calendarMenu-header-padding: 12px 16px;
1555
2134
  --gse-ui-calendarMenu-header-arrow-padding: 8px;
1556
2135
  --gse-ui-calendarMenu-backgroundColor: #ffffff;
1557
- --gse-ui-calendarMenu-date-defaultText: 400 12px/18px "Noto Sans";
1558
- --gse-ui-calendarMenu-date-currentText: 700 12px/18px "Noto Sans";
2136
+ --gse-ui-calendarMenu-date-defaultText-fontFamily: "Noto Sans";
2137
+ --gse-ui-calendarMenu-date-defaultText-fontWeight: 400;
2138
+ --gse-ui-calendarMenu-date-defaultText-fontSize: 12px;
2139
+ --gse-ui-calendarMenu-date-defaultText-lineHeight: 18px;
2140
+ --gse-ui-calendarMenu-date-currentText-fontFamily: "Noto Sans";
2141
+ --gse-ui-calendarMenu-date-currentText-fontWeight: 700;
2142
+ --gse-ui-calendarMenu-date-currentText-fontSize: 12px;
2143
+ --gse-ui-calendarMenu-date-currentText-lineHeight: 18px;
1559
2144
  --gse-ui-calendarMenu-date-selected-foregroundColor: #ffffff;
1560
2145
  --gse-ui-calendarMenu-date-selected-backgroundColor: #4856cb;
1561
2146
  --gse-ui-calendarMenu-date-selected-hoverBackgroundColor: #3742a2;
@@ -1570,19 +2155,27 @@
1570
2155
  --gse-ui-calendarMenu-range-body-secondMonth-borderRadius: 0 0 8px 0;
1571
2156
  --gse-ui-calendarMenu-range-date-endDate-borderRadius: 0 16px 16px 0;
1572
2157
  --gse-ui-calendarMenu-range-date-startDate-borderRadius: 16px 0 0 16px;
1573
- --gse-ui-calendarMenu-disabled-opacity: 0.5;
2158
+ --gse-ui-calendarMenu-disabled-opacity: .5;
1574
2159
  --gse-ui-calendarMenu-monthBody-padding: 16px 24px;
1575
2160
  --gse-ui-calendarMenu-monthBody-gap: 2px;
1576
- --gse-ui-calendarMenu-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
2161
+ --gse-ui-calendarMenu-boxShadow-blur: 4px;
2162
+ --gse-ui-calendarMenu-boxShadow-spread: 1px;
2163
+ --gse-ui-calendarMenu-boxShadow-color: rgba(35, 57, 92, 0.1);
2164
+ --gse-ui-calendarMenu-boxShadow-type: dropShadow;
2165
+ --gse-ui-calendarMenu-boxShadow-offsetX: 0;
2166
+ --gse-ui-calendarMenu-boxShadow-offsetY: 0;
1577
2167
  --gse-ui-datePicker-range-gap: 24px;
1578
2168
  --gse-ui-datePicker-startEndInput-gap: 8px;
1579
2169
  --gse-ui-datePicker-dateTyped-gap: 10px;
1580
2170
  --gse-ui-datePicker-dateTyped-backgroundColor: #dee1fd;
1581
- --gse-ui-datePicker-disabled-opacity: 0.5;
2171
+ --gse-ui-datePicker-disabled-opacity: .5;
1582
2172
  --gse-ui-datePicker-focusCalendar-gap: 2px;
1583
2173
  --gse-ui-datePicker-iconHover: #3742a2;
1584
2174
  --gse-ui-datePicker-iconFocus: #3742a2;
1585
- --gse-ui-toggle-label: 400 12px/18px "Noto Sans";
2175
+ --gse-ui-toggle-label-fontFamily: "Noto Sans";
2176
+ --gse-ui-toggle-label-fontWeight: 400;
2177
+ --gse-ui-toggle-label-fontSize: 12px;
2178
+ --gse-ui-toggle-label-lineHeight: 18px;
1586
2179
  --gse-ui-toggle-gap: 8px;
1587
2180
  --gse-ui-toggle-padding: 8px;
1588
2181
  --gse-ui-toggle-track-width: 32px;
@@ -1598,32 +2191,51 @@
1598
2191
  --gse-ui-toggle-track-borderRadius: 100%;
1599
2192
  --gse-ui-toggle-handle-width: 16px;
1600
2193
  --gse-ui-toggle-handle-height: 16px;
1601
- --gse-ui-toggle-handle-hover-border: 2px solid #7b88f7;
1602
- --gse-ui-toggle-handle-enabled-border: 2px solid #4856cb;
1603
- --gse-ui-toggle-handle-disabled-border: 2px solid #4856cb;
1604
- --gse-ui-toggle-handle-error-border: 2px solid #e22245;
2194
+ --gse-ui-toggle-handle-hover-border-width: 2px;
2195
+ --gse-ui-toggle-handle-hover-border-style: solid;
2196
+ --gse-ui-toggle-handle-hover-border-color: #7b88f7;
2197
+ --gse-ui-toggle-handle-enabled-border-width: 2px;
2198
+ --gse-ui-toggle-handle-enabled-border-color: #4856cb;
2199
+ --gse-ui-toggle-handle-enabled-border-style: solid;
2200
+ --gse-ui-toggle-handle-disabled-border-width: 2px;
2201
+ --gse-ui-toggle-handle-disabled-border-color: #4856cb;
2202
+ --gse-ui-toggle-handle-disabled-border-style: solid;
2203
+ --gse-ui-toggle-handle-error-border-color: #e22245;
2204
+ --gse-ui-toggle-handle-error-border-width: 2px;
2205
+ --gse-ui-toggle-handle-error-border-style: solid;
1605
2206
  --gse-ui-toggle-handle-backgroundColor: #ffffff;
1606
2207
  --gse-ui-toggle-handle-foregroundColor: #4856cb;
1607
2208
  --gse-ui-toggle-handle-borderRadius: 16px;
1608
- --gse-ui-toggle-disabled-opacity: 0.5;
1609
- --gse-ui-toggle-focus-border: 2px solid #7b88f7;
2209
+ --gse-ui-toggle-disabled-opacity: .5;
2210
+ --gse-ui-toggle-focus-border-color: #7b88f7;
2211
+ --gse-ui-toggle-focus-border-width: 2px;
2212
+ --gse-ui-toggle-focus-border-style: solid;
1610
2213
  --gse-ui-toggle-focus-borderRadius: 100%;
1611
2214
  --gse-ui-toggle-focus-offset: 1px;
1612
2215
  --gse-ui-timePicker-clock-padding: 2px;
1613
2216
  --gse-ui-timePicker-clockStates-defaultColor: #3e5374;
1614
2217
  --gse-ui-timePicker-clockStates-hoverColor: #23395d;
1615
2218
  --gse-ui-timePicker-clockStates-activeColor: #1b2c48;
1616
- --gse-ui-timePicker-clockStates-disabledColor: lch(34.7 21.7 268 / 0.5);
1617
- --gse-ui-timePicker-focusClock-border: 2px solid #7b88f7;
2219
+ --gse-ui-timePicker-clockStates-disabledColor: #3e537480;
2220
+ --gse-ui-timePicker-focusClock-border-color: #7b88f7;
2221
+ --gse-ui-timePicker-focusClock-border-width: 2px;
2222
+ --gse-ui-timePicker-focusClock-border-style: solid;
1618
2223
  --gse-ui-timePicker-focusClock-borderRadius: 4px;
1619
- --gse-ui-timePicker-focusAmpm-border: 2px solid #7b88f7;
2224
+ --gse-ui-timePicker-focusAmpm-border-color: #7b88f7;
2225
+ --gse-ui-timePicker-focusAmpm-border-width: 2px;
2226
+ --gse-ui-timePicker-focusAmpm-border-style: solid;
1620
2227
  --gse-ui-timePicker-focusAmpm-borderRadius: 4px;
1621
- --gse-ui-timePicker-focusTime-border: 2px solid #7b88f7;
2228
+ --gse-ui-timePicker-focusTime-border-color: #7b88f7;
2229
+ --gse-ui-timePicker-focusTime-border-width: 2px;
2230
+ --gse-ui-timePicker-focusTime-border-style: solid;
1622
2231
  --gse-ui-timePicker-focusTime-borderRadius: 4px;
1623
2232
  --gse-ui-timePicker-ampm-padding: 2px;
1624
2233
  --gse-ui-colorPicker-label-requiredSymbolColor: #e22245;
1625
2234
  --gse-ui-colorPicker-label-textColor: #1b2c48;
1626
- --gse-ui-colorPicker-label-text: 400 12px/18px "Noto Sans";
2235
+ --gse-ui-colorPicker-label-text-fontFamily: "Noto Sans";
2236
+ --gse-ui-colorPicker-label-text-fontWeight: 400;
2237
+ --gse-ui-colorPicker-label-text-fontSize: 12px;
2238
+ --gse-ui-colorPicker-label-text-lineHeight: 18px;
1627
2239
  --gse-ui-colorPicker-inputContainer-backgroundColor: #ffffff;
1628
2240
  --gse-ui-colorPicker-inputContainer-border-defaultColor: #a3a7b0;
1629
2241
  --gse-ui-colorPicker-inputContainer-border-hoverColor: #3742a2;
@@ -1640,8 +2252,11 @@
1640
2252
  --gse-ui-slider-handle-active-backgroundColor: #252e78;
1641
2253
  --gse-ui-slider-handle-disabled-backgroundColor: #4856cb;
1642
2254
  --gse-ui-slider-handle-borderRadius: 100%;
1643
- --gse-ui-slider-disabled-opacity: 0.5;
1644
- --gse-ui-slider-label-text: 600 14px/20px "Noto Sans";
2255
+ --gse-ui-slider-disabled-opacity: .5;
2256
+ --gse-ui-slider-label-text-fontFamily: "Noto Sans";
2257
+ --gse-ui-slider-label-text-fontWeight: 600;
2258
+ --gse-ui-slider-label-text-fontSize: 14px;
2259
+ --gse-ui-slider-label-text-lineHeight: 20px;
1645
2260
  --gse-ui-slider-label-foregroundColor: #1b2c48;
1646
2261
  --gse-ui-slider-bar-selected-backgroundColor: #4856cb;
1647
2262
  --gse-ui-slider-bar-default-backgroundColor: #c6c8ce;
@@ -1679,8 +2294,10 @@
1679
2294
  --gse-ui-monthPicker-calendarStates-defaultColor: #3e5374;
1680
2295
  --gse-ui-monthPicker-calendarStates-hoverColor: #23395d;
1681
2296
  --gse-ui-monthPicker-calendarStates-activeColor: #1b2c48;
1682
- --gse-ui-monthPicker-calendarStates-disabledColor: lch(34.7 21.7 268 / 0.5);
1683
- --gse-ui-monthPicker-calendarStates-focus-border: 2px solid #7b88f7;
2297
+ --gse-ui-monthPicker-calendarStates-disabledColor: #3e537480;
2298
+ --gse-ui-monthPicker-calendarStates-focus-border-color: #7b88f7;
2299
+ --gse-ui-monthPicker-calendarStates-focus-border-width: 2px;
2300
+ --gse-ui-monthPicker-calendarStates-focus-border-style: solid;
1684
2301
  --gse-ui-selectorCard-ilustrativeIcon-foregroundColor: #3e5374;
1685
2302
  --gse-ui-selectorCard-text-foregroundColor: #1b2c48;
1686
2303
  --gse-ui-selectorCard-default-backgroundColor: #ffffff;
@@ -1692,7 +2309,9 @@
1692
2309
  --gse-ui-selectorCard-active-selectedIndicator-foregroundColor: #252e78;
1693
2310
  --gse-ui-selectorCard-error-backgroundColor: #f3a7b5;
1694
2311
  --gse-ui-selectorCard-error-selectedIndicator-foregroundColor: #e22245;
1695
- --gse-ui-selectorCard-error-border: 1px solid #e22245;
2312
+ --gse-ui-selectorCard-error-border-color: #e22245;
2313
+ --gse-ui-selectorCard-error-border-width: 1px;
2314
+ --gse-ui-selectorCard-error-border-style: solid;
1696
2315
  --gse-ui-selectorCard-simple-minWidth: 108px;
1697
2316
  --gse-ui-selectorCard-simple-maxWidth: 316px;
1698
2317
  --gse-ui-selectorCard-simple-minHeight: 76px;
@@ -1700,7 +2319,10 @@
1700
2319
  --gse-ui-selectorCard-simple-padding: 12px;
1701
2320
  --gse-ui-selectorCard-simple-gap: 8px;
1702
2321
  --gse-ui-selectorCard-simple-borderRadius: 8px;
1703
- --gse-ui-selectorCard-simple-label: 700 14px/24px Urbanist;
2322
+ --gse-ui-selectorCard-simple-label-fontFamily: Urbanist;
2323
+ --gse-ui-selectorCard-simple-label-fontWeight: 700;
2324
+ --gse-ui-selectorCard-simple-label-fontSize: 14px;
2325
+ --gse-ui-selectorCard-simple-label-lineHeight: 24px;
1704
2326
  --gse-ui-selectorCard-descriptive-minWidth: 216px;
1705
2327
  --gse-ui-selectorCard-descriptive-maxWidth: 316px;
1706
2328
  --gse-ui-selectorCard-descriptive-minHeight: 118px;
@@ -1710,20 +2332,35 @@
1710
2332
  --gse-ui-selectorCard-descriptive-text-gap: 4px;
1711
2333
  --gse-ui-selectorCard-descriptive-badge-marginTop: 8px;
1712
2334
  --gse-ui-selectorCard-descriptive-borderRadius: 16px;
1713
- --gse-ui-selectorCard-descriptive-label: 700 16px/24px Urbanist;
1714
- --gse-ui-selectorCard-descriptive-description: 400 12px/18px "Noto Sans";
1715
- --gse-ui-selectorCard-unselected-border: 1px solid #c6c8ce;
1716
- --gse-ui-selectorCard-selected-border: 1px solid #3742a2;
1717
- --gse-ui-selectorCard-disabled-opacity: 0.5;
2335
+ --gse-ui-selectorCard-descriptive-label-fontFamily: Urbanist;
2336
+ --gse-ui-selectorCard-descriptive-label-fontWeight: 700;
2337
+ --gse-ui-selectorCard-descriptive-label-fontSize: 16px;
2338
+ --gse-ui-selectorCard-descriptive-label-lineHeight: 24px;
2339
+ --gse-ui-selectorCard-descriptive-description-fontFamily: "Noto Sans";
2340
+ --gse-ui-selectorCard-descriptive-description-fontWeight: 400;
2341
+ --gse-ui-selectorCard-descriptive-description-fontSize: 12px;
2342
+ --gse-ui-selectorCard-descriptive-description-lineHeight: 18px;
2343
+ --gse-ui-selectorCard-unselected-border-color: #c6c8ce;
2344
+ --gse-ui-selectorCard-unselected-border-width: 1px;
2345
+ --gse-ui-selectorCard-unselected-border-style: solid;
2346
+ --gse-ui-selectorCard-selected-border-color: #3742a2;
2347
+ --gse-ui-selectorCard-selected-border-width: 1px;
2348
+ --gse-ui-selectorCard-selected-border-style: solid;
2349
+ --gse-ui-selectorCard-disabled-opacity: .5;
1718
2350
  --gse-ui-selectorCard-disabled-backgroundColor: #ffffff;
1719
2351
  --gse-ui-selectorCard-disabled-selectedIndicator-selected-foregroundColor: #4856cb;
1720
2352
  --gse-ui-selectorCard-disabled-selectedIndicator-unselected-foregroundColor: #767c8d;
1721
2353
  --gse-ui-ctaGroup-gap: 8px;
1722
2354
  --gse-ui-search-counter-default-foregroundColor: #626e84;
1723
2355
  --gse-ui-search-counter-hover-foregroundColor: #3742a2;
1724
- --gse-ui-search-counter-divider-border: 1px solid #a3a7b0;
2356
+ --gse-ui-search-counter-divider-border-color: #a3a7b0;
2357
+ --gse-ui-search-counter-divider-border-width: 1px;
2358
+ --gse-ui-search-counter-divider-border-style: solid;
1725
2359
  --gse-ui-search-counter-divider-foregroundColor: #a3a7b0;
1726
- --gse-ui-search-counter-text: 400 12px/18px "Noto Sans";
2360
+ --gse-ui-search-counter-text-fontFamily: "Noto Sans";
2361
+ --gse-ui-search-counter-text-fontWeight: 400;
2362
+ --gse-ui-search-counter-text-fontSize: 12px;
2363
+ --gse-ui-search-counter-text-lineHeight: 18px;
1727
2364
  --gse-ui-search-counter-gap: 4px;
1728
2365
  --gse-ui-search-counter-icon-height: 16px;
1729
2366
  --gse-ui-search-counter-icon-width: 16px;
@@ -1733,7 +2370,10 @@
1733
2370
  --gse-ui-search-match-subsequentLevel-foregroundColour: #1b2c48;
1734
2371
  --gse-ui-search-match-subsequentLevel-backgroundColor: #daf0f4;
1735
2372
  --gse-ui-simpleFilter-gap: 16px;
1736
- --gse-ui-dataTableItems-header-text: 700 12px/18px "Noto Sans";
2373
+ --gse-ui-dataTableItems-header-text-fontFamily: "Noto Sans";
2374
+ --gse-ui-dataTableItems-header-text-fontWeight: 700;
2375
+ --gse-ui-dataTableItems-header-text-fontSize: 12px;
2376
+ --gse-ui-dataTableItems-header-text-lineHeight: 18px;
1737
2377
  --gse-ui-dataTableItems-header-multiselect-default-height: 40px;
1738
2378
  --gse-ui-dataTableItems-header-multiselect-default-width: 41px;
1739
2379
  --gse-ui-dataTableItems-header-multiselect-default-selectedBar-height: 3px;
@@ -1755,7 +2395,9 @@
1755
2395
  --gse-ui-dataTableItems-header-gap: 8px;
1756
2396
  --gse-ui-dataTableItems-header-selectedBar-height: 3px;
1757
2397
  --gse-ui-dataTableItems-header-selectedBar-width: 229px;
1758
- --gse-ui-dataTableItems-divider: 1px solid #e8ebf7;
2398
+ --gse-ui-dataTableItems-divider-color: #e8ebf7;
2399
+ --gse-ui-dataTableItems-divider-width: 1px;
2400
+ --gse-ui-dataTableItems-divider-style: solid;
1759
2401
  --gse-ui-dataTableItems-scrollbar-borderRadius: 45px;
1760
2402
  --gse-ui-dataTableItems-scrollbar-foregroundColor: #626e84;
1761
2403
  --gse-ui-dataTableItems-cell-altBackgroundColor: #f3f5fb;
@@ -1778,7 +2420,10 @@
1778
2420
  --gse-ui-dataTableItems-cell-padding: 0 12px;
1779
2421
  --gse-ui-dataTableItems-cell-gap: 8px;
1780
2422
  --gse-ui-dataTableItems-cell-icon-foregroundColor: #1b2c48;
1781
- --gse-ui-dataTableItems-cell-text: 400 12px/18px "Noto Sans";
2423
+ --gse-ui-dataTableItems-cell-text-fontFamily: "Noto Sans";
2424
+ --gse-ui-dataTableItems-cell-text-fontWeight: 400;
2425
+ --gse-ui-dataTableItems-cell-text-fontSize: 12px;
2426
+ --gse-ui-dataTableItems-cell-text-lineHeight: 18px;
1782
2427
  --gse-ui-dataTableItems-cell-tablePagination-width: 727px;
1783
2428
  --gse-ui-dataTableItems-cell-tablePagination-height: 56px;
1784
2429
  --gse-ui-dataTableItems-cell-contextMenu-default-height: 40px;
@@ -1798,9 +2443,17 @@
1798
2443
  --gse-ui-dataTableItems-tableToolbar-height: 32px;
1799
2444
  --gse-ui-dataTableItems-tablePagination-recordsetControls-gap: 10px;
1800
2445
  --gse-ui-dataTableItems-tablePagination-padding: 12px;
1801
- --gse-ui-dataTableItems-tablePagination-divider: 1px solid #c6c8ce;
1802
- --gse-ui-dataTableItems-tablePagination-defaultText: 400 12px/18px "Noto Sans";
1803
- --gse-ui-dataTableItems-tablePagination-currentResultText: 700 12px/18px "Noto Sans";
2446
+ --gse-ui-dataTableItems-tablePagination-divider-color: #c6c8ce;
2447
+ --gse-ui-dataTableItems-tablePagination-divider-width: 1px;
2448
+ --gse-ui-dataTableItems-tablePagination-divider-style: solid;
2449
+ --gse-ui-dataTableItems-tablePagination-defaultText-fontFamily: "Noto Sans";
2450
+ --gse-ui-dataTableItems-tablePagination-defaultText-fontWeight: 400;
2451
+ --gse-ui-dataTableItems-tablePagination-defaultText-fontSize: 12px;
2452
+ --gse-ui-dataTableItems-tablePagination-defaultText-lineHeight: 18px;
2453
+ --gse-ui-dataTableItems-tablePagination-currentResultText-fontFamily: "Noto Sans";
2454
+ --gse-ui-dataTableItems-tablePagination-currentResultText-fontWeight: 700;
2455
+ --gse-ui-dataTableItems-tablePagination-currentResultText-fontSize: 12px;
2456
+ --gse-ui-dataTableItems-tablePagination-currentResultText-lineHeight: 18px;
1804
2457
  --gse-ui-dataTableItems-tablePagination-defaultBackgroundColor: #ffffff;
1805
2458
  --gse-ui-dataTableItems-tablePagination-foregroundColor: #1b2c48;
1806
2459
  --gse-ui-dataTableItems-tablePagination-countDisplay-gap: 4px;
@@ -1809,7 +2462,10 @@
1809
2462
  --gse-ui-avatar-large-badge-size: 24px;
1810
2463
  --gse-ui-avatar-large-focusRing-size: 98px;
1811
2464
  --gse-ui-avatar-large-content-size: 84px;
1812
- --gse-ui-avatar-large-initials: 600 36px/1 Urbanist;
2465
+ --gse-ui-avatar-large-initials-fontFamily: Urbanist;
2466
+ --gse-ui-avatar-large-initials-fontWeight: 600;
2467
+ --gse-ui-avatar-large-initials-fontSize: 36px;
2468
+ --gse-ui-avatar-large-initials-lineHeight: 1;
1813
2469
  --gse-ui-avatar-large-presenceRing-width: 4px;
1814
2470
  --gse-ui-avatar-large-ucIntegration-size: 32px;
1815
2471
  --gse-ui-avatar-presenceRing-available: linear-gradient(135deg, #09b581 0%, #9de1cd 100%);
@@ -1822,19 +2478,28 @@
1822
2478
  --gse-ui-avatar-medium-badge-size: 16px;
1823
2479
  --gse-ui-avatar-medium-focusRing-size: 50px;
1824
2480
  --gse-ui-avatar-medium-content-size: 40px;
1825
- --gse-ui-avatar-medium-initials: 600 18px/1 Urbanist;
2481
+ --gse-ui-avatar-medium-initials-fontFamily: Urbanist;
2482
+ --gse-ui-avatar-medium-initials-lineHeight: 1;
2483
+ --gse-ui-avatar-medium-initials-fontSize: 18px;
2484
+ --gse-ui-avatar-medium-initials-fontWeight: 600;
1826
2485
  --gse-ui-avatar-medium-presenceRing-width: 3px;
1827
2486
  --gse-ui-avatar-small-size: 32px;
1828
2487
  --gse-ui-avatar-small-badge-size: 8px;
1829
2488
  --gse-ui-avatar-small-focusRing-size: 34px;
1830
2489
  --gse-ui-avatar-small-content-size: 26px;
1831
- --gse-ui-avatar-small-initials: 600 12px/1 Urbanist;
2490
+ --gse-ui-avatar-small-initials-fontFamily: Urbanist;
2491
+ --gse-ui-avatar-small-initials-lineHeight: 1;
2492
+ --gse-ui-avatar-small-initials-fontSize: 12px;
2493
+ --gse-ui-avatar-small-initials-fontWeight: 600;
1832
2494
  --gse-ui-avatar-small-substract-size: 30px;
1833
2495
  --gse-ui-avatar-small-presenceRing-width: 2px;
1834
2496
  --gse-ui-avatar-xsmall-size: 24px;
1835
2497
  --gse-ui-avatar-xsmall-focusRing-size: 26px;
1836
2498
  --gse-ui-avatar-xsmall-content-size: 18px;
1837
- --gse-ui-avatar-xsmall-initials: 600 8px/1 Urbanist;
2499
+ --gse-ui-avatar-xsmall-initials-fontFamily: Urbanist;
2500
+ --gse-ui-avatar-xsmall-initials-lineHeight: 1;
2501
+ --gse-ui-avatar-xsmall-initials-fontSize: 8px;
2502
+ --gse-ui-avatar-xsmall-initials-fontWeight: 600;
1838
2503
  --gse-ui-avatar-xsmall-presenceRing-width: 2px;
1839
2504
  --gse-ui-avatar-badge-available-color: #09b581;
1840
2505
  --gse-ui-avatar-badge-busy-color: #e22245;
@@ -1866,28 +2531,51 @@
1866
2531
  --gse-ui-avatar-media-initialsForeground-default: #1b2c48;
1867
2532
  --gse-ui-avatar-media-initialsForeground-inverse: #ffffff;
1868
2533
  --gse-ui-avatar-media-initialsForeground-add: #4856cb;
1869
- --gse-ui-avatar-hoverModal-shroudColor: rgb(24.3% 32.5% 45.5% / 0.8);
2534
+ --gse-ui-avatar-hoverModal-shroudColor: #3e5374cc;
1870
2535
  --gse-ui-avatar-hoverModal-foregroundColor: #ffffff;
1871
- --gse-ui-avatar-hoverModal-opacity: 0.8;
2536
+ --gse-ui-avatar-hoverModal-opacity: .8;
1872
2537
  --gse-ui-avatar-content-borderRadius: 100%;
1873
- --gse-ui-avatar-content-default-border: 1px solid #ffffff;
1874
- --gse-ui-avatar-content-large-border: 2px solid #ffffff;
2538
+ --gse-ui-avatar-content-default-border-color: #ffffff;
2539
+ --gse-ui-avatar-content-default-border-width: 1px;
2540
+ --gse-ui-avatar-content-default-border-style: solid;
2541
+ --gse-ui-avatar-content-large-border-color: #ffffff;
2542
+ --gse-ui-avatar-content-large-border-width: 2px;
2543
+ --gse-ui-avatar-content-large-border-style: solid;
1875
2544
  --gse-ui-avatar-groupSet-gap: -2px;
1876
2545
  --gse-ui-avatar-focusRing-large-borderRadius: 100%;
1877
- --gse-ui-avatar-focusRing-large-border: 2px solid #7b88f7;
2546
+ --gse-ui-avatar-focusRing-large-border-color: #7b88f7;
2547
+ --gse-ui-avatar-focusRing-large-border-width: 2px;
2548
+ --gse-ui-avatar-focusRing-large-border-style: solid;
1878
2549
  --gse-ui-avatar-focusRing-mediumSmall-borderRadius: 100%;
1879
- --gse-ui-avatar-focusRing-medium-border: 2px solid #7b88f7;
1880
- --gse-ui-avatar-focusRing-small-border: 2px solid #7b88f7;
1881
- --gse-ui-avatar-focusRing-xsmall-border: 2px solid #7b88f7;
2550
+ --gse-ui-avatar-focusRing-medium-border-color: #7b88f7;
2551
+ --gse-ui-avatar-focusRing-medium-border-width: 2px;
2552
+ --gse-ui-avatar-focusRing-medium-border-style: solid;
2553
+ --gse-ui-avatar-focusRing-small-border-color: #7b88f7;
2554
+ --gse-ui-avatar-focusRing-small-border-width: 2px;
2555
+ --gse-ui-avatar-focusRing-small-border-style: solid;
2556
+ --gse-ui-avatar-focusRing-xsmall-border-color: #7b88f7;
2557
+ --gse-ui-avatar-focusRing-xsmall-border-width: 2px;
2558
+ --gse-ui-avatar-focusRing-xsmall-border-style: solid;
1882
2559
  --gse-ui-avatar-focus: #7b88f7;
1883
2560
  --gse-ui-avatar-addChangeImage-hoverModal-shroudSize: 84px;
1884
2561
  --gse-ui-avatar-addChangeImage-icon-size: 16px;
1885
2562
  --gse-ui-globalNav-sideMenu: linear-gradient(135deg, #09b581 0%, #9de1cd 100%);
1886
- --gse-ui-globalNav-text: 700 12px/16px Roboto;
1887
- --gse-ui-globalNav-toggle-onQueue-text: 600 12px/16px Roboto;
2563
+ --gse-ui-globalNav-text-fontFamily: Roboto;
2564
+ --gse-ui-globalNav-text-lineHeight: 16px;
2565
+ --gse-ui-globalNav-text-fontSize: 12px;
2566
+ --gse-ui-globalNav-text-fontWeight: 700;
2567
+ --gse-ui-globalNav-toggle-onQueue-text-fontFamily: Roboto;
2568
+ --gse-ui-globalNav-toggle-onQueue-text-lineHeight: 16px;
2569
+ --gse-ui-globalNav-toggle-onQueue-text-fontSize: 12px;
2570
+ --gse-ui-globalNav-toggle-onQueue-text-fontWeight: 600;
1888
2571
  --gse-ui-globalNav-toggle-gap: 16px;
1889
- --gse-ui-globalNav-toggle-offQueue-text: 400 12px/16px Roboto;
1890
- --gse-ui-globalNav-focus-border: 3px solid #7b88f7;
2572
+ --gse-ui-globalNav-toggle-offQueue-text-fontFamily: Roboto;
2573
+ --gse-ui-globalNav-toggle-offQueue-text-lineHeight: 16px;
2574
+ --gse-ui-globalNav-toggle-offQueue-text-fontSize: 12px;
2575
+ --gse-ui-globalNav-toggle-offQueue-text-fontWeight: 400;
2576
+ --gse-ui-globalNav-focus-border-color: #7b88f7;
2577
+ --gse-ui-globalNav-focus-border-width: 3px;
2578
+ --gse-ui-globalNav-focus-border-style: solid;
1891
2579
  --gse-ui-globalNav-menuOption-height: 32px;
1892
2580
  --gse-ui-globalNav-menuOption-width: 248px;
1893
2581
  --gse-ui-globalNav-menuOption-padding: 0px 12px;
@@ -1914,7 +2602,9 @@
1914
2602
  --gse-ui-globalNav-buttonReturn-width: 280px;
1915
2603
  --gse-ui-globalNav-buttonReturn-padding: 16px 28px;
1916
2604
  --gse-ui-globalNav-buttonReturn-gap: 12px;
1917
- --gse-ui-globalNav-treeView-border: 2px solid #3e5374;
2605
+ --gse-ui-globalNav-treeView-border-color: #3e5374;
2606
+ --gse-ui-globalNav-treeView-border-width: 2px;
2607
+ --gse-ui-globalNav-treeView-border-style: solid;
1918
2608
  --gse-ui-globalNav-treeView-gap: 8px;
1919
2609
  --gse-ui-globalNav-treeView-width: 224px;
1920
2610
  --gse-ui-globalNav-bar-padding: 8px 12px;
@@ -1923,7 +2613,7 @@
1923
2613
  --gse-ui-globalNav-topBar-height: 64px;
1924
2614
  --gse-ui-globalNav-topBar-frame-backgroundColor: #ffffff;
1925
2615
  --gse-ui-globalNav-topBar-frame-stroke: #c6ceec;
1926
- --gse-ui-globalNav-topBar-logo: #ff4f1f; /* Brand Orange from Spark 1.0 */
2616
+ --gse-ui-globalNav-topBar-logo: #ff4f1f;
1927
2617
  --gse-ui-globalNav-topBar-menuButton-closed-default-foregroundColor: #4856cb;
1928
2618
  --gse-ui-globalNav-topBar-menuButton-closed-hover-backgroundColor: #3742a2;
1929
2619
  --gse-ui-globalNav-topBar-menuButton-closed-hover-foregroundColorStroke: #4856cb;
@@ -1934,14 +2624,24 @@
1934
2624
  --gse-ui-globalNav-panel-panelTitle: #ffffff;
1935
2625
  --gse-ui-globalNav-panel-primary: linear-gradient(127deg, #23395d 3.19%, #3e5374 225.06%);
1936
2626
  --gse-ui-globalNav-panel-secondary: linear-gradient(358deg, #1b2b48 0.16%, #23395d 98.45%);
1937
- --gse-ui-dataTableComposed-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
2627
+ --gse-ui-dataTableComposed-boxShadow-blur: 4px;
2628
+ --gse-ui-dataTableComposed-boxShadow-spread: 1px;
2629
+ --gse-ui-dataTableComposed-boxShadow-color: rgba(35, 57, 92, 0.1);
2630
+ --gse-ui-dataTableComposed-boxShadow-type: dropShadow;
2631
+ --gse-ui-dataTableComposed-boxShadow-offsetX: 0;
2632
+ --gse-ui-dataTableComposed-boxShadow-offsetY: 0;
1938
2633
  --gse-ui-dataTableComposed-width: 1440px;
1939
- --gse-ui-focus: 2px solid #7b88f7;
2634
+ --gse-ui-focus-color: #7b88f7;
2635
+ --gse-ui-focus-width: 2px;
2636
+ --gse-ui-focus-style: solid;
1940
2637
  --gse-ui-tabs-item-height: 40px;
1941
2638
  --gse-ui-tabs-item-horizontal-fixedHeight: 40px;
1942
2639
  --gse-ui-tabs-item-horizontal-padding: 11px 12px 10px;
1943
- --gse-ui-tabs-item-disableOpacity: 0.5;
1944
- --gse-ui-tabs-item-itemText: 400 12px/18px "Noto Sans";
2640
+ --gse-ui-tabs-item-disableOpacity: .5;
2641
+ --gse-ui-tabs-item-itemText-fontFamily: "Noto Sans";
2642
+ --gse-ui-tabs-item-itemText-fontWeight: 400;
2643
+ --gse-ui-tabs-item-itemText-fontSize: 12px;
2644
+ --gse-ui-tabs-item-itemText-lineHeight: 18px;
1945
2645
  --gse-ui-tabs-item-itemTextColor: #1b2c48;
1946
2646
  --gse-ui-tabs-item-divider-horizontal-height: 1px;
1947
2647
  --gse-ui-tabs-item-divider-vertical-height: 40px;
@@ -1967,13 +2667,17 @@
1967
2667
  --gse-ui-tabs-set-gap: -1px;
1968
2668
  --gse-ui-tabs-set-divider-horizontal-height: 1px;
1969
2669
  --gse-ui-tabs-set-divider-vertical-width: 1px;
1970
- --gse-ui-tabs-focusRing-border: 2px solid #7b88f7;
2670
+ --gse-ui-tabs-focusRing-border-color: #7b88f7;
2671
+ --gse-ui-tabs-focusRing-border-width: 2px;
2672
+ --gse-ui-tabs-focusRing-border-style: solid;
1971
2673
  --gse-ui-tabs-focusRing-borderRadius: 4px;
1972
2674
  --gse-ui-advancedTabs-divider-dividerColor: #c6c8ce;
1973
2675
  --gse-ui-advancedTabs-item-padding: 11px 12px 10px;
1974
2676
  --gse-ui-advancedTabs-item-gap: 8px;
1975
2677
  --gse-ui-advancedTabs-item-focus-borderRadius: 8px;
1976
- --gse-ui-advancedTabs-item-focus-border: 2px solid #7b88f7;
2678
+ --gse-ui-advancedTabs-item-focus-border-color: #7b88f7;
2679
+ --gse-ui-advancedTabs-item-focus-border-width: 2px;
2680
+ --gse-ui-advancedTabs-item-focus-border-style: solid;
1977
2681
  --gse-ui-advancedTabs-item-focus-borderCopy: 4px;
1978
2682
  --gse-ui-advancedTabs-item-backgroundColor: #ffffff;
1979
2683
  --gse-ui-advancedTabs-item-borderRadius: 4px 4px 0 0;
@@ -1998,7 +2702,10 @@
1998
2702
  --gse-ui-advancedTabs-item-menuButton-activeColor: #1b2c48;
1999
2703
  --gse-ui-advancedTabs-item-menuButton-focus-height: 53px;
2000
2704
  --gse-ui-advancedTabs-item-menuButton-focus-width: 40px;
2001
- --gse-ui-advancedTabs-item-itemText: 400 12px/18px "Noto Sans";
2705
+ --gse-ui-advancedTabs-item-itemText-fontFamily: "Noto Sans";
2706
+ --gse-ui-advancedTabs-item-itemText-fontWeight: 400;
2707
+ --gse-ui-advancedTabs-item-itemText-fontSize: 12px;
2708
+ --gse-ui-advancedTabs-item-itemText-lineHeight: 18px;
2002
2709
  --gse-ui-advancedTabs-button-add-height: 45px;
2003
2710
  --gse-ui-advancedTabs-button-arrow-height: 48px;
2004
2711
  --gse-ui-advancedTabs-set-backgroundColor: #f3f5fb;
@@ -2019,38 +2726,62 @@
2019
2726
  --gse-ui-toast-error-backgroundColor: #ffffff;
2020
2727
  --gse-ui-toast-error-foregroundColor: #1b2c48;
2021
2728
  --gse-ui-toast-error-iconColor: #e22245;
2022
- --gse-ui-toast-heading: 700 16px/24px Urbanist;
2023
- --gse-ui-toast-text: 400 14px/20px "Noto Sans";
2729
+ --gse-ui-toast-heading-fontFamily: Urbanist;
2730
+ --gse-ui-toast-heading-fontWeight: 700;
2731
+ --gse-ui-toast-heading-fontSize: 16px;
2732
+ --gse-ui-toast-heading-lineHeight: 24px;
2733
+ --gse-ui-toast-text-fontFamily: "Noto Sans";
2734
+ --gse-ui-toast-text-fontWeight: 400;
2735
+ --gse-ui-toast-text-fontSize: 14px;
2736
+ --gse-ui-toast-text-lineHeight: 20px;
2024
2737
  --gse-ui-toast-margin: 16px;
2025
2738
  --gse-ui-toast-gap: 12px;
2026
2739
  --gse-ui-toast-gapText: 4px;
2027
2740
  --gse-ui-toast-gapButton: 16px;
2028
2741
  --gse-ui-toast-buttonBar-gap: 8px;
2029
2742
  --gse-ui-toast-borderRadius: 8px;
2030
- --gse-ui-toast-boxShadow: 0 0 4px 1px rgba(35,57,92,0.1);
2743
+ --gse-ui-toast-boxShadow-blur: 4px;
2744
+ --gse-ui-toast-boxShadow-spread: 1px;
2745
+ --gse-ui-toast-boxShadow-color: rgba(35, 57, 92, 0.1);
2746
+ --gse-ui-toast-boxShadow-type: dropShadow;
2747
+ --gse-ui-toast-boxShadow-offsetX: 0;
2748
+ --gse-ui-toast-boxShadow-offsetY: 0;
2031
2749
  --gse-ui-toast-icon: 24px;
2032
2750
  --gse-ui-toast-wrappingWidth: 320px;
2033
2751
  --gse-ui-toast-stacking-gap: 4px;
2034
2752
  --gse-ui-modal-closeButtonColor: #3e5374;
2035
2753
  --gse-ui-modal-headerColor: #1b2c48;
2036
2754
  --gse-ui-modal-backgroundColor: #ffffff;
2037
- --gse-ui-modal-shroudColor: rgb(24.3% 32.5% 45.5% / 0.8);
2755
+ --gse-ui-modal-shroudColor: #3e5374cc;
2038
2756
  --gse-ui-modal-header-gap: 12px;
2039
2757
  --gse-ui-modal-padding: 32px;
2040
2758
  --gse-ui-modal-gap: 16px;
2041
- --gse-ui-modal-heading: 700 24px/32px Urbanist;
2759
+ --gse-ui-modal-heading-fontFamily: Urbanist;
2760
+ --gse-ui-modal-heading-fontWeight: 700;
2761
+ --gse-ui-modal-heading-fontSize: 24px;
2762
+ --gse-ui-modal-heading-lineHeight: 32px;
2042
2763
  --gse-ui-modal-icon: 32px;
2043
2764
  --gse-ui-modal-small-width: 420px;
2044
2765
  --gse-ui-modal-medium-width: 680px;
2045
2766
  --gse-ui-modal-large-width: 800px;
2046
2767
  --gse-ui-modal-buttonBar-gap: 8px;
2047
- --gse-ui-modal-boxShadow: 0 0 8px 1px rgba(35,57,92,0.15);
2768
+ --gse-ui-modal-boxShadow-blur: 8px;
2769
+ --gse-ui-modal-boxShadow-spread: 1px;
2770
+ --gse-ui-modal-boxShadow-color: rgba(35, 57, 92, 0.15);
2771
+ --gse-ui-modal-boxShadow-type: dropShadow;
2772
+ --gse-ui-modal-boxShadow-offsetX: 0;
2773
+ --gse-ui-modal-boxShadow-offsetY: 0;
2048
2774
  --gse-ui-modal-borderRadius: 16px;
2049
- --gse-ui-modal-shroud-opacity: 0.8;
2775
+ --gse-ui-modal-shroud-opacity: .8;
2050
2776
  --gse-ui-modal-dismissButton-paddingTop: 16px;
2051
2777
  --gse-ui-modal-dismissButton-paddingRight: 8px;
2052
2778
  --gse-ui-popover-borderRadius: 8px;
2053
- --gse-ui-popover-boxShadow: 0 0 8px 1px rgba(35,57,92,0.15);
2779
+ --gse-ui-popover-boxShadow-blur: 8px;
2780
+ --gse-ui-popover-boxShadow-spread: 1px;
2781
+ --gse-ui-popover-boxShadow-color: rgba(35, 57, 92, 0.15);
2782
+ --gse-ui-popover-boxShadow-type: dropShadow;
2783
+ --gse-ui-popover-boxShadow-offsetX: 0;
2784
+ --gse-ui-popover-boxShadow-offsetY: 0;
2054
2785
  --gse-ui-popover-closeButtonColor: #3e5374;
2055
2786
  --gse-ui-popover-headerColor: #1b2c48;
2056
2787
  --gse-ui-popover-backgroundColor: #ffffff;
@@ -2059,24 +2790,51 @@
2059
2790
  --gse-ui-popover-buttonsBar-gap: 8px;
2060
2791
  --gse-ui-popover-header-gap: 4px;
2061
2792
  --gse-ui-popover-spacer-height: 16px;
2062
- --gse-ui-popover-body-text: 400 14px/20px "Noto Sans";
2063
- --gse-ui-popover-title-text: 700 16px/24px Urbanist;
2793
+ --gse-ui-popover-body-text-fontFamily: "Noto Sans";
2794
+ --gse-ui-popover-body-text-fontWeight: 400;
2795
+ --gse-ui-popover-body-text-fontSize: 14px;
2796
+ --gse-ui-popover-body-text-lineHeight: 20px;
2797
+ --gse-ui-popover-title-text-fontFamily: Urbanist;
2798
+ --gse-ui-popover-title-text-fontWeight: 700;
2799
+ --gse-ui-popover-title-text-fontSize: 16px;
2800
+ --gse-ui-popover-title-text-lineHeight: 24px;
2064
2801
  --gse-ui-popover-anchor-width: 20px;
2065
2802
  --gse-ui-popover-anchor-height: 8px;
2066
2803
  --gse-ui-progressAndLoading-spinner-foreground: #4856cb;
2067
2804
  --gse-ui-progressAndLoading-spinner-base: #dee1fd;
2068
- --gse-ui-progressAndLoading-spinner-large: 48px; /* keeping hard code as it cant have "px" */
2069
- --gse-ui-progressAndLoading-spinner-small: 16px; /* keeping hard code as it cant have "px" */
2070
- --gse-ui-progressAndLoading-spinner-text: 600 12px/18px "Noto Sans";
2805
+ --gse-ui-progressAndLoading-spinner-large: 48px;
2806
+ --gse-ui-progressAndLoading-spinner-small: 16px;
2807
+ --gse-ui-progressAndLoading-spinner-text-fontFamily: "Noto Sans";
2808
+ --gse-ui-progressAndLoading-spinner-text-fontWeight: 600;
2809
+ --gse-ui-progressAndLoading-spinner-text-fontSize: 12px;
2810
+ --gse-ui-progressAndLoading-spinner-text-lineHeight: 18px;
2071
2811
  --gse-ui-progressAndLoading-textColor: #1b2c48;
2072
- --gse-ui-progressAndLoading-loadingState-large-header: 700 24px/32px Urbanist;
2073
- --gse-ui-progressAndLoading-loadingState-large-subheader: 600 16px/24px "Noto Sans";
2812
+ --gse-ui-progressAndLoading-loadingState-large-header-fontFamily: Urbanist;
2813
+ --gse-ui-progressAndLoading-loadingState-large-header-fontWeight: 700;
2814
+ --gse-ui-progressAndLoading-loadingState-large-header-fontSize: 24px;
2815
+ --gse-ui-progressAndLoading-loadingState-large-header-lineHeight: 32px;
2816
+ --gse-ui-progressAndLoading-loadingState-large-subheader-fontFamily: "Noto Sans";
2817
+ --gse-ui-progressAndLoading-loadingState-large-subheader-fontWeight: 600;
2818
+ --gse-ui-progressAndLoading-loadingState-large-subheader-fontSize: 16px;
2819
+ --gse-ui-progressAndLoading-loadingState-large-subheader-lineHeight: 24px;
2074
2820
  --gse-ui-progressAndLoading-loadingState-large-width: 600px;
2075
- --gse-ui-progressAndLoading-loadingState-medium-header: 700 18px/27px Urbanist;
2076
- --gse-ui-progressAndLoading-loadingState-medium-subheader: 600 14px/20px "Noto Sans";
2821
+ --gse-ui-progressAndLoading-loadingState-medium-header-fontFamily: Urbanist;
2822
+ --gse-ui-progressAndLoading-loadingState-medium-header-fontWeight: 700;
2823
+ --gse-ui-progressAndLoading-loadingState-medium-header-fontSize: 18px;
2824
+ --gse-ui-progressAndLoading-loadingState-medium-header-lineHeight: 27px;
2825
+ --gse-ui-progressAndLoading-loadingState-medium-subheader-fontFamily: "Noto Sans";
2826
+ --gse-ui-progressAndLoading-loadingState-medium-subheader-fontWeight: 600;
2827
+ --gse-ui-progressAndLoading-loadingState-medium-subheader-fontSize: 14px;
2828
+ --gse-ui-progressAndLoading-loadingState-medium-subheader-lineHeight: 20px;
2077
2829
  --gse-ui-progressAndLoading-loadingState-medium-width: 400px;
2078
- --gse-ui-progressAndLoading-loadingState-small-header: 700 16px/24px Urbanist;
2079
- --gse-ui-progressAndLoading-loadingState-small-subheader: 600 12px/18px "Noto Sans";
2830
+ --gse-ui-progressAndLoading-loadingState-small-header-fontFamily: Urbanist;
2831
+ --gse-ui-progressAndLoading-loadingState-small-header-fontWeight: 700;
2832
+ --gse-ui-progressAndLoading-loadingState-small-header-fontSize: 16px;
2833
+ --gse-ui-progressAndLoading-loadingState-small-header-lineHeight: 24px;
2834
+ --gse-ui-progressAndLoading-loadingState-small-subheader-fontFamily: "Noto Sans";
2835
+ --gse-ui-progressAndLoading-loadingState-small-subheader-fontWeight: 600;
2836
+ --gse-ui-progressAndLoading-loadingState-small-subheader-fontSize: 12px;
2837
+ --gse-ui-progressAndLoading-loadingState-small-subheader-lineHeight: 18px;
2080
2838
  --gse-ui-progressAndLoading-loadingState-small-width: 200px;
2081
2839
  --gse-ui-progressAndLoading-large-gap: 24px;
2082
2840
  --gse-ui-progressAndLoading-large-gapText: 4px;
@@ -2085,13 +2843,25 @@
2085
2843
  --gse-ui-progressAndLoading-medium-gapText: 4px;
2086
2844
  --gse-ui-progressAndLoading-small-gap: 12px;
2087
2845
  --gse-ui-progressAndLoading-small-gapText: 4px;
2088
- --gse-ui-progressAndLoading-blankState-large-header: 700 18px/27px Urbanist;
2089
- --gse-ui-progressAndLoading-blankState-large-subheader: 600 14px/20px "Noto Sans";
2090
- --gse-ui-progressAndLoading-blankState-small-header: 700 14px/24px Urbanist;
2091
- --gse-ui-progressAndLoading-blankState-small-subheader: 600 12px/18px "Noto Sans";
2092
- --gse-ui-progressAndLoading-largeBorder: 4px; /* Remove px because of SVG issues from COMUI-2226 */
2093
- --gse-ui-progressAndLoading-smallBorder: 2px; /* Remove px because of SVG issues from COMUI-2226 */
2094
- --gse-ui-progressAndLoading-thinBorder: 1px; /* Remove px because of SVG issues from COMUI-2226 */
2846
+ --gse-ui-progressAndLoading-blankState-large-header-fontFamily: Urbanist;
2847
+ --gse-ui-progressAndLoading-blankState-large-header-fontWeight: 700;
2848
+ --gse-ui-progressAndLoading-blankState-large-header-fontSize: 18px;
2849
+ --gse-ui-progressAndLoading-blankState-large-header-lineHeight: 27px;
2850
+ --gse-ui-progressAndLoading-blankState-large-subheader-fontFamily: "Noto Sans";
2851
+ --gse-ui-progressAndLoading-blankState-large-subheader-fontWeight: 600;
2852
+ --gse-ui-progressAndLoading-blankState-large-subheader-fontSize: 14px;
2853
+ --gse-ui-progressAndLoading-blankState-large-subheader-lineHeight: 20px;
2854
+ --gse-ui-progressAndLoading-blankState-small-header-fontFamily: Urbanist;
2855
+ --gse-ui-progressAndLoading-blankState-small-header-fontWeight: 700;
2856
+ --gse-ui-progressAndLoading-blankState-small-header-fontSize: 14px;
2857
+ --gse-ui-progressAndLoading-blankState-small-header-lineHeight: 24px;
2858
+ --gse-ui-progressAndLoading-blankState-small-subheader-fontFamily: "Noto Sans";
2859
+ --gse-ui-progressAndLoading-blankState-small-subheader-fontWeight: 600;
2860
+ --gse-ui-progressAndLoading-blankState-small-subheader-fontSize: 12px;
2861
+ --gse-ui-progressAndLoading-blankState-small-subheader-lineHeight: 18px;
2862
+ --gse-ui-progressAndLoading-largeBorder: 4px;
2863
+ --gse-ui-progressAndLoading-smallBorder: 2px;
2864
+ --gse-ui-progressAndLoading-thinBorder: 1px;
2095
2865
  --gse-ui-blankState-small-width: 250px;
2096
2866
  --gse-ui-blankState-small-maxWidth: 569px;
2097
2867
  --gse-ui-blankState-large-minWidth: 570px;
@@ -2109,11 +2879,17 @@
2109
2879
  --gse-ui-modalSideSheet-headerColor: #1b2c48;
2110
2880
  --gse-ui-modalSideSheet-closeColor: #3e5374;
2111
2881
  --gse-ui-modalSideSheet-dividerColor: #c6c8ce;
2112
- --gse-ui-modalSideSheet-shroudColor: rgb(24.3% 32.5% 45.5% / 0.8);
2113
- --gse-ui-modalSideSheet-shroud-opacity: 0.8;
2882
+ --gse-ui-modalSideSheet-shroudColor: #3e5374cc;
2883
+ --gse-ui-modalSideSheet-shroud-opacity: .8;
2114
2884
  --gse-ui-modalSideSheet-descriptionColor: #3e5374;
2115
- --gse-ui-modalSideSheet-heading: 600 18px/27px Urbanist;
2116
- --gse-ui-modalSideSheet-description: 400 12px/18px "Noto Sans";
2885
+ --gse-ui-modalSideSheet-heading-fontFamily: Urbanist;
2886
+ --gse-ui-modalSideSheet-heading-fontWeight: 600;
2887
+ --gse-ui-modalSideSheet-heading-fontSize: 18px;
2888
+ --gse-ui-modalSideSheet-heading-lineHeight: 27px;
2889
+ --gse-ui-modalSideSheet-description-fontFamily: "Noto Sans";
2890
+ --gse-ui-modalSideSheet-description-fontWeight: 400;
2891
+ --gse-ui-modalSideSheet-description-fontSize: 12px;
2892
+ --gse-ui-modalSideSheet-description-lineHeight: 18px;
2117
2893
  --gse-ui-modalSideSheet-header-interiorGap: 12px;
2118
2894
  --gse-ui-modalSideSheet-header-paddingTop: 24px;
2119
2895
  --gse-ui-modalSideSheet-header-paddingLeft: 24px;
@@ -2130,10 +2906,21 @@
2130
2906
  --gse-ui-dynamicSideSheet-headerColor: #1b2c48;
2131
2907
  --gse-ui-dynamicSideSheet-closeColor: #3e5374;
2132
2908
  --gse-ui-dynamicSideSheet-dividerColor: #c6c8ce;
2133
- --gse-ui-dynamicSideSheet-boxShadow: 0 0 6px 1px rgba(35,57,92,0.12);
2909
+ --gse-ui-dynamicSideSheet-boxShadow-blur: 6px;
2910
+ --gse-ui-dynamicSideSheet-boxShadow-spread: 1px;
2911
+ --gse-ui-dynamicSideSheet-boxShadow-color: rgba(35, 57, 92, 0.12);
2912
+ --gse-ui-dynamicSideSheet-boxShadow-type: dropShadow;
2913
+ --gse-ui-dynamicSideSheet-boxShadow-offsetX: 0;
2914
+ --gse-ui-dynamicSideSheet-boxShadow-offsetY: 0;
2134
2915
  --gse-ui-dynamicSideSheet-descriptionColor: #3e5374;
2135
- --gse-ui-dynamicSideSheet-heading: 600 18px/27px Urbanist;
2136
- --gse-ui-dynamicSideSheet-description: 400 12px/18px "Noto Sans";
2916
+ --gse-ui-dynamicSideSheet-heading-fontFamily: Urbanist;
2917
+ --gse-ui-dynamicSideSheet-heading-fontWeight: 600;
2918
+ --gse-ui-dynamicSideSheet-heading-fontSize: 18px;
2919
+ --gse-ui-dynamicSideSheet-heading-lineHeight: 27px;
2920
+ --gse-ui-dynamicSideSheet-description-fontFamily: "Noto Sans";
2921
+ --gse-ui-dynamicSideSheet-description-fontWeight: 400;
2922
+ --gse-ui-dynamicSideSheet-description-fontSize: 12px;
2923
+ --gse-ui-dynamicSideSheet-description-lineHeight: 18px;
2137
2924
  --gse-ui-dynamicSideSheet-header-interiorGap: 12px;
2138
2925
  --gse-ui-dynamicSideSheet-header-paddingTop: 24px;
2139
2926
  --gse-ui-dynamicSideSheet-header-paddingLeft: 24px;
@@ -2153,7 +2940,10 @@
2153
2940
  --gse-ui-accordion-header-default-foreground-chevronIcon-closed: #3e5374;
2154
2941
  --gse-ui-accordion-header-default-foreground-chevronIcon-open: #1b2c48;
2155
2942
  --gse-ui-accordion-header-default-foreground-chevronIcon-hover: #23395d;
2156
- --gse-ui-accordion-header-label-defaultText: 700 14px/20px "Noto Sans";
2943
+ --gse-ui-accordion-header-label-defaultText-fontFamily: "Noto Sans";
2944
+ --gse-ui-accordion-header-label-defaultText-fontWeight: 700;
2945
+ --gse-ui-accordion-header-label-defaultText-fontSize: 14px;
2946
+ --gse-ui-accordion-header-label-defaultText-lineHeight: 20px;
2157
2947
  --gse-ui-accordion-reversedHeader-padding: 2px;
2158
2948
  --gse-ui-accordion-menuItem-height: 32px;
2159
2949
  --gse-ui-accordion-menuItem-padding: 0 12px 0 24px;
@@ -2175,19 +2965,35 @@
2175
2965
  --gse-ui-accordion-menuItem-selected-foreground-parentIconColor: #1b2c48;
2176
2966
  --gse-ui-accordion-menuItem-selected-backgroundColor: #ced2fc;
2177
2967
  --gse-ui-accordion-menuItem-focus-borderRadius: 4px;
2178
- --gse-ui-accordion-menuItem-label-defaultText: 400 12px/18px "Noto Sans";
2179
- --gse-ui-accordion-menuItem-label-selectedText: 600 12px/18px "Noto Sans";
2180
- --gse-ui-accordion-menuItem-shortcut-text: 400 14px/20px "Noto Sans";
2181
- --gse-ui-accordion-focusBorder: 2px solid #7b88f7;
2968
+ --gse-ui-accordion-menuItem-label-defaultText-fontFamily: "Noto Sans";
2969
+ --gse-ui-accordion-menuItem-label-defaultText-fontWeight: 400;
2970
+ --gse-ui-accordion-menuItem-label-defaultText-fontSize: 12px;
2971
+ --gse-ui-accordion-menuItem-label-defaultText-lineHeight: 18px;
2972
+ --gse-ui-accordion-menuItem-label-selectedText-fontFamily: "Noto Sans";
2973
+ --gse-ui-accordion-menuItem-label-selectedText-fontWeight: 600;
2974
+ --gse-ui-accordion-menuItem-label-selectedText-fontSize: 12px;
2975
+ --gse-ui-accordion-menuItem-label-selectedText-lineHeight: 18px;
2976
+ --gse-ui-accordion-menuItem-shortcut-text-fontFamily: "Noto Sans";
2977
+ --gse-ui-accordion-menuItem-shortcut-text-fontWeight: 400;
2978
+ --gse-ui-accordion-menuItem-shortcut-text-fontSize: 14px;
2979
+ --gse-ui-accordion-menuItem-shortcut-text-lineHeight: 20px;
2980
+ --gse-ui-accordion-focusBorder-color: #7b88f7;
2981
+ --gse-ui-accordion-focusBorder-style: solid;
2982
+ --gse-ui-accordion-focusBorder-width: 2px;
2182
2983
  --gse-ui-accordion-contentItem-padding: 16px;
2183
2984
  --gse-ui-accordion-contentItem-gap: 16px;
2184
2985
  --gse-ui-accordion-contentItem-foregroundColor: #1b2c48;
2185
2986
  --gse-ui-accordion-contentItem-backgroundColor: #ffffff;
2186
- --gse-ui-accordion-contentItem-defaultText: 400 12px/18px "Noto Sans";
2187
- --gse-ui-accordion-wrapper-dividerBorder: 1px solid #c6c8ce;
2987
+ --gse-ui-accordion-contentItem-defaultText-fontFamily: "Noto Sans";
2988
+ --gse-ui-accordion-contentItem-defaultText-fontWeight: 400;
2989
+ --gse-ui-accordion-contentItem-defaultText-fontSize: 12px;
2990
+ --gse-ui-accordion-contentItem-defaultText-lineHeight: 18px;
2991
+ --gse-ui-accordion-wrapper-dividerBorder-color: #c6c8ce;
2992
+ --gse-ui-accordion-wrapper-dividerBorder-width: 1px;
2993
+ --gse-ui-accordion-wrapper-dividerBorder-style: solid;
2188
2994
  --gse-ui-accordion-focus-offset-gap: 1px;
2189
2995
  --gse-ui-accordion-contentPanel-paddingBottom: 8px;
2190
- --gse-ui-accordion-label-disabled-opacity: 0.5;
2996
+ --gse-ui-accordion-label-disabled-opacity: .5;
2191
2997
  }
2192
2998
 
2193
2999
  /*# sourceMappingURL=ui.css.map */