@baloise/ds-tokens 19.10.2 → 20.0.0-next.10

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 (39) hide show
  1. package/LICENSE +11 -2
  2. package/dist/css/base.override.css +2351 -0
  3. package/dist/css/base.tokens.css +2354 -0
  4. package/dist/css/erv.override.css +2351 -0
  5. package/dist/css/erv.tokens.css +2351 -0
  6. package/dist/css/tcs.override.css +2351 -0
  7. package/dist/css/tcs.tokens.css +2351 -0
  8. package/dist/docs/base.tokens.json +80732 -0
  9. package/dist/js/base.tokens.js +1992 -0
  10. package/dist/out-tsc/config.base.js +210 -0
  11. package/dist/out-tsc/config.brand.js +92 -0
  12. package/dist/out-tsc/css-naming.js +26 -0
  13. package/dist/out-tsc/css-preview.js +8 -0
  14. package/dist/out-tsc/css-value.js +301 -0
  15. package/dist/out-tsc/formatter.js +517 -0
  16. package/dist/out-tsc/index.js +46 -0
  17. package/dist/out-tsc/transformers.js +196 -0
  18. package/dist/sass/base.tokens.scss +17 -0
  19. package/dist/web/base.tokens.json +1990 -0
  20. package/package.json +31 -9
  21. package/sbom.cdx.json +76462 -0
  22. package/README.md +0 -37
  23. package/dist/deprecated/tokens.css +0 -119
  24. package/dist/deprecated/tokens.css.scss +0 -119
  25. package/dist/deprecated/tokens.docs.json +0 -2764
  26. package/dist/deprecated/tokens.json +0 -114
  27. package/dist/deprecated/tokens.less +0 -116
  28. package/dist/deprecated/tokens.scss +0 -116
  29. package/dist/figma/color.json +0 -606
  30. package/dist/figma/size.json +0 -232
  31. package/dist/tokens.css +0 -270
  32. package/dist/tokens.css.scss +0 -270
  33. package/dist/tokens.docs.json +0 -5853
  34. package/dist/tokens.esm.js +0 -268
  35. package/dist/tokens.js +0 -270
  36. package/dist/tokens.json +0 -265
  37. package/dist/tokens.less +0 -267
  38. package/dist/tokens.scss +0 -267
  39. package/dist/types/tokens.d.ts +0 -350
@@ -0,0 +1,2351 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ [data-theme="base"], :host([data-theme="base"]) {
6
+ /* Global tokens */
7
+ --ds-global-dimension-border-0: 0rem;
8
+ --ds-global-dimension-border-1: 0.125rem;
9
+ --ds-global-dimension-radius-0: 0rem;
10
+ --ds-global-dimension-radius-4: 0.25rem;
11
+ --ds-global-dimension-radius-6: 0.375rem;
12
+ --ds-global-dimension-radius-12: 0.75rem;
13
+ --ds-global-dimension-radius-9999: 9999px;
14
+ --ds-global-dimension-breakpoint-1: 769px;
15
+ --ds-global-dimension-breakpoint-2: 1024px;
16
+ --ds-global-dimension-breakpoint-3: 1280px;
17
+ --ds-global-dimension-breakpoint-4: 1440px;
18
+ --ds-global-dimension-breakpoint-5: 1920px;
19
+ --ds-global-dimension-container-1: 320px;
20
+ --ds-global-dimension-container-2: 480px;
21
+ --ds-global-dimension-container-3: 640px;
22
+ --ds-global-dimension-container-4: 896px;
23
+ --ds-global-dimension-container-5: 1496px;
24
+ --ds-global-dimension-container-full: 100%;
25
+ --ds-global-dimension-space-0: 0rem;
26
+ --ds-global-dimension-space-1: 0.0625rem;
27
+ --ds-global-dimension-space-2: 0.125rem;
28
+ --ds-global-dimension-space-4: 0.25rem;
29
+ --ds-global-dimension-space-8: 0.5rem;
30
+ --ds-global-dimension-space-12: 0.75rem;
31
+ --ds-global-dimension-space-14: 0.875rem;
32
+ --ds-global-dimension-space-16: 1rem;
33
+ --ds-global-dimension-space-20: 1.25rem;
34
+ --ds-global-dimension-space-24: 1.5rem;
35
+ --ds-global-dimension-space-32: 2rem;
36
+ --ds-global-dimension-space-40: 2.5rem;
37
+ --ds-global-dimension-space-48: 3rem;
38
+ --ds-global-dimension-space-56: 3.5rem;
39
+ --ds-global-dimension-space-64: 4rem;
40
+ --ds-global-dimension-space-72: 4.5rem;
41
+ --ds-global-dimension-space-96: 6rem;
42
+ --ds-global-dimension-space-128: 8rem;
43
+ --ds-global-dimension-space-auto: auto;
44
+ --ds-global-dimension-size-0: 0px;
45
+ --ds-global-dimension-size-2: 2px;
46
+ --ds-global-dimension-size-4: 4px;
47
+ --ds-global-dimension-size-14: 14px;
48
+ --ds-global-dimension-size-16: 16px;
49
+ --ds-global-dimension-size-18: 18px;
50
+ --ds-global-dimension-size-24: 24px;
51
+ --ds-global-dimension-size-32: 32px;
52
+ --ds-global-dimension-size-40: 40px;
53
+ --ds-global-dimension-size-48: 48px;
54
+ --ds-global-dimension-size-56: 56px;
55
+ --ds-global-dimension-size-64: 64px;
56
+ --ds-global-dimension-size-72: 72px;
57
+ --ds-global-dimension-size-80: 80px;
58
+ --ds-global-dimension-size-96: 96px;
59
+ --ds-global-dimension-size-176: 176px;
60
+ --ds-global-color-white: #ffffff;
61
+ --ds-global-color-neutral: rgba(255, 255, 255, 0);
62
+ --ds-global-color-danger-1: #fce8e6;
63
+ --ds-global-color-danger-2: #f7a299;
64
+ --ds-global-color-danger-3: #f05d4d;
65
+ --ds-global-color-danger-4: #ea1800;
66
+ --ds-global-color-danger-5: #cb1501;
67
+ --ds-global-color-danger-6: #a01100;
68
+ --ds-global-color-danger-1-b: #f5d0cc;
69
+ --ds-global-color-danger-6-b: #660b01;
70
+ --ds-global-color-warning-1: #fff9e8;
71
+ --ds-global-color-warning-2: #ffe5a3;
72
+ --ds-global-color-warning-3: #ffd25e;
73
+ --ds-global-color-warning-4: #ffbe19;
74
+ --ds-global-color-warning-5: #f99319;
75
+ --ds-global-color-warning-6: #c97612;
76
+ --ds-global-color-warning-1-b: #fee9d1;
77
+ --ds-global-color-warning-6-b: #7d4a0d;
78
+ --ds-global-color-success-1: #e8f3ec;
79
+ --ds-global-color-success-2: #a1cfb3;
80
+ --ds-global-color-success-3: #5bab7a;
81
+ --ds-global-color-success-4: #168741;
82
+ --ds-global-color-success-5: #116b34;
83
+ --ds-global-color-success-6: #0b5227;
84
+ --ds-global-color-success-1-b: #cfe1d6;
85
+ --ds-global-color-success-6-b: #09361a;
86
+ --ds-global-color-info-1: #e8f1fb;
87
+ --ds-global-color-info-2: #a4c9ed;
88
+ --ds-global-color-info-3: #60a0e0;
89
+ --ds-global-color-info-4: #1c77d2;
90
+ --ds-global-color-info-5: #155ba3;
91
+ --ds-global-color-info-6: #0e457b;
92
+ --ds-global-color-info-1-b: #d0deed;
93
+ --ds-global-color-info-6-b: #0b2e52;
94
+ --ds-global-color-sky-1: #e5f1fe;
95
+ --ds-global-color-sky-2: #a7d1fa;
96
+ --ds-global-color-sky-3: #56a7f5;
97
+ --ds-global-color-sky-4: #6672cc;
98
+ --ds-global-color-sky-5: #0014aa;
99
+ --ds-global-color-sky-6: #000a55;
100
+ --ds-global-color-grey-0: #fafafa;
101
+ --ds-global-color-grey-1: #f6f6f6;
102
+ --ds-global-color-grey-2: #e8e8e8;
103
+ --ds-global-color-grey-3: #d0d0d0;
104
+ --ds-global-color-grey-4: #b6b6b6;
105
+ --ds-global-color-grey-5: #747474;
106
+ --ds-global-color-grey-6: #313131;
107
+ --ds-global-color-yellow-1: #fff9e8;
108
+ --ds-global-color-yellow-2: #ffecbc;
109
+ --ds-global-color-yellow-3: #fae052;
110
+ --ds-global-color-yellow-4: #ffbe19;
111
+ --ds-global-color-yellow-5: #fa9319;
112
+ --ds-global-color-yellow-6: #b24a00;
113
+ --ds-global-color-red-1: #ffeef1;
114
+ --ds-global-color-red-2: #ffd7d7;
115
+ --ds-global-color-red-3: #ffaca6;
116
+ --ds-global-color-red-4: #ff596f;
117
+ --ds-global-color-red-5: #d9304c;
118
+ --ds-global-color-red-6: #99172d;
119
+ --ds-global-color-green-1: #e9fbf7;
120
+ --ds-global-color-green-2: #cbf2ec;
121
+ --ds-global-color-green-3: #94e3d4;
122
+ --ds-global-color-green-4: #21d9ac;
123
+ --ds-global-color-green-5: #00b28f;
124
+ --ds-global-color-green-6: #1b5951;
125
+ --ds-global-color-purple-1: #f9f3ff;
126
+ --ds-global-color-purple-2: #e1d9ff;
127
+ --ds-global-color-purple-3: #b8b2ff;
128
+ --ds-global-color-purple-4: #be82fa;
129
+ --ds-global-color-purple-5: #9f52cc;
130
+ --ds-global-color-purple-6: #6c2273;
131
+ --ds-global-color-primary-1: #e5e7f0;
132
+ --ds-global-color-primary-2: #b3b6d4;
133
+ --ds-global-color-primary-3: #656ea8;
134
+ --ds-global-color-primary-4: #293485;
135
+ --ds-global-color-primary-5: #000d6e;
136
+ --ds-global-color-primary-6: #000739;
137
+ --ds-global-color-primary-1-b: #cccfe2;
138
+ --ds-global-color-black: #000000;
139
+ --ds-global-font-shadow-0: none;
140
+ --ds-global-font-shadow-1: 0rem 0rem 0.25rem rgba(0, 0, 0, 0.15), 0rem 0.25rem 0.75rem rgba(0, 0, 0, 0.25), 0rem 0rem 5rem rgba(0, 0, 0, 0.5);
141
+ --ds-global-font-size-0: 0rem;
142
+ --ds-global-font-size-12: 0.75rem;
143
+ --ds-global-font-size-14: 0.875rem;
144
+ --ds-global-font-size-16: 1rem;
145
+ --ds-global-font-size-18: 1.125rem;
146
+ --ds-global-font-size-20: 1.25rem;
147
+ --ds-global-font-size-24: 1.5rem;
148
+ --ds-global-font-size-28: 1.75rem;
149
+ --ds-global-font-size-32: 2rem;
150
+ --ds-global-font-size-40: 2.5rem;
151
+ --ds-global-font-size-48: 3rem;
152
+ --ds-global-font-size-80: 5rem;
153
+ --ds-global-font-size-176: 11rem;
154
+ --ds-global-font-family-heading: BaloiseCreateHeadline, Arial, sans-serif;
155
+ --ds-global-font-family-text: BaloiseCreateText, Arial, sans-serif;
156
+ --ds-global-font-weight-100: 100;
157
+ --ds-global-font-weight-200: 200;
158
+ --ds-global-font-weight-300: 300;
159
+ --ds-global-font-weight-400: 400;
160
+ --ds-global-font-weight-500: 500;
161
+ --ds-global-font-weight-600: 600;
162
+ --ds-global-font-weight-700: 700;
163
+ --ds-global-font-weight-800: 800;
164
+ --ds-global-font-weight-900: 900;
165
+ --ds-global-font-weight-950: 950;
166
+ --ds-global-font-line-height-1: 1;
167
+ --ds-global-font-line-height-2: 1.3;
168
+ --ds-global-font-line-height-3: 1.5;
169
+ --ds-global-font-line-height-4: 2;
170
+ --ds-global-elevation-shadow-0: none;
171
+ --ds-global-elevation-shadow-1: 0rem 0.125rem 0.3125rem 0.0625rem rgba(0, 7, 57, 0.12);
172
+ --ds-global-elevation-shadow-2: 0rem 0.25rem 0.25rem 0rem rgba(0, 7, 57, 0.15);
173
+ --ds-global-elevation-shadow-3: 0rem 0rem 0.625rem 0rem rgba(0, 7, 57, 0.15);
174
+ --ds-global-elevation-shadow-4: 0rem 0rem 1.875rem 0rem rgba(0, 7, 57, 0.15);
175
+ --ds-global-elevation-z-index-100: 100;
176
+ --ds-global-elevation-z-index-200: 200;
177
+ --ds-global-elevation-z-index-300: 300;
178
+ --ds-global-elevation-z-index-400: 400;
179
+ --ds-global-elevation-z-index-1000: 1000;
180
+ --ds-global-elevation-z-index-1100: 1100;
181
+ --ds-global-elevation-z-index-1200: 1200;
182
+ --ds-global-elevation-z-index-1300: 1300;
183
+ --ds-global-elevation-z-index-behind-all: -999999;
184
+ --ds-global-elevation-opacity-0: 0;
185
+ --ds-global-elevation-opacity-30: 0.3;
186
+ --ds-global-elevation-opacity-40: 0.4;
187
+ --ds-global-elevation-opacity-50: 0.5;
188
+ --ds-global-elevation-opacity-60: 0.6;
189
+ --ds-global-elevation-opacity-80: 0.8;
190
+ --ds-global-elevation-opacity-100: 1;
191
+
192
+ /* Alias tokens */
193
+ --ds-alias-border-style-none: none;
194
+ --ds-alias-border-style-solid: solid;
195
+ --ds-alias-border-style-dashed: dashed;
196
+ --ds-alias-border-style-dotted: dotted;
197
+ --ds-alias-border-style-double: double;
198
+ --ds-alias-border-style-groove: groove;
199
+ --ds-alias-border-style-ridge: ridge;
200
+ --ds-alias-border-style-inset: inset;
201
+ --ds-alias-border-style-outset: outset;
202
+ --ds-alias-interaction-focus-size-inner: 2;
203
+ --ds-alias-interaction-focus-size-outer: 5;
204
+ --ds-alias-interaction-focus-size-inner-inset: 3;
205
+ --ds-alias-interaction-focus-size-outer-inset: 5;
206
+ --ds-alias-border-color-white: var(--ds-global-color-white);
207
+ --ds-alias-border-color-transparent: var(--ds-global-color-neutral);
208
+ --ds-alias-border-color-disabled: var(--ds-global-color-grey-3);
209
+ --ds-alias-border-color-grey-light: var(--ds-global-color-grey-2);
210
+ --ds-alias-border-color-grey: var(--ds-global-color-grey-3);
211
+ --ds-alias-border-color-grey-dark: var(--ds-global-color-grey-4);
212
+ --ds-alias-border-color-primary: var(--ds-global-color-primary-5);
213
+ --ds-alias-border-color-primary-hover: var(--ds-global-color-sky-5);
214
+ --ds-alias-border-color-primary-active: var(--ds-global-color-primary-6);
215
+ --ds-alias-border-color-inverted-primary: var(--ds-global-color-primary-4);
216
+ --ds-alias-border-color-inverted-primary-hover: var(--ds-global-color-sky-2);
217
+ --ds-alias-border-color-inverted-primary-active: var(--ds-global-color-sky-4);
218
+ --ds-alias-border-color-info: var(--ds-global-color-info-4);
219
+ --ds-alias-border-color-info-hover: var(--ds-global-color-info-5);
220
+ --ds-alias-border-color-info-active: var(--ds-global-color-info-6);
221
+ --ds-alias-border-color-success: var(--ds-global-color-success-4);
222
+ --ds-alias-border-color-success-hover: var(--ds-global-color-success-5);
223
+ --ds-alias-border-color-success-active: var(--ds-global-color-success-6);
224
+ --ds-alias-border-color-warning: var(--ds-global-color-warning-4);
225
+ --ds-alias-border-color-warning-hover: var(--ds-global-color-warning-5);
226
+ --ds-alias-border-color-warning-active: var(--ds-global-color-warning-6);
227
+ --ds-alias-border-color-danger: var(--ds-global-color-danger-4);
228
+ --ds-alias-border-color-danger-hover: var(--ds-global-color-danger-5);
229
+ --ds-alias-border-color-danger-active: var(--ds-global-color-danger-6);
230
+ --ds-alias-border-color-green: var(--ds-global-color-green-4);
231
+ --ds-alias-border-color-purple: var(--ds-global-color-purple-4);
232
+ --ds-alias-border-color-red: var(--ds-global-color-red-4);
233
+ --ds-alias-border-color-yellow: var(--ds-global-color-yellow-4);
234
+ --ds-alias-border-color-primary-light: var(--ds-global-color-primary-2);
235
+ --ds-alias-border-width-none: var(--ds-global-dimension-border-0);
236
+ --ds-alias-border-width-base: var(--ds-global-dimension-border-1);
237
+ --ds-alias-border-composite-none: 0rem var(--ds-alias-border-style-solid) var(--ds-global-color-neutral);
238
+ --ds-alias-breakpoint-tablet: var(--ds-global-dimension-breakpoint-1);
239
+ --ds-alias-breakpoint-desktop: var(--ds-global-dimension-breakpoint-2);
240
+ --ds-alias-breakpoint-desktop-lg: var(--ds-global-dimension-breakpoint-3); /** HighDefinition */
241
+ --ds-alias-breakpoint-desktop-xl: var(--ds-global-dimension-breakpoint-4); /** Widescreen */
242
+ --ds-alias-breakpoint-desktop-2xl: var(--ds-global-dimension-breakpoint-5); /** FullHD */
243
+ --ds-alias-container-width-modal: var(--ds-global-dimension-container-3);
244
+ --ds-alias-container-width-compact: var(--ds-global-dimension-container-4);
245
+ --ds-alias-container-width-default: var(--ds-global-dimension-container-5);
246
+ --ds-alias-container-width-fluid: var(--ds-global-dimension-container-full);
247
+ --ds-alias-interaction-focus-color-base: var(--ds-global-color-purple-6);
248
+ --ds-alias-interaction-focus-color-inverted: var(--ds-global-color-yellow-3);
249
+ --ds-alias-interaction-focus-color-border: var(--ds-global-color-white);
250
+ --ds-alias-opacity-hidden: var(--ds-global-elevation-opacity-0);
251
+ --ds-alias-opacity-half: var(--ds-global-elevation-opacity-50);
252
+ --ds-alias-opacity-disabled: var(--ds-global-elevation-opacity-60);
253
+ --ds-alias-opacity-backdrop: var(--ds-global-elevation-opacity-80);
254
+ --ds-alias-opacity-full: var(--ds-global-elevation-opacity-100);
255
+ --ds-alias-space-gap-none: var(--ds-global-dimension-space-0);
256
+ --ds-alias-space-gap-3xs: var(--ds-global-dimension-space-2);
257
+ --ds-alias-space-gap-2xs: var(--ds-global-dimension-space-4);
258
+ --ds-alias-space-gap-xs: var(--ds-global-dimension-space-8);
259
+ --ds-alias-space-gap-sm: var(--ds-global-dimension-space-12);
260
+ --ds-alias-space-gap-base: var(--ds-global-dimension-space-16);
261
+ --ds-alias-space-gap-lg: var(--ds-global-dimension-space-24);
262
+ --ds-alias-space-gap-xl: var(--ds-global-dimension-space-32);
263
+ --ds-alias-space-padding-none: var(--ds-global-dimension-space-0);
264
+ --ds-alias-space-padding-2xs: var(--ds-global-dimension-space-4);
265
+ --ds-alias-space-padding-xs: var(--ds-global-dimension-space-8);
266
+ --ds-alias-space-padding-sm: var(--ds-global-dimension-space-12);
267
+ --ds-alias-space-padding-base: var(--ds-global-dimension-space-16);
268
+ --ds-alias-space-padding-md: var(--ds-global-dimension-space-24);
269
+ --ds-alias-radius-none: var(--ds-global-dimension-radius-0);
270
+ --ds-alias-radius-base: var(--ds-global-dimension-radius-4);
271
+ --ds-alias-radius-lg: var(--ds-global-dimension-radius-12);
272
+ --ds-alias-radius-rounded: var(--ds-global-dimension-radius-9999);
273
+ --ds-alias-radius-md: var(--ds-global-dimension-radius-6);
274
+ --ds-alias-text-family-heading: var(--ds-global-font-family-heading);
275
+ --ds-alias-text-family-text: var(--ds-global-font-family-text);
276
+ --ds-alias-text-line-height-single: var(--ds-global-font-line-height-1);
277
+ --ds-alias-text-line-height-heading: var(--ds-global-font-line-height-2);
278
+ --ds-alias-text-line-height-double: var(--ds-global-font-line-height-4);
279
+ --ds-alias-text-line-height-text: var(--ds-global-font-line-height-3);
280
+ --ds-alias-text-weight-light: var(--ds-global-font-weight-300);
281
+ --ds-alias-text-weight-regular: var(--ds-global-font-weight-400);
282
+ --ds-alias-text-weight-bold: var(--ds-global-font-weight-700);
283
+ --ds-alias-text-color-white: var(--ds-global-color-white);
284
+ --ds-alias-text-color-primary: var(--ds-global-color-primary-5);
285
+ --ds-alias-text-color-grey: var(--ds-global-color-grey-5);
286
+ --ds-alias-text-color-disabled: var(--ds-global-color-grey-6);
287
+ --ds-alias-text-color-hint: var(--ds-global-color-primary-3);
288
+ --ds-alias-text-color-placeholder: var(--ds-global-color-primary-3);
289
+ --ds-alias-text-color-info: var(--ds-global-color-info-5);
290
+ --ds-alias-text-color-success: var(--ds-global-color-success-5);
291
+ --ds-alias-text-color-warning: var(--ds-global-color-warning-6-b);
292
+ --ds-alias-text-color-danger: var(--ds-global-color-danger-5); /** Used for validation messages in forms */
293
+ --ds-alias-text-shadow-elevated: var(--ds-global-font-shadow-1);
294
+ --ds-alias-text-size-xs: var(--ds-global-font-size-12);
295
+ --ds-alias-text-size-sm: var(--ds-global-font-size-14);
296
+ --ds-alias-text-size-base: var(--ds-global-font-size-16);
297
+ --ds-alias-text-size-lg: var(--ds-global-font-size-18);
298
+ --ds-alias-text-size-2xl: var(--ds-global-font-size-24);
299
+ --ds-alias-text-size-4xl: var(--ds-global-font-size-32);
300
+ --ds-alias-shadow-text: var(--ds-global-font-shadow-1);
301
+ --ds-alias-shadow-box-none: var(--ds-global-elevation-shadow-0);
302
+ --ds-alias-shadow-box-header: var(--ds-global-elevation-shadow-2);
303
+ --ds-alias-shadow-box-base: var(--ds-global-elevation-shadow-3);
304
+ --ds-alias-shadow-box-elevated: var(--ds-global-elevation-shadow-4);
305
+ --ds-alias-z-index-deep: var(--ds-global-elevation-z-index-behind-all);
306
+ --ds-alias-z-index-masked: var(--ds-global-elevation-z-index-100);
307
+ --ds-alias-z-index-mask: var(--ds-global-elevation-z-index-200);
308
+ --ds-alias-z-index-sticky: var(--ds-global-elevation-z-index-300);
309
+ --ds-alias-z-index-navigation: var(--ds-global-elevation-z-index-400);
310
+ --ds-alias-z-index-popup: var(--ds-global-elevation-z-index-1000);
311
+ --ds-alias-z-index-modal: var(--ds-global-elevation-z-index-1100);
312
+ --ds-alias-z-index-toast: var(--ds-global-elevation-z-index-1200);
313
+ --ds-alias-z-index-tooltip: var(--ds-global-elevation-z-index-1300);
314
+ --ds-alias-surface-white: var(--ds-global-color-white);
315
+ --ds-alias-surface-highlight: var(--ds-global-color-primary-1);
316
+ --ds-alias-surface-disabled: var(--ds-global-color-grey-2);
317
+ --ds-alias-surface-transparent: var(--ds-global-color-neutral);
318
+ --ds-alias-surface-sky-light: var(--ds-global-color-sky-1);
319
+ --ds-alias-surface-sky: var(--ds-global-color-sky-2);
320
+ --ds-alias-surface-sky-dark: var(--ds-global-color-sky-3);
321
+ --ds-alias-surface-info: var(--ds-global-color-info-3);
322
+ --ds-alias-surface-info-light: var(--ds-global-color-info-2);
323
+ --ds-alias-surface-info-dark: var(--ds-global-color-info-4);
324
+ --ds-alias-surface-info-darker: var(--ds-global-color-info-5);
325
+ --ds-alias-surface-info-darkest: var(--ds-global-color-info-6);
326
+ --ds-alias-surface-success: var(--ds-global-color-success-3);
327
+ --ds-alias-surface-success-lighter: var(--ds-global-color-success-1);
328
+ --ds-alias-surface-success-light: var(--ds-global-color-success-2);
329
+ --ds-alias-surface-success-dark: var(--ds-global-color-success-4);
330
+ --ds-alias-surface-success-darker: var(--ds-global-color-success-5);
331
+ --ds-alias-surface-success-darkest: var(--ds-global-color-success-6);
332
+ --ds-alias-surface-warning-lighter: var(--ds-global-color-warning-1);
333
+ --ds-alias-surface-warning-light: var(--ds-global-color-warning-2);
334
+ --ds-alias-surface-warning: var(--ds-global-color-warning-3);
335
+ --ds-alias-surface-warning-dark: var(--ds-global-color-warning-4);
336
+ --ds-alias-surface-warning-darker: var(--ds-global-color-warning-5);
337
+ --ds-alias-surface-warning-darkest: var(--ds-global-color-warning-6);
338
+ --ds-alias-surface-danger-lighter: var(--ds-global-color-danger-1);
339
+ --ds-alias-surface-danger-light: var(--ds-global-color-danger-2);
340
+ --ds-alias-surface-danger: var(--ds-global-color-danger-3);
341
+ --ds-alias-surface-danger-dark: var(--ds-global-color-danger-4);
342
+ --ds-alias-surface-danger-darker: var(--ds-global-color-danger-5);
343
+ --ds-alias-surface-danger-darkest: var(--ds-global-color-danger-6);
344
+ --ds-alias-surface-grey-lighter: var(--ds-global-color-grey-0);
345
+ --ds-alias-surface-grey-light: var(--ds-global-color-grey-1);
346
+ --ds-alias-surface-grey: var(--ds-global-color-grey-2);
347
+ --ds-alias-surface-grey-dark: var(--ds-global-color-grey-3);
348
+ --ds-alias-surface-grey-darker: var(--ds-global-color-grey-4);
349
+ --ds-alias-surface-primary-lighter: var(--ds-global-color-primary-1);
350
+ --ds-alias-surface-primary-light: var(--ds-global-color-primary-3);
351
+ --ds-alias-surface-primary: var(--ds-global-color-primary-5);
352
+ --ds-alias-surface-primary-hover: var(--ds-global-color-sky-5);
353
+ --ds-alias-surface-primary-active: var(--ds-global-color-primary-6);
354
+ --ds-alias-surface-primary-dark: var(--ds-global-color-primary-4);
355
+ --ds-alias-surface-green-lighter: var(--ds-global-color-green-1);
356
+ --ds-alias-surface-green-light: var(--ds-global-color-green-2);
357
+ --ds-alias-surface-green: var(--ds-global-color-green-3);
358
+ --ds-alias-surface-purple-lighter: var(--ds-global-color-purple-1);
359
+ --ds-alias-surface-purple-light: var(--ds-global-color-purple-2);
360
+ --ds-alias-surface-purple: var(--ds-global-color-purple-3);
361
+ --ds-alias-surface-red-lighter: var(--ds-global-color-red-1);
362
+ --ds-alias-surface-red-light: var(--ds-global-color-red-2);
363
+ --ds-alias-surface-red: var(--ds-global-color-red-3);
364
+ --ds-alias-surface-yellow-lighter: var(--ds-global-color-yellow-1);
365
+ --ds-alias-surface-yellow-light: var(--ds-global-color-yellow-2);
366
+ --ds-alias-surface-yellow: var(--ds-global-color-yellow-3);
367
+ --ds-alias-surface-backdrop: var(--ds-global-color-primary-6);
368
+ --ds-alias-surface-on-backdrop: var(--ds-global-color-white);
369
+ --ds-alias-surface-green-dark: var(--ds-global-color-green-6);
370
+ --ds-alias-surface-purple-dark: var(--ds-global-color-purple-6);
371
+ --ds-alias-surface-red-dark: var(--ds-global-color-red-6);
372
+ --ds-alias-surface-yellow-dark: var(--ds-global-color-yellow-6);
373
+ --ds-alias-surface-info-lighter: var(--ds-global-color-info-1);
374
+ --ds-alias-surface-selected: var(--ds-global-color-primary-1-b);
375
+ --ds-alias-surface-hover: var(--ds-global-color-grey-0);
376
+ --ds-alias-action-secondary-background-base: var(--ds-global-color-neutral);
377
+ --ds-alias-action-secondary-background-hover: var(--ds-global-color-sky-1);
378
+ --ds-alias-action-secondary-background-active: var(--ds-global-color-sky-1);
379
+ --ds-alias-action-ghost-background-base: var(--ds-global-color-neutral);
380
+ --ds-alias-action-ghost-background-hover: var(--ds-global-color-sky-1);
381
+ --ds-alias-action-ghost-background-active: var(--ds-global-color-sky-1);
382
+ --ds-alias-action-inverted-secondary-background-base: var(--ds-global-color-neutral);
383
+ --ds-alias-action-inverted-secondary-background-hover: var(--ds-global-color-primary-3);
384
+ --ds-alias-action-inverted-secondary-background-active: var(--ds-global-color-primary-3);
385
+ --ds-alias-action-primary-on-surface-base: var(--ds-global-color-white);
386
+ --ds-alias-action-primary-on-surface-hover: var(--ds-global-color-white);
387
+ --ds-alias-action-primary-on-surface-active: var(--ds-global-color-white);
388
+ --ds-alias-action-primary-surface-base: var(--ds-global-color-primary-5);
389
+ --ds-alias-action-primary-surface-hover: var(--ds-global-color-sky-5);
390
+ --ds-alias-action-primary-surface-active: var(--ds-global-color-primary-6);
391
+ --ds-alias-action-primary-text-base: var(--ds-global-color-primary-5);
392
+ --ds-alias-action-primary-text-active: var(--ds-global-color-primary-6);
393
+ --ds-alias-action-primary-text-hover: var(--ds-global-color-sky-5);
394
+ --ds-alias-action-danger-surface-base: var(--ds-global-color-danger-1);
395
+ --ds-alias-action-danger-surface-hover: var(--ds-global-color-danger-1-b);
396
+ --ds-alias-action-danger-surface-active: var(--ds-global-color-danger-1-b);
397
+ --ds-alias-action-danger-text-active: var(--ds-global-color-danger-6-b);
398
+ --ds-alias-action-danger-text-hover: var(--ds-global-color-danger-6-b);
399
+ --ds-alias-action-danger-text-base: var(--ds-global-color-danger-6);
400
+ --ds-alias-action-danger-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-danger-1);
401
+ --ds-alias-action-danger-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-danger-1-b);
402
+ --ds-alias-action-danger-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-danger-1-b);
403
+ --ds-alias-action-danger-on-surface-base: var(--ds-global-color-danger-6);
404
+ --ds-alias-action-danger-on-surface-hover: var(--ds-global-color-danger-6-b);
405
+ --ds-alias-action-danger-on-surface-active: var(--ds-global-color-danger-6-b);
406
+ --ds-alias-action-warning-surface-base: var(--ds-global-color-warning-1);
407
+ --ds-alias-action-warning-surface-hover: var(--ds-global-color-warning-1-b);
408
+ --ds-alias-action-warning-surface-active: var(--ds-global-color-warning-1-b);
409
+ --ds-alias-action-warning-text-active: var(--ds-global-color-warning-6-b);
410
+ --ds-alias-action-warning-text-hover: var(--ds-global-color-warning-6-b);
411
+ --ds-alias-action-warning-text-base: var(--ds-global-color-warning-6-b);
412
+ --ds-alias-action-warning-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-warning-1);
413
+ --ds-alias-action-warning-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-warning-1-b);
414
+ --ds-alias-action-warning-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-warning-1-b);
415
+ --ds-alias-action-warning-on-surface-hover: var(--ds-global-color-warning-6-b);
416
+ --ds-alias-action-warning-on-surface-active: var(--ds-global-color-warning-6-b);
417
+ --ds-alias-action-warning-on-surface-base: var(--ds-global-color-warning-6-b);
418
+ --ds-alias-action-success-surface-base: var(--ds-global-color-success-1);
419
+ --ds-alias-action-success-surface-hover: var(--ds-global-color-success-1-b);
420
+ --ds-alias-action-success-surface-active: var(--ds-global-color-success-1-b);
421
+ --ds-alias-action-success-text-active: var(--ds-global-color-success-6-b);
422
+ --ds-alias-action-success-text-hover: var(--ds-global-color-success-6-b);
423
+ --ds-alias-action-success-text-base: var(--ds-global-color-success-6);
424
+ --ds-alias-action-success-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-success-1);
425
+ --ds-alias-action-success-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-success-1-b);
426
+ --ds-alias-action-success-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-success-1-b);
427
+ --ds-alias-action-success-on-surface-base: var(--ds-global-color-success-6);
428
+ --ds-alias-action-success-on-surface-hover: var(--ds-global-color-success-6-b);
429
+ --ds-alias-action-success-on-surface-active: var(--ds-global-color-success-6-b);
430
+ --ds-alias-action-info-text-active: var(--ds-global-color-info-6-b);
431
+ --ds-alias-action-info-text-hover: var(--ds-global-color-info-6-b);
432
+ --ds-alias-action-info-text-base: var(--ds-global-color-info-6);
433
+ --ds-alias-action-info-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-info-1);
434
+ --ds-alias-action-info-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-info-1-b);
435
+ --ds-alias-action-info-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-info-1-b);
436
+ --ds-alias-action-info-surface-base: var(--ds-global-color-info-1);
437
+ --ds-alias-action-info-surface-hover: var(--ds-global-color-info-1-b);
438
+ --ds-alias-action-info-surface-active: var(--ds-global-color-info-1-b);
439
+ --ds-alias-action-info-on-surface-base: var(--ds-global-color-info-6);
440
+ --ds-alias-action-info-on-surface-hover: var(--ds-global-color-info-6-b);
441
+ --ds-alias-action-info-on-surface-active: var(--ds-global-color-info-6-b);
442
+ --ds-alias-action-brand-purple-on-surface-base: var(--ds-global-color-white);
443
+ --ds-alias-action-brand-purple-on-surface-hover: var(--ds-global-color-white);
444
+ --ds-alias-action-brand-purple-on-surface-active: var(--ds-global-color-white);
445
+ --ds-alias-action-brand-purple-surface-base: var(--ds-global-color-purple-1);
446
+ --ds-alias-action-brand-purple-surface-hover: var(--ds-global-color-purple-1);
447
+ --ds-alias-action-brand-purple-surface-active: var(--ds-global-color-purple-1);
448
+ --ds-alias-action-brand-purple-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-purple-1);
449
+ --ds-alias-action-brand-purple-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-purple-4);
450
+ --ds-alias-action-brand-purple-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-purple-4);
451
+ --ds-alias-action-brand-red-on-surface-base: var(--ds-global-color-white);
452
+ --ds-alias-action-brand-red-on-surface-hover: var(--ds-global-color-white);
453
+ --ds-alias-action-brand-red-on-surface-active: var(--ds-global-color-white);
454
+ --ds-alias-action-brand-red-surface-base: var(--ds-global-color-red-1);
455
+ --ds-alias-action-brand-red-surface-hover: var(--ds-global-color-red-1);
456
+ --ds-alias-action-brand-red-surface-active: var(--ds-global-color-red-1);
457
+ --ds-alias-action-brand-red-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-red-1);
458
+ --ds-alias-action-brand-red-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-red-4);
459
+ --ds-alias-action-brand-red-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-red-4);
460
+ --ds-alias-action-brand-yellow-on-surface-base: var(--ds-global-color-white);
461
+ --ds-alias-action-brand-yellow-on-surface-hover: var(--ds-global-color-white);
462
+ --ds-alias-action-brand-yellow-on-surface-active: var(--ds-global-color-white);
463
+ --ds-alias-action-brand-yellow-surface-base: var(--ds-global-color-yellow-1);
464
+ --ds-alias-action-brand-yellow-surface-hover: var(--ds-global-color-yellow-1);
465
+ --ds-alias-action-brand-yellow-surface-active: var(--ds-global-color-yellow-1);
466
+ --ds-alias-action-brand-yellow-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-yellow-1);
467
+ --ds-alias-action-brand-yellow-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-yellow-4);
468
+ --ds-alias-action-brand-yellow-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-yellow-4);
469
+ --ds-alias-action-brand-green-on-surface-base: var(--ds-global-color-white);
470
+ --ds-alias-action-brand-green-on-surface-hover: var(--ds-global-color-white);
471
+ --ds-alias-action-brand-green-on-surface-active: var(--ds-global-color-white);
472
+ --ds-alias-action-brand-green-surface-base: var(--ds-global-color-green-1);
473
+ --ds-alias-action-brand-green-surface-hover: var(--ds-global-color-green-1);
474
+ --ds-alias-action-brand-green-surface-active: var(--ds-global-color-green-1);
475
+ --ds-alias-action-brand-green-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-green-1);
476
+ --ds-alias-action-brand-green-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-green-4);
477
+ --ds-alias-action-brand-green-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-green-4);
478
+ --ds-alias-action-tertiary-on-surface-base: var(--ds-global-color-white);
479
+ --ds-alias-action-tertiary-on-surface-hover: var(--ds-global-color-white);
480
+ --ds-alias-action-tertiary-on-surface-active: var(--ds-global-color-white);
481
+ --ds-alias-action-tertiary-surface-hover: var(--ds-global-color-sky-1);
482
+ --ds-alias-action-tertiary-surface-active: var(--ds-global-color-sky-1);
483
+ --ds-alias-action-tertiary-surface-base: var(--ds-global-color-grey-1);
484
+ --ds-alias-action-tertiary-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-sky-1);
485
+ --ds-alias-action-tertiary-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-sky-1);
486
+ --ds-alias-action-tertiary-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-grey-1);
487
+ --ds-alias-action-inverted-tertiary-on-surface-base: var(--ds-global-color-white);
488
+ --ds-alias-action-inverted-tertiary-on-surface-hover: var(--ds-global-color-white);
489
+ --ds-alias-action-inverted-tertiary-on-surface-active: var(--ds-global-color-white);
490
+ --ds-alias-action-inverted-tertiary-surface-base: var(--ds-global-color-primary-4);
491
+ --ds-alias-action-inverted-tertiary-surface-hover: var(--ds-global-color-sky-2);
492
+ --ds-alias-action-inverted-tertiary-surface-active: var(--ds-global-color-white);
493
+ --ds-alias-action-inverted-tertiary-text-base: var(--ds-global-color-white);
494
+ --ds-alias-action-inverted-tertiary-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-primary-4);
495
+ --ds-alias-action-inverted-tertiary-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-sky-2);
496
+ --ds-alias-action-inverted-tertiary-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-white);
497
+ --ds-alias-action-inverted-ghost-on-surface-base: var(--ds-global-color-white);
498
+ --ds-alias-action-inverted-ghost-on-surface-hover: var(--ds-global-color-white);
499
+ --ds-alias-action-inverted-ghost-on-surface-active: var(--ds-global-color-white);
500
+ --ds-alias-action-inverted-ghost-surface-base: var(--ds-global-color-neutral);
501
+ --ds-alias-action-inverted-ghost-surface-hover: var(--ds-global-color-sky-2);
502
+ --ds-alias-action-inverted-ghost-surface-active: var(--ds-global-color-white);
503
+ --ds-alias-action-inverted-ghost-text-base: var(--ds-global-color-white);
504
+ --ds-alias-action-inverted-ghost-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-sky-2);
505
+ --ds-alias-action-inverted-ghost-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-white);
506
+ --ds-alias-action-inverted-ghost-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-global-color-neutral);
507
+ --ds-alias-action-inverted-primary-surface-base: var(--ds-global-color-white);
508
+ --ds-alias-action-inverted-primary-surface-hover: var(--ds-global-color-sky-2);
509
+ --ds-alias-action-inverted-primary-surface-active: var(--ds-global-color-sky-5);
510
+ --ds-alias-action-inverted-primary-on-surface-base: var(--ds-global-color-white);
511
+ --ds-alias-action-inverted-primary-on-surface-hover: var(--ds-global-color-sky-2);
512
+ --ds-alias-action-inverted-primary-on-surface-active: var(--ds-global-color-sky-3);
513
+ --ds-alias-action-inverted-primary-text-base: var(--ds-global-color-white);
514
+ --ds-alias-action-inverted-primary-text-hover: var(--ds-global-color-sky-2);
515
+ --ds-alias-action-inverted-primary-text-active: var(--ds-global-color-sky-3);
516
+ --ds-alias-border-composite-grey-dashed: var(--ds-alias-border-width-base) var(--ds-alias-border-style-dashed) var(--ds-alias-border-color-grey);
517
+ --ds-alias-border-composite-grey-dark: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-grey-dark);
518
+ --ds-alias-border-composite-grey-dark-dashed: var(--ds-alias-border-width-base) var(--ds-alias-border-style-dashed) var(--ds-alias-border-color-grey-dark);
519
+ --ds-alias-border-composite-primary-light: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-primary-light);
520
+ --ds-alias-border-composite-primary: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-primary);
521
+ --ds-alias-border-composite-primary-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-primary-hover);
522
+ --ds-alias-border-composite-primary-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-primary-active);
523
+ --ds-alias-border-composite-inverted-primary: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-inverted-primary);
524
+ --ds-alias-border-composite-inverted-primary-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-inverted-primary-hover);
525
+ --ds-alias-border-composite-inverted-primary-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-inverted-primary-active);
526
+ --ds-alias-border-composite-grey-light: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-grey-light);
527
+ --ds-alias-border-composite-warning: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-warning);
528
+ --ds-alias-border-composite-warning-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-warning-hover);
529
+ --ds-alias-border-composite-warning-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-warning-active);
530
+ --ds-alias-border-composite-success: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-success);
531
+ --ds-alias-border-composite-success-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-success-hover);
532
+ --ds-alias-border-composite-success-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-success-active);
533
+ --ds-alias-border-composite-info: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-info);
534
+ --ds-alias-border-composite-info-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-info-hover);
535
+ --ds-alias-border-composite-info-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-info-active);
536
+ --ds-alias-border-composite-danger: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-danger);
537
+ --ds-alias-border-composite-danger-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-danger-hover);
538
+ --ds-alias-border-composite-danger-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-danger-active);
539
+ --ds-alias-border-composite-white: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-white);
540
+ --ds-alias-border-composite-transparent: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-transparent);
541
+ --ds-alias-border-composite-disabled: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-disabled);
542
+ --ds-alias-border-composite-white-dashed: var(--ds-alias-border-width-base) var(--ds-alias-border-style-dashed) var(--ds-alias-border-color-white);
543
+ --ds-alias-border-composite-primary-dashed: var(--ds-alias-border-width-base) var(--ds-alias-border-style-dashed) var(--ds-alias-border-color-primary);
544
+ --ds-alias-border-composite-purple: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-purple);
545
+ --ds-alias-border-composite-green: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-green);
546
+ --ds-alias-border-composite-yellow: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-yellow);
547
+ --ds-alias-border-composite-red: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-red);
548
+ --ds-alias-border-composite-surface-grey-light: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-grey-light);
549
+ --ds-alias-border-composite-surface-danger-light: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-danger-light);
550
+ --ds-alias-border-composite-surface-success-light: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-success-light);
551
+ --ds-alias-border-composite-surface-info-light: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-info-light);
552
+ --ds-alias-border-composite-surface-warning-light: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-warning-light);
553
+ --ds-alias-border-composite-grey: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-border-color-grey-light);
554
+ --ds-alias-interaction-focus-color-start: var(--ds-alias-interaction-focus-color-border);
555
+ --ds-alias-interaction-focus-color-end: var(--ds-alias-interaction-focus-color-base);
556
+ --ds-alias-interaction-focus-color-inverted-start: var(--ds-alias-interaction-focus-color-border);
557
+ --ds-alias-interaction-focus-color-inverted-end: var(--ds-alias-interaction-focus-color-inverted);
558
+ --ds-alias-text-color-inverted-primary: var(--ds-alias-text-color-white);
559
+ --ds-alias-text-color-inverted-disabled: var(--ds-alias-text-color-hint);
560
+ --ds-alias-surface-on-white: var(--ds-alias-text-color-primary);
561
+ --ds-alias-surface-on-selected: var(--ds-alias-text-color-primary);
562
+ --ds-alias-surface-on-hover: var(--ds-alias-text-color-primary);
563
+ --ds-alias-surface-on-highlight: var(--ds-alias-text-color-primary);
564
+ --ds-alias-surface-on-disabled: var(--ds-alias-text-color-primary);
565
+ --ds-alias-surface-on-sky-light: var(--ds-alias-text-color-primary);
566
+ --ds-alias-surface-on-sky: var(--ds-alias-text-color-primary);
567
+ --ds-alias-surface-on-sky-dark: var(--ds-alias-text-color-primary);
568
+ --ds-alias-surface-on-info: var(--ds-alias-text-color-primary);
569
+ --ds-alias-surface-on-info-light: var(--ds-alias-text-color-primary);
570
+ --ds-alias-surface-on-info-dark: var(--ds-alias-text-color-white);
571
+ --ds-alias-surface-on-info-darker: var(--ds-alias-text-color-white);
572
+ --ds-alias-surface-on-info-darkest: var(--ds-alias-text-color-white);
573
+ --ds-alias-surface-on-success: var(--ds-alias-text-color-primary);
574
+ --ds-alias-surface-on-success-lighter: var(--ds-alias-text-color-primary);
575
+ --ds-alias-surface-on-success-light: var(--ds-alias-text-color-primary);
576
+ --ds-alias-surface-on-success-dark: var(--ds-alias-text-color-white);
577
+ --ds-alias-surface-on-success-darker: var(--ds-alias-text-color-white);
578
+ --ds-alias-surface-on-success-darkest: var(--ds-alias-text-color-white);
579
+ --ds-alias-surface-on-warning-lighter: var(--ds-alias-text-color-primary);
580
+ --ds-alias-surface-on-warning-light: var(--ds-alias-text-color-primary);
581
+ --ds-alias-surface-on-warning: var(--ds-alias-text-color-primary);
582
+ --ds-alias-surface-on-warning-dark: var(--ds-alias-text-color-primary);
583
+ --ds-alias-surface-on-warning-darker: var(--ds-alias-text-color-primary);
584
+ --ds-alias-surface-on-warning-darkest: var(--ds-alias-text-color-primary);
585
+ --ds-alias-surface-on-danger-lighter: var(--ds-alias-text-color-primary);
586
+ --ds-alias-surface-on-danger-light: var(--ds-alias-text-color-primary);
587
+ --ds-alias-surface-on-danger: var(--ds-alias-text-color-primary);
588
+ --ds-alias-surface-on-danger-dark: var(--ds-alias-text-color-white);
589
+ --ds-alias-surface-on-danger-darker: var(--ds-alias-text-color-white);
590
+ --ds-alias-surface-on-danger-darkest: var(--ds-alias-text-color-white);
591
+ --ds-alias-surface-on-grey-lighter: var(--ds-alias-text-color-primary);
592
+ --ds-alias-surface-on-grey-light: var(--ds-alias-text-color-primary);
593
+ --ds-alias-surface-on-grey: var(--ds-alias-text-color-primary);
594
+ --ds-alias-surface-on-grey-dark: var(--ds-alias-text-color-primary);
595
+ --ds-alias-surface-on-grey-darker: var(--ds-alias-text-color-primary);
596
+ --ds-alias-surface-on-primary-lighter: var(--ds-alias-text-color-primary);
597
+ --ds-alias-surface-on-primary-light: var(--ds-alias-text-color-white);
598
+ --ds-alias-surface-on-primary: var(--ds-alias-text-color-white);
599
+ --ds-alias-surface-on-primary-hover: var(--ds-alias-text-color-white);
600
+ --ds-alias-surface-on-primary-active: var(--ds-alias-text-color-white);
601
+ --ds-alias-surface-on-primary-dark: var(--ds-alias-text-color-white);
602
+ --ds-alias-surface-on-green-lighter: var(--ds-alias-text-color-primary);
603
+ --ds-alias-surface-on-green-light: var(--ds-alias-text-color-primary);
604
+ --ds-alias-surface-on-green: var(--ds-alias-text-color-primary);
605
+ --ds-alias-surface-on-purple-lighter: var(--ds-alias-text-color-primary);
606
+ --ds-alias-surface-on-purple-light: var(--ds-alias-text-color-primary);
607
+ --ds-alias-surface-on-purple: var(--ds-alias-text-color-primary);
608
+ --ds-alias-surface-on-red-lighter: var(--ds-alias-text-color-primary);
609
+ --ds-alias-surface-on-red-light: var(--ds-alias-text-color-primary);
610
+ --ds-alias-surface-on-red: var(--ds-alias-text-color-primary);
611
+ --ds-alias-surface-on-yellow-lighter: var(--ds-alias-text-color-primary);
612
+ --ds-alias-surface-on-yellow-light: var(--ds-alias-text-color-primary);
613
+ --ds-alias-surface-on-yellow: var(--ds-alias-text-color-primary);
614
+ --ds-alias-surface-on-yellow-dark: var(--ds-alias-text-color-white);
615
+ --ds-alias-surface-on-red-dark: var(--ds-alias-text-color-white);
616
+ --ds-alias-surface-on-purple-dark: var(--ds-alias-text-color-white);
617
+ --ds-alias-surface-on-green-dark: var(--ds-alias-text-color-white);
618
+ --ds-alias-surface-on-info-lighter: var(--ds-alias-text-color-primary);
619
+ --ds-alias-action-brand-purple-text-base: var(--ds-alias-action-primary-text-base);
620
+ --ds-alias-action-brand-purple-text-hover: var(--ds-alias-action-primary-text-hover);
621
+ --ds-alias-action-brand-purple-text-active: var(--ds-alias-action-primary-text-active);
622
+ --ds-alias-action-brand-red-text-base: var(--ds-alias-action-primary-text-base);
623
+ --ds-alias-action-brand-red-text-hover: var(--ds-alias-action-primary-text-hover);
624
+ --ds-alias-action-brand-red-text-active: var(--ds-alias-action-primary-text-active);
625
+ --ds-alias-action-brand-yellow-text-base: var(--ds-alias-action-primary-text-base);
626
+ --ds-alias-action-brand-yellow-text-hover: var(--ds-alias-action-primary-text-hover);
627
+ --ds-alias-action-brand-yellow-text-active: var(--ds-alias-action-primary-text-active);
628
+ --ds-alias-action-brand-green-text-base: var(--ds-alias-action-primary-text-base);
629
+ --ds-alias-action-brand-green-text-hover: var(--ds-alias-action-primary-text-hover);
630
+ --ds-alias-action-brand-green-text-active: var(--ds-alias-action-primary-text-active);
631
+ --ds-alias-action-tertiary-text-base: var(--ds-alias-action-primary-text-base);
632
+ --ds-alias-action-tertiary-text-hover: var(--ds-alias-action-primary-text-hover);
633
+ --ds-alias-action-tertiary-text-active: var(--ds-alias-action-primary-text-active);
634
+ --ds-alias-action-inverted-tertiary-text-hover: var(--ds-alias-action-primary-text-base);
635
+ --ds-alias-action-inverted-tertiary-text-active: var(--ds-alias-action-primary-text-base);
636
+ --ds-alias-action-inverted-ghost-text-hover: var(--ds-alias-action-primary-text-base);
637
+ --ds-alias-action-inverted-ghost-text-active: var(--ds-alias-action-primary-text-base);
638
+ --ds-alias-action-disabled-on-surface-base: var(--ds-alias-text-color-disabled);
639
+ --ds-alias-action-disabled-on-surface-hover: var(--ds-alias-text-color-disabled);
640
+ --ds-alias-action-disabled-on-surface-active: var(--ds-alias-text-color-disabled);
641
+ --ds-alias-action-disabled-surface-base: var(--ds-alias-surface-disabled);
642
+ --ds-alias-action-disabled-surface-hover: var(--ds-alias-surface-disabled);
643
+ --ds-alias-action-disabled-surface-active: var(--ds-alias-surface-disabled);
644
+ --ds-alias-action-disabled-text-base: var(--ds-alias-text-color-disabled);
645
+ --ds-alias-action-disabled-text-hover: var(--ds-alias-text-color-disabled);
646
+ --ds-alias-action-disabled-text-active: var(--ds-alias-text-color-disabled);
647
+ --ds-alias-action-disabled-border-base: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-disabled);
648
+ --ds-alias-action-disabled-border-hover: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-disabled);
649
+ --ds-alias-action-disabled-border-active: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-disabled);
650
+ --ds-alias-action-secondary-border-base: var(--ds-alias-border-composite-primary);
651
+ --ds-alias-action-secondary-border-hover: var(--ds-alias-border-composite-primary-hover);
652
+ --ds-alias-action-secondary-border-active: var(--ds-alias-border-composite-primary-active);
653
+ --ds-alias-action-ghost-border-base: var(--ds-alias-border-composite-transparent);
654
+ --ds-alias-action-ghost-border-hover: var(--ds-alias-border-composite-transparent);
655
+ --ds-alias-action-ghost-border-active: var(--ds-alias-border-composite-transparent);
656
+ --ds-alias-action-inverted-secondary-border-base: var(--ds-alias-border-composite-white);
657
+ --ds-alias-action-inverted-secondary-border-hover: var(--ds-alias-border-composite-white);
658
+ --ds-alias-action-inverted-secondary-border-active: var(--ds-alias-border-composite-white);
659
+ --ds-alias-action-primary-border-base: var(--ds-alias-border-composite-primary);
660
+ --ds-alias-action-primary-border-hover: var(--ds-alias-border-composite-primary-hover);
661
+ --ds-alias-action-primary-border-active: var(--ds-alias-border-composite-primary-active);
662
+ --ds-alias-action-inverted-primary-border-base: var(--ds-alias-border-composite-white);
663
+ --ds-alias-action-inverted-primary-border-hover: var(--ds-alias-border-composite-white);
664
+ --ds-alias-action-inverted-primary-border-active: var(--ds-alias-border-composite-white);
665
+
666
+ /* Device tokens */
667
+ --ds-device-space-none-mobile: var(--ds-global-dimension-space-0);
668
+ --ds-device-space-none-tablet: var(--ds-global-dimension-space-0);
669
+ --ds-device-space-none-desktop: var(--ds-global-dimension-space-0);
670
+ --ds-device-space-2xs-mobile: var(--ds-global-dimension-space-4);
671
+ --ds-device-space-2xs-tablet: var(--ds-global-dimension-space-4);
672
+ --ds-device-space-2xs-desktop: var(--ds-global-dimension-space-4);
673
+ --ds-device-space-xs-mobile: var(--ds-global-dimension-space-8);
674
+ --ds-device-space-xs-tablet: var(--ds-global-dimension-space-8);
675
+ --ds-device-space-xs-desktop: var(--ds-global-dimension-space-8);
676
+ --ds-device-space-sm-mobile: var(--ds-global-dimension-space-12);
677
+ --ds-device-space-sm-tablet: var(--ds-global-dimension-space-12);
678
+ --ds-device-space-sm-desktop: var(--ds-global-dimension-space-12);
679
+ --ds-device-space-base-mobile: var(--ds-global-dimension-space-16);
680
+ --ds-device-space-base-tablet: var(--ds-global-dimension-space-16);
681
+ --ds-device-space-base-desktop: var(--ds-global-dimension-space-16);
682
+ --ds-device-space-md-mobile: var(--ds-global-dimension-space-20);
683
+ --ds-device-space-md-tablet: var(--ds-global-dimension-space-20);
684
+ --ds-device-space-md-desktop: var(--ds-global-dimension-space-24);
685
+ --ds-device-space-lg-mobile: var(--ds-global-dimension-space-24);
686
+ --ds-device-space-lg-tablet: var(--ds-global-dimension-space-24);
687
+ --ds-device-space-lg-desktop: var(--ds-global-dimension-space-32);
688
+ --ds-device-space-xl-mobile: var(--ds-global-dimension-space-32);
689
+ --ds-device-space-xl-tablet: var(--ds-global-dimension-space-40);
690
+ --ds-device-space-xl-desktop: var(--ds-global-dimension-space-48);
691
+ --ds-device-space-2xl-mobile: var(--ds-global-dimension-space-48);
692
+ --ds-device-space-2xl-tablet: var(--ds-global-dimension-space-56);
693
+ --ds-device-space-2xl-desktop: var(--ds-global-dimension-space-64);
694
+ --ds-device-space-3xl-mobile: var(--ds-global-dimension-space-56);
695
+ --ds-device-space-3xl-tablet: var(--ds-global-dimension-space-72);
696
+ --ds-device-space-3xl-desktop: var(--ds-global-dimension-space-96);
697
+ --ds-device-space-4xl-mobile: var(--ds-global-dimension-space-64);
698
+ --ds-device-space-4xl-tablet: var(--ds-global-dimension-space-96);
699
+ --ds-device-space-4xl-desktop: var(--ds-global-dimension-space-128);
700
+ --ds-device-space-3xs-mobile: var(--ds-global-dimension-space-2);
701
+ --ds-device-space-3xs-tablet: var(--ds-global-dimension-space-2);
702
+ --ds-device-space-3xs-desktop: var(--ds-global-dimension-space-2);
703
+ --ds-device-text-size-base-mobile: var(--ds-global-font-size-16);
704
+ --ds-device-text-size-base-tablet: var(--ds-global-font-size-16);
705
+ --ds-device-text-size-base-desktop: var(--ds-global-font-size-16);
706
+ --ds-device-text-size-none-mobile: 0rem;
707
+ --ds-device-text-size-none-tablet: 0rem;
708
+ --ds-device-text-size-none-desktop: 0rem;
709
+ --ds-device-text-size-xs-mobile: var(--ds-global-font-size-12);
710
+ --ds-device-text-size-xs-tablet: var(--ds-global-font-size-12);
711
+ --ds-device-text-size-xs-desktop: var(--ds-global-font-size-12);
712
+ --ds-device-text-size-md-mobile: var(--ds-global-font-size-16);
713
+ --ds-device-text-size-md-tablet: var(--ds-global-font-size-18);
714
+ --ds-device-text-size-md-desktop: var(--ds-global-font-size-18);
715
+ --ds-device-text-size-sm-mobile: var(--ds-global-font-size-14);
716
+ --ds-device-text-size-sm-tablet: var(--ds-global-font-size-14);
717
+ --ds-device-text-size-sm-desktop: var(--ds-global-font-size-14);
718
+ --ds-device-text-size-2xl-mobile: var(--ds-global-font-size-24);
719
+ --ds-device-text-size-2xl-tablet: var(--ds-global-font-size-32);
720
+ --ds-device-text-size-2xl-desktop: var(--ds-global-font-size-32);
721
+ --ds-device-text-size-3xl-mobile: var(--ds-global-font-size-28);
722
+ --ds-device-text-size-3xl-tablet: var(--ds-global-font-size-40);
723
+ --ds-device-text-size-3xl-desktop: var(--ds-global-font-size-40);
724
+ --ds-device-text-size-4xl-mobile: var(--ds-global-font-size-32);
725
+ --ds-device-text-size-4xl-tablet: var(--ds-global-font-size-48);
726
+ --ds-device-text-size-4xl-desktop: var(--ds-global-font-size-48);
727
+ --ds-device-text-size-5xl-mobile: var(--ds-global-font-size-48);
728
+ --ds-device-text-size-5xl-tablet: var(--ds-global-font-size-80);
729
+ --ds-device-text-size-5xl-desktop: var(--ds-global-font-size-80);
730
+ --ds-device-text-size-xl-mobile: var(--ds-global-font-size-20);
731
+ --ds-device-text-size-xl-tablet: var(--ds-global-font-size-24);
732
+ --ds-device-text-size-xl-desktop: var(--ds-global-font-size-24);
733
+ --ds-device-text-size-lg-mobile: var(--ds-global-font-size-18);
734
+ --ds-device-text-size-lg-tablet: var(--ds-global-font-size-18);
735
+ --ds-device-text-size-lg-desktop: var(--ds-global-font-size-18);
736
+ --ds-device-container-space-mobile: var(--ds-global-dimension-space-16);
737
+ --ds-device-container-space-tablet: var(--ds-global-dimension-space-40);
738
+ --ds-device-container-space-desktop: var(--ds-global-dimension-space-48);
739
+ --ds-device-space-auto: var(--ds-global-dimension-space-auto);
740
+
741
+ /* Component tokens */
742
+ --ds-backdrop-filter: blur(4px);
743
+ --ds-app-footer-gap: var(--ds-device-space-base);
744
+ --ds-app-footer-typo-font-family: var(--ds-alias-text-family-text);
745
+ --ds-app-footer-typo-font-size: var(--ds-device-text-size-sm);
746
+ --ds-app-footer-typo-font-weight: var(--ds-alias-text-weight-regular);
747
+ --ds-app-footer-typo-line-height: var(--ds-alias-text-line-height-text);
748
+ --ds-app-footer-padding-y: var(--ds-device-space-lg);
749
+ --ds-hint-heading-font-family: var(--ds-heading-level-3-font-family);
750
+ --ds-hint-heading-font-size: var(--ds-heading-level-3-font-size);
751
+ --ds-hint-heading-font-weight: var(--ds-heading-level-3-font-weight);
752
+ --ds-hint-heading-line-height: var(--ds-heading-level-3-line-height);
753
+ --ds-hint-body-font-family: var(--ds-body-font-font-family);
754
+ --ds-hint-body-font-size: var(--ds-body-font-font-size);
755
+ --ds-hint-body-font-weight: var(--ds-body-font-font-weight);
756
+ --ds-hint-body-line-height: var(--ds-body-font-line-height);
757
+ --ds-heading-level-1-font-family: var(--ds-alias-text-family-heading);
758
+ --ds-heading-level-1-font-size: var(--ds-device-text-size-3xl);
759
+ --ds-heading-level-1-font-weight: var(--ds-alias-text-weight-bold);
760
+ --ds-heading-level-1-line-height: var(--ds-alias-text-line-height-heading);
761
+ --ds-heading-level-2-font-family: var(--ds-alias-text-family-heading);
762
+ --ds-heading-level-2-font-size: var(--ds-device-text-size-2xl);
763
+ --ds-heading-level-2-font-weight: var(--ds-alias-text-weight-bold);
764
+ --ds-heading-level-2-line-height: var(--ds-alias-text-line-height-heading);
765
+ --ds-heading-level-3-font-family: var(--ds-alias-text-family-heading);
766
+ --ds-heading-level-3-font-size: var(--ds-device-text-size-xl);
767
+ --ds-heading-level-3-font-weight: var(--ds-alias-text-weight-bold);
768
+ --ds-heading-level-3-line-height: var(--ds-alias-text-line-height-heading);
769
+ --ds-heading-level-4-font-family: var(--ds-alias-text-family-heading);
770
+ --ds-heading-level-4-font-size: var(--ds-device-text-size-lg);
771
+ --ds-heading-level-4-font-weight: var(--ds-alias-text-weight-bold);
772
+ --ds-heading-level-4-line-height: var(--ds-alias-text-line-height-heading);
773
+ --ds-heading-level-5-font-family: var(--ds-alias-text-family-heading);
774
+ --ds-heading-level-5-font-size: var(--ds-device-text-size-base);
775
+ --ds-heading-level-5-font-weight: var(--ds-alias-text-weight-bold);
776
+ --ds-heading-level-5-line-height: var(--ds-alias-text-line-height-heading);
777
+ --ds-heading-level-light1-font-family: var(--ds-alias-text-family-heading);
778
+ --ds-heading-level-light1-font-size: var(--ds-device-text-size-3xl);
779
+ --ds-heading-level-light1-font-weight: var(--ds-alias-text-weight-light);
780
+ --ds-heading-level-light1-line-height: var(--ds-alias-text-line-height-heading);
781
+ --ds-heading-level-light3-font-family: var(--ds-alias-text-family-heading);
782
+ --ds-heading-level-light3-font-size: var(--ds-device-text-size-xl);
783
+ --ds-heading-level-light3-font-weight: var(--ds-alias-text-weight-light);
784
+ --ds-heading-level-light3-line-height: var(--ds-alias-text-line-height-heading);
785
+ --ds-heading-level-display2-font-family: var(--ds-alias-text-family-heading);
786
+ --ds-heading-level-display2-font-size: var(--ds-device-text-size-4xl);
787
+ --ds-heading-level-display2-font-weight: var(--ds-alias-text-weight-bold);
788
+ --ds-heading-level-display2-line-height: var(--ds-alias-text-line-height-heading);
789
+ --ds-heading-level-display1-font-family: var(--ds-alias-text-family-heading);
790
+ --ds-heading-level-display1-font-size: var(--ds-device-text-size-5xl);
791
+ --ds-heading-level-display1-font-weight: var(--ds-alias-text-weight-bold);
792
+ --ds-heading-level-display1-line-height: var(--ds-alias-text-line-height-heading);
793
+ --ds-heading-level-light-display2-font-family: var(--ds-alias-text-family-heading);
794
+ --ds-heading-level-light-display2-font-size: var(--ds-device-text-size-4xl);
795
+ --ds-heading-level-light-display2-font-weight: var(--ds-alias-text-weight-light);
796
+ --ds-heading-level-light-display2-line-height: var(--ds-alias-text-line-height-heading);
797
+ --ds-heading-level-light-display1-font-family: var(--ds-alias-text-family-heading);
798
+ --ds-heading-level-light-display1-font-size: var(--ds-device-text-size-5xl);
799
+ --ds-heading-level-light-display1-font-weight: var(--ds-alias-text-weight-light);
800
+ --ds-heading-level-light-display1-line-height: var(--ds-alias-text-line-height-heading);
801
+ --ds-heading-level-light2-font-family: var(--ds-alias-text-family-heading);
802
+ --ds-heading-level-light2-font-size: var(--ds-device-text-size-2xl);
803
+ --ds-heading-level-light2-font-weight: var(--ds-alias-text-weight-light);
804
+ --ds-heading-level-light2-line-height: var(--ds-alias-text-line-height-heading);
805
+ --ds-badge-size-sm-font: 0rem;
806
+ --ds-body-font-font-family: var(--ds-text-typo-paragraph-font-family);
807
+ --ds-body-font-font-size: var(--ds-text-typo-paragraph-font-size);
808
+ --ds-body-font-font-weight: var(--ds-text-typo-paragraph-font-weight);
809
+ --ds-body-font-line-height: var(--ds-text-typo-paragraph-line-height);
810
+ --ds-card-gap-sm: var(--ds-device-space-base);
811
+ --ds-card-gap-base: var(--ds-device-space-md);
812
+ --ds-card-gap-md: var(--ds-device-space-md);
813
+ --ds-card-gap-lg: var(--ds-device-space-xl);
814
+ --ds-card-padding-sm: var(--ds-device-space-base);
815
+ --ds-card-padding-base: var(--ds-device-space-md);
816
+ --ds-card-padding-lg: var(--ds-device-space-xl);
817
+ --ds-close-inverted-color-background-hover: rgba(255, 255, 255, 0.30000001192092896);
818
+ --ds-close-inverted-color-background-active: rgba(255, 255, 255, 0.5);
819
+ --ds-close-primary-color-background-hover: rgba(0, 7, 57, 0.1);
820
+ --ds-close-primary-color-background-active: rgba(0, 7, 57, 0.2);
821
+ --ds-close-size-sm: 14px;
822
+ --ds-close-padding-base: 10px;
823
+ --ds-close-padding-md: 14px;
824
+ --ds-close-padding-sm: 6px;
825
+ --ds-form-default-label-typo-font-family: var(--ds-alias-text-family-text);
826
+ --ds-form-default-label-typo-font-size: var(--ds-device-text-size-sm);
827
+ --ds-form-default-label-typo-font-weight: var(--ds-alias-text-weight-bold);
828
+ --ds-form-default-label-typo-line-height: var(--ds-alias-text-line-height-text);
829
+ --ds-form-default-control-typo-font-family: var(--ds-alias-text-family-text);
830
+ --ds-form-default-control-typo-font-size: var(--ds-device-text-size-base);
831
+ --ds-form-default-control-typo-font-weight: var(--ds-alias-text-weight-regular);
832
+ --ds-form-default-control-typo-line-height: var(--ds-alias-text-line-height-text);
833
+ --ds-form-default-description-typo-font-family: var(--ds-alias-text-family-text);
834
+ --ds-form-default-description-typo-font-size: var(--ds-device-text-size-xs);
835
+ --ds-form-default-description-typo-font-weight: var(--ds-alias-text-weight-regular);
836
+ --ds-form-default-description-typo-line-height: var(--ds-alias-text-line-height-text);
837
+ --ds-form-success-label-typo-font-family: var(--ds-alias-text-family-text);
838
+ --ds-form-success-label-typo-font-size: var(--ds-device-text-size-sm);
839
+ --ds-form-success-label-typo-font-weight: var(--ds-alias-text-weight-bold);
840
+ --ds-form-success-label-typo-line-height: var(--ds-alias-text-line-height-text);
841
+ --ds-form-success-control-typo-font-family: var(--ds-alias-text-family-text);
842
+ --ds-form-success-control-typo-font-size: var(--ds-device-text-size-base);
843
+ --ds-form-success-control-typo-font-weight: var(--ds-alias-text-weight-regular);
844
+ --ds-form-success-control-typo-line-height: var(--ds-alias-text-line-height-text);
845
+ --ds-form-success-description-typo-font-family: var(--ds-alias-text-family-text);
846
+ --ds-form-success-description-typo-font-size: var(--ds-device-text-size-xs);
847
+ --ds-form-success-description-typo-font-weight: var(--ds-alias-text-weight-regular);
848
+ --ds-form-success-description-typo-line-height: var(--ds-alias-text-line-height-text);
849
+ --ds-form-warning-label-typo-font-family: var(--ds-alias-text-family-text);
850
+ --ds-form-warning-label-typo-font-size: var(--ds-device-text-size-sm);
851
+ --ds-form-warning-label-typo-font-weight: var(--ds-alias-text-weight-bold);
852
+ --ds-form-warning-label-typo-line-height: var(--ds-alias-text-line-height-text);
853
+ --ds-form-warning-control-typo-font-family: var(--ds-alias-text-family-text);
854
+ --ds-form-warning-control-typo-font-size: var(--ds-device-text-size-base);
855
+ --ds-form-warning-control-typo-font-weight: var(--ds-alias-text-weight-regular);
856
+ --ds-form-warning-control-typo-line-height: var(--ds-alias-text-line-height-text);
857
+ --ds-form-warning-description-typo-font-family: var(--ds-alias-text-family-text);
858
+ --ds-form-warning-description-typo-font-size: var(--ds-device-text-size-xs);
859
+ --ds-form-warning-description-typo-font-weight: var(--ds-alias-text-weight-regular);
860
+ --ds-form-warning-description-typo-line-height: var(--ds-alias-text-line-height-text);
861
+ --ds-form-danger-label-typo-font-family: var(--ds-alias-text-family-text);
862
+ --ds-form-danger-label-typo-font-size: var(--ds-device-text-size-sm);
863
+ --ds-form-danger-label-typo-font-weight: var(--ds-alias-text-weight-bold);
864
+ --ds-form-danger-label-typo-line-height: var(--ds-alias-text-line-height-text);
865
+ --ds-form-danger-control-typo-font-family: var(--ds-alias-text-family-text);
866
+ --ds-form-danger-control-typo-font-size: var(--ds-device-text-size-base);
867
+ --ds-form-danger-control-typo-font-weight: var(--ds-alias-text-weight-regular);
868
+ --ds-form-danger-control-typo-line-height: var(--ds-alias-text-line-height-text);
869
+ --ds-form-danger-description-typo-font-family: var(--ds-alias-text-family-text);
870
+ --ds-form-danger-description-typo-font-size: var(--ds-device-text-size-xs);
871
+ --ds-form-danger-description-typo-font-weight: var(--ds-alias-text-weight-regular);
872
+ --ds-form-danger-description-typo-line-height: var(--ds-alias-text-line-height-text);
873
+ --ds-form-disabled-label-typo-font-family: var(--ds-alias-text-family-text);
874
+ --ds-form-disabled-label-typo-font-size: var(--ds-device-text-size-sm);
875
+ --ds-form-disabled-label-typo-font-weight: var(--ds-alias-text-weight-bold);
876
+ --ds-form-disabled-label-typo-line-height: var(--ds-alias-text-line-height-text);
877
+ --ds-form-disabled-control-typo-font-family: var(--ds-alias-text-family-text);
878
+ --ds-form-disabled-control-typo-font-size: var(--ds-device-text-size-base);
879
+ --ds-form-disabled-control-typo-font-weight: var(--ds-alias-text-weight-regular);
880
+ --ds-form-disabled-control-typo-line-height: var(--ds-alias-text-line-height-text);
881
+ --ds-form-disabled-description-typo-font-family: var(--ds-alias-text-family-text);
882
+ --ds-form-disabled-description-typo-font-size: var(--ds-device-text-size-xs);
883
+ --ds-form-disabled-description-typo-font-weight: var(--ds-alias-text-weight-regular);
884
+ --ds-form-disabled-description-typo-line-height: var(--ds-alias-text-line-height-text);
885
+ --ds-notification-default-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M5.52 3.448C6.452 2.521 7.716 2 9.033 2s2.562 0.521 3.493 1.448C13.478 4.374 14.001 5.632 14.001 6.942v4.413c0 0.31 0.124 0.605 0.344 0.824 0.249 0.248 0.445 0.342 0.719 0.342 0.278 0 0.503 0.224 0.503 0.501 0 0.277-0.225 0.501-0.503 0.501H3.003c-0.278 0-0.503-0.224-0.503-0.501 0-0.277 0.225-0.501 0.503-0.501 0.275 0 0.47-0.094 0.719-0.342 0.219-0.219 0.344-0.514 0.344-0.824V6.942c0-1.311 0.523-2.569 1.456-3.494zM7.274 15.25c0-0.414 0.338-0.75 0.754-0.75h2.01c0.416 0 0.754 0.336 0.754 0.75s-0.338 0.75-0.754 0.75h-2.01c-0.416 0-0.754-0.336-0.754-0.75z" fill="black"/></svg>');
886
+ --ds-notification-default-heading-font-family: var(--ds-heading-level-4-font-family);
887
+ --ds-notification-default-heading-font-size: var(--ds-heading-level-4-font-size);
888
+ --ds-notification-default-heading-font-weight: var(--ds-heading-level-4-font-weight);
889
+ --ds-notification-default-heading-line-height: var(--ds-heading-level-4-line-height);
890
+ --ds-notification-default-body-font-family: var(--ds-text-typo-paragraph-font-family);
891
+ --ds-notification-default-body-font-size: var(--ds-text-typo-paragraph-font-size);
892
+ --ds-notification-default-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
893
+ --ds-notification-default-body-line-height: var(--ds-text-typo-paragraph-line-height);
894
+ --ds-notification-info-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M6.176 13.705c-0.65 0-1.176 0.514-1.176 1.147 0 0.635 0.526 1.149 1.176 1.149h2.824h2.824c0.65 0 1.176-0.514 1.176-1.149 0-0.633-0.526-1.147-1.176-1.147h-1.647V8.426c0-0.634-0.526-1.147-1.176-1.147H7.118C6.468 7.279 5.941 7.792 5.941 8.426c0 0.633 0.526 1.147 1.176 1.147h0.706v4.132H6.176zM10.882 3.836c0 1.014-0.843 1.836-1.882 1.836S7.118 4.85 7.118 3.836C7.118 2.822 7.96 2 9 2s1.882 0.822 1.882 1.836z" fill="black"/></svg>');
895
+ --ds-notification-info-heading-font-family: var(--ds-heading-level-4-font-family);
896
+ --ds-notification-info-heading-font-size: var(--ds-heading-level-4-font-size);
897
+ --ds-notification-info-heading-font-weight: var(--ds-heading-level-4-font-weight);
898
+ --ds-notification-info-heading-line-height: var(--ds-heading-level-4-line-height);
899
+ --ds-notification-info-body-font-family: var(--ds-text-typo-paragraph-font-family);
900
+ --ds-notification-info-body-font-size: var(--ds-text-typo-paragraph-font-size);
901
+ --ds-notification-info-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
902
+ --ds-notification-info-body-line-height: var(--ds-text-typo-paragraph-line-height);
903
+ --ds-notification-success-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M15.637 3.247c0.426 0.379 0.486 1.059 0.134 1.518L7.73 15.251l-0.002 0.003c-0.183 0.237-0.413 0.426-0.672 0.555-0.26 0.13-0.543 0.195-0.829 0.191-0.291-0.004-0.577-0.08-0.837-0.219-0.259-0.14-0.485-0.341-0.662-0.588l-2.517-3.488c-0.339-0.47-0.261-1.147 0.175-1.512 0.436-0.365 1.064-0.28 1.403 0.19l2.463 3.414 7.976-10.403c0.352-0.459 0.982-0.524 1.408-0.144z" fill="black"/></svg>');
904
+ --ds-notification-success-heading-font-family: var(--ds-heading-level-4-font-family);
905
+ --ds-notification-success-heading-font-size: var(--ds-heading-level-4-font-size);
906
+ --ds-notification-success-heading-font-weight: var(--ds-heading-level-4-font-weight);
907
+ --ds-notification-success-heading-line-height: var(--ds-heading-level-4-line-height);
908
+ --ds-notification-success-body-font-family: var(--ds-text-typo-paragraph-font-family);
909
+ --ds-notification-success-body-font-size: var(--ds-text-typo-paragraph-font-size);
910
+ --ds-notification-success-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
911
+ --ds-notification-success-body-line-height: var(--ds-text-typo-paragraph-line-height);
912
+ --ds-notification-warning-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M9.333 2c0.805 0 1.458 0.514 1.458 1.148v5.508c0 0.634-0.653 1.148-1.458 1.148s-1.458-0.514-1.458-1.148V3.148C7.875 2.514 8.528 2 9.333 2zM9.333 16c1.289 0 2.334-0.822 2.334-1.836s-1.045-1.836-2.334-1.836S7 13.15 7 14.164 8.044 16 9.333 16z" fill="black"/></svg>');
913
+ --ds-notification-warning-heading-font-family: var(--ds-heading-level-4-font-family);
914
+ --ds-notification-warning-heading-font-size: var(--ds-heading-level-4-font-size);
915
+ --ds-notification-warning-heading-font-weight: var(--ds-heading-level-4-font-weight);
916
+ --ds-notification-warning-heading-line-height: var(--ds-heading-level-4-line-height);
917
+ --ds-notification-warning-body-font-family: var(--ds-text-typo-paragraph-font-family);
918
+ --ds-notification-warning-body-font-size: var(--ds-text-typo-paragraph-font-size);
919
+ --ds-notification-warning-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
920
+ --ds-notification-warning-body-line-height: var(--ds-text-typo-paragraph-line-height);
921
+ --ds-notification-danger-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M9.333 2c0.805 0 1.458 0.514 1.458 1.148v5.508c0 0.634-0.653 1.148-1.458 1.148s-1.458-0.514-1.458-1.148V3.148C7.875 2.514 8.528 2 9.333 2zM9.333 16c1.289 0 2.334-0.822 2.334-1.836s-1.045-1.836-2.334-1.836S7 13.15 7 14.164 8.044 16 9.333 16z" fill="black"/></svg>');
922
+ --ds-notification-danger-heading-font-family: var(--ds-heading-level-4-font-family);
923
+ --ds-notification-danger-heading-font-size: var(--ds-heading-level-4-font-size);
924
+ --ds-notification-danger-heading-font-weight: var(--ds-heading-level-4-font-weight);
925
+ --ds-notification-danger-heading-line-height: var(--ds-heading-level-4-line-height);
926
+ --ds-notification-danger-body-font-family: var(--ds-text-typo-paragraph-font-family);
927
+ --ds-notification-danger-body-font-size: var(--ds-text-typo-paragraph-font-size);
928
+ --ds-notification-danger-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
929
+ --ds-notification-danger-body-line-height: var(--ds-text-typo-paragraph-line-height);
930
+ --ds-notification-outline-default-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M5.52 3.448C6.452 2.521 7.716 2 9.033 2s2.562 0.521 3.493 1.448C13.478 4.374 14.001 5.632 14.001 6.942v4.413c0 0.31 0.124 0.605 0.344 0.824 0.249 0.248 0.445 0.342 0.719 0.342 0.278 0 0.503 0.224 0.503 0.501 0 0.277-0.225 0.501-0.503 0.501H3.003c-0.278 0-0.503-0.224-0.503-0.501 0-0.277 0.225-0.501 0.503-0.501 0.275 0 0.47-0.094 0.719-0.342 0.219-0.219 0.344-0.514 0.344-0.824V6.942c0-1.311 0.523-2.569 1.456-3.494zM7.274 15.25c0-0.414 0.338-0.75 0.754-0.75h2.01c0.416 0 0.754 0.336 0.754 0.75s-0.338 0.75-0.754 0.75h-2.01c-0.416 0-0.754-0.336-0.754-0.75z" fill="black"/></svg>');
931
+ --ds-notification-outline-default-heading-font-family: var(--ds-heading-level-4-font-family);
932
+ --ds-notification-outline-default-heading-font-size: var(--ds-heading-level-4-font-size);
933
+ --ds-notification-outline-default-heading-font-weight: var(--ds-heading-level-4-font-weight);
934
+ --ds-notification-outline-default-heading-line-height: var(--ds-heading-level-4-line-height);
935
+ --ds-notification-outline-default-body-font-family: var(--ds-text-typo-paragraph-font-family);
936
+ --ds-notification-outline-default-body-font-size: var(--ds-text-typo-paragraph-font-size);
937
+ --ds-notification-outline-default-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
938
+ --ds-notification-outline-default-body-line-height: var(--ds-text-typo-paragraph-line-height);
939
+ --ds-notification-outline-purple-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M6.176 13.705c-0.65 0-1.176 0.514-1.176 1.147 0 0.635 0.526 1.149 1.176 1.149h2.824h2.824c0.65 0 1.176-0.514 1.176-1.149 0-0.633-0.526-1.147-1.176-1.147h-1.647V8.426c0-0.634-0.526-1.147-1.176-1.147H7.118C6.468 7.279 5.941 7.792 5.941 8.426c0 0.633 0.526 1.147 1.176 1.147h0.706v4.132H6.176zM10.882 3.836c0 1.014-0.843 1.836-1.882 1.836S7.118 4.85 7.118 3.836C7.118 2.822 7.96 2 9 2s1.882 0.822 1.882 1.836z" fill="black"/></svg>');
940
+ --ds-notification-outline-purple-heading-font-family: var(--ds-heading-level-4-font-family);
941
+ --ds-notification-outline-purple-heading-font-size: var(--ds-heading-level-4-font-size);
942
+ --ds-notification-outline-purple-heading-font-weight: var(--ds-heading-level-4-font-weight);
943
+ --ds-notification-outline-purple-heading-line-height: var(--ds-heading-level-4-line-height);
944
+ --ds-notification-outline-purple-body-font-family: var(--ds-text-typo-paragraph-font-family);
945
+ --ds-notification-outline-purple-body-font-size: var(--ds-text-typo-paragraph-font-size);
946
+ --ds-notification-outline-purple-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
947
+ --ds-notification-outline-purple-body-line-height: var(--ds-text-typo-paragraph-line-height);
948
+ --ds-notification-outline-green-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M15.637 3.247c0.426 0.379 0.486 1.059 0.134 1.518L7.73 15.251l-0.002 0.003c-0.183 0.237-0.413 0.426-0.672 0.555-0.26 0.13-0.543 0.195-0.829 0.191-0.291-0.004-0.577-0.08-0.837-0.219-0.259-0.14-0.485-0.341-0.662-0.588l-2.517-3.488c-0.339-0.47-0.261-1.147 0.175-1.512 0.436-0.365 1.064-0.28 1.403 0.19l2.463 3.414 7.976-10.403c0.352-0.459 0.982-0.524 1.408-0.144z" fill="black"/></svg>');
949
+ --ds-notification-outline-green-heading-font-family: var(--ds-heading-level-4-font-family);
950
+ --ds-notification-outline-green-heading-font-size: var(--ds-heading-level-4-font-size);
951
+ --ds-notification-outline-green-heading-font-weight: var(--ds-heading-level-4-font-weight);
952
+ --ds-notification-outline-green-heading-line-height: var(--ds-heading-level-4-line-height);
953
+ --ds-notification-outline-green-body-font-family: var(--ds-text-typo-paragraph-font-family);
954
+ --ds-notification-outline-green-body-font-size: var(--ds-text-typo-paragraph-font-size);
955
+ --ds-notification-outline-green-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
956
+ --ds-notification-outline-green-body-line-height: var(--ds-text-typo-paragraph-line-height);
957
+ --ds-notification-outline-yellow-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M9.333 2c0.805 0 1.458 0.514 1.458 1.148v5.508c0 0.634-0.653 1.148-1.458 1.148s-1.458-0.514-1.458-1.148V3.148C7.875 2.514 8.528 2 9.333 2zM9.333 16c1.289 0 2.334-0.822 2.334-1.836s-1.045-1.836-2.334-1.836S7 13.15 7 14.164 8.044 16 9.333 16z" fill="black"/></svg>');
958
+ --ds-notification-outline-yellow-heading-font-family: var(--ds-heading-level-4-font-family);
959
+ --ds-notification-outline-yellow-heading-font-size: var(--ds-heading-level-4-font-size);
960
+ --ds-notification-outline-yellow-heading-font-weight: var(--ds-heading-level-4-font-weight);
961
+ --ds-notification-outline-yellow-heading-line-height: var(--ds-heading-level-4-line-height);
962
+ --ds-notification-outline-yellow-body-font-family: var(--ds-text-typo-paragraph-font-family);
963
+ --ds-notification-outline-yellow-body-font-size: var(--ds-text-typo-paragraph-font-size);
964
+ --ds-notification-outline-yellow-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
965
+ --ds-notification-outline-yellow-body-line-height: var(--ds-text-typo-paragraph-line-height);
966
+ --ds-notification-outline-red-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M9.333 2c0.805 0 1.458 0.514 1.458 1.148v5.508c0 0.634-0.653 1.148-1.458 1.148s-1.458-0.514-1.458-1.148V3.148C7.875 2.514 8.528 2 9.333 2zM9.333 16c1.289 0 2.334-0.822 2.334-1.836s-1.045-1.836-2.334-1.836S7 13.15 7 14.164 8.044 16 9.333 16z" fill="black"/></svg>');
967
+ --ds-notification-outline-red-heading-font-family: var(--ds-heading-level-4-font-family);
968
+ --ds-notification-outline-red-heading-font-size: var(--ds-heading-level-4-font-size);
969
+ --ds-notification-outline-red-heading-font-weight: var(--ds-heading-level-4-font-weight);
970
+ --ds-notification-outline-red-heading-line-height: var(--ds-heading-level-4-line-height);
971
+ --ds-notification-outline-red-body-font-family: var(--ds-text-typo-paragraph-font-family);
972
+ --ds-notification-outline-red-body-font-size: var(--ds-text-typo-paragraph-font-size);
973
+ --ds-notification-outline-red-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
974
+ --ds-notification-outline-red-body-line-height: var(--ds-text-typo-paragraph-line-height);
975
+ --ds-label-typo-base-font-family: var(--ds-alias-text-family-text);
976
+ --ds-label-typo-base-font-size: var(--ds-device-text-size-sm);
977
+ --ds-label-typo-base-font-weight: var(--ds-alias-text-weight-bold);
978
+ --ds-label-typo-base-line-height: var(--ds-alias-text-line-height-text);
979
+ --ds-label-typo-md-font-family: var(--ds-alias-text-family-text);
980
+ --ds-label-typo-md-font-size: var(--ds-device-text-size-base);
981
+ --ds-label-typo-md-font-weight: var(--ds-alias-text-weight-bold);
982
+ --ds-label-typo-md-line-height: var(--ds-alias-text-line-height-text);
983
+ --ds-label-typo-3xl-font-family: var(--ds-alias-text-family-heading);
984
+ --ds-label-typo-3xl-font-size: var(--ds-device-text-size-3xl);
985
+ --ds-label-typo-3xl-font-weight: var(--ds-alias-text-weight-bold);
986
+ --ds-label-typo-3xl-line-height: var(--ds-alias-text-line-height-text);
987
+ --ds-label-typo-2xl-font-family: var(--ds-alias-text-family-heading);
988
+ --ds-label-typo-2xl-font-size: var(--ds-device-text-size-2xl);
989
+ --ds-label-typo-2xl-font-weight: var(--ds-alias-text-weight-bold);
990
+ --ds-label-typo-2xl-line-height: var(--ds-alias-text-line-height-text);
991
+ --ds-label-typo-lg-font-family: var(--ds-alias-text-family-heading);
992
+ --ds-label-typo-lg-font-size: var(--ds-device-text-size-lg);
993
+ --ds-label-typo-lg-font-weight: var(--ds-alias-text-weight-bold);
994
+ --ds-label-typo-lg-line-height: var(--ds-alias-text-line-height-text);
995
+ --ds-label-typo-xl-font-family: var(--ds-alias-text-family-heading);
996
+ --ds-label-typo-xl-font-size: var(--ds-device-text-size-xl);
997
+ --ds-label-typo-xl-font-weight: var(--ds-alias-text-weight-bold);
998
+ --ds-label-typo-xl-line-height: var(--ds-alias-text-line-height-text);
999
+ --ds-list-item-title-font-family: var(--ds-alias-text-family-heading);
1000
+ --ds-list-item-title-font-size: var(--ds-device-text-size-base);
1001
+ --ds-list-item-title-font-weight: var(--ds-alias-text-weight-bold);
1002
+ --ds-list-item-title-line-height: var(--ds-alias-text-line-height-heading);
1003
+ --ds-list-item-text-font-family: var(--ds-alias-text-family-text);
1004
+ --ds-list-item-text-font-size: var(--ds-device-text-size-sm);
1005
+ --ds-list-item-text-font-weight: var(--ds-alias-text-weight-regular);
1006
+ --ds-list-item-text-line-height: var(--ds-alias-text-line-height-text);
1007
+ --ds-list-item-content-gap: 1px;
1008
+ --ds-modal-heading-font-family: var(--ds-heading-level-3-font-family);
1009
+ --ds-modal-heading-font-size: var(--ds-heading-level-3-font-size);
1010
+ --ds-modal-heading-font-weight: var(--ds-heading-level-3-font-weight);
1011
+ --ds-modal-heading-line-height: var(--ds-heading-level-3-line-height);
1012
+ --ds-modal-padding: var(--ds-device-space-md);
1013
+ --ds-modal-gap: var(--ds-device-space-md);
1014
+ --ds-app-navbar-default-layout-height: 5rem;
1015
+ --ds-app-navbar-default-title-font-size: var(--ds-device-text-size-xl);
1016
+ --ds-app-navbar-default-hamburger-transition-duration: 0.2s;
1017
+ --ds-app-navbar-default-sidebar-max-width: 25rem;
1018
+ --ds-app-navbar-default-sidebar-slide-duration: 300ms;
1019
+ --ds-app-navbar-default-sidebar-backdrop-color: #000000;
1020
+ --ds-app-navbar-default-sidebar-panel-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);
1021
+ --ds-app-navbar-default-menu-item-transition-duration: 0.2s;
1022
+ --ds-snackbar-heading-font-family: var(--ds-heading-level-4-font-family);
1023
+ --ds-snackbar-heading-font-size: var(--ds-heading-level-4-font-size);
1024
+ --ds-snackbar-heading-font-weight: var(--ds-heading-level-4-font-weight);
1025
+ --ds-snackbar-heading-line-height: var(--ds-heading-level-4-line-height);
1026
+ --ds-snackbar-body-font-family: var(--ds-text-typo-paragraph-font-family);
1027
+ --ds-snackbar-body-font-size: var(--ds-text-typo-paragraph-font-size);
1028
+ --ds-snackbar-body-font-weight: var(--ds-text-typo-paragraph-font-weight);
1029
+ --ds-snackbar-body-line-height: var(--ds-text-typo-paragraph-line-height);
1030
+ --ds-toast-heading-font-family: var(--ds-heading-level-5-font-family);
1031
+ --ds-toast-heading-font-size: var(--ds-heading-level-5-font-size);
1032
+ --ds-toast-heading-font-weight: var(--ds-heading-level-5-font-weight);
1033
+ --ds-toast-heading-line-height: var(--ds-heading-level-5-line-height);
1034
+ --ds-toast-body-font-family: var(--ds-text-typo-small-font-family);
1035
+ --ds-toast-body-font-size: var(--ds-text-typo-small-font-size);
1036
+ --ds-toast-body-font-weight: var(--ds-text-typo-small-font-weight);
1037
+ --ds-toast-body-line-height: var(--ds-text-typo-small-line-height);
1038
+ --ds-segment-item-icon-gap: 0.375rem;
1039
+ --ds-accordion-summary-typo-font-family: var(--ds-alias-text-family-text);
1040
+ --ds-accordion-summary-typo-font-size: var(--ds-device-text-size-base);
1041
+ --ds-accordion-summary-typo-font-weight: var(--ds-alias-text-weight-regular);
1042
+ --ds-accordion-summary-typo-line-height: var(--ds-alias-text-line-height-text);
1043
+ --ds-tabs-tab-selected-typo-font-family: var(--ds-alias-text-family-heading);
1044
+ --ds-tabs-tab-selected-typo-font-size: var(--ds-device-text-size-base);
1045
+ --ds-tabs-tab-selected-typo-font-weight: var(--ds-alias-text-weight-bold);
1046
+ --ds-tabs-tab-selected-typo-line-height: var(--ds-alias-text-line-height-text);
1047
+ --ds-tabs-tab-unselected-typo-font-family: var(--ds-alias-text-family-heading);
1048
+ --ds-tabs-tab-unselected-typo-font-size: var(--ds-device-text-size-base);
1049
+ --ds-tabs-tab-unselected-typo-font-weight: var(--ds-alias-text-weight-bold);
1050
+ --ds-tabs-tab-unselected-typo-line-height: var(--ds-alias-text-line-height-text);
1051
+ --ds-tabs-panel-padding-x: var(--ds-device-space-none);
1052
+ --ds-tabs-panel-padding-y: var(--ds-device-space-base);
1053
+ --ds-tab-panel-padding: 1rem 0;
1054
+ --ds-steps-step-typo-base-font-family: var(--ds-heading-level-5-font-family);
1055
+ --ds-steps-step-typo-base-font-size: var(--ds-heading-level-5-font-size);
1056
+ --ds-steps-step-typo-base-font-weight: var(--ds-heading-level-5-font-weight);
1057
+ --ds-steps-step-typo-base-line-height: var(--ds-heading-level-5-line-height);
1058
+ --ds-steps-step-typo-sm-font-family: var(--ds-alias-text-family-heading);
1059
+ --ds-steps-step-typo-sm-font-size: var(--ds-device-text-size-sm);
1060
+ --ds-steps-step-typo-sm-font-weight: var(--ds-alias-text-weight-bold);
1061
+ --ds-steps-step-typo-sm-line-height: var(--ds-alias-text-line-height-heading);
1062
+ --ds-steps-panel-padding-x: var(--ds-device-space-none);
1063
+ --ds-steps-panel-padding-y: var(--ds-device-space-base);
1064
+ --ds-step-panel-padding: 1rem 0;
1065
+ --ds-carousel-dot-size: 8px;
1066
+ --ds-carousel-dot-size-active: 10px;
1067
+ --ds-tooltip-text-font-family: var(--ds-text-typo-small-font-family);
1068
+ --ds-tooltip-text-font-size: var(--ds-text-typo-small-font-size);
1069
+ --ds-tooltip-text-font-weight: var(--ds-text-typo-small-font-weight);
1070
+ --ds-tooltip-text-line-height: var(--ds-text-typo-small-line-height);
1071
+ --ds-table-cell-padding-x: 0.75em;
1072
+ --ds-table-cell-padding-y: 0.5em;
1073
+ --ds-table-head-font-font-family: var(--ds-heading-level-5-font-family);
1074
+ --ds-table-head-font-font-size: var(--ds-heading-level-5-font-size);
1075
+ --ds-table-head-font-font-weight: var(--ds-heading-level-5-font-weight);
1076
+ --ds-table-head-font-line-height: var(--ds-heading-level-5-line-height);
1077
+ --ds-table-font-font-family: var(--ds-text-typo-paragraph-font-family);
1078
+ --ds-table-font-font-size: var(--ds-text-typo-paragraph-font-size);
1079
+ --ds-table-font-font-weight: var(--ds-text-typo-paragraph-font-weight);
1080
+ --ds-table-font-line-height: var(--ds-text-typo-paragraph-line-height);
1081
+ --ds-popup-min-width: 16rem;
1082
+ --ds-popup-padding: var(--ds-device-space-md);
1083
+ --ds-drawer-max-height: 85dvh;
1084
+ --ds-drawer-padding: var(--ds-device-space-md);
1085
+ --ds-link-font-family: inherit;
1086
+ --ds-text-typo-paragraph-font-family: var(--ds-alias-text-family-text);
1087
+ --ds-text-typo-paragraph-font-size: var(--ds-device-text-size-base);
1088
+ --ds-text-typo-paragraph-font-weight: var(--ds-alias-text-weight-regular);
1089
+ --ds-text-typo-paragraph-line-height: var(--ds-alias-text-line-height-text);
1090
+ --ds-text-typo-small-font-family: var(--ds-alias-text-family-text);
1091
+ --ds-text-typo-small-font-size: var(--ds-device-text-size-sm);
1092
+ --ds-text-typo-small-font-weight: var(--ds-alias-text-weight-regular);
1093
+ --ds-text-typo-small-line-height: var(--ds-alias-text-line-height-text);
1094
+ --ds-text-typo-lead-font-family: var(--ds-alias-text-family-text);
1095
+ --ds-text-typo-lead-font-size: var(--ds-device-text-size-lg);
1096
+ --ds-text-typo-lead-font-weight: var(--ds-alias-text-weight-regular);
1097
+ --ds-text-typo-lead-line-height: var(--ds-alias-text-line-height-text);
1098
+ --ds-text-typo-block-font-family: var(--ds-alias-text-family-text);
1099
+ --ds-text-typo-block-font-size: var(--ds-device-text-size-md);
1100
+ --ds-text-typo-block-font-weight: var(--ds-alias-text-weight-regular);
1101
+ --ds-text-typo-block-line-height: var(--ds-alias-text-line-height-text);
1102
+ --ds-logo-size-base-mobile: var(--ds-global-dimension-size-24);
1103
+ --ds-logo-size-base-tablet: var(--ds-global-dimension-size-24);
1104
+ --ds-logo-size-base-desktop: var(--ds-global-dimension-size-32);
1105
+ --ds-logo-size-sm-mobile: var(--ds-global-dimension-size-24);
1106
+ --ds-logo-size-sm-tablet: var(--ds-global-dimension-size-24);
1107
+ --ds-logo-size-sm-desktop: var(--ds-global-dimension-size-24);
1108
+ --ds-logo-size-lg-mobile: var(--ds-global-dimension-size-32);
1109
+ --ds-logo-size-lg-tablet: var(--ds-global-dimension-size-32);
1110
+ --ds-logo-size-lg-desktop: var(--ds-global-dimension-size-48);
1111
+ --ds-app-footer-social-icon-size: var(--ds-global-dimension-size-24);
1112
+ --ds-hint-trigger-size: var(--ds-global-dimension-size-24);
1113
+ --ds-badge-size-sm-icon: var(--ds-global-dimension-size-0);
1114
+ --ds-badge-size-base-icon: var(--ds-global-dimension-size-14);
1115
+ --ds-badge-size-base-height: var(--ds-global-dimension-size-24);
1116
+ --ds-badge-size-lg-height: var(--ds-global-dimension-size-32);
1117
+ --ds-badge-size-lg-icon: var(--ds-global-dimension-size-18);
1118
+ --ds-button-size-base-min-height: var(--ds-global-dimension-size-48);
1119
+ --ds-button-size-base-min-width: var(--ds-global-dimension-size-48);
1120
+ --ds-button-size-sm-min-height: var(--ds-global-dimension-size-32);
1121
+ --ds-button-size-sm-min-width: var(--ds-global-dimension-size-32);
1122
+ --ds-button-size-lg-min-height: var(--ds-global-dimension-size-56);
1123
+ --ds-button-size-lg-min-width: var(--ds-global-dimension-size-56);
1124
+ --ds-close-size-base: var(--ds-global-dimension-size-24);
1125
+ --ds-close-size-md: var(--ds-global-dimension-size-32);
1126
+ --ds-icon-size-sm: var(--ds-global-dimension-size-14);
1127
+ --ds-icon-size-base: var(--ds-global-dimension-size-16);
1128
+ --ds-icon-size-md: var(--ds-global-dimension-size-24);
1129
+ --ds-icon-size-lg: var(--ds-global-dimension-size-32);
1130
+ --ds-icon-size-xl: var(--ds-global-dimension-size-40);
1131
+ --ds-brand-icon-tile-size-base-tablet: var(--ds-global-dimension-size-64);
1132
+ --ds-brand-icon-tile-size-base-desktop: var(--ds-global-dimension-size-64);
1133
+ --ds-brand-icon-tile-size-base-mobile: var(--ds-global-dimension-size-56);
1134
+ --ds-brand-icon-tile-size-lg-mobile: var(--ds-global-dimension-size-64);
1135
+ --ds-brand-icon-tile-size-lg-tablet: var(--ds-global-dimension-size-96);
1136
+ --ds-brand-icon-tile-size-lg-desktop: var(--ds-global-dimension-size-96);
1137
+ --ds-brand-icon-tile-size-sm-mobile: var(--ds-global-dimension-size-48);
1138
+ --ds-brand-icon-tile-size-sm-tablet: var(--ds-global-dimension-size-56);
1139
+ --ds-brand-icon-tile-size-sm-desktop: var(--ds-global-dimension-size-56);
1140
+ --ds-brand-icon-size-sm: var(--ds-global-dimension-size-40);
1141
+ --ds-brand-icon-size-base: var(--ds-global-dimension-size-80);
1142
+ --ds-brand-icon-size-lg: var(--ds-global-dimension-size-176);
1143
+ --ds-list-item-size-base-min-height: var(--ds-global-dimension-size-56);
1144
+ --ds-list-item-size-lg-min-height: var(--ds-global-dimension-size-72);
1145
+ --ds-modal-backdrop-filter: var(--ds-backdrop-filter);
1146
+ --ds-app-navbar-default-hamburger-width: var(--ds-global-dimension-size-48);
1147
+ --ds-app-navbar-default-hamburger-height: var(--ds-global-dimension-size-48);
1148
+ --ds-app-navbar-default-sidebar-panel-border-top: 1px solid var(--ds-global-color-white);
1149
+ --ds-app-navbar-default-sidebar-item-min-height: var(--ds-global-dimension-size-48);
1150
+ --ds-app-navbar-default-sidebar-item-chevron-size: var(--ds-global-dimension-size-16);
1151
+ --ds-app-navbar-light-sidebar-panel-border-top: 1px solid var(--ds-global-color-grey-3);
1152
+ --ds-spinner-circle-size-sm: var(--ds-global-dimension-size-16);
1153
+ --ds-spinner-circle-size-md: var(--ds-global-dimension-size-24);
1154
+ --ds-spinner-circle-thickness-sm: var(--ds-global-dimension-size-2);
1155
+ --ds-spinner-circle-thickness-md: var(--ds-global-dimension-size-4);
1156
+ --ds-spinner-logo-size-md: var(--ds-global-dimension-size-64);
1157
+ --ds-spinner-logo-size-sm: var(--ds-global-dimension-size-32);
1158
+ --ds-toast-primary-progress-background: var(--ds-global-color-primary-1-b);
1159
+ --ds-segment-item-height: var(--ds-global-dimension-size-40);
1160
+ --ds-progress-bar-height: var(--ds-global-dimension-size-4);
1161
+ --ds-steps-circle-size-base: var(--ds-global-dimension-size-32);
1162
+ --ds-steps-circle-size-sm: var(--ds-global-dimension-size-24);
1163
+ --ds-backdrop-opacity: var(--ds-alias-opacity-backdrop);
1164
+ --ds-backdrop-color: var(--ds-alias-surface-backdrop);
1165
+ --ds-app-footer-color-background: var(--ds-alias-surface-primary);
1166
+ --ds-hint-color-focus: var(--ds-alias-interaction-focus-color-base);
1167
+ --ds-hint-color-body: var(--ds-alias-text-color-primary);
1168
+ --ds-hint-color-heading: var(--ds-alias-text-color-primary);
1169
+ --ds-hint-color-background: var(--ds-alias-surface-grey-light);
1170
+ --ds-hint-trigger-radius: var(--ds-alias-radius-rounded);
1171
+ --ds-hint-trigger-padding: var(--ds-alias-space-padding-2xs);
1172
+ --ds-hint-trigger-color-background-base: var(--ds-alias-surface-primary);
1173
+ --ds-hint-trigger-color-background-hover: var(--ds-alias-surface-primary-hover);
1174
+ --ds-hint-trigger-color-background-active: var(--ds-alias-surface-primary-active);
1175
+ --ds-hint-radius: var(--ds-alias-radius-lg);
1176
+ --ds-hint-gap: var(--ds-alias-space-gap-sm);
1177
+ --ds-heading-color-primary: var(--ds-alias-text-color-primary);
1178
+ --ds-heading-color-inverted: var(--ds-alias-text-color-white);
1179
+ --ds-heading-shadow: var(--ds-alias-shadow-text);
1180
+ --ds-badge-default-color-text: var(--ds-alias-text-color-primary);
1181
+ --ds-badge-default-color-background: var(--ds-alias-surface-red);
1182
+ --ds-badge-success-color-text: var(--ds-alias-text-color-primary);
1183
+ --ds-badge-success-color-background: var(--ds-alias-surface-green);
1184
+ --ds-badge-warning-color-text: var(--ds-alias-text-color-primary);
1185
+ --ds-badge-warning-color-background: var(--ds-alias-surface-yellow-light);
1186
+ --ds-badge-danger-color-text: var(--ds-alias-text-color-primary);
1187
+ --ds-badge-danger-color-background: var(--ds-alias-surface-red);
1188
+ --ds-badge-disabled-color-text: var(--ds-alias-text-color-grey);
1189
+ --ds-badge-disabled-color-background: var(--ds-alias-surface-grey);
1190
+ --ds-badge-size-sm-height: var(--ds-alias-text-size-xs);
1191
+ --ds-badge-size-sm-radius: var(--ds-alias-radius-rounded);
1192
+ --ds-badge-size-sm-padding: var(--ds-alias-space-padding-2xs);
1193
+ --ds-badge-size-sm-gap: var(--ds-alias-space-gap-none);
1194
+ --ds-badge-size-base-radius: var(--ds-alias-radius-rounded);
1195
+ --ds-badge-size-base-gap: var(--ds-alias-space-padding-2xs);
1196
+ --ds-badge-size-base-padding: var(--ds-alias-space-padding-2xs);
1197
+ --ds-badge-size-base-font: var(--ds-alias-text-size-sm);
1198
+ --ds-badge-size-lg-radius: var(--ds-alias-radius-rounded);
1199
+ --ds-badge-size-lg-gap: var(--ds-alias-space-padding-2xs);
1200
+ --ds-badge-size-lg-padding: var(--ds-alias-space-padding-2xs);
1201
+ --ds-badge-size-lg-font: var(--ds-alias-text-size-lg);
1202
+ --ds-badge-typo-font-family: var(--ds-alias-text-family-heading);
1203
+ --ds-badge-typo-font-weight: var(--ds-alias-text-weight-bold);
1204
+ --ds-badge-typo-line-height: var(--ds-alias-text-line-height-single);
1205
+ --ds-badge-info-color-background: var(--ds-alias-surface-primary-lighter);
1206
+ --ds-button-color-primary-base-text: var(--ds-alias-action-primary-on-surface-base);
1207
+ --ds-button-color-primary-base-background: var(--ds-alias-action-primary-surface-base);
1208
+ --ds-button-color-primary-hover-text: var(--ds-alias-action-primary-on-surface-hover);
1209
+ --ds-button-color-primary-hover-background: var(--ds-alias-action-primary-surface-hover);
1210
+ --ds-button-color-primary-active-text: var(--ds-alias-action-primary-on-surface-active);
1211
+ --ds-button-color-primary-active-background: var(--ds-alias-action-primary-surface-active);
1212
+ --ds-button-color-secondary-base-text: var(--ds-alias-action-primary-text-base);
1213
+ --ds-button-color-secondary-base-background: var(--ds-alias-action-secondary-background-base);
1214
+ --ds-button-color-secondary-hover-text: var(--ds-alias-action-primary-text-hover);
1215
+ --ds-button-color-secondary-hover-background: var(--ds-alias-action-secondary-background-hover);
1216
+ --ds-button-color-secondary-active-text: var(--ds-alias-action-primary-text-active);
1217
+ --ds-button-color-secondary-active-background: var(--ds-alias-action-secondary-background-active);
1218
+ --ds-button-color-tertiary-base-background: var(--ds-alias-action-tertiary-surface-base);
1219
+ --ds-button-color-tertiary-base-border: var(--ds-alias-action-tertiary-border-base);
1220
+ --ds-button-color-tertiary-hover-background: var(--ds-alias-action-tertiary-surface-hover);
1221
+ --ds-button-color-tertiary-hover-border: var(--ds-alias-action-tertiary-border-hover);
1222
+ --ds-button-color-tertiary-active-background: var(--ds-alias-action-tertiary-surface-active);
1223
+ --ds-button-color-tertiary-active-border: var(--ds-alias-action-tertiary-border-active);
1224
+ --ds-button-color-ghost-base-text: var(--ds-alias-action-primary-text-base);
1225
+ --ds-button-color-ghost-base-background: var(--ds-alias-action-ghost-background-base);
1226
+ --ds-button-color-ghost-hover-text: var(--ds-alias-action-primary-text-hover);
1227
+ --ds-button-color-ghost-hover-background: var(--ds-alias-action-ghost-background-hover);
1228
+ --ds-button-color-ghost-active-text: var(--ds-alias-action-primary-text-active);
1229
+ --ds-button-color-ghost-active-background: var(--ds-alias-action-ghost-background-active);
1230
+ --ds-button-color-brand-purple-base-background: var(--ds-alias-action-brand-purple-surface-base);
1231
+ --ds-button-color-brand-purple-base-border: var(--ds-alias-action-brand-purple-border-base);
1232
+ --ds-button-color-brand-purple-hover-background: var(--ds-alias-action-brand-purple-surface-hover);
1233
+ --ds-button-color-brand-purple-hover-border: var(--ds-alias-action-brand-purple-border-hover);
1234
+ --ds-button-color-brand-purple-active-background: var(--ds-alias-action-brand-purple-surface-active);
1235
+ --ds-button-color-brand-purple-active-border: var(--ds-alias-action-brand-purple-border-active);
1236
+ --ds-button-color-brand-red-base-background: var(--ds-alias-action-brand-red-surface-base);
1237
+ --ds-button-color-brand-red-base-border: var(--ds-alias-action-brand-red-border-base);
1238
+ --ds-button-color-brand-red-hover-background: var(--ds-alias-action-brand-red-surface-hover);
1239
+ --ds-button-color-brand-red-hover-border: var(--ds-alias-action-brand-red-border-hover);
1240
+ --ds-button-color-brand-red-active-background: var(--ds-alias-action-brand-red-surface-active);
1241
+ --ds-button-color-brand-red-active-border: var(--ds-alias-action-brand-red-border-active);
1242
+ --ds-button-color-brand-yellow-base-background: var(--ds-alias-action-brand-yellow-surface-base);
1243
+ --ds-button-color-brand-yellow-base-border: var(--ds-alias-action-brand-yellow-border-base);
1244
+ --ds-button-color-brand-yellow-hover-background: var(--ds-alias-action-brand-yellow-surface-hover);
1245
+ --ds-button-color-brand-yellow-hover-border: var(--ds-alias-action-brand-yellow-border-hover);
1246
+ --ds-button-color-brand-yellow-active-background: var(--ds-alias-action-brand-yellow-surface-active);
1247
+ --ds-button-color-brand-yellow-active-border: var(--ds-alias-action-brand-yellow-border-active);
1248
+ --ds-button-color-brand-green-base-background: var(--ds-alias-action-brand-green-surface-base);
1249
+ --ds-button-color-brand-green-base-border: var(--ds-alias-action-brand-green-border-base);
1250
+ --ds-button-color-brand-green-hover-background: var(--ds-alias-action-brand-green-surface-hover);
1251
+ --ds-button-color-brand-green-hover-border: var(--ds-alias-action-brand-green-border-hover);
1252
+ --ds-button-color-brand-green-active-background: var(--ds-alias-action-brand-green-surface-active);
1253
+ --ds-button-color-brand-green-active-border: var(--ds-alias-action-brand-green-border-active);
1254
+ --ds-button-color-info-base-text: var(--ds-alias-action-info-on-surface-base);
1255
+ --ds-button-color-info-base-border: var(--ds-alias-action-info-border-base);
1256
+ --ds-button-color-info-base-background: var(--ds-alias-action-info-surface-base);
1257
+ --ds-button-color-info-hover-text: var(--ds-alias-action-info-on-surface-hover);
1258
+ --ds-button-color-info-hover-border: var(--ds-alias-action-info-border-hover);
1259
+ --ds-button-color-info-hover-background: var(--ds-alias-action-info-surface-hover);
1260
+ --ds-button-color-info-active-text: var(--ds-alias-action-info-on-surface-active);
1261
+ --ds-button-color-info-active-border: var(--ds-alias-action-info-border-active);
1262
+ --ds-button-color-info-active-background: var(--ds-alias-action-info-surface-active);
1263
+ --ds-button-color-success-base-text: var(--ds-alias-action-success-on-surface-base);
1264
+ --ds-button-color-success-base-border: var(--ds-alias-action-success-border-base);
1265
+ --ds-button-color-success-base-background: var(--ds-alias-action-success-surface-base);
1266
+ --ds-button-color-success-hover-text: var(--ds-alias-action-success-on-surface-hover);
1267
+ --ds-button-color-success-hover-border: var(--ds-alias-action-success-border-hover);
1268
+ --ds-button-color-success-hover-background: var(--ds-alias-action-success-surface-hover);
1269
+ --ds-button-color-success-active-text: var(--ds-alias-action-success-on-surface-active);
1270
+ --ds-button-color-success-active-border: var(--ds-alias-action-success-border-active);
1271
+ --ds-button-color-success-active-background: var(--ds-alias-action-success-surface-active);
1272
+ --ds-button-color-warning-base-text: var(--ds-alias-action-warning-on-surface-base);
1273
+ --ds-button-color-warning-base-border: var(--ds-alias-action-warning-border-base);
1274
+ --ds-button-color-warning-base-background: var(--ds-alias-action-warning-surface-base);
1275
+ --ds-button-color-warning-hover-text: var(--ds-alias-action-warning-on-surface-hover);
1276
+ --ds-button-color-warning-hover-border: var(--ds-alias-action-warning-border-hover);
1277
+ --ds-button-color-warning-hover-background: var(--ds-alias-action-warning-surface-hover);
1278
+ --ds-button-color-warning-active-text: var(--ds-alias-action-warning-on-surface-active);
1279
+ --ds-button-color-warning-active-border: var(--ds-alias-action-warning-border-active);
1280
+ --ds-button-color-warning-active-background: var(--ds-alias-action-warning-surface-active);
1281
+ --ds-button-color-danger-base-text: var(--ds-alias-action-danger-on-surface-base);
1282
+ --ds-button-color-danger-base-border: var(--ds-alias-action-danger-border-base);
1283
+ --ds-button-color-danger-base-background: var(--ds-alias-action-danger-surface-base);
1284
+ --ds-button-color-danger-hover-text: var(--ds-alias-action-danger-on-surface-hover);
1285
+ --ds-button-color-danger-hover-border: var(--ds-alias-action-danger-border-hover);
1286
+ --ds-button-color-danger-hover-background: var(--ds-alias-action-danger-surface-hover);
1287
+ --ds-button-color-danger-active-text: var(--ds-alias-action-danger-on-surface-active);
1288
+ --ds-button-color-danger-active-border: var(--ds-alias-action-danger-border-active);
1289
+ --ds-button-color-danger-active-background: var(--ds-alias-action-danger-surface-active);
1290
+ --ds-button-color-link-hover-text: var(--ds-alias-action-primary-text-hover);
1291
+ --ds-button-color-link-hover-background: var(--ds-alias-surface-transparent);
1292
+ --ds-button-color-link-active-text: var(--ds-alias-action-primary-text-active);
1293
+ --ds-button-color-link-active-background: var(--ds-alias-surface-transparent);
1294
+ --ds-button-color-link-base-text: var(--ds-alias-surface-primary);
1295
+ --ds-button-color-link-base-background: var(--ds-alias-surface-transparent);
1296
+ --ds-button-color-inverted-active-text: var(--ds-alias-text-color-white);
1297
+ --ds-button-color-inverted-active-background: var(--ds-alias-surface-primary-hover);
1298
+ --ds-button-color-inverted-active-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-primary-hover);
1299
+ --ds-button-color-inverted-base-text: var(--ds-alias-surface-primary);
1300
+ --ds-button-color-inverted-base-background: var(--ds-alias-surface-white);
1301
+ --ds-button-color-inverted-hover-text: var(--ds-alias-surface-primary);
1302
+ --ds-button-color-inverted-hover-background: var(--ds-alias-surface-sky);
1303
+ --ds-button-color-inverted-hover-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-sky);
1304
+ --ds-button-color-inverted-secondary-base-text: var(--ds-alias-text-color-white);
1305
+ --ds-button-color-inverted-secondary-base-background: var(--ds-alias-surface-transparent);
1306
+ --ds-button-color-inverted-secondary-hover-text: var(--ds-alias-text-color-white);
1307
+ --ds-button-color-inverted-secondary-hover-background: var(--ds-alias-surface-primary-light);
1308
+ --ds-button-color-inverted-secondary-hover-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-sky-dark);
1309
+ --ds-button-color-inverted-secondary-active-text: var(--ds-alias-text-color-white);
1310
+ --ds-button-color-inverted-secondary-active-background: var(--ds-alias-surface-primary-light);
1311
+ --ds-button-color-inverted-secondary-active-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-primary-hover);
1312
+ --ds-button-color-inverted-tertiary-base-text: var(--ds-alias-action-inverted-tertiary-text-base);
1313
+ --ds-button-color-inverted-tertiary-base-background: var(--ds-alias-action-inverted-tertiary-surface-base);
1314
+ --ds-button-color-inverted-tertiary-base-border: var(--ds-alias-action-inverted-tertiary-border-base);
1315
+ --ds-button-color-inverted-tertiary-hover-background: var(--ds-alias-action-inverted-tertiary-surface-hover);
1316
+ --ds-button-color-inverted-tertiary-hover-border: var(--ds-alias-action-inverted-tertiary-border-hover);
1317
+ --ds-button-color-inverted-tertiary-active-background: var(--ds-alias-action-inverted-tertiary-surface-active);
1318
+ --ds-button-color-inverted-tertiary-active-border: var(--ds-alias-action-inverted-tertiary-border-active);
1319
+ --ds-button-color-inverted-ghost-base-text: var(--ds-alias-action-inverted-ghost-text-base);
1320
+ --ds-button-color-inverted-ghost-base-background: var(--ds-alias-action-inverted-ghost-surface-base);
1321
+ --ds-button-color-inverted-ghost-base-border: var(--ds-alias-action-inverted-ghost-border-base);
1322
+ --ds-button-color-inverted-ghost-hover-background: var(--ds-alias-action-inverted-ghost-surface-hover);
1323
+ --ds-button-color-inverted-ghost-hover-border: var(--ds-alias-action-inverted-ghost-border-hover);
1324
+ --ds-button-color-inverted-ghost-active-background: var(--ds-alias-action-inverted-ghost-surface-active);
1325
+ --ds-button-color-inverted-ghost-active-border: var(--ds-alias-action-inverted-ghost-border-active);
1326
+ --ds-button-color-inverted-link-base-background: var(--ds-alias-surface-transparent);
1327
+ --ds-button-color-inverted-link-hover-text: var(--ds-alias-action-inverted-primary-text-hover);
1328
+ --ds-button-color-inverted-link-hover-background: var(--ds-alias-surface-transparent);
1329
+ --ds-button-color-inverted-link-active-text: var(--ds-alias-action-inverted-primary-text-active);
1330
+ --ds-button-color-inverted-link-active-background: var(--ds-alias-surface-transparent);
1331
+ --ds-button-size-base-line-height: var(--ds-alias-text-line-height-heading);
1332
+ --ds-button-size-base-font-weight: var(--ds-alias-text-weight-bold);
1333
+ --ds-button-size-base-font-family: var(--ds-alias-text-family-heading);
1334
+ --ds-button-size-base-font-size: var(--ds-alias-text-size-base);
1335
+ --ds-button-size-base-gap: var(--ds-alias-space-gap-xs);
1336
+ --ds-button-size-base-padding-x: var(--ds-alias-space-padding-md);
1337
+ --ds-button-size-base-radius: var(--ds-alias-radius-base);
1338
+ --ds-button-size-sm-line-height: var(--ds-alias-text-line-height-heading);
1339
+ --ds-button-size-sm-font-weight: var(--ds-alias-text-weight-bold);
1340
+ --ds-button-size-sm-radius: var(--ds-alias-radius-base);
1341
+ --ds-button-size-sm-font-family: var(--ds-alias-text-family-heading);
1342
+ --ds-button-size-sm-font-size: var(--ds-alias-text-size-sm);
1343
+ --ds-button-size-sm-gap: var(--ds-alias-space-gap-xs);
1344
+ --ds-button-size-sm-padding-x: var(--ds-alias-space-padding-sm);
1345
+ --ds-button-size-lg-line-height: var(--ds-alias-text-line-height-heading);
1346
+ --ds-button-size-lg-font-weight: var(--ds-alias-text-weight-bold);
1347
+ --ds-button-size-lg-radius: var(--ds-alias-radius-base);
1348
+ --ds-button-size-lg-font-family: var(--ds-alias-text-family-heading);
1349
+ --ds-button-size-lg-font-size: var(--ds-alias-text-size-lg);
1350
+ --ds-button-size-lg-gap: var(--ds-alias-space-gap-xs);
1351
+ --ds-button-size-lg-padding-x: var(--ds-alias-space-padding-md);
1352
+ --ds-body-color: var(--ds-alias-text-color-primary);
1353
+ --ds-body-surface: var(--ds-alias-surface-white);
1354
+ --ds-card-shadow-flat: var(--ds-alias-shadow-box-none);
1355
+ --ds-card-shadow-base: var(--ds-alias-shadow-box-base);
1356
+ --ds-card-shadow-hover: var(--ds-alias-shadow-box-elevated);
1357
+ --ds-card-color-primary-background: var(--ds-alias-surface-primary);
1358
+ --ds-card-color-primary-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-primary);
1359
+ --ds-card-color-grey-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-grey);
1360
+ --ds-card-color-grey-background: var(--ds-alias-surface-grey);
1361
+ --ds-card-color-green-dark-background: var(--ds-alias-surface-green);
1362
+ --ds-card-color-green-dark-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-green);
1363
+ --ds-card-color-green-background: var(--ds-alias-surface-green-lighter);
1364
+ --ds-card-color-green-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-green-lighter);
1365
+ --ds-card-color-yellow-dark-background: var(--ds-alias-surface-yellow);
1366
+ --ds-card-color-yellow-dark-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-yellow);
1367
+ --ds-card-color-yellow-background: var(--ds-alias-surface-yellow-lighter);
1368
+ --ds-card-color-yellow-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-yellow-lighter);
1369
+ --ds-card-color-red-dark-background: var(--ds-alias-surface-red);
1370
+ --ds-card-color-red-dark-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-red);
1371
+ --ds-card-color-red-background: var(--ds-alias-surface-red-lighter);
1372
+ --ds-card-color-red-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-red-lighter);
1373
+ --ds-card-color-purple-dark-background: var(--ds-alias-surface-purple);
1374
+ --ds-card-color-purple-dark-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-purple);
1375
+ --ds-card-color-purple-background: var(--ds-alias-surface-purple-lighter);
1376
+ --ds-card-color-purple-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-purple-lighter);
1377
+ --ds-card-color-dashed-background: var(--ds-alias-surface-white);
1378
+ --ds-card-color-default-background: var(--ds-alias-surface-white);
1379
+ --ds-card-color-default-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-surface-white);
1380
+ --ds-card-radius: var(--ds-alias-radius-lg);
1381
+ --ds-close-radius: var(--ds-alias-radius-rounded);
1382
+ --ds-close-inverted-color-background-base: var(--ds-alias-surface-transparent);
1383
+ --ds-close-inverted-color-background-disabled: var(--ds-alias-surface-disabled);
1384
+ --ds-close-inverted-color-icon-base: var(--ds-alias-text-color-white);
1385
+ --ds-close-inverted-color-icon-disabled: var(--ds-alias-text-color-disabled);
1386
+ --ds-close-primary-color-background-base: var(--ds-alias-surface-transparent);
1387
+ --ds-close-primary-color-background-disabled: var(--ds-alias-surface-disabled);
1388
+ --ds-close-primary-color-icon-base: var(--ds-alias-text-color-primary);
1389
+ --ds-close-primary-color-icon-disabled: var(--ds-alias-text-color-disabled);
1390
+ --ds-data-item-label-font-weight: var(--ds-alias-text-weight-bold);
1391
+ --ds-data-item-label-color: var(--ds-alias-text-color-primary);
1392
+ --ds-data-item-value-color: var(--ds-alias-text-color-primary);
1393
+ --ds-data-item-color-required: var(--ds-alias-text-color-danger);
1394
+ --ds-data-item-color-disabled: var(--ds-alias-text-color-disabled);
1395
+ --ds-datepicker-calendar-weight: var(--ds-alias-text-weight-bold);
1396
+ --ds-datepicker-calendar-radius: var(--ds-alias-radius-base);
1397
+ --ds-datepicker-calendar-shadow: var(--ds-alias-shadow-box-base);
1398
+ --ds-datepicker-calendar-color-inner-border: var(--ds-alias-border-color-grey);
1399
+ --ds-datepicker-calendar-color-current-date: var(--ds-alias-text-color-primary);
1400
+ --ds-datepicker-calendar-color-text: var(--ds-alias-text-color-primary);
1401
+ --ds-datepicker-calendar-color-disabled: var(--ds-alias-text-color-disabled);
1402
+ --ds-datepicker-calendar-color-day-active-background: var(--ds-alias-surface-sky);
1403
+ --ds-datepicker-calendar-color-day-selected-background: var(--ds-alias-surface-primary-dark);
1404
+ --ds-datepicker-calendar-color-day-selected-hover-background: var(--ds-alias-surface-primary-hover);
1405
+ --ds-datepicker-calendar-color-day-hover-background: var(--ds-alias-surface-highlight);
1406
+ --ds-datepicker-calendar-day-weight-base: var(--ds-alias-text-weight-regular);
1407
+ --ds-datepicker-calendar-day-weight-selected: var(--ds-alias-text-weight-bold);
1408
+ --ds-datepicker-calendar-day-name-family: var(--ds-alias-text-family-heading);
1409
+ --ds-datepicker-calendar-day-name-weight: var(--ds-alias-text-weight-bold);
1410
+ --ds-datepicker-calendar-nav-radius: var(--ds-alias-radius-base);
1411
+ --ds-datepicker-calendar-nav-color-base: var(--ds-alias-text-color-primary);
1412
+ --ds-datepicker-calendar-nav-color-hover: var(--ds-alias-action-primary-text-hover);
1413
+ --ds-datepicker-calendar-nav-color-active: var(--ds-alias-action-primary-text-active);
1414
+ --ds-datepicker-calendar-nav-color-disabled: var(--ds-alias-text-color-disabled);
1415
+ --ds-datepicker-calendar-family: var(--ds-alias-text-family-text);
1416
+ --ds-datepicker-calendar-size: var(--ds-alias-text-size-base);
1417
+ --ds-datepicker-trigger-color-disabled: var(--ds-alias-text-color-disabled);
1418
+ --ds-datepicker-trigger-color-hover: var(--ds-alias-action-primary-text-hover);
1419
+ --ds-datepicker-trigger-color-active: var(--ds-alias-action-primary-text-active);
1420
+ --ds-datepicker-popup-shadow: var(--ds-alias-shadow-box-base);
1421
+ --ds-description-list-term-color: var(--ds-alias-text-color-hint);
1422
+ --ds-description-list-term-font-weight: var(--ds-alias-text-weight-regular);
1423
+ --ds-description-list-term-font-family: var(--ds-alias-text-family-text);
1424
+ --ds-description-list-detail-color: var(--ds-alias-text-color-primary);
1425
+ --ds-description-list-detail-font-weight: var(--ds-alias-text-weight-regular);
1426
+ --ds-description-list-detail-font-family: var(--ds-alias-text-family-text);
1427
+ --ds-divider-radius: var(--ds-alias-radius-rounded);
1428
+ --ds-divider-color-primary: var(--ds-alias-border-color-primary);
1429
+ --ds-divider-color-secondary: var(--ds-alias-border-color-primary-light);
1430
+ --ds-divider-color-inverted: var(--ds-alias-border-color-white);
1431
+ --ds-divider-color-default: var(--ds-alias-border-color-grey-light);
1432
+ --ds-divider-size: var(--ds-alias-border-width-base);
1433
+ --ds-icon-color-primary: var(--ds-alias-text-color-primary);
1434
+ --ds-icon-color-success: var(--ds-alias-text-color-success);
1435
+ --ds-icon-color-warning: var(--ds-alias-text-color-warning);
1436
+ --ds-icon-color-grey: var(--ds-alias-text-color-grey);
1437
+ --ds-icon-color-disabled: var(--ds-alias-text-color-disabled);
1438
+ --ds-icon-color-inverted: var(--ds-alias-text-color-white);
1439
+ --ds-icon-color-danger: var(--ds-alias-text-color-danger);
1440
+ --ds-icon-color-info: var(--ds-alias-text-color-hint);
1441
+ --ds-brand-icon-tile-radius: var(--ds-alias-radius-base);
1442
+ --ds-brand-icon-color-green-background: var(--ds-alias-surface-green-lighter);
1443
+ --ds-brand-icon-color-green-level1: var(--ds-alias-surface-primary);
1444
+ --ds-brand-icon-color-green-level2: var(--ds-alias-surface-green-dark);
1445
+ --ds-brand-icon-color-green-level3: var(--ds-alias-surface-green);
1446
+ --ds-brand-icon-color-invalid-level1: var(--ds-alias-text-color-danger);
1447
+ --ds-brand-icon-color-invalid-level2: var(--ds-alias-text-color-danger);
1448
+ --ds-brand-icon-color-invalid-level3: var(--ds-alias-text-color-danger);
1449
+ --ds-brand-icon-color-invalid-background: var(--ds-alias-surface-danger-lighter);
1450
+ --ds-brand-icon-color-disabled-level1: var(--ds-alias-text-color-disabled);
1451
+ --ds-brand-icon-color-disabled-level2: var(--ds-alias-text-color-disabled);
1452
+ --ds-brand-icon-color-disabled-level3: var(--ds-alias-text-color-disabled);
1453
+ --ds-brand-icon-color-disabled-background: var(--ds-alias-surface-grey);
1454
+ --ds-brand-icon-color-purple-background: var(--ds-alias-surface-purple-lighter);
1455
+ --ds-brand-icon-color-purple-level1: var(--ds-alias-surface-primary);
1456
+ --ds-brand-icon-color-purple-level2: var(--ds-alias-surface-purple-dark);
1457
+ --ds-brand-icon-color-purple-level3: var(--ds-alias-surface-purple);
1458
+ --ds-brand-icon-color-red-background: var(--ds-alias-surface-red-lighter);
1459
+ --ds-brand-icon-color-red-level1: var(--ds-alias-surface-primary);
1460
+ --ds-brand-icon-color-red-level2: var(--ds-alias-surface-red-dark);
1461
+ --ds-brand-icon-color-red-level3: var(--ds-alias-surface-red);
1462
+ --ds-brand-icon-color-yellow-background: var(--ds-alias-surface-yellow-lighter);
1463
+ --ds-brand-icon-color-yellow-level1: var(--ds-alias-surface-primary);
1464
+ --ds-brand-icon-color-yellow-level2: var(--ds-alias-surface-yellow-dark);
1465
+ --ds-brand-icon-color-yellow-level3: var(--ds-alias-surface-yellow);
1466
+ --ds-form-container-radius: var(--ds-alias-radius-base);
1467
+ --ds-form-default-container-background: var(--ds-alias-surface-white);
1468
+ --ds-form-default-label-color: var(--ds-alias-text-color-primary);
1469
+ --ds-form-default-control-value-color: var(--ds-alias-text-color-primary);
1470
+ --ds-form-default-control-placeholder-color: var(--ds-alias-text-color-placeholder);
1471
+ --ds-form-default-description-color: var(--ds-alias-text-color-hint);
1472
+ --ds-form-hover-container-background: var(--ds-alias-surface-hover);
1473
+ --ds-form-active-container-background: var(--ds-alias-surface-hover);
1474
+ --ds-form-focus-container-background: var(--ds-alias-surface-hover);
1475
+ --ds-form-success-container-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-text-color-success);
1476
+ --ds-form-success-container-background: var(--ds-alias-surface-success-lighter);
1477
+ --ds-form-success-label-color: var(--ds-alias-text-color-success);
1478
+ --ds-form-success-control-value-color: var(--ds-alias-text-color-success);
1479
+ --ds-form-success-control-placeholder-color: var(--ds-alias-text-color-placeholder);
1480
+ --ds-form-success-description-color: var(--ds-alias-text-color-success);
1481
+ --ds-form-warning-container-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-text-color-warning);
1482
+ --ds-form-warning-container-background: var(--ds-alias-surface-warning-lighter);
1483
+ --ds-form-warning-label-color: var(--ds-alias-text-color-warning);
1484
+ --ds-form-warning-control-value-color: var(--ds-alias-text-color-warning);
1485
+ --ds-form-warning-control-placeholder-color: var(--ds-alias-text-color-placeholder);
1486
+ --ds-form-warning-description-color: var(--ds-alias-text-color-warning);
1487
+ --ds-form-danger-container-border: var(--ds-alias-border-width-base) var(--ds-alias-border-style-solid) var(--ds-alias-text-color-danger);
1488
+ --ds-form-danger-container-background: var(--ds-alias-surface-danger-lighter);
1489
+ --ds-form-danger-label-color: var(--ds-alias-text-color-danger);
1490
+ --ds-form-danger-control-value-color: var(--ds-alias-text-color-danger);
1491
+ --ds-form-danger-control-placeholder-color: var(--ds-alias-text-color-placeholder);
1492
+ --ds-form-danger-description-color: var(--ds-alias-text-color-danger);
1493
+ --ds-form-disabled-container-background: var(--ds-alias-surface-disabled);
1494
+ --ds-form-disabled-label-color: var(--ds-alias-text-color-disabled);
1495
+ --ds-form-disabled-control-value-color: var(--ds-alias-text-color-disabled);
1496
+ --ds-form-disabled-control-placeholder-color: var(--ds-alias-text-color-disabled);
1497
+ --ds-form-disabled-description-color: var(--ds-alias-text-color-disabled);
1498
+ --ds-select-radius: var(--ds-alias-radius-base);
1499
+ --ds-select-container-radius: var(--ds-alias-radius-base);
1500
+ --ds-select-container-border-width: var(--ds-alias-border-width-base);
1501
+ --ds-select-container-color-base-border: var(--ds-alias-border-color-grey);
1502
+ --ds-select-container-color-base-background: var(--ds-alias-surface-white);
1503
+ --ds-select-container-color-hover-border: var(--ds-alias-border-color-grey);
1504
+ --ds-select-container-color-hover-background: var(--ds-alias-surface-hover);
1505
+ --ds-select-container-color-active-border: var(--ds-alias-border-color-primary);
1506
+ --ds-select-container-color-active-background: var(--ds-alias-surface-hover);
1507
+ --ds-select-container-color-focus-border: var(--ds-alias-border-color-primary);
1508
+ --ds-select-container-color-focus-background: var(--ds-alias-surface-hover);
1509
+ --ds-select-container-color-success-border: var(--ds-alias-text-color-success);
1510
+ --ds-select-container-color-success-background: var(--ds-alias-surface-success-lighter);
1511
+ --ds-select-container-color-warning-border: var(--ds-alias-text-color-warning);
1512
+ --ds-select-container-color-warning-background: var(--ds-alias-surface-warning-lighter);
1513
+ --ds-select-container-color-danger-border: var(--ds-alias-text-color-danger);
1514
+ --ds-select-container-color-danger-background: var(--ds-alias-surface-danger-lighter);
1515
+ --ds-select-container-color-disabled-border: var(--ds-alias-border-color-disabled);
1516
+ --ds-select-container-color-disabled-background: var(--ds-alias-surface-disabled);
1517
+ --ds-select-label-weight: var(--ds-alias-text-weight-bold);
1518
+ --ds-select-label-color-base: var(--ds-alias-text-color-primary);
1519
+ --ds-select-label-color-success: var(--ds-alias-text-color-success);
1520
+ --ds-select-label-color-warning: var(--ds-alias-text-color-warning);
1521
+ --ds-select-label-color-danger: var(--ds-alias-text-color-danger);
1522
+ --ds-select-label-color-disabled: var(--ds-alias-text-color-disabled);
1523
+ --ds-select-label-family: var(--ds-alias-text-family-text);
1524
+ --ds-select-label-line-height: var(--ds-alias-text-line-height-text);
1525
+ --ds-select-label-size: var(--ds-alias-text-size-sm);
1526
+ --ds-select-control-weight: var(--ds-alias-text-weight-regular);
1527
+ --ds-select-control-color-value-base: var(--ds-alias-text-color-primary);
1528
+ --ds-select-control-color-value-disabled: var(--ds-alias-text-color-disabled);
1529
+ --ds-select-control-color-placeholder-disabled: var(--ds-alias-text-color-disabled);
1530
+ --ds-select-control-color-placeholder-base: var(--ds-alias-text-color-placeholder);
1531
+ --ds-select-control-family: var(--ds-alias-text-family-text);
1532
+ --ds-select-control-line-height: var(--ds-alias-text-line-height-text);
1533
+ --ds-select-control-font-size: var(--ds-alias-text-size-base);
1534
+ --ds-select-description-weight: var(--ds-alias-text-weight-regular);
1535
+ --ds-select-description-color-success: var(--ds-alias-text-color-success);
1536
+ --ds-select-description-color-warning: var(--ds-alias-text-color-warning);
1537
+ --ds-select-description-color-danger: var(--ds-alias-text-color-danger);
1538
+ --ds-select-description-color-disabled: var(--ds-alias-text-color-disabled);
1539
+ --ds-select-description-color-base: var(--ds-alias-text-color-hint);
1540
+ --ds-select-description-family: var(--ds-alias-text-family-text);
1541
+ --ds-select-description-line-height: var(--ds-alias-text-line-height-text);
1542
+ --ds-select-description-size: var(--ds-alias-text-size-xs);
1543
+ --ds-select-chip-color-text: var(--ds-alias-text-color-primary);
1544
+ --ds-select-chip-color-background: var(--ds-alias-surface-grey);
1545
+ --ds-select-chip-family: var(--ds-alias-text-family-text);
1546
+ --ds-select-color-disabled: var(--ds-alias-text-color-disabled);
1547
+ --ds-select-color-success: var(--ds-alias-text-color-success);
1548
+ --ds-select-color-error: var(--ds-alias-text-color-danger);
1549
+ --ds-select-color-text: var(--ds-alias-text-color-primary);
1550
+ --ds-select-color-primary: var(--ds-alias-text-color-primary);
1551
+ --ds-select-color-placeholder: var(--ds-alias-text-color-placeholder);
1552
+ --ds-select-color-border: var(--ds-alias-border-color-grey-light);
1553
+ --ds-select-color-focus-ring: var(--ds-alias-interaction-focus-color-base);
1554
+ --ds-select-color-background: var(--ds-alias-surface-transparent);
1555
+ --ds-select-color-highlight: var(--ds-alias-surface-yellow-light);
1556
+ --ds-select-color-focus: var(--ds-alias-surface-hover);
1557
+ --ds-select-content-shadow: var(--ds-alias-shadow-box-base);
1558
+ --ds-select-content-family: var(--ds-alias-text-family-text);
1559
+ --ds-select-content-color-background: var(--ds-alias-surface-white);
1560
+ --ds-select-content-radius: var(--ds-alias-radius-md);
1561
+ --ds-select-content-padding: var(--ds-alias-space-padding-2xs);
1562
+ --ds-select-search-color-text: var(--ds-alias-text-color-primary);
1563
+ --ds-select-option-color-text-base: var(--ds-alias-text-color-primary);
1564
+ --ds-select-option-color-text-selected: var(--ds-alias-text-color-primary);
1565
+ --ds-select-option-color-text-highlight: var(--ds-alias-text-color-primary);
1566
+ --ds-select-option-color-text-disabled: var(--ds-alias-text-color-disabled);
1567
+ --ds-select-option-color-border: var(--ds-alias-border-color-grey-light);
1568
+ --ds-select-option-color-icon-selected: var(--ds-alias-text-color-primary);
1569
+ --ds-select-option-color-background-base: var(--ds-alias-surface-transparent);
1570
+ --ds-select-option-color-background-highlight: var(--ds-alias-surface-highlight);
1571
+ --ds-select-option-color-background-disabled: var(--ds-alias-surface-disabled);
1572
+ --ds-select-option-color-background-hover: var(--ds-alias-surface-highlight);
1573
+ --ds-select-option-color-background-selected: var(--ds-alias-surface-transparent);
1574
+ --ds-select-option-weight-selected: var(--ds-alias-text-weight-bold);
1575
+ --ds-select-optgroup-weight: var(--ds-alias-text-weight-bold);
1576
+ --ds-select-optgroup-color-text: var(--ds-alias-text-color-primary);
1577
+ --ds-select-optgroup-color-background: var(--ds-alias-surface-grey-light);
1578
+ --ds-select-icon-color-base: var(--ds-alias-text-color-primary);
1579
+ --ds-select-icon-color-hover: var(--ds-alias-action-primary-text-hover);
1580
+ --ds-select-icon-color-active: var(--ds-alias-action-primary-text-active);
1581
+ --ds-select-checkbox-color-border-base: var(--ds-alias-border-color-primary);
1582
+ --ds-select-checkbox-color-border-selected: var(--ds-alias-border-color-primary);
1583
+ --ds-select-checkbox-color-background-selected: var(--ds-alias-surface-primary);
1584
+ --ds-notification-default-color-background: var(--ds-alias-surface-grey-light);
1585
+ --ds-notification-default-border: var(--ds-alias-border-composite-none);
1586
+ --ds-notification-info-border: var(--ds-alias-border-composite-none);
1587
+ --ds-notification-info-color-background: var(--ds-alias-surface-info-lighter);
1588
+ --ds-notification-info-color-heading: var(--ds-alias-text-color-info);
1589
+ --ds-notification-success-color-background: var(--ds-alias-surface-success-lighter);
1590
+ --ds-notification-success-color-heading: var(--ds-alias-text-color-success);
1591
+ --ds-notification-success-border: var(--ds-alias-border-composite-none);
1592
+ --ds-notification-warning-color-background: var(--ds-alias-surface-warning-lighter);
1593
+ --ds-notification-warning-color-heading: var(--ds-alias-text-color-warning);
1594
+ --ds-notification-warning-border: var(--ds-alias-border-composite-none);
1595
+ --ds-notification-danger-color-background: var(--ds-alias-surface-danger-lighter);
1596
+ --ds-notification-danger-color-heading: var(--ds-alias-text-color-danger);
1597
+ --ds-notification-danger-border: var(--ds-alias-border-composite-none);
1598
+ --ds-notification-outline-default-color-background: var(--ds-alias-surface-white);
1599
+ --ds-notification-outline-purple-color-background: var(--ds-alias-surface-purple-lighter);
1600
+ --ds-notification-outline-green-color-background: var(--ds-alias-surface-green-lighter);
1601
+ --ds-notification-outline-yellow-color-background: var(--ds-alias-surface-yellow-lighter);
1602
+ --ds-notification-outline-red-color-background: var(--ds-alias-surface-red-lighter);
1603
+ --ds-notification-radius: var(--ds-alias-radius-md);
1604
+ --ds-label-color-disabled: var(--ds-alias-text-color-disabled);
1605
+ --ds-label-color-success: var(--ds-alias-text-color-success);
1606
+ --ds-label-color-warning: var(--ds-alias-text-color-warning);
1607
+ --ds-label-color-danger: var(--ds-alias-text-color-danger);
1608
+ --ds-label-color-primary: var(--ds-alias-text-color-primary);
1609
+ --ds-list-marker-radius: var(--ds-alias-radius-rounded);
1610
+ --ds-list-marker-color-green: var(--ds-alias-surface-green);
1611
+ --ds-list-marker-color-purple: var(--ds-alias-surface-purple);
1612
+ --ds-list-marker-color-red: var(--ds-alias-surface-red);
1613
+ --ds-list-marker-color-yellow: var(--ds-alias-surface-yellow);
1614
+ --ds-list-item-size-base-padding-y: var(--ds-alias-space-padding-xs);
1615
+ --ds-list-item-size-lg-padding-y: var(--ds-alias-space-padding-xs);
1616
+ --ds-list-item-gap: var(--ds-alias-space-gap-base);
1617
+ --ds-list-item-radius: var(--ds-alias-radius-lg);
1618
+ --ds-list-item-color-text-base: var(--ds-alias-text-color-primary);
1619
+ --ds-list-item-color-text-disabled: var(--ds-alias-text-color-grey);
1620
+ --ds-list-item-color-text-hover: var(--ds-alias-border-color-primary-hover);
1621
+ --ds-list-item-color-text-active: var(--ds-alias-border-color-primary-active);
1622
+ --ds-list-item-inverted-color-text-hover: var(--ds-alias-action-inverted-primary-text-hover);
1623
+ --ds-list-item-inverted-color-text-active: var(--ds-alias-action-inverted-primary-text-active);
1624
+ --ds-list-item-accordion-py: var(--ds-alias-space-padding-base);
1625
+ --ds-list-item-action-icon-size: var(--ds-icon-size-sm);
1626
+ --ds-modal-width: var(--ds-alias-container-width-modal);
1627
+ --ds-modal-radius: var(--ds-alias-radius-lg);
1628
+ --ds-modal-color-background: var(--ds-alias-surface-white);
1629
+ --ds-app-navbar-default-gap: var(--ds-alias-space-gap-xl);
1630
+ --ds-app-navbar-default-layout-shadow: var(--ds-alias-shadow-box-header);
1631
+ --ds-app-navbar-default-layout-z-index: var(--ds-alias-z-index-navigation);
1632
+ --ds-app-navbar-default-layout-background: var(--ds-alias-surface-primary);
1633
+ --ds-app-navbar-default-layout-padding: var(--ds-alias-space-padding-base);
1634
+ --ds-app-navbar-default-brand-focus-radius: var(--ds-alias-radius-base);
1635
+ --ds-app-navbar-default-brand-gap: var(--ds-alias-space-gap-xs);
1636
+ --ds-app-navbar-default-title-color: var(--ds-alias-text-color-white);
1637
+ --ds-app-navbar-default-title-font-family: var(--ds-alias-text-family-heading);
1638
+ --ds-app-navbar-default-title-font-weight: var(--ds-alias-text-weight-bold);
1639
+ --ds-app-navbar-default-hamburger-radius: var(--ds-alias-radius-base);
1640
+ --ds-app-navbar-default-hamburger-padding: var(--ds-alias-space-padding-xs);
1641
+ --ds-app-navbar-default-sidebar-panel-background: var(--ds-alias-surface-white);
1642
+ --ds-app-navbar-default-sidebar-item-font-weight: var(--ds-alias-text-weight-bold);
1643
+ --ds-app-navbar-default-sidebar-item-font-family: var(--ds-alias-text-family-heading);
1644
+ --ds-app-navbar-default-sidebar-item-color-base: var(--ds-alias-text-color-primary);
1645
+ --ds-app-navbar-default-sidebar-item-color-hover: var(--ds-alias-text-color-primary);
1646
+ --ds-app-navbar-default-sidebar-item-color-active: var(--ds-alias-text-color-primary);
1647
+ --ds-app-navbar-default-sidebar-item-divider-color: var(--ds-alias-border-color-grey);
1648
+ --ds-app-navbar-default-sidebar-item-divider-color-active: var(--ds-alias-border-color-primary);
1649
+ --ds-app-navbar-default-sidebar-item-font-size: var(--ds-alias-text-size-base);
1650
+ --ds-app-navbar-default-sidebar-item-background-active: var(--ds-alias-surface-primary-lighter);
1651
+ --ds-app-navbar-default-sidebar-item-background-hover: var(--ds-alias-surface-primary-lighter);
1652
+ --ds-app-navbar-default-sidebar-item-padding-block: var(--ds-alias-space-padding-sm);
1653
+ --ds-app-navbar-default-sidebar-item-padding-inline: var(--ds-alias-space-padding-xs);
1654
+ --ds-app-navbar-default-sidebar-item-chevron-color: var(--ds-alias-surface-primary);
1655
+ --ds-app-navbar-default-sidebar-content-gap: var(--ds-alias-space-gap-base);
1656
+ --ds-app-navbar-default-sidebar-content-padding-inline: var(--ds-alias-space-padding-md);
1657
+ --ds-app-navbar-default-sidebar-content-padding-block: var(--ds-alias-space-padding-md);
1658
+ --ds-app-navbar-default-menu-item-border-radius: var(--ds-alias-radius-base);
1659
+ --ds-app-navbar-default-menu-item-color-base: var(--ds-alias-text-color-white);
1660
+ --ds-app-navbar-default-menu-item-color-hover: var(--ds-alias-action-inverted-primary-text-hover);
1661
+ --ds-app-navbar-default-menu-item-color-selected-hover: var(--ds-alias-action-inverted-primary-text-hover);
1662
+ --ds-app-navbar-default-menu-item-color-active: var(--ds-alias-action-inverted-primary-text-active);
1663
+ --ds-app-navbar-default-menu-item-font-size: var(--ds-alias-text-size-base);
1664
+ --ds-app-navbar-default-menu-item-padding-block: var(--ds-alias-space-padding-xs);
1665
+ --ds-app-navbar-default-menu-item-padding-inline: var(--ds-alias-space-padding-base);
1666
+ --ds-app-navbar-default-menu-start-gap: var(--ds-alias-space-gap-3xs);
1667
+ --ds-app-navbar-default-menu-end-gap: var(--ds-alias-space-gap-xs);
1668
+ --ds-app-navbar-default-focus-color-start: var(--ds-alias-interaction-focus-color-inverted);
1669
+ --ds-app-navbar-default-focus-color-end: var(--ds-alias-interaction-focus-color-inverted);
1670
+ --ds-app-navbar-default-content-gap: var(--ds-alias-space-gap-xs);
1671
+ --ds-app-navbar-light-title-color: var(--ds-alias-text-color-primary);
1672
+ --ds-app-navbar-light-menu-item-color-base: var(--ds-alias-text-color-primary);
1673
+ --ds-app-navbar-light-menu-item-color-hover: var(--ds-alias-action-primary-text-hover);
1674
+ --ds-app-navbar-light-menu-item-color-selected: var(--ds-alias-action-primary-text-active);
1675
+ --ds-app-navbar-light-menu-item-color-active: var(--ds-alias-action-primary-text-active);
1676
+ --ds-app-navbar-light-background: var(--ds-alias-surface-white);
1677
+ --ds-sheet-background: var(--ds-alias-surface-white);
1678
+ --ds-sheet-radius: var(--ds-alias-radius-lg);
1679
+ --ds-sheet-shadow: var(--ds-alias-shadow-box-base);
1680
+ --ds-sheet-position-bottom: var(--ds-alias-space-padding-xs);
1681
+ --ds-snackbar-radius: var(--ds-alias-radius-base);
1682
+ --ds-snackbar-primary-color-background: var(--ds-alias-surface-grey-light);
1683
+ --ds-snackbar-primary-color-body: var(--ds-alias-text-color-primary);
1684
+ --ds-snackbar-primary-color-heading: var(--ds-alias-text-color-primary);
1685
+ --ds-snackbar-primary-border: var(--ds-alias-border-composite-none);
1686
+ --ds-snackbar-success-color-body: var(--ds-alias-text-color-primary);
1687
+ --ds-snackbar-success-color-background: var(--ds-alias-surface-success-lighter);
1688
+ --ds-snackbar-success-color-heading: var(--ds-alias-text-color-success);
1689
+ --ds-snackbar-success-border: var(--ds-alias-border-composite-none);
1690
+ --ds-snackbar-info-color-body: var(--ds-alias-text-color-primary);
1691
+ --ds-snackbar-info-color-heading: var(--ds-alias-text-color-info);
1692
+ --ds-snackbar-info-color-background: var(--ds-alias-surface-info-lighter);
1693
+ --ds-snackbar-info-border: var(--ds-alias-border-composite-none);
1694
+ --ds-snackbar-warning-color-body: var(--ds-alias-text-color-primary);
1695
+ --ds-snackbar-warning-color-background: var(--ds-alias-surface-warning-lighter);
1696
+ --ds-snackbar-warning-color-heading: var(--ds-alias-text-color-warning);
1697
+ --ds-snackbar-warning-border: var(--ds-alias-border-composite-none);
1698
+ --ds-snackbar-danger-color-body: var(--ds-alias-text-color-primary);
1699
+ --ds-snackbar-danger-color-background: var(--ds-alias-surface-danger-lighter);
1700
+ --ds-snackbar-danger-color-heading: var(--ds-alias-text-color-danger);
1701
+ --ds-snackbar-danger-border: var(--ds-alias-border-composite-none);
1702
+ --ds-snackbar-padding: var(--ds-alias-space-padding-base);
1703
+ --ds-snackbar-gap: var(--ds-alias-space-gap-3xs);
1704
+ --ds-spinner-circle-primary-background: var(--ds-alias-surface-grey);
1705
+ --ds-spinner-circle-primary-progress: var(--ds-alias-text-color-primary);
1706
+ --ds-spinner-circle-inverted-background: var(--ds-alias-surface-white);
1707
+ --ds-spinner-circle-inverted-progress: var(--ds-alias-text-color-primary);
1708
+ --ds-spinner-logo-primary-color: var(--ds-alias-text-color-primary);
1709
+ --ds-toast-primary-color-background: var(--ds-alias-surface-grey-light);
1710
+ --ds-toast-primary-color-heading: var(--ds-alias-text-color-primary);
1711
+ --ds-toast-primary-border: var(--ds-alias-border-composite-none);
1712
+ --ds-toast-primary-progress-bar: var(--ds-alias-surface-primary);
1713
+ --ds-toast-success-color-background: var(--ds-alias-surface-success-lighter);
1714
+ --ds-toast-success-color-heading: var(--ds-alias-text-color-success);
1715
+ --ds-toast-success-border: var(--ds-alias-border-composite-none);
1716
+ --ds-toast-success-progress-background: var(--ds-alias-surface-success-light);
1717
+ --ds-toast-success-progress-bar: var(--ds-alias-surface-success-darkest);
1718
+ --ds-toast-info-border: var(--ds-alias-border-composite-none);
1719
+ --ds-toast-info-color-background: var(--ds-alias-surface-info-lighter);
1720
+ --ds-toast-info-color-heading: var(--ds-alias-text-color-info);
1721
+ --ds-toast-info-progress-background: var(--ds-alias-surface-info-light);
1722
+ --ds-toast-info-progress-bar: var(--ds-alias-surface-info-darkest);
1723
+ --ds-toast-warning-color-background: var(--ds-alias-surface-warning-lighter);
1724
+ --ds-toast-warning-color-heading: var(--ds-alias-text-color-warning);
1725
+ --ds-toast-warning-border: var(--ds-alias-border-composite-none);
1726
+ --ds-toast-warning-progress-background: var(--ds-alias-surface-warning-light);
1727
+ --ds-toast-warning-progress-bar: var(--ds-alias-surface-warning-darkest);
1728
+ --ds-toast-danger-color-background: var(--ds-alias-surface-danger-lighter);
1729
+ --ds-toast-danger-color-heading: var(--ds-alias-text-color-danger);
1730
+ --ds-toast-danger-border: var(--ds-alias-border-composite-none);
1731
+ --ds-toast-danger-progress-background: var(--ds-alias-surface-danger-light);
1732
+ --ds-toast-danger-progress-bar: var(--ds-alias-surface-danger-darkest);
1733
+ --ds-toast-radius: var(--ds-alias-radius-md);
1734
+ --ds-toast-padding: var(--ds-alias-space-padding-base);
1735
+ --ds-toast-gap: var(--ds-alias-space-gap-3xs);
1736
+ --ds-tag-size-base-gap: var(--ds-alias-space-gap-2xs);
1737
+ --ds-tag-size-base-padding-x: var(--ds-alias-space-padding-sm);
1738
+ --ds-tag-size-base-padding-y: var(--ds-alias-space-padding-2xs);
1739
+ --ds-tag-size-base-font-weight: var(--ds-alias-text-weight-bold);
1740
+ --ds-tag-size-base-font-size: var(--ds-alias-text-size-base);
1741
+ --ds-tag-size-sm-gap: var(--ds-alias-space-gap-2xs);
1742
+ --ds-tag-size-sm-padding-x: var(--ds-alias-space-padding-sm);
1743
+ --ds-tag-size-sm-padding-y: var(--ds-alias-space-padding-none);
1744
+ --ds-tag-size-sm-font-weight: var(--ds-alias-text-weight-regular);
1745
+ --ds-tag-size-sm-font-size: var(--ds-alias-text-size-sm);
1746
+ --ds-tag-size-md-gap: var(--ds-alias-space-gap-2xs);
1747
+ --ds-tag-size-md-padding-x: var(--ds-alias-space-padding-base);
1748
+ --ds-tag-size-md-padding-y: var(--ds-alias-space-padding-xs);
1749
+ --ds-tag-size-md-font-weight: var(--ds-alias-text-weight-bold);
1750
+ --ds-tag-size-md-font-size: var(--ds-alias-text-size-base);
1751
+ --ds-tag-size-lg-gap: var(--ds-alias-space-gap-2xs);
1752
+ --ds-tag-size-lg-padding-x: var(--ds-alias-space-padding-md);
1753
+ --ds-tag-size-lg-padding-y: var(--ds-alias-space-padding-sm);
1754
+ --ds-tag-size-lg-font-weight: var(--ds-alias-text-weight-bold);
1755
+ --ds-tag-size-lg-font-size: var(--ds-alias-text-size-base);
1756
+ --ds-tag-primary-color-text: var(--ds-alias-text-color-white);
1757
+ --ds-tag-primary-color-background: var(--ds-alias-surface-primary);
1758
+ --ds-tag-purple-color-text: var(--ds-alias-text-color-primary);
1759
+ --ds-tag-purple-color-background: var(--ds-alias-surface-purple);
1760
+ --ds-tag-purple-light-color-text: var(--ds-alias-text-color-primary);
1761
+ --ds-tag-purple-light-color-background: var(--ds-alias-surface-purple-light);
1762
+ --ds-tag-red-color-text: var(--ds-alias-text-color-primary);
1763
+ --ds-tag-red-color-background: var(--ds-alias-surface-red);
1764
+ --ds-tag-red-light-color-text: var(--ds-alias-text-color-primary);
1765
+ --ds-tag-red-light-color-background: var(--ds-alias-surface-red-light);
1766
+ --ds-tag-green-color-text: var(--ds-alias-text-color-primary);
1767
+ --ds-tag-green-color-background: var(--ds-alias-surface-green);
1768
+ --ds-tag-green-light-color-text: var(--ds-alias-text-color-primary);
1769
+ --ds-tag-green-light-color-background: var(--ds-alias-surface-green-light);
1770
+ --ds-tag-yellow-color-text: var(--ds-alias-text-color-primary);
1771
+ --ds-tag-yellow-color-background: var(--ds-alias-surface-yellow);
1772
+ --ds-tag-yellow-light-color-text: var(--ds-alias-text-color-primary);
1773
+ --ds-tag-yellow-light-color-background: var(--ds-alias-surface-yellow-light);
1774
+ --ds-tag-default-color-text: var(--ds-alias-text-color-primary);
1775
+ --ds-tag-default-color-background: var(--ds-alias-surface-grey);
1776
+ --ds-tag-radius: var(--ds-alias-radius-rounded);
1777
+ --ds-tag-line-height: var(--ds-alias-text-line-height-text);
1778
+ --ds-tag-font-family: var(--ds-alias-text-family-text);
1779
+ --ds-tag-purple-dark-color-background: var(--ds-alias-surface-purple-dark);
1780
+ --ds-tag-red-dark-color-background: var(--ds-alias-surface-red-dark);
1781
+ --ds-tag-green-dark-color-background: var(--ds-alias-surface-green-dark);
1782
+ --ds-tag-yellow-dark-color-background: var(--ds-alias-surface-yellow-dark);
1783
+ --ds-tag-danger-color-background: var(--ds-alias-surface-danger-lighter);
1784
+ --ds-tag-danger-color-text: var(--ds-alias-text-color-danger);
1785
+ --ds-tag-warning-color-background: var(--ds-alias-surface-warning-lighter);
1786
+ --ds-tag-warning-color-text: var(--ds-alias-text-color-warning);
1787
+ --ds-tag-info-color-text: var(--ds-alias-text-color-info);
1788
+ --ds-tag-info-color-background: var(--ds-alias-surface-info-lighter);
1789
+ --ds-tag-success-color-text: var(--ds-alias-text-color-success);
1790
+ --ds-tag-success-color-background: var(--ds-alias-surface-success-lighter);
1791
+ --ds-tag-disabled-color-text: var(--ds-alias-text-color-white);
1792
+ --ds-tag-disabled-color-background: var(--ds-alias-text-color-grey);
1793
+ --ds-segment-radius: var(--ds-alias-radius-base);
1794
+ --ds-segment-focus-color: var(--ds-alias-interaction-focus-color-base);
1795
+ --ds-segment-description-font-weight: var(--ds-alias-text-weight-regular);
1796
+ --ds-segment-description-font-size: var(--ds-alias-text-size-sm);
1797
+ --ds-segment-item-font-weight: var(--ds-alias-text-weight-bold);
1798
+ --ds-segment-item-unselected-color-hover: var(--ds-alias-action-primary-text-hover);
1799
+ --ds-segment-item-unselected-color-active: var(--ds-alias-action-primary-text-active);
1800
+ --ds-segment-item-unselected-color-base: var(--ds-alias-action-primary-text-base);
1801
+ --ds-segment-item-selected-color-hover: var(--ds-alias-action-primary-text-hover);
1802
+ --ds-segment-item-selected-color-active: var(--ds-alias-action-primary-text-active);
1803
+ --ds-segment-item-selected-color-base: var(--ds-alias-action-primary-text-base);
1804
+ --ds-segment-item-selected-background: var(--ds-alias-surface-selected);
1805
+ --ds-segment-item-icon-size: var(--ds-alias-space-padding-base);
1806
+ --ds-segment-item-padding-inline: var(--ds-alias-space-padding-base);
1807
+ --ds-segment-item-padding-block: var(--ds-alias-space-padding-2xs);
1808
+ --ds-segment-gap: var(--ds-alias-space-gap-2xs);
1809
+ --ds-segment-padding: var(--ds-alias-space-padding-2xs);
1810
+ --ds-segment-background: var(--ds-alias-surface-grey-light);
1811
+ --ds-checkbox-radius: var(--ds-alias-radius-base);
1812
+ --ds-checkbox-label-color-hover: var(--ds-alias-action-primary-text-hover);
1813
+ --ds-checkbox-label-color-active: var(--ds-alias-action-primary-text-active);
1814
+ --ds-checkbox-label-color-disabled: var(--ds-alias-text-color-grey);
1815
+ --ds-checkbox-border-width: var(--ds-alias-border-width-base);
1816
+ --ds-checkbox-focus-color: var(--ds-alias-interaction-focus-color-base);
1817
+ --ds-checkbox-tile-radius: var(--ds-alias-radius-base);
1818
+ --ds-checkbox-tile-border-width: var(--ds-alias-border-width-base);
1819
+ --ds-checkbox-tile-color-base-border: var(--ds-alias-border-color-grey);
1820
+ --ds-checkbox-tile-color-hover-border: var(--ds-alias-border-color-primary-hover);
1821
+ --ds-checkbox-tile-color-hover-background: var(--ds-alias-surface-hover);
1822
+ --ds-checkbox-tile-color-active-border: var(--ds-alias-border-color-primary-active);
1823
+ --ds-checkbox-tile-color-active-background: var(--ds-alias-surface-hover);
1824
+ --ds-checkbox-unchecked-color-base-border: var(--ds-alias-border-color-primary);
1825
+ --ds-checkbox-unchecked-color-hover-border: var(--ds-alias-border-color-primary-hover);
1826
+ --ds-checkbox-unchecked-color-hover-background: var(--ds-alias-surface-hover);
1827
+ --ds-checkbox-unchecked-color-active-border: var(--ds-alias-border-color-primary-active);
1828
+ --ds-checkbox-unchecked-color-active-background: var(--ds-alias-surface-hover);
1829
+ --ds-checkbox-unchecked-color-disabled-background: var(--ds-alias-surface-grey);
1830
+ --ds-checkbox-checked-color-base-border: var(--ds-alias-border-color-primary);
1831
+ --ds-checkbox-checked-color-base-icon: var(--ds-alias-text-color-white);
1832
+ --ds-checkbox-checked-color-base-background: var(--ds-alias-surface-primary);
1833
+ --ds-checkbox-checked-color-hover-border: var(--ds-alias-border-color-primary-hover);
1834
+ --ds-checkbox-checked-color-hover-background: var(--ds-alias-surface-primary-hover);
1835
+ --ds-checkbox-checked-color-active-border: var(--ds-alias-border-color-primary-active);
1836
+ --ds-checkbox-checked-color-active-background: var(--ds-alias-surface-primary-active);
1837
+ --ds-checkbox-font-family: var(--ds-alias-text-family-text);
1838
+ --ds-checkbox-line-height: var(--ds-alias-text-line-height-text);
1839
+ --ds-radio-radius: var(--ds-alias-radius-rounded);
1840
+ --ds-radio-label-color-hover: var(--ds-alias-action-primary-text-hover);
1841
+ --ds-radio-label-color-active: var(--ds-alias-action-primary-text-active);
1842
+ --ds-radio-label-color-disabled: var(--ds-alias-text-color-grey);
1843
+ --ds-radio-border-width: var(--ds-alias-border-width-base);
1844
+ --ds-radio-focus-color: var(--ds-alias-interaction-focus-color-base);
1845
+ --ds-radio-tile-radius: var(--ds-alias-radius-base);
1846
+ --ds-radio-tile-border-width: var(--ds-alias-border-width-base);
1847
+ --ds-radio-tile-color-base-border: var(--ds-alias-border-color-grey);
1848
+ --ds-radio-tile-color-hover-border: var(--ds-alias-border-color-primary-hover);
1849
+ --ds-radio-tile-color-hover-background: var(--ds-alias-surface-hover);
1850
+ --ds-radio-tile-color-active-border: var(--ds-alias-border-color-primary-active);
1851
+ --ds-radio-tile-color-active-background: var(--ds-alias-surface-hover);
1852
+ --ds-radio-unchecked-color-base-border: var(--ds-alias-border-color-primary);
1853
+ --ds-radio-unchecked-color-hover-border: var(--ds-alias-border-color-primary-hover);
1854
+ --ds-radio-unchecked-color-hover-background: var(--ds-alias-surface-hover);
1855
+ --ds-radio-unchecked-color-active-border: var(--ds-alias-border-color-primary-active);
1856
+ --ds-radio-unchecked-color-active-background: var(--ds-alias-surface-hover);
1857
+ --ds-radio-unchecked-color-disabled-background: var(--ds-alias-surface-grey);
1858
+ --ds-radio-checked-color-base-border: var(--ds-alias-border-color-primary);
1859
+ --ds-radio-checked-color-base-icon: var(--ds-alias-text-color-white);
1860
+ --ds-radio-checked-color-base-background: var(--ds-alias-surface-primary);
1861
+ --ds-radio-checked-color-hover-border: var(--ds-alias-border-color-primary-hover);
1862
+ --ds-radio-checked-color-hover-background: var(--ds-alias-surface-primary-hover);
1863
+ --ds-radio-checked-color-active-border: var(--ds-alias-border-color-primary-active);
1864
+ --ds-radio-checked-color-active-background: var(--ds-alias-surface-primary-active);
1865
+ --ds-radio-font-family: var(--ds-alias-text-family-text);
1866
+ --ds-radio-line-height: var(--ds-alias-text-line-height-text);
1867
+ --ds-toggle-radius: var(--ds-alias-radius-rounded);
1868
+ --ds-toggle-label-color-hover: var(--ds-alias-action-primary-text-hover);
1869
+ --ds-toggle-label-color-active: var(--ds-alias-action-primary-text-active);
1870
+ --ds-toggle-label-color-disabled: var(--ds-alias-text-color-grey);
1871
+ --ds-toggle-border-width: var(--ds-alias-border-width-base);
1872
+ --ds-toggle-focus-color: var(--ds-alias-interaction-focus-color-base);
1873
+ --ds-toggle-tile-radius: var(--ds-alias-radius-base);
1874
+ --ds-toggle-tile-border-width: var(--ds-alias-border-width-base);
1875
+ --ds-toggle-tile-color-base-border: var(--ds-alias-border-color-grey);
1876
+ --ds-toggle-tile-color-hover-border: var(--ds-alias-border-color-primary-hover);
1877
+ --ds-toggle-tile-color-hover-background: var(--ds-alias-surface-grey);
1878
+ --ds-toggle-tile-color-active-border: var(--ds-alias-border-color-primary-active);
1879
+ --ds-toggle-tile-color-active-background: var(--ds-alias-surface-grey);
1880
+ --ds-toggle-unchecked-color-base-tick: var(--ds-alias-action-primary-text-base);
1881
+ --ds-toggle-unchecked-color-base-background: var(--ds-alias-surface-grey);
1882
+ --ds-toggle-unchecked-color-hover-tick: var(--ds-alias-action-primary-text-hover);
1883
+ --ds-toggle-unchecked-color-hover-background: var(--ds-alias-surface-grey);
1884
+ --ds-toggle-unchecked-color-active-tick: var(--ds-alias-action-primary-text-active);
1885
+ --ds-toggle-unchecked-color-active-background: var(--ds-alias-surface-grey);
1886
+ --ds-toggle-checked-color-base-background: var(--ds-alias-surface-success-dark);
1887
+ --ds-toggle-checked-color-base-tick: var(--ds-alias-text-color-white);
1888
+ --ds-toggle-checked-color-base-icon: var(--ds-alias-text-color-white);
1889
+ --ds-toggle-checked-color-hover-background: var(--ds-alias-surface-success-darker);
1890
+ --ds-toggle-checked-color-hover-tick: var(--ds-alias-text-color-white);
1891
+ --ds-toggle-checked-color-active-background: var(--ds-alias-surface-success-darkest);
1892
+ --ds-toggle-checked-color-active-tick: var(--ds-alias-text-color-white);
1893
+ --ds-toggle-font-family: var(--ds-alias-text-family-text);
1894
+ --ds-toggle-line-height: var(--ds-alias-text-line-height-text);
1895
+ --ds-pagination-dots-radius: var(--ds-alias-radius-base);
1896
+ --ds-pagination-dots-color-active: var(--ds-alias-surface-primary);
1897
+ --ds-pagination-dots-color-background: var(--ds-alias-surface-grey);
1898
+ --ds-pagination-dots-color-inactive: var(--ds-alias-surface-white);
1899
+ --ds-pagination-dots-gap: var(--ds-alias-space-gap-3xs);
1900
+ --ds-pagination-elevation-sticky: var(--ds-alias-z-index-sticky);
1901
+ --ds-pagination-size-sm-gap: var(--ds-alias-space-gap-2xs);
1902
+ --ds-pagination-size-base-gap: var(--ds-alias-space-gap-xs);
1903
+ --ds-pagination-disabled-color: var(--ds-alias-text-color-disabled);
1904
+ --ds-progress-bar-primary-background-dark: var(--ds-alias-surface-grey-light);
1905
+ --ds-progress-bar-primary-background-light: var(--ds-alias-surface-white);
1906
+ --ds-progress-bar-primary-line: var(--ds-alias-surface-primary);
1907
+ --ds-progress-bar-yellow-background-light: var(--ds-alias-surface-white);
1908
+ --ds-progress-bar-yellow-background-dark: var(--ds-alias-surface-yellow-light);
1909
+ --ds-progress-bar-yellow-line: var(--ds-alias-surface-yellow-dark);
1910
+ --ds-progress-bar-purple-background-light: var(--ds-alias-surface-white);
1911
+ --ds-progress-bar-purple-background-dark: var(--ds-alias-surface-purple-light);
1912
+ --ds-progress-bar-purple-line: var(--ds-alias-surface-purple-dark);
1913
+ --ds-progress-bar-red-background-light: var(--ds-alias-surface-white);
1914
+ --ds-progress-bar-red-background-dark: var(--ds-alias-surface-red-light);
1915
+ --ds-progress-bar-red-line: var(--ds-alias-surface-red-dark);
1916
+ --ds-progress-bar-green-background-light: var(--ds-alias-surface-white);
1917
+ --ds-progress-bar-green-background-dark: var(--ds-alias-surface-green-light);
1918
+ --ds-progress-bar-green-line: var(--ds-alias-surface-green-dark);
1919
+ --ds-progress-bar-radius: var(--ds-alias-radius-rounded);
1920
+ --ds-accordion-summary-color-base: var(--ds-alias-action-primary-text-base);
1921
+ --ds-accordion-summary-color-hover: var(--ds-alias-action-primary-text-hover);
1922
+ --ds-accordion-summary-color-active: var(--ds-alias-action-primary-text-active);
1923
+ --ds-accordion-radius: var(--ds-alias-radius-base);
1924
+ --ds-tabs-gap: var(--ds-alias-border-width-base);
1925
+ --ds-tabs-tab-padding-x: var(--ds-alias-space-padding-base);
1926
+ --ds-tabs-tab-padding-y: var(--ds-alias-space-padding-2xs);
1927
+ --ds-tabs-tab-selected-color-text-hover: var(--ds-alias-action-primary-text-hover);
1928
+ --ds-tabs-tab-selected-color-text-active: var(--ds-alias-action-primary-text-active);
1929
+ --ds-tabs-tab-selected-color-text-base: var(--ds-alias-action-primary-text-base);
1930
+ --ds-tabs-tab-unselected-color-text-hover: var(--ds-alias-action-primary-text-hover);
1931
+ --ds-tabs-tab-unselected-color-text-active: var(--ds-alias-action-primary-text-active);
1932
+ --ds-tabs-tab-unselected-color-text-base: var(--ds-alias-text-color-hint);
1933
+ --ds-tabs-scroll-fade-background: var(--ds-alias-surface-white);
1934
+ --ds-steps-connector-height: var(--ds-alias-border-width-base);
1935
+ --ds-tabs-border-green: var(--ds-alias-action-brand-green-border-base);
1936
+ --ds-tabs-border-red: var(--ds-alias-action-brand-red-border-base);
1937
+ --ds-tabs-border-yellow: var(--ds-alias-action-brand-yellow-border-base);
1938
+ --ds-tabs-border-purple: var(--ds-alias-action-brand-purple-border-base);
1939
+ --ds-tabs-indicator-purple-unselected-base: var(--ds-alias-action-brand-purple-border-base);
1940
+ --ds-tabs-indicator-purple-selected-base: var(--ds-alias-action-brand-purple-border-hover);
1941
+ --ds-tabs-indicator-purple-selected-hover: var(--ds-alias-action-brand-purple-border-hover);
1942
+ --ds-tabs-indicator-yellow-unselected-hover: var(--ds-alias-action-brand-yellow-border-base);
1943
+ --ds-tabs-indicator-yellow-selected-base: var(--ds-alias-action-brand-yellow-border-hover);
1944
+ --ds-tabs-indicator-yellow-selected-hover: var(--ds-alias-action-brand-yellow-border-hover);
1945
+ --ds-tabs-indicator-green-unselected-hover: var(--ds-alias-action-brand-green-border-base);
1946
+ --ds-tabs-indicator-green-selected-base: var(--ds-alias-action-brand-green-border-hover);
1947
+ --ds-tabs-indicator-green-selected-hover: var(--ds-alias-action-brand-green-border-hover);
1948
+ --ds-tabs-indicator-red-unselected-hover: var(--ds-alias-action-brand-red-border-base);
1949
+ --ds-tabs-indicator-red-selected-base: var(--ds-alias-action-brand-red-border-hover);
1950
+ --ds-tabs-indicator-red-selected-hover: var(--ds-alias-action-brand-red-border-hover);
1951
+ --ds-tabs-vertical-gap: var(--ds-alias-space-gap-lg);
1952
+ --ds-steps-connector-color-filled: var(--ds-alias-surface-primary);
1953
+ --ds-steps-connector-color-base: var(--ds-alias-border-color-grey-light);
1954
+ --ds-steps-step-color-selected: var(--ds-alias-text-color-primary);
1955
+ --ds-steps-step-color-focus: var(--ds-alias-interaction-focus-color-base);
1956
+ --ds-steps-step-color-base: var(--ds-alias-text-color-hint);
1957
+ --ds-steps-step-color-disabled: var(--ds-alias-text-color-disabled);
1958
+ --ds-steps-step-color-done: var(--ds-alias-text-color-primary);
1959
+ --ds-steps-color-purple: var(--ds-alias-surface-purple);
1960
+ --ds-steps-color-green: var(--ds-alias-surface-green);
1961
+ --ds-steps-color-red: var(--ds-alias-surface-red);
1962
+ --ds-steps-color-yellow: var(--ds-alias-surface-yellow);
1963
+ --ds-steps-circle-color-default-background: var(--ds-alias-surface-grey);
1964
+ --ds-steps-circle-color-selected-background: var(--ds-alias-surface-primary);
1965
+ --ds-steps-circle-color-done-background: var(--ds-alias-surface-primary);
1966
+ --ds-steps-circle-color-disabled-background: var(--ds-alias-surface-grey);
1967
+ --ds-steps-circle-color-disabled-text: var(--ds-alias-text-color-disabled);
1968
+ --ds-steps-circle-color-invalid-background: var(--ds-alias-surface-danger-darker);
1969
+ --ds-carousel-dot-color: var(--ds-alias-border-color-grey);
1970
+ --ds-carousel-dot-color-active: var(--ds-alias-border-color-primary);
1971
+ --ds-carousel-control-color: var(--ds-alias-text-color-primary);
1972
+ --ds-carousel-scroll-btn-color-active: var(--ds-alias-text-color-white);
1973
+ --ds-carousel-scroll-btn-background-active: var(--ds-alias-surface-primary);
1974
+ --ds-carousel-scroll-btn-background-active-hover: var(--ds-alias-surface-primary-hover);
1975
+ --ds-carousel-scroll-btn-background-active-pressed: var(--ds-alias-surface-primary-active);
1976
+ --ds-carousel-gap: var(--ds-alias-space-gap-base);
1977
+ --ds-carousel-scroll-fade-bg: var(--ds-alias-surface-white);
1978
+ --ds-tooltip-radius: var(--ds-alias-radius-base);
1979
+ --ds-tooltip-shadow: var(--ds-alias-shadow-box-base);
1980
+ --ds-tooltip-z-index: var(--ds-alias-z-index-tooltip);
1981
+ --ds-tooltip-color-text: var(--ds-alias-text-color-white);
1982
+ --ds-tooltip-color-background: var(--ds-alias-surface-primary-active);
1983
+ --ds-tooltip-padding-x: var(--ds-alias-space-padding-sm);
1984
+ --ds-tooltip-padding-y: var(--ds-alias-space-padding-xs);
1985
+ --ds-table-color: var(--ds-alias-text-color-primary);
1986
+ --ds-table-row-background-active: var(--ds-alias-surface-grey-light);
1987
+ --ds-table-row-background-hover: var(--ds-alias-surface-grey-light);
1988
+ --ds-table-row-background-striped: var(--ds-alias-surface-grey-lighter);
1989
+ --ds-popup-radius: var(--ds-alias-radius-base);
1990
+ --ds-popup-shadow: var(--ds-alias-shadow-box-base);
1991
+ --ds-popup-z-index: var(--ds-alias-z-index-popup);
1992
+ --ds-popup-color-background: var(--ds-alias-surface-white);
1993
+ --ds-drawer-radius: var(--ds-alias-radius-lg);
1994
+ --ds-drawer-backdrop-opacity: var(--ds-alias-opacity-backdrop);
1995
+ --ds-drawer-backdrop-background: var(--ds-alias-surface-primary-active);
1996
+ --ds-drawer-background: var(--ds-alias-surface-white);
1997
+ --ds-file-upload-label-font-weight: var(--ds-alias-text-weight-bold);
1998
+ --ds-file-upload-label-font-family: var(--ds-alias-text-family-text);
1999
+ --ds-file-upload-label-text-color: var(--ds-alias-text-color-primary);
2000
+ --ds-file-upload-label-text-line-height: var(--ds-alias-text-line-height-text);
2001
+ --ds-file-upload-label-text-size: var(--ds-alias-text-size-base);
2002
+ --ds-file-upload-drop-zone-border-color-base: var(--ds-alias-border-color-grey);
2003
+ --ds-file-upload-drop-zone-border-color-hover: var(--ds-alias-border-color-primary);
2004
+ --ds-file-upload-drop-zone-border-color-active: var(--ds-alias-border-color-primary);
2005
+ --ds-file-upload-drop-zone-border-color-focus: var(--ds-alias-border-color-primary);
2006
+ --ds-file-upload-drop-zone-border-color-danger: var(--ds-alias-text-color-danger);
2007
+ --ds-file-upload-drop-zone-border-color-success: var(--ds-alias-text-color-success);
2008
+ --ds-file-upload-drop-zone-border-color-warning: var(--ds-alias-text-color-warning);
2009
+ --ds-file-upload-drop-zone-text-color-hover: var(--ds-alias-action-primary-text-hover);
2010
+ --ds-file-upload-drop-zone-text-color-active: var(--ds-alias-action-primary-text-active);
2011
+ --ds-file-upload-drop-zone-background-color-base: var(--ds-alias-surface-transparent);
2012
+ --ds-file-upload-drop-zone-background-color-hover: var(--ds-alias-surface-hover);
2013
+ --ds-file-upload-drop-zone-background-color-active: var(--ds-alias-surface-hover);
2014
+ --ds-file-upload-drop-zone-background-color-disabled: var(--ds-alias-surface-disabled);
2015
+ --ds-file-upload-file-name-text-color: var(--ds-alias-text-color-primary);
2016
+ --ds-file-upload-control-font-family: var(--ds-alias-text-family-text);
2017
+ --ds-file-upload-control-font-weight: var(--ds-alias-text-weight-regular);
2018
+ --ds-file-upload-control-text-size: var(--ds-alias-text-size-base);
2019
+ --ds-file-upload-control-text-line-height: var(--ds-alias-text-line-height-text);
2020
+ --ds-file-upload-control-text-color: var(--ds-alias-text-color-primary);
2021
+ --ds-file-upload-control-placeholder-color: var(--ds-alias-text-color-placeholder);
2022
+ --ds-file-upload-description-font-family: var(--ds-alias-text-family-text);
2023
+ --ds-file-upload-description-font-weight: var(--ds-alias-text-weight-regular);
2024
+ --ds-file-upload-description-text-size: var(--ds-alias-text-size-xs);
2025
+ --ds-file-upload-description-text-line-height: var(--ds-alias-text-line-height-text);
2026
+ --ds-file-upload-description-text-color-base: var(--ds-alias-text-color-hint);
2027
+ --ds-file-upload-description-text-color-danger: var(--ds-alias-text-color-danger);
2028
+ --ds-file-upload-description-text-color-success: var(--ds-alias-text-color-success);
2029
+ --ds-file-upload-description-text-color-warning: var(--ds-alias-text-color-warning);
2030
+ --ds-file-upload-file-list-background-color: var(--ds-alias-surface-grey-light);
2031
+ --ds-file-upload-file-size-text-color: var(--ds-alias-text-color-hint);
2032
+ --ds-link-font-weight: var(--ds-alias-text-weight-bold);
2033
+ --ds-link-underline-width: var(--ds-alias-border-width-base);
2034
+ --ds-link-primary-hover: var(--ds-alias-action-primary-text-hover);
2035
+ --ds-link-primary-active: var(--ds-alias-action-primary-text-active);
2036
+ --ds-link-primary-base: var(--ds-alias-action-primary-text-base);
2037
+ --ds-link-inverted-hover: var(--ds-alias-action-inverted-primary-text-hover);
2038
+ --ds-link-inverted-active: var(--ds-alias-action-inverted-primary-text-active);
2039
+ --ds-link-inverted-base: var(--ds-alias-action-inverted-primary-text-base);
2040
+ --ds-text-shadow: var(--ds-alias-text-shadow-elevated);
2041
+ --ds-text-margin-bottom: var(--ds-alias-space-gap-base);
2042
+ --ds-text-color-primary: var(--ds-alias-text-color-primary);
2043
+ --ds-text-color-disabled: var(--ds-alias-text-color-disabled);
2044
+ --ds-text-color-grey: var(--ds-alias-text-color-grey);
2045
+ --ds-text-color-success: var(--ds-alias-text-color-success);
2046
+ --ds-text-color-warning: var(--ds-alias-text-color-warning);
2047
+ --ds-text-color-danger: var(--ds-alias-text-color-danger);
2048
+ --ds-text-color-inverted: var(--ds-alias-text-color-white);
2049
+ --ds-text-color-info: var(--ds-alias-text-color-hint);
2050
+ --ds-text-color-placeholder: var(--ds-alias-text-color-placeholder);
2051
+ --ds-logo-color-primary: var(--ds-alias-surface-primary);
2052
+ --ds-logo-color-inverted: var(--ds-alias-surface-white);
2053
+ --ds-input-phone-flag-radius-empty: var(--ds-alias-radius-base); /** Border radius of the country flag placeholder when no country is selected. */
2054
+ --ds-input-phone-flag-background-color-empty: var(--ds-alias-surface-grey-dark); /** Background color of the country flag placeholder when no country is selected. */
2055
+ --ds-input-phone-popup-color-background: var(--ds-alias-surface-white); /** Background color of the country picker popup. */
2056
+ --ds-input-phone-popup-padding: var(--ds-alias-space-padding-2xs); /** Padding of the country picker popup. */
2057
+ --ds-input-phone-popup-radius: var(--ds-alias-radius-md); /** Border radius of the country picker popup. */
2058
+ --ds-input-phone-filter-color-placeholder: var(--ds-alias-text-color-placeholder); /** Placeholder text color of the country filter input. */
2059
+ --ds-input-phone-scrollbar-color: var(--ds-alias-border-color-grey-light); /** Color of the country list scrollbar thumb. */
2060
+ --ds-input-phone-scrollbar-radius: var(--ds-alias-radius-rounded); /** Border radius of the country list scrollbar thumb. */
2061
+ --ds-input-phone-scrollbar-border-width: var(--ds-alias-border-width-base); /** Border width of the country list scrollbar thumb. */
2062
+ --ds-input-phone-option-radius: var(--ds-alias-radius-base); /** Border radius of a country option. */
2063
+ --ds-app-footer-color-text: var(--ds-alias-surface-on-primary);
2064
+ --ds-app-footer-link-color-text-base: var(--ds-link-inverted-base);
2065
+ --ds-app-footer-link-color-text-hover: var(--ds-link-inverted-hover);
2066
+ --ds-app-footer-link-color-text-active: var(--ds-link-inverted-active);
2067
+ --ds-badge-info-color-text: var(--ds-alias-surface-on-primary-lighter);
2068
+ --ds-button-color-tertiary-base-text: var(--ds-alias-action-tertiary-text-base);
2069
+ --ds-button-color-tertiary-hover-text: var(--ds-alias-action-tertiary-text-hover);
2070
+ --ds-button-color-tertiary-active-text: var(--ds-alias-action-tertiary-text-active);
2071
+ --ds-button-color-brand-purple-base-text: var(--ds-alias-action-brand-purple-text-base);
2072
+ --ds-button-color-brand-purple-hover-text: var(--ds-alias-action-brand-purple-text-hover);
2073
+ --ds-button-color-brand-purple-active-text: var(--ds-alias-action-brand-purple-text-active);
2074
+ --ds-button-color-brand-red-base-text: var(--ds-alias-action-brand-red-text-base);
2075
+ --ds-button-color-brand-red-hover-text: var(--ds-alias-action-brand-red-text-hover);
2076
+ --ds-button-color-brand-red-active-text: var(--ds-alias-action-brand-red-text-active);
2077
+ --ds-button-color-brand-yellow-base-text: var(--ds-alias-action-brand-yellow-text-base);
2078
+ --ds-button-color-brand-yellow-hover-text: var(--ds-alias-action-brand-yellow-text-hover);
2079
+ --ds-button-color-brand-yellow-active-text: var(--ds-alias-action-brand-yellow-text-active);
2080
+ --ds-button-color-brand-green-base-text: var(--ds-alias-action-brand-green-text-base);
2081
+ --ds-button-color-brand-green-hover-text: var(--ds-alias-action-brand-green-text-hover);
2082
+ --ds-button-color-brand-green-active-text: var(--ds-alias-action-brand-green-text-active);
2083
+ --ds-button-color-disabled-base-text: var(--ds-alias-action-disabled-on-surface-base);
2084
+ --ds-button-color-disabled-base-background: var(--ds-alias-action-disabled-surface-base);
2085
+ --ds-button-color-disabled-base-border: var(--ds-alias-action-disabled-border-base);
2086
+ --ds-button-color-disabled-hover-text: var(--ds-alias-action-disabled-on-surface-hover);
2087
+ --ds-button-color-disabled-hover-background: var(--ds-alias-action-disabled-surface-hover);
2088
+ --ds-button-color-disabled-hover-border: var(--ds-alias-action-disabled-border-hover);
2089
+ --ds-button-color-disabled-active-text: var(--ds-alias-action-disabled-on-surface-active);
2090
+ --ds-button-color-disabled-active-background: var(--ds-alias-action-disabled-surface-active);
2091
+ --ds-button-color-disabled-active-border: var(--ds-alias-action-disabled-border-active);
2092
+ --ds-button-color-link-hover-border: var(--ds-alias-border-composite-transparent);
2093
+ --ds-button-color-link-active-border: var(--ds-alias-border-composite-transparent);
2094
+ --ds-button-color-link-base-border: var(--ds-alias-border-composite-transparent);
2095
+ --ds-button-color-inverted-base-border: var(--ds-alias-border-composite-white);
2096
+ --ds-button-color-inverted-secondary-base-border: var(--ds-alias-border-composite-white);
2097
+ --ds-button-color-inverted-tertiary-hover-text: var(--ds-alias-action-inverted-tertiary-text-hover);
2098
+ --ds-button-color-inverted-tertiary-active-text: var(--ds-alias-action-inverted-tertiary-text-active);
2099
+ --ds-button-color-inverted-ghost-hover-text: var(--ds-alias-action-inverted-ghost-text-hover);
2100
+ --ds-button-color-inverted-ghost-active-text: var(--ds-alias-action-inverted-ghost-text-active);
2101
+ --ds-button-color-inverted-link-base-text: var(--ds-alias-text-color-inverted-primary);
2102
+ --ds-button-color-inverted-link-base-border: var(--ds-alias-border-composite-transparent);
2103
+ --ds-button-color-inverted-link-hover-border: var(--ds-alias-border-composite-transparent);
2104
+ --ds-button-color-inverted-link-active-border: var(--ds-alias-border-composite-transparent);
2105
+ --ds-card-color-primary-text: var(--ds-alias-surface-on-primary);
2106
+ --ds-card-color-grey-text: var(--ds-alias-surface-on-grey);
2107
+ --ds-card-color-green-dark-text: var(--ds-alias-surface-on-green);
2108
+ --ds-card-color-green-text: var(--ds-alias-surface-on-green-lighter);
2109
+ --ds-card-color-yellow-dark-text: var(--ds-alias-surface-on-yellow);
2110
+ --ds-card-color-yellow-text: var(--ds-alias-surface-on-yellow-lighter);
2111
+ --ds-card-color-red-dark-text: var(--ds-alias-surface-on-red);
2112
+ --ds-card-color-red-text: var(--ds-alias-surface-on-red-lighter);
2113
+ --ds-card-color-purple-dark-text: var(--ds-alias-surface-on-purple);
2114
+ --ds-card-color-purple-text: var(--ds-alias-surface-on-purple-lighter);
2115
+ --ds-card-color-dashed-text: var(--ds-alias-surface-on-white);
2116
+ --ds-card-color-dashed-border: var(--ds-alias-border-composite-grey-dashed);
2117
+ --ds-card-color-default-text: var(--ds-alias-surface-on-white);
2118
+ --ds-data-item-border-bottom: var(--ds-alias-border-composite-grey);
2119
+ --ds-icon-color-inverted-disabled: var(--ds-alias-text-color-inverted-disabled);
2120
+ --ds-form-default-container-border: var(--ds-alias-border-composite-grey);
2121
+ --ds-form-hover-container-border: var(--ds-alias-border-composite-grey);
2122
+ --ds-form-active-container-border: var(--ds-alias-border-composite-primary);
2123
+ --ds-form-focus-container-border: var(--ds-alias-border-composite-primary);
2124
+ --ds-form-disabled-container-border: var(--ds-alias-border-composite-disabled);
2125
+ --ds-select-content-border: var(--ds-alias-border-composite-grey);
2126
+ --ds-notification-default-color-text: var(--ds-alias-surface-on-grey-light);
2127
+ --ds-notification-default-color-heading: var(--ds-alias-surface-on-grey-light);
2128
+ --ds-notification-info-color-text: var(--ds-alias-surface-on-info-lighter);
2129
+ --ds-notification-success-color-text: var(--ds-alias-surface-on-success-lighter);
2130
+ --ds-notification-warning-color-text: var(--ds-alias-surface-on-warning-lighter);
2131
+ --ds-notification-danger-color-text: var(--ds-alias-surface-on-danger-lighter);
2132
+ --ds-notification-outline-default-color-text: var(--ds-alias-surface-on-white);
2133
+ --ds-notification-outline-default-color-heading: var(--ds-alias-surface-on-white);
2134
+ --ds-notification-outline-default-border: var(--ds-alias-border-composite-primary-light);
2135
+ --ds-notification-outline-purple-color-text: var(--ds-alias-surface-on-purple-lighter);
2136
+ --ds-notification-outline-purple-color-heading: var(--ds-alias-surface-on-purple-lighter);
2137
+ --ds-notification-outline-purple-border: var(--ds-alias-border-composite-purple);
2138
+ --ds-notification-outline-green-color-text: var(--ds-alias-surface-on-green-lighter);
2139
+ --ds-notification-outline-green-color-heading: var(--ds-alias-surface-on-green-lighter);
2140
+ --ds-notification-outline-green-border: var(--ds-alias-border-composite-green);
2141
+ --ds-notification-outline-yellow-color-text: var(--ds-alias-surface-on-yellow-lighter);
2142
+ --ds-notification-outline-yellow-color-heading: var(--ds-alias-surface-on-yellow-lighter);
2143
+ --ds-notification-outline-yellow-border: var(--ds-alias-border-composite-yellow);
2144
+ --ds-notification-outline-red-color-text: var(--ds-alias-surface-on-red-lighter);
2145
+ --ds-notification-outline-red-color-heading: var(--ds-alias-surface-on-red-lighter);
2146
+ --ds-notification-outline-red-border: var(--ds-alias-border-composite-red);
2147
+ --ds-list-marker-color-success: var(--ds-icon-color-success);
2148
+ --ds-list-marker-color-warning: var(--ds-icon-color-warning);
2149
+ --ds-list-marker-color-danger: var(--ds-icon-color-danger);
2150
+ --ds-list-marker-color-inverted: var(--ds-icon-color-inverted);
2151
+ --ds-list-marker-color-primary: var(--ds-icon-color-primary);
2152
+ --ds-list-item-color-border-hover: var(--ds-alias-border-composite-primary-hover);
2153
+ --ds-list-item-color-border-active: var(--ds-alias-border-composite-primary-active);
2154
+ --ds-list-item-color-border-base: var(--ds-alias-border-composite-grey);
2155
+ --ds-list-item-inverted-color-text-base: var(--ds-alias-surface-on-primary);
2156
+ --ds-list-item-inverted-color-text-disabled: var(--ds-alias-text-color-inverted-disabled);
2157
+ --ds-list-item-inverted-color-border-base: var(--ds-alias-border-composite-inverted-primary);
2158
+ --ds-list-item-inverted-color-border-hover: var(--ds-alias-border-composite-inverted-primary-hover);
2159
+ --ds-list-item-inverted-color-border-active: var(--ds-alias-border-composite-inverted-primary-active);
2160
+ --ds-modal-backdrop-opacity: var(--ds-backdrop-opacity);
2161
+ --ds-app-navbar-default-menu-item-color-selected: var(--ds-alias-text-color-inverted-primary);
2162
+ --ds-app-navbar-default-menu-gap: var(--ds-app-navbar-default-gap);
2163
+ --ds-app-navbar-default-button-color-border-base: var(--ds-button-color-inverted-tertiary-base-border);
2164
+ --ds-app-navbar-default-button-color-border-hover: var(--ds-button-color-inverted-tertiary-hover-border);
2165
+ --ds-app-navbar-default-button-color-border-active: var(--ds-button-color-inverted-tertiary-active-border);
2166
+ --ds-app-navbar-default-button-color-text-base: var(--ds-button-color-inverted-tertiary-base-text);
2167
+ --ds-app-navbar-default-button-color-background-base: var(--ds-button-color-inverted-tertiary-base-background);
2168
+ --ds-app-navbar-default-button-color-background-hover: var(--ds-button-color-inverted-tertiary-hover-background);
2169
+ --ds-app-navbar-default-button-color-background-active: var(--ds-button-color-inverted-tertiary-active-background);
2170
+ --ds-app-navbar-default-container-gap: var(--ds-app-navbar-default-gap);
2171
+ --ds-app-navbar-light-button-color-border-base: var(--ds-button-color-tertiary-base-border);
2172
+ --ds-app-navbar-light-button-color-border-hover: var(--ds-button-color-tertiary-hover-border);
2173
+ --ds-app-navbar-light-button-color-border-active: var(--ds-button-color-tertiary-active-border);
2174
+ --ds-app-navbar-light-button-color-background-base: var(--ds-button-color-tertiary-base-background);
2175
+ --ds-app-navbar-light-button-color-background-hover: var(--ds-button-color-tertiary-hover-background);
2176
+ --ds-app-navbar-light-button-color-background-active: var(--ds-button-color-tertiary-active-background);
2177
+ --ds-app-navbar-light-focus-color-start: var(--ds-alias-interaction-focus-color-start);
2178
+ --ds-app-navbar-light-focus-color-end: var(--ds-alias-interaction-focus-color-end);
2179
+ --ds-spinner-logo-inverted-color: var(--ds-alias-text-color-inverted-primary);
2180
+ --ds-toast-primary-color-body: var(--ds-alias-surface-on-grey-light);
2181
+ --ds-toast-success-color-body: var(--ds-alias-surface-on-success-lighter);
2182
+ --ds-toast-info-color-body: var(--ds-alias-surface-on-info-lighter);
2183
+ --ds-toast-warning-color-body: var(--ds-alias-surface-on-warning-lighter);
2184
+ --ds-toast-danger-color-body: var(--ds-alias-surface-on-danger-lighter);
2185
+ --ds-tag-purple-dark-color-text: var(--ds-alias-surface-on-purple-dark);
2186
+ --ds-tag-red-dark-color-text: var(--ds-alias-surface-on-red-dark);
2187
+ --ds-tag-green-dark-color-text: var(--ds-alias-surface-on-green-dark);
2188
+ --ds-tag-yellow-dark-color-text: var(--ds-alias-surface-on-yellow-dark);
2189
+ --ds-segment-divider-color: var(--ds-divider-color-default);
2190
+ --ds-toggle-unchecked-color-disabled-background: var(--ds-alias-action-disabled-surface-base);
2191
+ --ds-toggle-unchecked-color-disabled-tick: var(--ds-alias-action-disabled-text-base);
2192
+ --ds-toggle-checked-color-disabled-background: var(--ds-alias-action-disabled-text-base);
2193
+ --ds-toggle-checked-color-disabled-tick: var(--ds-alias-action-disabled-surface-base);
2194
+ --ds-tabs-border-default: var(--ds-alias-border-composite-grey);
2195
+ --ds-tabs-indicator-default-unselected-base: var(--ds-alias-border-composite-transparent);
2196
+ --ds-tabs-indicator-default-unselected-hover: var(--ds-alias-border-composite-grey);
2197
+ --ds-tabs-indicator-default-selected-base: var(--ds-alias-border-composite-primary);
2198
+ --ds-tabs-indicator-default-selected-hover: var(--ds-alias-border-composite-primary);
2199
+ --ds-tabs-indicator-purple-unselected-hover: var(--ds-alias-border-composite-grey);
2200
+ --ds-tabs-indicator-yellow-unselected-base: var(--ds-alias-border-composite-transparent);
2201
+ --ds-tabs-indicator-green-unselected-base: var(--ds-alias-border-composite-transparent);
2202
+ --ds-tabs-indicator-red-unselected-base: var(--ds-alias-border-composite-transparent);
2203
+ --ds-steps-circle-color-default-text: var(--ds-alias-surface-on-grey);
2204
+ --ds-steps-circle-color-selected-text: var(--ds-alias-surface-on-primary);
2205
+ --ds-steps-circle-color-done-text: var(--ds-alias-surface-on-primary);
2206
+ --ds-steps-circle-color-invalid-text: var(--ds-alias-surface-on-danger-darker);
2207
+ --ds-table-cell-border: var(--ds-alias-border-composite-grey);
2208
+ --ds-table-head-border: var(--ds-alias-border-composite-primary);
2209
+ --ds-popup-backdrop-background: var(--ds-backdrop-color);
2210
+ --ds-popup-backdrop-opacity: var(--ds-backdrop-opacity);
2211
+ --ds-text-color-inverted-disabled: var(--ds-alias-text-color-inverted-disabled);
2212
+ --ds-input-phone-popup-border: var(--ds-alias-border-composite-grey); /** Border of the country picker popup. */
2213
+ --ds-button-color-primary-base-border: var(--ds-alias-action-primary-border-base);
2214
+ --ds-button-color-primary-hover-border: var(--ds-alias-action-primary-border-hover);
2215
+ --ds-button-color-primary-active-border: var(--ds-alias-action-primary-border-active);
2216
+ --ds-button-color-secondary-base-border: var(--ds-alias-action-secondary-border-base);
2217
+ --ds-button-color-secondary-hover-border: var(--ds-alias-action-secondary-border-hover);
2218
+ --ds-button-color-secondary-active-border: var(--ds-alias-action-secondary-border-active);
2219
+ --ds-button-color-ghost-base-border: var(--ds-alias-action-ghost-border-base);
2220
+ --ds-button-color-ghost-hover-border: var(--ds-alias-action-ghost-border-hover);
2221
+ --ds-button-color-ghost-active-border: var(--ds-alias-action-ghost-border-active);
2222
+ --ds-app-navbar-default-button-color-text-hover: var(--ds-button-color-inverted-tertiary-hover-text);
2223
+ --ds-app-navbar-default-button-color-text-active: var(--ds-button-color-inverted-tertiary-active-text);
2224
+ --ds-app-navbar-light-button-color-text-base: var(--ds-button-color-tertiary-base-text);
2225
+ --ds-app-navbar-light-button-color-text-hover: var(--ds-button-color-tertiary-hover-text);
2226
+ --ds-app-navbar-light-button-color-text-active: var(--ds-button-color-tertiary-active-text);
2227
+ --ds-file-upload-drop-zone-text-color-disabled: var(--ds-button-color-disabled-base-text);
2228
+ --ds-file-upload-icon-color-disabled: var(--ds-button-color-disabled-base-text);
2229
+
2230
+ /* Device tokens */
2231
+ /* Device tokens */
2232
+ --ds-device-space-none: var(--ds-global-dimension-space-0);
2233
+ --ds-device-space-2xs: var(--ds-global-dimension-space-4);
2234
+ --ds-device-space-xs: var(--ds-global-dimension-space-8);
2235
+ --ds-device-space-sm: var(--ds-global-dimension-space-12);
2236
+ --ds-device-space-base: var(--ds-global-dimension-space-16);
2237
+ --ds-device-space-md: var(--ds-global-dimension-space-20);
2238
+ --ds-device-space-lg: var(--ds-global-dimension-space-24);
2239
+ --ds-device-space-xl: var(--ds-global-dimension-space-32);
2240
+ --ds-device-space-2xl: var(--ds-global-dimension-space-48);
2241
+ --ds-device-space-3xl: var(--ds-global-dimension-space-56);
2242
+ --ds-device-space-4xl: var(--ds-global-dimension-space-64);
2243
+ --ds-device-space-3xs: var(--ds-global-dimension-space-2);
2244
+ --ds-device-text-size-base: var(--ds-global-font-size-16);
2245
+ --ds-device-text-size-none: 0rem;
2246
+ --ds-device-text-size-xs: var(--ds-global-font-size-12);
2247
+ --ds-device-text-size-md: var(--ds-global-font-size-16);
2248
+ --ds-device-text-size-sm: var(--ds-global-font-size-14);
2249
+ --ds-device-text-size-2xl: var(--ds-global-font-size-24);
2250
+ --ds-device-text-size-3xl: var(--ds-global-font-size-28);
2251
+ --ds-device-text-size-4xl: var(--ds-global-font-size-32);
2252
+ --ds-device-text-size-5xl: var(--ds-global-font-size-48);
2253
+ --ds-device-text-size-xl: var(--ds-global-font-size-20);
2254
+ --ds-device-text-size-lg: var(--ds-global-font-size-18);
2255
+ --ds-device-container-space: var(--ds-global-dimension-space-16);
2256
+
2257
+ /* Component tokens */
2258
+ --ds-logo-size-base: var(--ds-global-dimension-size-24);
2259
+ --ds-logo-size-sm: var(--ds-global-dimension-size-24);
2260
+ --ds-logo-size-lg: var(--ds-global-dimension-size-32);
2261
+ --ds-brand-icon-tile-size-base: var(--ds-global-dimension-size-56);
2262
+ --ds-brand-icon-tile-size-lg: var(--ds-global-dimension-size-64);
2263
+ --ds-brand-icon-tile-size-sm: var(--ds-global-dimension-size-48);
2264
+ }
2265
+
2266
+ /* Device tokens: Tablet */
2267
+
2268
+ @media (min-width: 769px) {
2269
+ [data-theme="base"], :host([data-theme="base"]) {
2270
+ /* Alias tokens */
2271
+ --ds-alias-breakpoint: var(--ds-global-dimension-breakpoint-1);
2272
+
2273
+ /* Device tokens */
2274
+ --ds-device-space-none: var(--ds-global-dimension-space-0);
2275
+ --ds-device-space-2xs: var(--ds-global-dimension-space-4);
2276
+ --ds-device-space-xs: var(--ds-global-dimension-space-8);
2277
+ --ds-device-space-sm: var(--ds-global-dimension-space-12);
2278
+ --ds-device-space-base: var(--ds-global-dimension-space-16);
2279
+ --ds-device-space-md: var(--ds-global-dimension-space-20);
2280
+ --ds-device-space-lg: var(--ds-global-dimension-space-24);
2281
+ --ds-device-space-xl: var(--ds-global-dimension-space-40);
2282
+ --ds-device-space-2xl: var(--ds-global-dimension-space-56);
2283
+ --ds-device-space-3xl: var(--ds-global-dimension-space-72);
2284
+ --ds-device-space-4xl: var(--ds-global-dimension-space-96);
2285
+ --ds-device-space-3xs: var(--ds-global-dimension-space-2);
2286
+ --ds-device-text-size-base: var(--ds-global-font-size-16);
2287
+ --ds-device-text-size-none: 0rem;
2288
+ --ds-device-text-size-xs: var(--ds-global-font-size-12);
2289
+ --ds-device-text-size-md: var(--ds-global-font-size-18);
2290
+ --ds-device-text-size-sm: var(--ds-global-font-size-14);
2291
+ --ds-device-text-size-2xl: var(--ds-global-font-size-32);
2292
+ --ds-device-text-size-3xl: var(--ds-global-font-size-40);
2293
+ --ds-device-text-size-4xl: var(--ds-global-font-size-48);
2294
+ --ds-device-text-size-5xl: var(--ds-global-font-size-80);
2295
+ --ds-device-text-size-xl: var(--ds-global-font-size-24);
2296
+ --ds-device-text-size-lg: var(--ds-global-font-size-18);
2297
+ --ds-device-container-space: var(--ds-global-dimension-space-40);
2298
+
2299
+ /* Component tokens */
2300
+ --ds-logo-size-base: var(--ds-global-dimension-size-24);
2301
+ --ds-logo-size-sm: var(--ds-global-dimension-size-24);
2302
+ --ds-logo-size-lg: var(--ds-global-dimension-size-32);
2303
+ --ds-brand-icon-tile-size-base: var(--ds-global-dimension-size-64);
2304
+ --ds-brand-icon-tile-size-lg: var(--ds-global-dimension-size-96);
2305
+ --ds-brand-icon-tile-size-sm: var(--ds-global-dimension-size-56);
2306
+ }
2307
+ }
2308
+
2309
+ /* Device tokens: Desktop */
2310
+
2311
+ @media (min-width: 1024px) {
2312
+ [data-theme="base"], :host([data-theme="base"]) {
2313
+ /* Alias tokens */
2314
+ --ds-alias-breakpoint: var(--ds-global-dimension-breakpoint-2);
2315
+
2316
+ /* Device tokens */
2317
+ --ds-device-space-none: var(--ds-global-dimension-space-0);
2318
+ --ds-device-space-2xs: var(--ds-global-dimension-space-4);
2319
+ --ds-device-space-xs: var(--ds-global-dimension-space-8);
2320
+ --ds-device-space-sm: var(--ds-global-dimension-space-12);
2321
+ --ds-device-space-base: var(--ds-global-dimension-space-16);
2322
+ --ds-device-space-md: var(--ds-global-dimension-space-24);
2323
+ --ds-device-space-lg: var(--ds-global-dimension-space-32);
2324
+ --ds-device-space-xl: var(--ds-global-dimension-space-48);
2325
+ --ds-device-space-2xl: var(--ds-global-dimension-space-64);
2326
+ --ds-device-space-3xl: var(--ds-global-dimension-space-96);
2327
+ --ds-device-space-4xl: var(--ds-global-dimension-space-128);
2328
+ --ds-device-space-3xs: var(--ds-global-dimension-space-2);
2329
+ --ds-device-text-size-base: var(--ds-global-font-size-16);
2330
+ --ds-device-text-size-none: 0rem;
2331
+ --ds-device-text-size-xs: var(--ds-global-font-size-12);
2332
+ --ds-device-text-size-md: var(--ds-global-font-size-18);
2333
+ --ds-device-text-size-sm: var(--ds-global-font-size-14);
2334
+ --ds-device-text-size-2xl: var(--ds-global-font-size-32);
2335
+ --ds-device-text-size-3xl: var(--ds-global-font-size-40);
2336
+ --ds-device-text-size-4xl: var(--ds-global-font-size-48);
2337
+ --ds-device-text-size-5xl: var(--ds-global-font-size-80);
2338
+ --ds-device-text-size-xl: var(--ds-global-font-size-24);
2339
+ --ds-device-text-size-lg: var(--ds-global-font-size-18);
2340
+ --ds-device-container-space: var(--ds-global-dimension-space-48);
2341
+
2342
+ /* Component tokens */
2343
+ --ds-logo-size-base: var(--ds-global-dimension-size-32);
2344
+ --ds-logo-size-sm: var(--ds-global-dimension-size-24);
2345
+ --ds-logo-size-lg: var(--ds-global-dimension-size-48);
2346
+ --ds-brand-icon-tile-size-base: var(--ds-global-dimension-size-64);
2347
+ --ds-brand-icon-tile-size-lg: var(--ds-global-dimension-size-96);
2348
+ --ds-brand-icon-tile-size-sm: var(--ds-global-dimension-size-56);
2349
+ }
2350
+ }
2351
+