@mittwald/flow-design-tokens 0.1.0-alpha.357 → 0.1.0-alpha.359

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.
@@ -3,1237 +3,1244 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --transition--duration--slow: 300ms;
7
- --transition--duration--default: 200ms;
8
- --progress-bar--height-s: 0.375rem;
9
- --notification--width: 355px;
10
- --loading-spinner--transition-duration: 2000ms;
11
- --counter-badge--height-empty: 0.75rem;
12
- --counter-badge--height: 1.25rem;
13
- --counter-badge--font-size: 0.625rem;
14
- --size-px--xxl: 64px;
15
- --size-px--xl: 32px;
16
- --size-px--l: 24px;
17
- --size-px--m: 16px;
18
- --size-px--s: 8px;
19
- --size-px--xs: 4px;
20
- --size-px--xxs: 2px;
21
- --size-px--xxxs: 1px;
22
- --size-rem--xxl: 4rem;
23
- --size-rem--xl: 2rem;
24
- --size-rem--l: 1.5rem;
25
- --size-rem--m: 1rem;
26
- --size-rem--s: 0.5rem;
27
- --size-rem--xs: 0.25rem;
28
- --size-rem--xxs: 0.125rem;
29
- --size-rem--xxxs: 0.0625rem;
30
- --tooltip--max-width: 300px;
31
- --popover--min-width: 200px;
32
- --modal--size--m: 900px;
33
- --modal--size--s: 660px;
34
- --contextual-help--max-width: 500px;
35
- --switch--handle-size: 1.25rem;
36
- --switch--track-corner-radius: 0.75rem;
37
- --switch--track-width: 2.75rem;
38
- --switch--track-height: 1.5rem;
39
- --calendar--cell-size: 2.25rem;
40
- --font-size-heading--xxl: 2.625rem;
41
- --font-size-heading--xl: 2rem;
42
- --font-size-heading--l: 1.5rem;
43
- --font-size-heading--m: 1.25rem;
44
- --font-size-heading--s: 1.125rem;
45
- --font-size-heading--xs: 1rem;
46
- --font-size-text--m: 1rem;
47
- --font-size-text--s: 0.875rem;
48
- --line-height--default: 1.5;
49
- --font-weight--bold: bold;
50
- --font-weight--normal: normal;
51
- --text--max-width: 780px;
52
- --icon--size--l: 4rem;
53
- --icon--size--m: 1.5rem;
54
- --icon--size--s: 1rem;
55
- --code--dark-syntax-color-variable: #8c3b3b;
56
- --code--dark-syntax-color-type: #880000;
57
- --code--dark-syntax-color-title: #880000;
58
- --code--dark-syntax-color-template-variable: #8c3b3b;
59
- --code--dark-syntax-color-template-tag: #880000;
60
- --code--dark-syntax-color-symbol: #8c3b3b;
61
- --code--dark-syntax-color-string: #880000;
62
- --code--dark-syntax-color-selector-id: #880000;
63
- --code--dark-syntax-color-selector-class: #880000;
64
- --code--dark-syntax-color-selector-attr: #8c3b3b;
65
- --code--dark-syntax-color-section: #880000;
66
- --code--dark-syntax-color-regexp: #8c3b3b;
67
- --code--dark-syntax-color-quote: #880000;
68
- --code--dark-syntax-color-pseudo: #8c3b3b;
69
- --code--dark-syntax-color-number: #880000;
70
- --code--dark-syntax-color-meta-string: #2a5b74;
71
- --code--dark-syntax-color-meta: #195b7b;
72
- --code--dark-syntax-color-literal: #405d32;
73
- --code--dark-syntax-color-link: #8c3b3b;
74
- --code--dark-syntax-color-deletion: #880000;
75
- --code--dark-syntax-color-comment: #575757;
76
- --code--dark-syntax-color-code: #306100;
77
- --code--dark-syntax-color-bullet: #306100;
78
- --code--dark-syntax-color-built-in: #306100;
79
- --code--dark-syntax-color-addition: #306100;
80
- --code--light-syntax-color-variable: #dcacac;
81
- --code--light-syntax-color-type: #ff9e9e;
82
- --code--light-syntax-color-title: #ff9e9e;
83
- --code--light-syntax-color-template-variable: #dcacac;
84
- --code--light-syntax-color-template-tag: #ff9e9e;
85
- --code--light-syntax-color-symbol: #dcacac;
86
- --code--light-syntax-color-string: #ff9e9e;
87
- --code--light-syntax-color-selector-id: #ff9e9e;
88
- --code--light-syntax-color-selector-class: #ff9e9e;
89
- --code--light-syntax-color-selector-attr: #dcacac;
90
- --code--light-syntax-color-section: #ff9e9e;
91
- --code--light-syntax-color-regexp: #dcacac;
92
- --code--light-syntax-color-quote: #ff9e9e;
93
- --code--light-syntax-color-pseudo: #dcacac;
94
- --code--light-syntax-color-number: #ff9e9e;
95
- --code--light-syntax-color-meta-string: #8ebfd7;
96
- --code--light-syntax-color-meta: #77c0e4;
97
- --code--light-syntax-color-literal: #9fc28e;
98
- --code--light-syntax-color-link: #dcacac;
99
- --code--light-syntax-color-deletion: #ff9e9e;
100
- --code--light-syntax-color-comment: #b8b8b8;
101
- --code--light-syntax-color-code: #68d100;
102
- --code--light-syntax-color-bullet: #68d100;
103
- --code--light-syntax-color-built-in: #68d100;
104
- --code--light-syntax-color-addition: #68d100;
105
- --code--default-syntax-color-variable: #a94747;
106
- --code--default-syntax-color-type: #880000;
107
- --code--default-syntax-color-title: #880000;
108
- --code--default-syntax-color-template-variable: #a94747;
109
- --code--default-syntax-color-template-tag: #880000;
110
- --code--default-syntax-color-symbol: #a94747;
111
- --code--default-syntax-color-string: #880000;
112
- --code--default-syntax-color-selector-pseudo: #a94747;
113
- --code--default-syntax-color-selector-id: #880000;
114
- --code--default-syntax-color-selector-class: #880000;
115
- --code--default-syntax-color-selector-attr: #a94747;
116
- --code--default-syntax-color-section: #880000;
117
- --code--default-syntax-color-regexp: #a94747;
118
- --code--default-syntax-color-quote: #880000;
119
- --code--default-syntax-color-number: #880000;
120
- --code--default-syntax-color-meta-string: #326d8b;
121
- --code--default-syntax-color-meta: #1e6e94;
122
- --code--default-syntax-color-literal: #4c6d3b;
123
- --code--default-syntax-color-link: #a94747;
124
- --code--default-syntax-color-deletion: #880000;
125
- --code--default-syntax-color-comment: #666666;
126
- --code--default-syntax-color-code: #397300;
127
- --code--default-syntax-color-bullet: #397300;
128
- --code--default-syntax-color-built-in: #397300;
129
- --code--default-syntax-color-addition: #397300;
130
- --avatar--size--m: 2.5rem;
131
- --color--transparent: transparent;
132
- --color--super-teal--1100: #00424a;
133
- --color--super-teal--1000: #004f59;
134
- --color--super-teal--900: #006b78;
135
- --color--super-teal--800: #008696;
136
- --color--super-teal--700: #00a1b5;
137
- --color--super-teal--600: #00d3ed;
138
- --color--super-teal--500: #26e7ff;
139
- --color--super-teal--400: #5eedff;
140
- --color--super-teal--300: #96f3ff;
141
- --color--super-teal--200: #cffaff;
142
- --color--super-teal--100: #ebfdff;
143
- --color--bright-lilac--1100: #470062;
144
- --color--bright-lilac--1000: #5f0083;
145
- --color--bright-lilac--900: #9000c5;
146
- --color--bright-lilac--800: #bc08ff;
147
- --color--bright-lilac--700: #ce4bff;
148
- --color--bright-lilac--600: #e08dff;
149
- --color--bright-lilac--500: #e6a1ff;
150
- --color--bright-lilac--400: #ebb6ff;
151
- --color--bright-lilac--300: #f1caff;
152
- --color--bright-lilac--200: #f6dfff;
153
- --color--bright-lilac--100: #f9e9ff;
154
- --color--mittwald-navy--1100: #0E142E;
155
- --color--mittwald-navy--1000: #131B3D;
156
- --color--mittwald-navy--900: #1D285C;
157
- --color--mittwald-navy--800: #27367B;
158
- --color--mittwald-navy--700: #32459E;
159
- --color--mittwald-navy--600: #3D55C1;
160
- --color--mittwald-navy--500: #5F73CC;
161
- --color--mittwald-navy--400: #8291D7;
162
- --color--mittwald-navy--300: #A5B0E2;
163
- --color--mittwald-navy--200: #C8CFEE;
164
- --color--mittwald-navy--100: #E4E7F6;
165
- --color--soft-contrast-violet--1100: #302a6f;
166
- --color--soft-contrast-violet--1000: #483b9f;
167
- --color--soft-contrast-violet--900: #5d4abf;
168
- --color--soft-contrast-violet--800: #715DEE;
169
- --color--soft-contrast-violet--700: #8574F0;
170
- --color--soft-contrast-violet--600: #998BF3;
171
- --color--soft-contrast-violet--500: #AEA2F5;
172
- --color--soft-contrast-violet--400: #C2B9F8;
173
- --color--soft-contrast-violet--300: #D6D0FA;
174
- --color--soft-contrast-violet--200: #EAE7FD;
175
- --color--soft-contrast-violet--100: #F4F3FE;
176
- --color--espelkamp-green--1100: #00291C;
177
- --color--espelkamp-green--1000: #003B29;
178
- --color--espelkamp-green--900: #005F42;
179
- --color--espelkamp-green--800: #00825B;
180
- --color--espelkamp-green--700: #00A673;
181
- --color--espelkamp-green--600: #00DE9A;
182
- --color--espelkamp-green--500: #17FFB8;
183
- --color--espelkamp-green--400: #4FFFC9;
184
- --color--espelkamp-green--300: #87FFDA;
185
- --color--espelkamp-green--200: #C0FFEB;
186
- --color--espelkamp-green--100: #DCFFF4;
187
- --color--royal-orange--1100: #763200;
188
- --color--royal-orange--1000: #8F3D00;
189
- --color--royal-orange--900: #C25200;
190
- --color--royal-orange--800: #F56800;
191
- --color--royal-orange--700: #FF8225;
192
- --color--royal-orange--600: #FF9343;
193
- --color--royal-orange--500: #FFA562;
194
- --color--royal-orange--400: #FFC89F;
195
- --color--royal-orange--300: #FFD9BD;
196
- --color--royal-orange--200: #FFEBDC;
197
- --color--royal-orange--100: #FFF4EB;
198
- --color--amaranth-red--1100: #6A0F22;
199
- --color--amaranth-red--1000: #83122A;
200
- --color--amaranth-red--900: #B4193A;
201
- --color--amaranth-red--800: #E1244C;
202
- --color--amaranth-red--700: #E54366;
203
- --color--amaranth-red--600: #EA637F;
204
- --color--amaranth-red--500: #EE8299;
205
- --color--amaranth-red--400: #F2A2B3;
206
- --color--amaranth-red--300: #F7C1CC;
207
- --color--amaranth-red--200: #FBE0E6;
208
- --color--amaranth-red--100: #FDF0F3;
209
- --color--hosting-blue--1100: #00205C;
210
- --color--hosting-blue--1000: #002A7B;
211
- --color--hosting-blue--900: #003FB8;
212
- --color--hosting-blue--800: #0054F5;
213
- --color--hosting-blue--700: #1A68FF;
214
- --color--hosting-blue--600: #3D80FF;
215
- --color--hosting-blue--500: #6197FF;
216
- --color--hosting-blue--400: #85AFFF;
217
- --color--hosting-blue--300: #ABC6FF;
218
- --color--hosting-blue--200: #E0EBFF;
219
- --color--hosting-blue--100: #F0F5FF;
220
- --color--gray--1100: #000000;
221
- --color--gray--1000: #222222;
222
- --color--gray--900: #464646;
223
- --color--gray--800: #6D6D6D;
224
- --color--gray--700: #909090;
225
- --color--gray--600: #B1B1B1;
226
- --color--gray--500: #D5D5D5;
227
- --color--gray--400: #E6E6E6;
228
- --color--gray--300: #F8F8F8;
229
- --color--gray--200: #FDFDFD;
230
- --color--gray--100: #FFFFFF;
231
- --light--color--800: rgb(255 255 255 / 100%);
232
- --light--color--700: rgb(255 255 255 / 87.5%);
233
- --light--color--600: rgb(255 255 255 / 75%);
234
- --light--color--500: rgb(255 255 255 / 62.5%);
235
- --light--color--400: rgb(255 255 255 / 50%);
236
- --light--color--300: rgb(255 255 255 / 37.5%);
237
- --light--color--200: rgb(255 255 255 / 25%);
238
- --light--color--100: rgb(255 255 255 / 12.5%);
239
- --dark--color--800: rgb(0 0 0 / 100%);
240
- --dark--color--700: rgb(0 0 0 / 87.5%);
241
- --dark--color--600: rgb(0 0 0 / 75%);
242
- --dark--color--500: rgb(0 0 0 / 62.5%);
243
- --dark--color--400: rgb(0 0 0 / 50%);
244
- --dark--color--300: rgb(0 0 0 / 37.5%);
245
- --dark--color--200: rgb(0 0 0 / 25%);
246
- --dark--color--100: rgb(0 0 0 / 12.5%);
247
- --border-style--default: solid;
248
- --corner-radius--round: 50%;
249
- --image-button--brightness--pressed: 50%;
250
6
  --image-button--brightness--hover: 62.5%;
251
- --file-card--sub-title-font-size: var(--font-size-text--s);
252
- --file-card--border-style: var(--border-style--default);
253
- --file-card--spacing: var(--size-rem--s);
254
- --file-card--padding-y: var(--size-px--xs);
255
- --file-card--padding-x: var(--size-px--s);
256
- --table--footer-font-weight: var(--font-weight--bold);
257
- --table--header-font-weight: var(--font-weight--bold);
258
- --table--padding-y: var(--size-px--s);
259
- --table--padding-x: var(--size-px--m);
260
- --table--border-style: var(--border-style--default);
261
- --section-header--heading-to-actions-spacing: var(--size-rem--m);
262
- --section-header--action-to-action-spacing: var(--size-rem--s);
263
- --section--sub-heading-spacing: var(--size-rem--s);
264
- --section--content-to-content-spacing: var(--size-rem--m);
265
- --section--section-to-section-spacing: var(--size-rem--xl);
266
- --section--border-style: var(--border-style--default);
267
- --list-item--subtitle-font-size: var(--font-size-text--s);
268
- --list-item--content-to-content-spacing: var(--size-px--m);
269
- --list-item--border-style: var(--border-style--default);
270
- --list-item--padding: var(--size-px--s);
271
- --list--block-to-block-spacing: var(--size-px--m);
272
- --list--content-to-content-spacing: var(--size-px--s);
273
- --layout-card--padding: var(--size-px--xl);
274
- --column-layout--gap--l: var(--size-px--l);
275
- --column-layout--gap--m: var(--size-px--m);
276
- --column-layout--gap--s: var(--size-px--s);
277
- --column-layout--content-to-content-spacing: var(--size-rem--m);
278
- --align--avatar-text--spacing: var(--size-rem--s);
279
- --accordion--content-padding: var(--size-px--s);
280
- --accordion--header-padding-y: var(--size-px--xs);
281
- --accordion--header-padding-x: var(--size-px--s);
282
- --accordion--heading-to-chevron-spacing: var(--size-rem--s);
283
- --progress-bar--corner-radius: var(--size-rem--xs);
284
- --progress-bar--height: var(--size-rem--s);
285
- --progress-bar--spacing-x: var(--size-rem--m);
286
- --progress-bar--spacing-y: var(--size-rem--xs);
287
- --progress-bar--value-font-weight: var(--font-weight--bold);
288
- --progress-bar--font-size-s: var(--font-size-text--s);
289
- --progress-bar--font-size: var(--font-size-text--m);
290
- --notification--font-size: var(--font-size-text--s);
291
- --notification--heading-to-text-spacing: var(--size-rem--xs);
292
- --notification--border-style: var(--border-style--default);
293
- --notification--padding: var(--size-px--s);
294
- --notification-provider--notification-to-notification-spacing: var(--size-px--m);
295
- --notification-provider--window-to-provider-spacing: var(--size-px--xl);
296
- --counter-badge--border-style: var(--border-style--default);
297
- --counter-badge--padding-inline: var(--size-rem--xs);
298
- --counter-badge--font-weight: var(--font-weight--bold);
299
- --badge--light-scope-background-color: var(--light--color--800);
300
- --badge--light-content-color--pressed: var(--light--color--800);
301
- --badge--light-content-color--hover: var(--light--color--800);
302
- --badge--light-content-color--default: var(--light--color--800);
303
- --badge--light-background-color--pressed: var(--light--color--300);
304
- --badge--light-background-color--hover: var(--light--color--200);
305
- --badge--light-background-color--default: var(--light--color--100);
306
- --badge--light-border-color: var(--light--color--800);
307
- --badge--dark-scope-background-color: var(--dark--color--800);
308
- --badge--dark-content-color--pressed: var(--dark--color--800);
309
- --badge--dark-content-color--hover: var(--dark--color--800);
310
- --badge--dark-content-color--default: var(--dark--color--800);
311
- --badge--dark-background-color--pressed: var(--dark--color--300);
312
- --badge--dark-background-color--hover: var(--dark--color--200);
313
- --badge--dark-background-color--default: var(--dark--color--100);
314
- --badge--dark-border-color: var(--dark--color--800);
315
- --badge--orange-scope-background-color: var(--color--royal-orange--900);
316
- --badge--orange-content-color--pressed: var(--color--royal-orange--1000);
317
- --badge--orange-content-color--hover: var(--color--royal-orange--900);
318
- --badge--orange-content-color--default: var(--color--royal-orange--900);
319
- --badge--orange-background-color--pressed: var(--color--royal-orange--300);
320
- --badge--orange-background-color--hover: var(--color--royal-orange--200);
321
- --badge--orange-background-color--default: var(--color--royal-orange--100);
322
- --badge--orange-border-color: var(--color--royal-orange--900);
323
- --badge--green-scope-background-color: var(--color--espelkamp-green--800);
324
- --badge--green-content-color--pressed: var(--color--espelkamp-green--1000);
325
- --badge--green-content-color--hover: var(--color--espelkamp-green--900);
326
- --badge--green-content-color--default: var(--color--espelkamp-green--900);
327
- --badge--green-background-color--pressed: var(--color--espelkamp-green--300);
328
- --badge--green-background-color--hover: var(--color--espelkamp-green--200);
329
- --badge--green-background-color--default: var(--color--espelkamp-green--100);
330
- --badge--green-border-color: var(--color--espelkamp-green--800);
331
- --badge--red-scope-background-color: var(--color--amaranth-red--800);
332
- --badge--red-content-color--pressed: var(--color--amaranth-red--1000);
333
- --badge--red-content-color--hover: var(--color--amaranth-red--900);
334
- --badge--red-content-color--default: var(--color--amaranth-red--900);
335
- --badge--red-background-color--pressed: var(--color--amaranth-red--300);
336
- --badge--red-background-color--hover: var(--color--amaranth-red--200);
337
- --badge--red-background-color--default: var(--color--amaranth-red--100);
338
- --badge--red-border-color: var(--color--amaranth-red--800);
339
- --badge--lilac-scope-background-color: var(--color--bright-lilac--800);
340
- --badge--lilac-content-color--pressed: var(--color--bright-lilac--1000);
341
- --badge--lilac-content-color--hover: var(--color--bright-lilac--900);
342
- --badge--lilac-content-color--default: var(--color--bright-lilac--900);
343
- --badge--lilac-background-color--pressed: var(--color--bright-lilac--300);
344
- --badge--lilac-background-color--hover: var(--color--bright-lilac--200);
345
- --badge--lilac-background-color--default: var(--color--bright-lilac--100);
346
- --badge--lilac-border-color: var(--color--bright-lilac--800);
347
- --badge--teal-scope-background-color: var(--color--super-teal--800);
348
- --badge--teal-content-color--pressed: var(--color--super-teal--1000);
349
- --badge--teal-content-color--hover: var(--color--super-teal--900);
350
- --badge--teal-content-color--default: var(--color--super-teal--900);
351
- --badge--teal-background-color--pressed: var(--color--super-teal--300);
352
- --badge--teal-background-color--hover: var(--color--super-teal--200);
353
- --badge--teal-background-color--default: var(--color--super-teal--100);
354
- --badge--teal-border-color: var(--color--super-teal--800);
355
- --badge--violet-scope-background-color: var(--color--soft-contrast-violet--800);
356
- --badge--violet-content-color--pressed: var(--color--soft-contrast-violet--1000);
357
- --badge--violet-content-color--hover: var(--color--soft-contrast-violet--900);
358
- --badge--violet-content-color--default: var(--color--soft-contrast-violet--900);
359
- --badge--violet-background-color--pressed: var(--color--soft-contrast-violet--300);
360
- --badge--violet-background-color--hover: var(--color--soft-contrast-violet--200);
361
- --badge--violet-background-color--default: var(--color--soft-contrast-violet--100);
362
- --badge--violet-border-color: var(--color--soft-contrast-violet--800);
363
- --badge--navy-scope-background-color: var(--color--mittwald-navy--800);
364
- --badge--navy-content-color--pressed: var(--color--mittwald-navy--1000);
365
- --badge--navy-content-color--hover: var(--color--mittwald-navy--900);
366
- --badge--navy-content-color--default: var(--color--mittwald-navy--900);
367
- --badge--navy-background-color--pressed: var(--color--mittwald-navy--300);
368
- --badge--navy-background-color--hover: var(--color--mittwald-navy--200);
369
- --badge--navy-background-color--default: var(--color--mittwald-navy--100);
370
- --badge--navy-border-color: var(--color--mittwald-navy--800);
371
- --badge--blue-scope-background-color: var(--color--hosting-blue--800);
372
- --badge--blue-content-color--pressed: var(--color--hosting-blue--1000);
373
- --badge--blue-content-color--hover: var(--color--hosting-blue--900);
374
- --badge--blue-content-color--default: var(--color--hosting-blue--900);
375
- --badge--blue-background-color--pressed: var(--color--hosting-blue--300);
376
- --badge--blue-background-color--hover: var(--color--hosting-blue--200);
377
- --badge--blue-background-color--default: var(--color--hosting-blue--100);
378
- --badge--blue-border-color: var(--color--hosting-blue--800);
379
- --badge--neutral-scope-background-color: var(--color--gray--800);
380
- --badge--neutral-content-color--pressed: var(--color--gray--1000);
381
- --badge--neutral-content-color--hover: var(--color--gray--900);
382
- --badge--neutral-content-color--default: var(--color--gray--900);
383
- --badge--neutral-background-color--pressed: var(--color--gray--500);
384
- --badge--neutral-background-color--hover: var(--color--gray--400);
385
- --badge--neutral-background-color--default: var(--color--gray--300);
386
- --badge--neutral-border-color: var(--color--gray--800);
387
- --badge--content-to-content-spacing: var(--size-rem--xs);
388
- --badge--padding-x: var(--size-rem--s);
389
- --badge--padding-y: var(--size-rem--xs);
390
- --badge--border-style: var(--border-style--default);
391
- --badge--corner-radius: var(--size-rem--m);
392
- --badge--line-height: var(--size-rem--m);
393
- --badge--font-weight: var(--font-weight--bold);
394
- --badge--font-size: var(--font-size-text--s);
395
- --alert--font-size-heading: var(--font-size-text--m);
396
- --alert--content-to-content-spacing: var(--size-rem--s);
397
- --alert--heading-to-content-spacing: var(--size-rem--xs);
398
- --alert--border-style: var(--border-style--default);
399
- --alert--padding: var(--size-px--m);
400
- --alert-badge--icon-to-text-spacing: var(--size-rem--xs);
401
- --shadow--overlay: rgba(0, 0, 0, 0.14) 0 var(--size-px--m) var(--size-px--l);
402
- --shadow--content: rgba(0, 0, 0, 0.1) 0 var(--size-px--xs) var(--size-px--s);
403
- --tooltip--arrow-size: var(--size-px--s);
404
- --tooltip--tooltip-to-content-spacing: var(--size-px--s);
405
- --tooltip--font-size: var(--font-size-text--s);
406
- --tooltip--padding-y: var(--size-px--xs);
407
- --tooltip--padding-x: var(--size-px--s);
408
- --popover--tip-width: var(--size-px--m);
409
- --popover--tip-height: var(--size-px--s);
410
- --popover--popover-to-trigger-spacing: var(--size-px--m);
411
- --popover--border-style: var(--border-style--default);
412
- --popover--padding: var(--size-px--m);
413
- --overlay--background-color: var(--dark--color--200);
414
- --modal--off-canvas-max-width: calc(100vw - var(--size-px--m));
415
- --modal--off-canvas-padding-y: var(--size-px--s);
416
- --modal--action-group-border-style: var(--border-style--default);
417
- --modal--action-group-padding: var(--size-rem--l);
418
- --modal--padding-bottom: var(--size-px--xl);
419
- --modal--padding: var(--size-px--l);
420
- --light-box--spacing: var(--size-px--s);
421
- --light-box--max-height: calc(100dvh - var(--size-px--l));
422
- --light-box--max-width: calc(100dvw - var(--size-px--l));
423
- --light-box--overlay-background-color: var(--dark--color--600);
424
- --contextual-help--content-to-content-spacing: var(--size-rem--s);
425
- --tab-panel--padding: var(--size-px--xl);
426
- --tab--text-to-status-spacing: var(--size-rem--s);
427
- --tab--font-weight--selected: var(--font-weight--bold);
428
- --tab--padding-x: var(--size-px--l);
429
- --tab--padding-y: var(--size-px--m);
430
- --link--color-light--pressed: var(--light--color--600);
431
- --link--color-light--hover: var(--light--color--700);
432
- --link--color-light--default: var(--light--color--800);
433
- --link--color-dark--pressed: var(--dark--color--600);
434
- --link--color-dark--hover: var(--dark--color--700);
435
- --link--color-dark--default: var(--dark--color--800);
436
- --link--text-to-icon-spacing: var(--size-rem--xs);
437
- --link--font-weight: var(--font-weight--bold);
438
- --link--font-size: var(--font-size-text--s);
439
- --header-navigation--item-font-weight-current: var(--font-weight--bold);
440
- --header-navigation--item-padding: var(--size-px--s);
441
- --header-navigation--item-to-item-spacing: var(--size-rem--m);
442
- --breadcrumb-item--font-weight--current: var(--font-weight--bold);
443
- --breadcrumb-item--font-weight--default: var(--font-weight--normal);
444
- --breadcrumb-item--font-size: var(--font-size-text--s);
445
- --breadcrumb-item--padding-x: var(--size-px--xs);
446
- --time-field--date-segment-corner-radius: var(--size-px--xs);
447
- --switch--track-padding: var(--size-rem--xxs);
448
- --switch--label-to-track-spacing: var(--size-rem--s);
449
- --slider--initial-marker-width: var(--size-rem--xs);
450
- --slider--initial-marker-height: var(--size-rem--m);
451
- --slider--thumb-size: var(--size-rem--l);
452
- --slider--thumb-corner-radius: var(--corner-radius--round);
453
- --slider--thumb-border-style: var(--border-style--default);
454
- --slider--thumb-border-width: var(--size-rem--xs);
455
- --slider--track-height: var(--size-rem--xs);
456
- --slider--text-to-track-spacing: var(--size-rem--xs);
457
- --slider--value-to-label-spacing: var(--size-rem--xs);
458
- --slider--value-font-weight: var(--font-weight--bold);
459
- --segmented-button--text-to-text-spacing: var(--size-rem--xs);
460
- --form-control--border-style: var(--border-style--default);
461
- --form-control--padding-y: var(--size-px--s);
462
- --form-control--padding-x: var(--size-px--m);
463
- --form-control--spacing-y: var(--size-rem--xs);
464
- --form-control--spacing-x: var(--size-rem--s);
465
- --form-control--control-to-info-spacing: var(--size-rem--xs);
466
- --form-control--label-to-control-spacing: var(--size-rem--xxs);
467
- --field-error--spacing: var(--size-rem--xs);
468
- --field-error--font-size: var(--font-size-text--s);
469
- --field-description--font-size: var(--font-size-text--s);
470
- --calendar--header-cell-font-weight: var(--font-weight--bold);
471
- --calendar--cell-font-size: var(--font-size-text--s);
472
- --calendar--cell-corner-radius: var(--corner-radius--round);
473
- --calendar--spacing: var(--size-rem--xs);
474
- --date-picker--date-segment-corner-radius: var(--size-px--xs);
475
- --font-size-text--default: var(--font-size-text--m);
476
- --line-height--s: calc(var(--font-size-text--s) * 1.5);
477
- --line-height--m: calc(var(--font-size-text--m) * 1.5);
478
- --focus--outline-offset: var(--size-px--xxs);
479
- --markdown--spacing: var(--size-rem--m);
480
- --labeled-value--value-to-action-spacing: var(--size-rem--xs);
481
- --labeled-value--label-to-value-spacing: var(--size-rem--xxs);
482
- --label--spacing: var(--size-rem--xs);
483
- --label--font-weight: var(--font-weight--bold);
484
- --label--font-size: var(--font-size-text--s);
485
- --initials--font-weight: var(--font-weight--bold);
486
- --illustrated-message--spacing: var(--size-rem--m);
487
- --illustrated-message--padding: var(--size-px--m);
488
- --heading--font-weight: var(--font-weight--bold);
489
- --heading--icon-to-text-spacing: var(--size-rem--s);
490
- --decorative--disabled-content-color: var(--color--gray--600);
491
- --decorative--disabled-content-accent-color: var(--color--gray--500);
492
- --decorative--disabled-background-color: var(--color--gray--300);
493
- --decorative--lilac-content-color: var(--color--bright-lilac--1000);
494
- --decorative--lilac-content-accent-color: var(--color--bright-lilac--800);
495
- --decorative--lilac-background-color: var(--color--bright-lilac--200);
496
- --decorative--violet-content-color: var(--color--soft-contrast-violet--1000);
497
- --decorative--violet-content-accent-color: var(--color--soft-contrast-violet--800);
498
- --decorative--violet-background-color: var(--color--soft-contrast-violet--200);
499
- --decorative--green-content-color: var(--color--espelkamp-green--1000);
500
- --decorative--green-content-accent-color: var(--color--espelkamp-green--800);
501
- --decorative--green-background-color: var(--color--espelkamp-green--200);
502
- --decorative--teal-content-color: var(--color--super-teal--1000);
503
- --decorative--teal-content-accent-color: var(--color--super-teal--800);
504
- --decorative--teal-background-color: var(--color--super-teal--200);
505
- --decorative--blue-content-color: var(--color--hosting-blue--1000);
506
- --decorative--blue-content-accent-color: var(--color--hosting-blue--800);
507
- --decorative--blue-background-color: var(--color--hosting-blue--200);
508
- --code--spacing: var(--size-px--m);
509
- --code--padding: var(--size-px--m);
510
- --code--padding-x: var(--size-px--xs);
511
- --code--font-size: var(--font-size-text--s);
512
- --avatar--size--l: var(--size-rem--xxl);
513
- --avatar--size--s: var(--size-rem--xl);
514
- --avatar--size--xs: var(--size-rem--l);
515
- --light-outline-content-color: var(--light--color--700);
516
- --light-outline-border-color: var(--light--color--800);
517
- --light-outline-background-color--pressed: var(--light--color--200);
518
- --light-outline-background-color--hover: var(--light--color--100);
519
- --light-outline-background-color--default: var(--color--transparent);
520
- --light-plain-content-color: var(--light--color--800);
521
- --light-plain-background-color--pressed: var(--light--color--200);
522
- --light-plain-background-color--hover: var(--light--color--100);
523
- --light-plain-background-color--default: var(--color--transparent);
524
- --light-soft-content-color: var(--light--color--800);
525
- --light-soft-background-color--pressed: var(--light--color--300);
526
- --light-soft-background-color--hover: var(--light--color--200);
527
- --light-soft-background-color--default: var(--light--color--100);
528
- --light-solid-content-color: var(--dark--color--800);
529
- --light-solid-background-color--pressed: var(--light--color--600);
530
- --light-solid-background-color--hover: var(--light--color--700);
531
- --light-solid-background-color--default: var(--light--color--800);
532
- --dark-outline-content-color: var(--dark--color--800);
533
- --dark-outline-border-color: var(--dark--color--700);
534
- --dark-outline-background-color--pressed: var(--dark--color--200);
535
- --dark-outline-background-color--hover: var(--dark--color--100);
536
- --dark-outline-background-color--default: var(--color--transparent);
537
- --dark-plain-content-color: var(--dark--color--800);
538
- --dark-plain-background-color--pressed: var(--dark--color--200);
539
- --dark-plain-background-color--hover: var(--dark--color--100);
540
- --dark-plain-background-color--default: var(--color--transparent);
541
- --dark-soft-content-color: var(--dark--color--800);
542
- --dark-soft-background-color--pressed: var(--dark--color--300);
543
- --dark-soft-background-color--hover: var(--dark--color--200);
544
- --dark-soft-background-color--default: var(--dark--color--100);
545
- --dark-solid-content-color: var(--light--color--800);
546
- --dark-solid-background-color--pressed: var(--dark--color--600);
547
- --dark-solid-background-color--hover: var(--dark--color--700);
548
- --dark-solid-background-color--default: var(--dark--color--800);
549
- --disabled-soft-light-content-color: var(--light--color--200);
550
- --disabled-soft-light-background-color: var(--light--color--100);
551
- --disabled-soft-dark-content-color: var(--dark--color--200);
552
- --disabled-soft-dark-background-color: var(--dark--color--100);
553
- --disabled-outline-light-content-color: var(--light--color--300);
554
- --disabled-outline-light-border-color: var(--light--color--300);
555
- --disabled-outline-light-background-color: var(--color--transparent);
556
- --disabled-outline-dark-content-color: var(--dark--color--300);
557
- --disabled-outline-dark-border-color: var(--dark--color--300);
558
- --disabled-outline-dark-background-color: var(--color--transparent);
559
- --disabled-plain-light-content-color: var(--light--color--300);
560
- --disabled-plain-dark-content-color: var(--dark--color--300);
561
- --disabled-plain-background-color: var(--color--transparent);
562
- --disabled-solid-light-content-color: var(--dark--color--300);
563
- --disabled-solid-light-background-color: var(--light--color--300);
564
- --disabled-solid-dark-content-color: var(--light--color--300);
565
- --disabled-solid-dark-background-color: var(--dark--color--300);
566
- --neutral-outline-background-color--default: var(--color--transparent);
567
- --neutral-plain-background-color--default: var(--color--transparent);
568
- --warning-plain-background-color--default: var(--color--transparent);
569
- --warning-outline-background-color--default: var(--color--transparent);
570
- --success-outline-background-color--default: var(--color--transparent);
571
- --success-plain-background-color--default: var(--color--transparent);
572
- --info-plain-background-color--default: var(--color--transparent);
573
- --info-outline-background-color--default: var(--color--transparent);
574
- --danger-outline-background-color--default: var(--color--transparent);
575
- --danger-plain-background-color--default: var(--color--transparent);
576
- --primary-outline-background-color--default: var(--color--transparent);
577
- --primary-plain-background-color--default: var(--color--transparent);
578
- --warning--color--1100: var(--color--royal-orange--1100);
579
- --warning--color--1000: var(--color--royal-orange--1000);
580
- --warning--color--900: var(--color--royal-orange--900);
581
- --warning--color--800: var(--color--royal-orange--800);
582
- --warning--color--700: var(--color--royal-orange--700);
583
- --warning--color--600: var(--color--royal-orange--600);
584
- --warning--color--500: var(--color--royal-orange--500);
585
- --warning--color--400: var(--color--royal-orange--400);
586
- --warning--color--300: var(--color--royal-orange--300);
587
- --warning--color--200: var(--color--royal-orange--200);
588
- --warning--color--100: var(--color--royal-orange--100);
589
- --danger--color--1100: var(--color--amaranth-red--1100);
590
- --danger--color--1000: var(--color--amaranth-red--1000);
591
- --danger--color--900: var(--color--amaranth-red--900);
592
- --danger--color--800: var(--color--amaranth-red--800);
593
- --danger--color--700: var(--color--amaranth-red--700);
594
- --danger--color--600: var(--color--amaranth-red--600);
595
- --danger--color--500: var(--color--amaranth-red--500);
596
- --danger--color--400: var(--color--amaranth-red--400);
597
- --danger--color--300: var(--color--amaranth-red--300);
598
- --danger--color--200: var(--color--amaranth-red--200);
599
- --danger--color--100: var(--color--amaranth-red--100);
600
- --neutral--color--1100: var(--color--gray--1100);
601
- --neutral--color--1000: var(--color--gray--1000);
602
- --neutral--color--900: var(--color--gray--900);
603
- --neutral--color--800: var(--color--gray--800);
604
- --neutral--color--700: var(--color--gray--700);
605
- --neutral--color--600: var(--color--gray--600);
606
- --neutral--color--500: var(--color--gray--500);
607
- --neutral--color--400: var(--color--gray--400);
608
- --neutral--color--300: var(--color--gray--300);
609
- --neutral--color--200: var(--color--gray--200);
610
- --neutral--color--100: var(--color--gray--100);
611
- --success--color--1100: var(--color--espelkamp-green--1100);
612
- --success--color--1000: var(--color--espelkamp-green--1000);
613
- --success--color--900: var(--color--espelkamp-green--900);
614
- --success--color--800: var(--color--espelkamp-green--800);
615
- --success--color--700: var(--color--espelkamp-green--700);
616
- --success--color--600: var(--color--espelkamp-green--600);
617
- --success--color--500: var(--color--espelkamp-green--500);
618
- --success--color--400: var(--color--espelkamp-green--400);
619
- --success--color--300: var(--color--espelkamp-green--300);
620
- --success--color--200: var(--color--espelkamp-green--200);
621
- --success--color--100: var(--color--espelkamp-green--100);
622
- --info--color--1100: var(--color--hosting-blue--1100);
623
- --info--color--1000: var(--color--hosting-blue--1000);
624
- --info--color--900: var(--color--hosting-blue--900);
625
- --info--color--800: var(--color--hosting-blue--800);
626
- --info--color--700: var(--color--hosting-blue--700);
627
- --info--color--600: var(--color--hosting-blue--600);
628
- --info--color--500: var(--color--hosting-blue--500);
629
- --info--color--400: var(--color--hosting-blue--400);
630
- --info--color--300: var(--color--hosting-blue--300);
631
- --info--color--200: var(--color--hosting-blue--200);
632
- --info--color--100: var(--color--hosting-blue--100);
633
- --primary--color--1100: var(--color--hosting-blue--1100);
634
- --primary--color--1000: var(--color--hosting-blue--1000);
635
- --primary--color--900: var(--color--hosting-blue--900);
636
- --primary--color--800: var(--color--hosting-blue--800);
637
- --primary--color--700: var(--color--hosting-blue--700);
638
- --primary--color--600: var(--color--hosting-blue--600);
639
- --primary--color--500: var(--color--hosting-blue--500);
640
- --primary--color--400: var(--color--hosting-blue--400);
641
- --primary--color--300: var(--color--hosting-blue--300);
642
- --primary--color--200: var(--color--hosting-blue--200);
643
- --primary--color--100: var(--color--hosting-blue--100);
644
- --border-width--400: var(--size-px--s);
645
- --border-width--300: var(--size-px--xs);
646
- --border-width--200: var(--size-px--xxs);
647
- --border-width--100: var(--size-px--xxxs);
648
- --corner-radius--default: var(--size-px--xs);
649
- --menu-item--background-color--default: var(--color--transparent);
650
- --menu-item--icon-to-text-spacing: var(--size-rem--s);
651
- --menu-item--padding-y: var(--size-px--xs);
652
- --menu-item--padding-x: var(--size-px--s);
653
- --menu-item--font-weight--current: var(--font-weight--bold);
654
- --menu--separator-to-item-spacing: var(--size-px--s);
655
- --menu--label-to-group-spacing: var(--size-px--xs);
656
- --menu--group-to-group-spacing: var(--size-px--m);
657
- --menu--item-to-item-spacing: var(--size-px--xs);
658
- --image-button--hover-icon-color: var(--color--gray--100);
659
- --context-menu--padding: var(--size-px--s);
660
- --button--line-height-s: var(--size-rem--m);
661
- --button--font-size-s: var(--font-size-text--s);
662
- --button--spacing-s: var(--size-rem--xs);
663
- --button--padding-s-y: var(--size-px--xs);
664
- --button--padding-s-x: var(--size-px--s);
665
- --button--padding-s-icon-only: var(--size-px--xs);
666
- --button--border-style: var(--border-style--default);
667
- --button--spacing: var(--size-rem--s);
668
- --button--padding-icon-only: var(--size-px--s);
669
- --button--padding-y: var(--size-px--s);
670
- --button--padding-x: var(--size-px--m);
671
- --action-group--spacing--s: var(--size-px--s);
672
- --action-group--spacing--m: var(--size-px--m);
673
- --file-card--background-color--default: var(--neutral--color--100);
674
- --file-card--border-width: var(--border-width--100);
675
- --file-card--corner-radius: var(--corner-radius--default);
676
- --table--background-color-accent: var(--neutral--color--300);
677
- --table--background-color: var(--neutral--color--100);
678
- --table--footer-border-width: var(--border-width--200);
679
- --table--header-border-width: var(--border-width--200);
680
- --table--header-color: var(--primary--color--1000);
681
- --table--border-width: var(--border-width--100);
682
- --table--corner-radius: var(--corner-radius--default);
683
- --separator--height: var(--border-width--100);
684
- --separator--color: var(--neutral--color--700);
685
- --list-item--background-color--pressed: var(--primary--color--200);
686
- --list-item--background-color--hover: var(--primary--color--100);
687
- --list-item--background-color--default: var(--neutral--color--200);
688
- --list-item--border-width: var(--border-width--100);
689
- --list-item--corner-radius: var(--corner-radius--default);
690
- --layout-card--box-shadow: var(--shadow--content);
691
- --layout-card--corner-radius: var(--corner-radius--default);
692
- --layout-card--background-color: var(--neutral--color--100);
693
- --accordion--header-corner-radius: var(--corner-radius--default);
694
- --progress-bar--background-color: var(--neutral-outline-background-color--default);
695
- --progress-bar--border-width: var(--border-width--100);
696
- --notification--success-background-color--default: var(--neutral--color--100);
697
- --notification--danger-background-color--default: var(--neutral--color--100);
698
- --notification--warning-background-color--default: var(--neutral--color--100);
699
- --notification--info-background-color--default: var(--neutral--color--100);
700
- --notification--box-shadow: var(--shadow--overlay);
701
- --notification--border-x-start-width: var(--border-width--300);
702
- --notification--corner-radius: var(--corner-radius--default);
703
- --counter-badge--border-color: var(--neutral--color--100);
704
- --counter-badge--border-width: var(--border-width--200);
705
- --badge--disabled-light-scope-content-color: var(--disabled-solid-light-content-color);
706
- --badge--disabled-light-scope-background-color: var(--disabled-solid-light-background-color);
707
- --badge--disabled-light-content-color: var(--disabled-soft-light-content-color);
708
- --badge--disabled-light-background-color: var(--disabled-soft-light-background-color);
709
- --badge--disabled-light-border-color: var(--disabled-outline-light-border-color);
710
- --badge--disabled-dark-scope-content-color: var(--disabled-solid-dark-content-color);
711
- --badge--disabled-dark-scope-background-color: var(--disabled-solid-dark-background-color);
712
- --badge--disabled-dark-content-color: var(--disabled-soft-dark-content-color);
713
- --badge--disabled-dark-background-color: var(--disabled-soft-dark-background-color);
714
- --badge--disabled-dark-border-color: var(--disabled-outline-dark-border-color);
715
- --badge--border-width: var(--border-width--100);
716
- --alert--border-x-start-width: var(--border-width--400);
717
- --alert--border-width: var(--border-width--100);
718
- --alert--corner-radius: var(--corner-radius--default);
719
- --tooltip--box-shadow: var(--shadow--overlay);
720
- --tooltip--color: var(--neutral--color--100);
721
- --tooltip--background-color: var(--neutral--color--900);
722
- --popover--border-width: var(--border-width--100);
723
- --popover--background-color: var(--neutral--color--100);
724
- --popover--corner-radius: var(--corner-radius--default);
725
- --popover--box-shadow: var(--shadow--overlay);
726
- --modal--off-canvas-header-background-color: var(--neutral--color--200);
727
- --modal--action-group-border-top-width: var(--border-width--100);
728
- --modal--action-group-border-color: var(--neutral--color--400);
729
- --modal--action-group-background-color: var(--neutral--color--300);
730
- --modal--background-color: var(--neutral--color--100);
731
- --modal--corner-radius: var(--corner-radius--default);
732
- --tab--disabled-color: var(--neutral--color--600);
733
- --tab--background-color--selected: var(--neutral--color--100);
734
- --tab-list--background-color: var(--neutral--color--400);
735
- --link--color-light--disabled: var(--disabled-plain-light-content-color);
736
- --link--color-dark--disabled: var(--disabled-plain-dark-content-color);
737
- --link--color--pressed: var(--primary--color--1000);
738
- --link--color--hover: var(--primary--color--900);
739
- --link--color--default: var(--primary--color--800);
740
- --link--line-height: var(--line-height--m);
741
- --header-navigation--item-underline-width-current: var(--border-width--200);
742
- --header-navigation--item-corner-radius: var(--corner-radius--default);
743
- --header-navigation--item-background-color-light--pressed: var(--light-plain-background-color--pressed);
744
- --header-navigation--item-background-color-light--hover: var(--light-plain-background-color--hover);
745
- --header-navigation--item-background-color-dark--pressed: var(--dark-plain-background-color--pressed);
746
- --header-navigation--item-background-color-dark--hover: var(--dark-plain-background-color--hover);
747
- --header-navigation--item-color-light: var(--light-plain-content-color);
748
- --header-navigation--item-color-dark: var(--dark-plain-content-color);
749
- --breadcrumb-item--color-dark: var(--dark-plain-content-color);
750
- --breadcrumb-item--color-light: var(--light-plain-content-color);
751
- --switch--handle-background-color--disabled: var(--neutral--color--300);
752
- --switch--handle-background-color--default: var(--neutral--color--100);
753
- --switch--handle-color--disabled: var(--neutral--color--500);
754
- --slider--initial-marker-corner-radius: var(--corner-radius--default);
755
- --slider--thumb-background-color--default: var(--neutral--color--100);
756
- --slider--track-corner-radius: var(--corner-radius--default);
757
- --form-control--background-color--selected: var(--primary--color--200);
758
- --form-control--background-color--invalid: var(--danger--color--100);
759
- --form-control--background-color--focused: var(--neutral--color--300);
760
- --form-control--background-color--hover: var(--primary--color--100);
761
- --form-control--background-color--default: var(--neutral--color--300);
762
- --form-control--placeholder-color--disabled: var(--neutral--color--500);
763
- --form-control--placeholder-color--default: var(--neutral--color--900);
764
- --form-control--border-width: var(--border-width--100);
765
- --form-control--corner-radius: var(--corner-radius--default);
766
- --field-error--color: var(--danger--color--800);
767
- --calendar--cell-range-background-color: var(--primary--color--100);
768
- --calendar--cell-background-color--pressed: var(--dark-plain-background-color--pressed);
769
- --calendar--cell-background-color--hover: var(--dark-plain-background-color--hover);
770
- --calendar--cell-background-color--disabled: var(--disabled-plain-background-color);
771
- --calendar--heading-font-size: var(--font-size-text--default);
772
- --choice--icon-color--selected: var(--primary--color--800);
773
- --focus--outline-width: var(--border-width--200);
774
- --focus--outline-color: var(--primary--color--800);
775
- --text--color--dark: var(--dark-plain-content-color);
776
- --text--color--light: var(--light-plain-content-color);
777
- --text--color--default: var(--neutral--color--1000);
778
- --label--color--default: var(--neutral--color--800);
779
- --label--line-height: var(--line-height--m);
780
- --illustrated-message--light-icon-color: var(--light-plain-content-color);
781
- --illustrated-message--dark-icon-color: var(--dark-plain-content-color);
782
- --illustrated-message--danger-heading-color: var(--danger--color--1000);
783
- --illustrated-message--danger-icon-color: var(--danger--color--900);
784
- --illustrated-message--primary-icon-color: var(--primary--color--900);
785
- --icon--color: var(--neutral--color--800);
786
- --heading--color-light: var(--light-plain-content-color);
787
- --heading--color-dark: var(--dark-plain-content-color);
788
- --heading--color: var(--primary--color--1000);
789
- --code--dark-content-color: var(--dark-soft-content-color);
790
- --code--dark-background-color: var(--dark-soft-background-color--default);
791
- --code--light-content-color: var(--light-soft-content-color);
792
- --code--light-background-color: var(--light-soft-background-color--default);
793
- --code--corner-radius: var(--corner-radius--default);
794
- --code--line-height: var(--line-height--m);
795
- --disabled-soft-content-color: var(--neutral--color--500);
796
- --disabled-soft-background-color: var(--neutral--color--300);
797
- --disabled-outline-border-color: var(--neutral--color--400);
798
- --disabled-outline-content-color: var(--neutral--color--500);
799
- --disabled-outline-background-color: var(--neutral--color--300);
800
- --disabled-plain-content-color: var(--neutral--color--400);
801
- --disabled-solid-content-color: var(--neutral--color--600);
802
- --disabled-solid-background-color: var(--neutral--color--400);
803
- --neutral-soft-content-color--pressed: var(--neutral--color--1100);
804
- --neutral-soft-content-color--default: var(--neutral--color--1000);
805
- --neutral-soft-background-color--pressed: var(--neutral--color--600);
806
- --neutral-soft-background-color--hover: var(--neutral--color--500);
807
- --neutral-soft-background-color--default: var(--neutral--color--400);
808
- --neutral-outline-border-color: var(--neutral--color--700);
809
- --neutral-outline-content-color: var(--neutral--color--1000);
810
- --neutral-outline-background-color--pressed: var(--neutral--color--500);
811
- --neutral-outline-background-color--selected: var(--neutral--color--500);
812
- --neutral-outline-background-color--hover: var(--neutral--color--400);
813
- --neutral-plain-content-color: var(--neutral--color--1000);
814
- --neutral-plain-background-color--pressed: var(--neutral--color--500);
815
- --neutral-plain-background-color--hover: var(--neutral--color--400);
816
- --neutral-solid-content-color: var(--neutral--color--100);
817
- --neutral-solid-background-color--pressed: var(--neutral--color--1000);
818
- --neutral-solid-background-color--hover: var(--neutral--color--900);
819
- --neutral-solid-background-color--default: var(--neutral--color--800);
820
- --warning-plain-content-color: var(--info--color--800);
821
- --warning-plain-background-color--pressed: var(--info--color--200);
822
- --warning-plain-background-color--hover: var(--info--color--100);
823
- --warning-soft-content-color--pressed: var(--warning--color--1000);
824
- --warning-soft-content-color--default: var(--warning--color--900);
825
- --warning-soft-background-color--pressed: var(--warning--color--300);
826
- --warning-soft-background-color--hover: var(--warning--color--200);
827
- --warning-soft-background-color--default: var(--warning--color--100);
828
- --warning-outline-border-color: var(--warning--color--800);
829
- --warning-outline-content-color: var(--warning--color--900);
830
- --warning-outline-background-color--pressed: var(--warning--color--200);
831
- --warning-outline-background-color--hover: var(--warning--color--100);
832
- --warning-solid-content-color: var(--neutral--color--100);
833
- --warning-solid-background-color--pressed: var(--warning--color--1000);
834
- --warning-solid-background-color--hover: var(--warning--color--900);
835
- --warning-solid-background-color--default: var(--warning--color--800);
836
- --success-soft-content-color--pressed: var(--success--color--1000);
837
- --success-soft-content-color--default: var(--success--color--900);
838
- --success-soft-background-color--pressed: var(--success--color--300);
839
- --success-soft-background-color--hover: var(--success--color--200);
840
- --success-soft-background-color--default: var(--success--color--100);
841
- --success-outline-border-color: var(--success--color--800);
842
- --success-outline-content-color: var(--success--color--900);
843
- --success-outline-background-color--pressed: var(--success--color--200);
844
- --success-outline-background-color--hover: var(--success--color--100);
845
- --success-plain-content-color: var(--success--color--800);
846
- --success-plain-background-color--pressed: var(--success--color--200);
847
- --success-plain-background-color--hover: var(--success--color--100);
848
- --success-solid-content-color: var(--neutral--color--100);
849
- --success-solid-background-color--pressed: var(--success--color--1000);
850
- --success-solid-background-color--hover: var(--success--color--900);
851
- --success-solid-background-color--default: var(--success--color--800);
852
- --info-plain-content-color: var(--info--color--800);
853
- --info-plain-background-color--pressed: var(--info--color--200);
854
- --info-plain-background-color--hover: var(--info--color--100);
855
- --info-soft-content-color--pressed: var(--info--color--1000);
856
- --info-soft-content-color--default: var(--info--color--900);
857
- --info-soft-background-color--pressed: var(--info--color--300);
858
- --info-soft-background-color--hover: var(--info--color--200);
859
- --info-soft-background-color--default: var(--info--color--100);
860
- --info-outline-border-color: var(--info--color--800);
861
- --info-outline-content-color: var(--info--color--900);
862
- --info-outline-background-color--pressed: var(--info--color--200);
863
- --info-outline-background-color--hover: var(--info--color--100);
864
- --info-solid-content-color: var(--neutral--color--100);
865
- --info-solid-background-color--pressed: var(--info--color--1000);
866
- --info-solid-background-color--hover: var(--info--color--900);
867
- --info-solid-background-color--default: var(--info--color--800);
868
- --danger-soft-content-color--pressed: var(--danger--color--1000);
869
- --danger-soft-content-color--default: var(--danger--color--900);
870
- --danger-soft-background-color--pressed: var(--danger--color--300);
871
- --danger-soft-background-color--hover: var(--danger--color--200);
872
- --danger-soft-background-color--default: var(--danger--color--100);
873
- --danger-outline-border-color: var(--danger--color--800);
874
- --danger-outline-content-color: var(--danger--color--900);
875
- --danger-outline-background-color--pressed: var(--danger--color--200);
876
- --danger-outline-background-color--hover: var(--danger--color--100);
877
- --danger-plain-content-color: var(--danger--color--800);
878
- --danger-plain-background-color--pressed: var(--danger--color--200);
879
- --danger-plain-background-color--hover: var(--danger--color--100);
880
- --danger-solid-content-color: var(--neutral--color--100);
881
- --danger-solid-background-color--pressed: var(--danger--color--1000);
882
- --danger-solid-background-color--hover: var(--danger--color--900);
883
- --danger-solid-background-color--default: var(--danger--color--800);
884
- --primary-outline-border-color: var(--primary--color--800);
885
- --primary-outline-content-color: var(--primary--color--900);
886
- --primary-outline-background-color--pressed: var(--primary--color--200);
887
- --primary-outline-background-color--hover: var(--primary--color--100);
888
- --primary-soft-content-color--pressed: var(--primary--color--1000);
889
- --primary-soft-content-color--default: var(--primary--color--900);
890
- --primary-soft-background-color--pressed: var(--primary--color--300);
891
- --primary-soft-background-color--hover: var(--primary--color--200);
892
- --primary-soft-background-color--default: var(--primary--color--100);
893
- --primary-plain-content-color: var(--primary--color--800);
894
- --primary-plain-background-color--pressed: var(--primary--color--200);
895
- --primary-plain-background-color--hover: var(--primary--color--100);
896
- --primary-solid-content-color: var(--neutral--color--100);
897
- --primary-solid-background-color--pressed: var(--primary--color--1000);
898
- --primary-solid-background-color--hover: var(--primary--color--900);
899
- --primary-solid-background-color--default: var(--primary--color--800);
900
- --menu-item--disabled-background-color: var(--disabled-plain-background-color);
901
- --menu-item--icon-color--current: var(--primary--color--800);
902
- --menu-item--icon-color--default: var(--neutral--color--800);
903
- --menu-item--color--current: var(--primary--color--800);
904
- --menu-item--corner-radius: var(--corner-radius--default);
905
- --button--light-outline-border-color--disabled: var(--disabled-outline-light-border-color);
906
- --button--light-outline-border-color--default: var(--light-outline-border-color);
907
- --button--light-outline-content-color--disabled: var(--disabled-outline-light-content-color);
908
- --button--light-outline-content-color--pressed: var(--light-outline-content-color);
909
- --button--light-outline-content-color--hover: var(--light-outline-content-color);
910
- --button--light-outline-content-color--default: var(--light-outline-content-color);
911
- --button--light-outline-background-color--disabled: var(--disabled-outline-light-background-color);
912
- --button--light-outline-background-color--pressed: var(--light-outline-background-color--pressed);
913
- --button--light-outline-background-color--hover: var(--light-outline-background-color--hover);
914
- --button--light-outline-background-color--default: var(--light-outline-background-color--default);
915
- --button--light-soft-content-color--disabled: var(--disabled-soft-light-content-color);
916
- --button--light-soft-content-color--pressed: var(--light-soft-content-color);
917
- --button--light-soft-content-color--hover: var(--light-soft-content-color);
918
- --button--light-soft-content-color--default: var(--light-soft-content-color);
919
- --button--light-soft-background-color--disabled: var(--disabled-soft-light-background-color);
920
- --button--light-soft-background-color--pressed: var(--light-soft-background-color--pressed);
921
- --button--light-soft-background-color--hover: var(--light-soft-background-color--hover);
922
- --button--light-soft-background-color--default: var(--light-soft-background-color--default);
923
- --button--light-plain-content-color--disabled: var(--disabled-plain-light-content-color);
924
- --button--light-plain-content-color--pressed: var(--light-plain-content-color);
925
- --button--light-plain-content-color--hover: var(--light-plain-content-color);
926
- --button--light-plain-content-color--default: var(--light-plain-content-color);
927
- --button--light-plain-background-color--disabled: var(--disabled-plain-background-color);
928
- --button--light-plain-background-color--pressed: var(--light-plain-background-color--pressed);
929
- --button--light-plain-background-color--hover: var(--light-plain-background-color--hover);
930
- --button--light-plain-background-color--default: var(--light-plain-background-color--default);
931
- --button--light-solid-content-color--disabled: var(--disabled-solid-light-content-color);
932
- --button--light-solid-content-color--pressed: var(--light-solid-content-color);
933
- --button--light-solid-content-color--hover: var(--light-solid-content-color);
934
- --button--light-solid-content-color--default: var(--light-solid-content-color);
935
- --button--light-solid-background-color--disabled: var(--disabled-solid-light-background-color);
936
- --button--light-solid-background-color--pressed: var(--light-solid-background-color--pressed);
937
- --button--light-solid-background-color--hover: var(--light-solid-background-color--hover);
938
- --button--light-solid-background-color--default: var(--light-solid-background-color--default);
939
- --button--dark-outline-border-color--disabled: var(--disabled-outline-dark-border-color);
940
- --button--dark-outline-border-color--default: var(--dark-outline-border-color);
941
- --button--dark-outline-content-color--disabled: var(--disabled-outline-dark-content-color);
942
- --button--dark-outline-content-color--pressed: var(--dark-outline-content-color);
943
- --button--dark-outline-content-color--hover: var(--dark-outline-content-color);
944
- --button--dark-outline-content-color--default: var(--dark-outline-content-color);
945
- --button--dark-outline-background-color--disabled: var(--disabled-outline-dark-background-color);
946
- --button--dark-outline-background-color--pressed: var(--dark-outline-background-color--pressed);
947
- --button--dark-outline-background-color--hover: var(--dark-outline-background-color--hover);
948
- --button--dark-outline-background-color--default: var(--dark-outline-background-color--default);
949
- --button--dark-soft-content-color--disabled: var(--disabled-soft-dark-content-color);
950
- --button--dark-soft-content-color--pressed: var(--dark-soft-content-color);
951
- --button--dark-soft-content-color--hover: var(--dark-soft-content-color);
952
- --button--dark-soft-content-color--default: var(--dark-soft-content-color);
953
- --button--dark-soft-background-color--disabled: var(--disabled-soft-dark-background-color);
954
- --button--dark-soft-background-color--pressed: var(--dark-soft-background-color--pressed);
955
- --button--dark-soft-background-color--hover: var(--dark-soft-background-color--hover);
956
- --button--dark-soft-background-color--default: var(--dark-soft-background-color--default);
957
- --button--dark-plain-content-color--disabled: var(--disabled-plain-dark-content-color);
958
- --button--dark-plain-content-color--pressed: var(--dark-plain-content-color);
959
- --button--dark-plain-content-color--hover: var(--dark-plain-content-color);
960
- --button--dark-plain-content-color--default: var(--dark-plain-content-color);
961
- --button--dark-plain-background-color--disabled: var(--disabled-plain-background-color);
962
- --button--dark-plain-background-color--pressed: var(--dark-plain-background-color--pressed);
963
- --button--dark-plain-background-color--hover: var(--dark-plain-background-color--hover);
964
- --button--dark-plain-background-color--default: var(--dark-plain-background-color--default);
965
- --button--dark-solid-content-color--disabled: var(--disabled-solid-dark-content-color);
966
- --button--dark-solid-content-color--pressed: var(--dark-solid-content-color);
967
- --button--dark-solid-content-color--hover: var(--dark-solid-content-color);
968
- --button--dark-solid-content-color--default: var(--dark-solid-content-color);
969
- --button--dark-solid-background-color--disabled: var(--disabled-solid-dark-background-color);
970
- --button--dark-solid-background-color--pressed: var(--dark-solid-background-color--pressed);
971
- --button--dark-solid-background-color--hover: var(--dark-solid-background-color--hover);
972
- --button--dark-solid-background-color--default: var(--dark-solid-background-color--default);
973
- --button--danger-outline-background-color--default: var(--danger-outline-background-color--default);
974
- --button--danger-plain-background-color--disabled: var(--disabled-plain-background-color);
975
- --button--danger-plain-background-color--default: var(--danger-plain-background-color--default);
976
- --button--secondary-outline-background-color--default: var(--neutral-outline-background-color--default);
977
- --button--secondary-plain-background-color--disabled: var(--disabled-plain-background-color);
978
- --button--secondary-plain-background-color--default: var(--neutral-plain-background-color--default);
979
- --button--primary-outline-background-color--default: var(--primary-outline-background-color--default);
980
- --button--primary-plain-background-color--disabled: var(--disabled-plain-background-color);
981
- --button--primary-plain-background-color--default: var(--primary-plain-background-color--default);
982
- --button--accent-outline-background-color--default: var(--success-outline-background-color--default);
983
- --button--accent-plain-background-color--disabled: var(--disabled-plain-background-color);
984
- --button--accent-plain-background-color--default: var(--success-plain-background-color--default);
985
- --button--border-width: var(--border-width--100);
986
- --button--failed-icon-color: var(--danger--color--800);
987
- --button--succeeded-icon-color: var(--success--color--800);
988
- --button--pending-icon-color: var(--neutral--color--1000);
989
- --button--corner-radius: var(--corner-radius--default);
990
- --file-card--background-color--pressed: var(--neutral-outline-background-color--pressed);
991
- --file-card--background-color--hover: var(--neutral-outline-background-color--hover);
992
- --file-card--border-color: var(--neutral-outline-border-color);
993
- --table--border-color: var(--neutral-outline-border-color);
994
- --section--border-color: var(--separator--color);
995
- --section--border-width: var(--separator--height);
996
- --list-item--border-color: var(--neutral-outline-border-color);
997
- --accordion--header-background-color--hover: var(--primary-plain-background-color--hover);
998
- --progress-bar--danger-fill-background-color: var(--danger-solid-background-color--default);
999
- --progress-bar--warning-fill-background-color: var(--warning-solid-background-color--default);
1000
- --progress-bar--success-fill-background-color: var(--success-solid-background-color--default);
1001
- --progress-bar--info-fill-background-color: var(--info-solid-background-color--default);
1002
- --progress-bar--border-color: var(--neutral-outline-border-color);
1003
- --notification--success-background-color--pressed: var(--success-outline-background-color--pressed);
1004
- --notification--success-background-color--hover: var(--success-outline-background-color--hover);
1005
- --notification--success-heading-color: var(--success-outline-content-color);
1006
- --notification--success-border-color: var(--success-outline-border-color);
1007
- --notification--danger-background-color--pressed: var(--danger-outline-background-color--pressed);
1008
- --notification--danger-background-color--hover: var(--danger-outline-background-color--hover);
1009
- --notification--danger-heading-color: var(--danger-outline-content-color);
1010
- --notification--danger-border-color: var(--danger-outline-border-color);
1011
- --notification--warning-background-color--pressed: var(--warning-outline-background-color--pressed);
1012
- --notification--warning-background-color--hover: var(--warning-outline-background-color--hover);
1013
- --notification--warning-heading-color: var(--warning-outline-content-color);
1014
- --notification--warning-border-color: var(--warning-outline-border-color);
1015
- --notification--info-background-color--pressed: var(--info-outline-background-color--pressed);
1016
- --notification--info-background-color--hover: var(--info-outline-background-color--hover);
1017
- --notification--info-heading-color: var(--info-outline-content-color);
1018
- --notification--info-border-color: var(--info-outline-border-color);
1019
- --counter-badge--color: var(--success-solid-content-color);
1020
- --counter-badge--background-color: var(--success-solid-background-color--default);
1021
- --badge--disabled-scope-content-color: var(--disabled-solid-content-color);
1022
- --badge--disabled-scope-background-color: var(--disabled-solid-background-color);
1023
- --badge--disabled-content-color: var(--disabled-soft-content-color);
1024
- --badge--disabled-background-color: var(--disabled-soft-background-color);
1025
- --badge--disabled-border-color: var(--disabled-outline-border-color);
1026
- --badge--light-scope-content-color: var(--text--color--dark);
1027
- --badge--dark-scope-content-color: var(--text--color--light);
1028
- --badge--orange-scope-content-color: var(--text--color--light);
1029
- --badge--green-scope-content-color: var(--text--color--light);
1030
- --badge--red-scope-content-color: var(--text--color--light);
1031
- --badge--lilac-scope-content-color: var(--text--color--light);
1032
- --badge--teal-scope-content-color: var(--text--color--light);
1033
- --badge--violet-scope-content-color: var(--text--color--light);
1034
- --badge--navy-scope-content-color: var(--text--color--light);
1035
- --badge--blue-scope-content-color: var(--text--color--light);
1036
- --badge--neutral-scope-content-color: var(--text--color--light);
1037
- --alert--success-heading-color: var(--success-outline-content-color);
1038
- --alert--success-border-color: var(--success-outline-border-color);
1039
- --alert--danger-heading-color: var(--danger-outline-content-color);
1040
- --alert--danger-border-color: var(--danger-outline-border-color);
1041
- --alert--warning-heading-color: var(--warning-outline-content-color);
1042
- --alert--warning-border-color: var(--warning-outline-border-color);
1043
- --alert--info-heading-color: var(--info-outline-content-color);
1044
- --alert--info-border-color: var(--info-outline-border-color);
1045
- --alert-icon--success-color: var(--success-outline-content-color);
1046
- --alert-icon--danger-color: var(--danger-outline-content-color);
1047
- --alert-icon--warning-color: var(--warning-outline-content-color);
1048
- --alert-icon--info-color: var(--info-outline-content-color);
1049
- --alert-badge--danger-border-color: var(--danger-outline-border-color);
1050
- --alert-badge--danger-content-color: var(--danger-soft-content-color--default);
1051
- --alert-badge--danger-background-color: var(--danger-soft-background-color--default);
1052
- --alert-badge--warning-border-color: var(--warning-outline-border-color);
1053
- --alert-badge--warning-content-color: var(--warning-soft-content-color--default);
1054
- --alert-badge--warning-background-color: var(--warning-soft-background-color--default);
1055
- --alert-badge--success-border-color: var(--success-outline-border-color);
1056
- --alert-badge--success-content-color: var(--success-soft-content-color--default);
1057
- --alert-badge--success-background-color: var(--success-soft-background-color--default);
1058
- --alert-badge--info-border-color: var(--info-outline-border-color);
1059
- --alert-badge--info-content-color: var(--info-soft-content-color--default);
1060
- --alert-badge--info-background-color: var(--info-soft-background-color--default);
1061
- --popover--border-color: var(--neutral-outline-border-color);
1062
- --tab--disabled-background-color: var(--neutral-soft-background-color--default);
1063
- --tab--color--pressed: var(--neutral-soft-content-color--pressed);
1064
- --tab--color--hover: var(--neutral-soft-content-color--default);
1065
- --tab--color--default: var(--neutral-soft-content-color--default);
1066
- --tab--background-color--pressed: var(--neutral-soft-background-color--pressed);
1067
- --tab--background-color--hover: var(--neutral-soft-background-color--hover);
1068
- --tab--background-color--default: var(--neutral-soft-background-color--default);
1069
- --link--color--disabled: var(--disabled-plain-content-color);
1070
- --header-navigation--item-background-color--pressed: var(--primary-plain-background-color--pressed);
1071
- --header-navigation--item-background-color--hover: var(--primary-plain-background-color--hover);
1072
- --header-navigation--item-color: var(--heading--color);
1073
- --breadcrumb-item--color: var(--heading--color);
1074
- --time-field--date-segment-background-color--focused: var(--primary-plain-background-color--pressed);
1075
- --switch--handle-color--default: var(--neutral-solid-content-color);
1076
- --switch--track-background-color--selected: var(--success-solid-background-color--default);
1077
- --switch--track-background-color--disabled: var(--disabled-solid-background-color);
1078
- --switch--track-background-color--default: var(--neutral-solid-background-color--default);
1079
- --slider--initial-marker-background-color--disabled: var(--disabled-solid-background-color);
1080
- --slider--initial-marker-background-color--default: var(--primary-solid-background-color--default);
1081
- --slider--thumb-background-color--pressed: var(--primary-solid-background-color--default);
1082
- --slider--thumb-border-color--disabled: var(--disabled-solid-background-color);
1083
- --slider--thumb-border-color--default: var(--primary-solid-background-color--default);
1084
- --slider--track-background-color-fill--disabled: var(--disabled-solid-background-color);
1085
- --slider--track-background-color-fill--default: var(--primary-solid-background-color--default);
1086
- --slider--track-background-color--disabled: var(--disabled-soft-background-color);
1087
- --slider--track-background-color--default: var(--primary-soft-background-color--default);
1088
- --slider--text-color--disabled: var(--disabled-plain-content-color);
1089
- --form-control--content-color--selected: var(--neutral-outline-content-color);
1090
- --form-control--content-color--disabled: var(--disabled-outline-content-color);
1091
- --form-control--content-color--default: var(--neutral-outline-content-color);
1092
- --form-control--background-color--disabled: var(--disabled-outline-background-color);
1093
- --form-control--border-color--selected: var(--neutral-outline-border-color);
1094
- --form-control--border-color--focused: var(--focus--outline-color);
1095
- --form-control--border-color--invalid: var(--danger-outline-border-color);
1096
- --form-control--border-color--disabled: var(--disabled-outline-border-color);
1097
- --form-control--border-color--default: var(--neutral-outline-border-color);
1098
- --calendar--cell-content-color--selected: var(--primary-solid-content-color);
1099
- --calendar--cell-content-color--disabled: var(--disabled-plain-content-color);
1100
- --calendar--cell-background-color--selected: var(--primary-solid-background-color--default);
1101
- --date-picker--date-segment-background-color--focused: var(--primary-plain-background-color--pressed);
1102
- --choice--icon-color--disabled: var(--disabled-outline-content-color);
1103
- --choice--icon-color--default: var(--icon--color);
1104
- --text--color--disabled: var(--disabled-plain-content-color);
1105
- --label--color--disabled: var(--disabled-plain-content-color);
1106
- --illustrated-message--light-heading-color: var(--heading--color-light);
1107
- --illustrated-message--dark-heading-color: var(--heading--color-dark);
1108
- --illustrated-message--primary-heading-color: var(--heading--color);
1109
- --code--default-content-color: var(--neutral-soft-content-color--default);
1110
- --code--default-background-color: var(--neutral-soft-background-color--default);
1111
- --menu-item--disabled-color: var(--disabled-plain-content-color);
1112
- --menu-item--background-color--current: var(--primary-plain-background-color--pressed);
1113
- --menu-item--background-color--hover: var(--primary-plain-background-color--hover);
1114
- --menu-item--icon-color--disabled: var(--disabled-plain-content-color);
1115
- --button--danger-outline-border-color--disabled: var(--disabled-outline-border-color);
1116
- --button--danger-outline-border-color--default: var(--danger-outline-border-color);
1117
- --button--danger-outline-content-color--disabled: var(--disabled-outline-content-color);
1118
- --button--danger-outline-content-color--pressed: var(--danger-outline-border-color);
1119
- --button--danger-outline-content-color--hover: var(--danger-outline-border-color);
1120
- --button--danger-outline-content-color--default: var(--danger-outline-border-color);
1121
- --button--danger-outline-background-color--disabled: var(--disabled-outline-background-color);
1122
- --button--danger-outline-background-color--pressed: var(--danger-outline-background-color--pressed);
1123
- --button--danger-outline-background-color--hover: var(--danger-outline-background-color--hover);
1124
- --button--danger-soft-content-color--disabled: var(--disabled-soft-content-color);
1125
- --button--danger-soft-content-color--pressed: var(--danger-soft-content-color--pressed);
1126
- --button--danger-soft-content-color--hover: var(--danger-soft-content-color--default);
1127
- --button--danger-soft-content-color--default: var(--danger-soft-content-color--default);
1128
- --button--danger-soft-background-color--disabled: var(--disabled-soft-background-color);
1129
- --button--danger-soft-background-color--pressed: var(--danger-soft-background-color--pressed);
1130
- --button--danger-soft-background-color--hover: var(--danger-soft-background-color--hover);
1131
- --button--danger-soft-background-color--default: var(--danger-soft-background-color--default);
1132
- --button--danger-plain-content-color--disabled: var(--disabled-plain-content-color);
1133
- --button--danger-plain-content-color--pressed: var(--danger-plain-content-color);
1134
- --button--danger-plain-content-color--hover: var(--danger-plain-content-color);
1135
- --button--danger-plain-content-color--default: var(--danger-plain-content-color);
1136
- --button--danger-plain-background-color--pressed: var(--danger-plain-background-color--pressed);
1137
- --button--danger-plain-background-color--hover: var(--danger-plain-background-color--hover);
1138
- --button--danger-solid-content-color--disabled: var(--disabled-solid-content-color);
1139
- --button--danger-solid-content-color--pressed: var(--danger-solid-content-color);
1140
- --button--danger-solid-content-color--hover: var(--danger-solid-content-color);
1141
- --button--danger-solid-content-color--default: var(--danger-solid-content-color);
1142
- --button--danger-solid-background-color--disabled: var(--disabled-solid-background-color);
1143
- --button--danger-solid-background-color--pressed: var(--danger-solid-background-color--pressed);
1144
- --button--danger-solid-background-color--hover: var(--danger-solid-background-color--hover);
1145
- --button--danger-solid-background-color--default: var(--danger-solid-background-color--default);
1146
- --button--secondary-outline-border-color--disabled: var(--disabled-outline-border-color);
1147
- --button--secondary-outline-border-color--default: var(--neutral-outline-border-color);
1148
- --button--secondary-outline-content-color--disabled: var(--disabled-outline-content-color);
1149
- --button--secondary-outline-content-color--pressed: var(--neutral-outline-content-color);
1150
- --button--secondary-outline-content-color--hover: var(--neutral-outline-content-color);
1151
- --button--secondary-outline-content-color--default: var(--neutral-outline-content-color);
1152
- --button--secondary-outline-background-color--disabled: var(--disabled-outline-background-color);
1153
- --button--secondary-outline-background-color--pressed: var(--neutral-outline-background-color--pressed);
1154
- --button--secondary-outline-background-color--hover: var(--neutral-outline-background-color--hover);
1155
- --button--secondary-soft-content-color--disabled: var(--disabled-soft-content-color);
1156
- --button--secondary-soft-content-color--pressed: var(--neutral-soft-content-color--pressed);
1157
- --button--secondary-soft-content-color--hover: var(--neutral-soft-content-color--default);
1158
- --button--secondary-soft-content-color--default: var(--neutral-soft-content-color--default);
1159
- --button--secondary-soft-background-color--disabled: var(--disabled-soft-background-color);
1160
- --button--secondary-soft-background-color--pressed: var(--neutral-soft-background-color--pressed);
1161
- --button--secondary-soft-background-color--hover: var(--neutral-soft-background-color--hover);
1162
- --button--secondary-soft-background-color--default: var(--neutral-soft-background-color--default);
1163
- --button--secondary-plain-content-color--disabled: var(--disabled-plain-content-color);
1164
- --button--secondary-plain-content-color--pressed: var(--neutral-plain-content-color);
1165
- --button--secondary-plain-content-color--hover: var(--neutral-plain-content-color);
1166
- --button--secondary-plain-content-color--default: var(--neutral-plain-content-color);
1167
- --button--secondary-plain-background-color--pressed: var(--neutral-plain-background-color--pressed);
1168
- --button--secondary-plain-background-color--hover: var(--neutral-plain-background-color--hover);
1169
- --button--secondary-solid-content-color--disabled: var(--disabled-solid-content-color);
1170
- --button--secondary-solid-content-color--pressed: var(--neutral-solid-content-color);
1171
- --button--secondary-solid-content-color--hover: var(--neutral-solid-content-color);
1172
- --button--secondary-solid-content-color--default: var(--neutral-solid-content-color);
1173
- --button--secondary-solid-background-color--disabled: var(--disabled-solid-background-color);
1174
- --button--secondary-solid-background-color--pressed: var(--neutral-solid-background-color--pressed);
1175
- --button--secondary-solid-background-color--hover: var(--neutral-solid-background-color--hover);
1176
- --button--secondary-solid-background-color--default: var(--neutral-solid-background-color--default);
1177
- --button--primary-outline-border-color--disabled: var(--disabled-outline-border-color);
1178
- --button--primary-outline-border-color--default: var(--primary-outline-border-color);
1179
- --button--primary-outline-content-color--disabled: var(--disabled-outline-content-color);
1180
- --button--primary-outline-content-color--pressed: var(--primary-outline-border-color);
1181
- --button--primary-outline-content-color--hover: var(--primary-outline-border-color);
1182
- --button--primary-outline-content-color--default: var(--primary-outline-border-color);
1183
- --button--primary-outline-background-color--disabled: var(--disabled-outline-background-color);
1184
- --button--primary-outline-background-color--pressed: var(--primary-outline-background-color--pressed);
1185
- --button--primary-outline-background-color--hover: var(--primary-outline-background-color--hover);
1186
- --button--primary-soft-content-color--disabled: var(--disabled-soft-content-color);
1187
- --button--primary-soft-content-color--pressed: var(--primary-soft-content-color--pressed);
1188
- --button--primary-soft-content-color--hover: var(--primary-soft-content-color--default);
1189
- --button--primary-soft-content-color--default: var(--primary-soft-content-color--default);
1190
- --button--primary-soft-background-color--disabled: var(--disabled-soft-background-color);
1191
- --button--primary-soft-background-color--pressed: var(--primary-soft-background-color--pressed);
1192
- --button--primary-soft-background-color--hover: var(--primary-soft-background-color--hover);
1193
- --button--primary-soft-background-color--default: var(--primary-soft-background-color--default);
1194
- --button--primary-plain-content-color--disabled: var(--disabled-plain-content-color);
1195
- --button--primary-plain-content-color--pressed: var(--primary-plain-content-color);
1196
- --button--primary-plain-content-color--hover: var(--primary-plain-content-color);
1197
- --button--primary-plain-content-color--default: var(--primary-plain-content-color);
1198
- --button--primary-plain-background-color--pressed: var(--primary-plain-background-color--pressed);
1199
- --button--primary-plain-background-color--hover: var(--primary-plain-background-color--hover);
1200
- --button--primary-solid-content-color--disabled: var(--disabled-solid-content-color);
1201
- --button--primary-solid-content-color--pressed: var(--primary-solid-content-color);
1202
- --button--primary-solid-content-color--hover: var(--primary-solid-content-color);
1203
- --button--primary-solid-content-color--default: var(--primary-solid-content-color);
1204
- --button--primary-solid-background-color--disabled: var(--disabled-solid-background-color);
1205
- --button--primary-solid-background-color--pressed: var(--primary-solid-background-color--pressed);
1206
- --button--primary-solid-background-color--hover: var(--primary-solid-background-color--hover);
1207
- --button--primary-solid-background-color--default: var(--primary-solid-background-color--default);
1208
- --button--accent-outline-border-color--disabled: var(--disabled-outline-border-color);
1209
- --button--accent-outline-border-color--default: var(--success-outline-border-color);
1210
- --button--accent-outline-content-color--disabled: var(--disabled-outline-content-color);
1211
- --button--accent-outline-content-color--pressed: var(--success-outline-border-color);
1212
- --button--accent-outline-content-color--hover: var(--success-outline-border-color);
1213
- --button--accent-outline-content-color--default: var(--success-outline-border-color);
1214
- --button--accent-outline-background-color--disabled: var(--disabled-outline-background-color);
1215
- --button--accent-outline-background-color--pressed: var(--success-outline-background-color--pressed);
1216
- --button--accent-outline-background-color--hover: var(--success-outline-background-color--hover);
1217
- --button--accent-soft-content-color--disabled: var(--disabled-soft-content-color);
1218
- --button--accent-soft-content-color--pressed: var(--success-soft-content-color--pressed);
1219
- --button--accent-soft-content-color--hover: var(--success-soft-content-color--default);
1220
- --button--accent-soft-content-color--default: var(--success-soft-content-color--default);
1221
- --button--accent-soft-background-color--disabled: var(--disabled-soft-background-color);
1222
- --button--accent-soft-background-color--pressed: var(--success-soft-background-color--pressed);
1223
- --button--accent-soft-background-color--hover: var(--success-soft-background-color--hover);
1224
- --button--accent-soft-background-color--default: var(--success-soft-background-color--default);
1225
- --button--accent-plain-content-color--disabled: var(--disabled-plain-content-color);
1226
- --button--accent-plain-content-color--pressed: var(--success-plain-content-color);
1227
- --button--accent-plain-content-color--hover: var(--success-plain-content-color);
1228
- --button--accent-plain-content-color--default: var(--success-plain-content-color);
1229
- --button--accent-plain-background-color--pressed: var(--success-plain-background-color--pressed);
1230
- --button--accent-plain-background-color--hover: var(--success-plain-background-color--hover);
1231
- --button--accent-solid-content-color--disabled: var(--disabled-solid-content-color);
1232
- --button--accent-solid-content-color--pressed: var(--success-solid-content-color);
1233
- --button--accent-solid-content-color--hover: var(--success-solid-content-color);
1234
- --button--accent-solid-content-color--default: var(--success-solid-content-color);
1235
- --button--accent-solid-background-color--disabled: var(--disabled-solid-background-color);
1236
- --button--accent-solid-background-color--pressed: var(--success-solid-background-color--pressed);
1237
- --button--accent-solid-background-color--hover: var(--success-solid-background-color--hover);
7
+ --image-button--brightness--pressed: 50%;
8
+ --corner-radius--round: 50%;
9
+ --border-style--default: solid;
10
+ --dark--color--100: rgb(0 0 0 / 12.5%);
11
+ --dark--color--200: rgb(0 0 0 / 25%);
12
+ --dark--color--300: rgb(0 0 0 / 37.5%);
13
+ --dark--color--400: rgb(0 0 0 / 50%);
14
+ --dark--color--500: rgb(0 0 0 / 62.5%);
15
+ --dark--color--600: rgb(0 0 0 / 75%);
16
+ --dark--color--700: rgb(0 0 0 / 87.5%);
17
+ --dark--color--800: rgb(0 0 0 / 100%);
18
+ --light--color--100: rgb(255 255 255 / 12.5%);
19
+ --light--color--200: rgb(255 255 255 / 25%);
20
+ --light--color--300: rgb(255 255 255 / 37.5%);
21
+ --light--color--400: rgb(255 255 255 / 50%);
22
+ --light--color--500: rgb(255 255 255 / 62.5%);
23
+ --light--color--600: rgb(255 255 255 / 75%);
24
+ --light--color--700: rgb(255 255 255 / 87.5%);
25
+ --light--color--800: rgb(255 255 255 / 100%);
26
+ --color--gray--100: #FFFFFF;
27
+ --color--gray--200: #FDFDFD;
28
+ --color--gray--300: #F8F8F8;
29
+ --color--gray--400: #E6E6E6;
30
+ --color--gray--500: #D5D5D5;
31
+ --color--gray--600: #B1B1B1;
32
+ --color--gray--700: #909090;
33
+ --color--gray--800: #6D6D6D;
34
+ --color--gray--900: #464646;
35
+ --color--gray--1000: #222222;
36
+ --color--gray--1100: #000000;
37
+ --color--hosting-blue--100: #F0F5FF;
38
+ --color--hosting-blue--200: #E0EBFF;
39
+ --color--hosting-blue--300: #ABC6FF;
40
+ --color--hosting-blue--400: #85AFFF;
41
+ --color--hosting-blue--500: #6197FF;
42
+ --color--hosting-blue--600: #3D80FF;
43
+ --color--hosting-blue--700: #1A68FF;
44
+ --color--hosting-blue--800: #0054F5;
45
+ --color--hosting-blue--900: #003FB8;
46
+ --color--hosting-blue--1000: #002A7B;
47
+ --color--hosting-blue--1100: #00205C;
48
+ --color--amaranth-red--100: #FDF0F3;
49
+ --color--amaranth-red--200: #FBE0E6;
50
+ --color--amaranth-red--300: #F7C1CC;
51
+ --color--amaranth-red--400: #F2A2B3;
52
+ --color--amaranth-red--500: #EE8299;
53
+ --color--amaranth-red--600: #EA637F;
54
+ --color--amaranth-red--700: #E54366;
55
+ --color--amaranth-red--800: #E1244C;
56
+ --color--amaranth-red--900: #B4193A;
57
+ --color--amaranth-red--1000: #83122A;
58
+ --color--amaranth-red--1100: #6A0F22;
59
+ --color--royal-orange--100: #FFF4EB;
60
+ --color--royal-orange--200: #FFEBDC;
61
+ --color--royal-orange--300: #FFD9BD;
62
+ --color--royal-orange--400: #FFC89F;
63
+ --color--royal-orange--500: #FFA562;
64
+ --color--royal-orange--600: #FF9343;
65
+ --color--royal-orange--700: #FF8225;
66
+ --color--royal-orange--800: #F56800;
67
+ --color--royal-orange--900: #C25200;
68
+ --color--royal-orange--1000: #8F3D00;
69
+ --color--royal-orange--1100: #763200;
70
+ --color--espelkamp-green--100: #DCFFF4;
71
+ --color--espelkamp-green--200: #C0FFEB;
72
+ --color--espelkamp-green--300: #87FFDA;
73
+ --color--espelkamp-green--400: #4FFFC9;
74
+ --color--espelkamp-green--500: #17FFB8;
75
+ --color--espelkamp-green--600: #00DE9A;
76
+ --color--espelkamp-green--700: #00A673;
77
+ --color--espelkamp-green--800: #00825B;
78
+ --color--espelkamp-green--900: #005F42;
79
+ --color--espelkamp-green--1000: #003B29;
80
+ --color--espelkamp-green--1100: #00291C;
81
+ --color--soft-contrast-violet--100: #F4F3FE;
82
+ --color--soft-contrast-violet--200: #EAE7FD;
83
+ --color--soft-contrast-violet--300: #D6D0FA;
84
+ --color--soft-contrast-violet--400: #C2B9F8;
85
+ --color--soft-contrast-violet--500: #AEA2F5;
86
+ --color--soft-contrast-violet--600: #998BF3;
87
+ --color--soft-contrast-violet--700: #8574F0;
88
+ --color--soft-contrast-violet--800: #715DEE;
89
+ --color--soft-contrast-violet--900: #5d4abf;
90
+ --color--soft-contrast-violet--1000: #483b9f;
91
+ --color--soft-contrast-violet--1100: #302a6f;
92
+ --color--mittwald-navy--100: #E4E7F6;
93
+ --color--mittwald-navy--200: #C8CFEE;
94
+ --color--mittwald-navy--300: #A5B0E2;
95
+ --color--mittwald-navy--400: #8291D7;
96
+ --color--mittwald-navy--500: #5F73CC;
97
+ --color--mittwald-navy--600: #3D55C1;
98
+ --color--mittwald-navy--700: #32459E;
99
+ --color--mittwald-navy--800: #27367B;
100
+ --color--mittwald-navy--900: #1D285C;
101
+ --color--mittwald-navy--1000: #131B3D;
102
+ --color--mittwald-navy--1100: #0E142E;
103
+ --color--bright-lilac--100: #f9e9ff;
104
+ --color--bright-lilac--200: #f6dfff;
105
+ --color--bright-lilac--300: #f1caff;
106
+ --color--bright-lilac--400: #ebb6ff;
107
+ --color--bright-lilac--500: #e6a1ff;
108
+ --color--bright-lilac--600: #e08dff;
109
+ --color--bright-lilac--700: #ce4bff;
110
+ --color--bright-lilac--800: #bc08ff;
111
+ --color--bright-lilac--900: #9000c5;
112
+ --color--bright-lilac--1000: #5f0083;
113
+ --color--bright-lilac--1100: #470062;
114
+ --color--super-teal--100: #ebfdff;
115
+ --color--super-teal--200: #cffaff;
116
+ --color--super-teal--300: #96f3ff;
117
+ --color--super-teal--400: #5eedff;
118
+ --color--super-teal--500: #26e7ff;
119
+ --color--super-teal--600: #00d3ed;
120
+ --color--super-teal--700: #00a1b5;
121
+ --color--super-teal--800: #008696;
122
+ --color--super-teal--900: #006b78;
123
+ --color--super-teal--1000: #004f59;
124
+ --color--super-teal--1100: #00424a;
125
+ --color--transparent: transparent;
126
+ --avatar--size--m: 2.5rem;
127
+ --code--default-syntax-color-addition: #397300;
128
+ --code--default-syntax-color-built-in: #397300;
129
+ --code--default-syntax-color-bullet: #397300;
130
+ --code--default-syntax-color-code: #397300;
131
+ --code--default-syntax-color-comment: #666666;
132
+ --code--default-syntax-color-deletion: #880000;
133
+ --code--default-syntax-color-link: #a94747;
134
+ --code--default-syntax-color-literal: #4c6d3b;
135
+ --code--default-syntax-color-meta: #1e6e94;
136
+ --code--default-syntax-color-meta-string: #326d8b;
137
+ --code--default-syntax-color-number: #880000;
138
+ --code--default-syntax-color-quote: #880000;
139
+ --code--default-syntax-color-regexp: #a94747;
140
+ --code--default-syntax-color-section: #880000;
141
+ --code--default-syntax-color-selector-attr: #a94747;
142
+ --code--default-syntax-color-selector-class: #880000;
143
+ --code--default-syntax-color-selector-id: #880000;
144
+ --code--default-syntax-color-selector-pseudo: #a94747;
145
+ --code--default-syntax-color-string: #880000;
146
+ --code--default-syntax-color-symbol: #a94747;
147
+ --code--default-syntax-color-template-tag: #880000;
148
+ --code--default-syntax-color-template-variable: #a94747;
149
+ --code--default-syntax-color-title: #880000;
150
+ --code--default-syntax-color-type: #880000;
151
+ --code--default-syntax-color-variable: #a94747;
152
+ --code--light-syntax-color-addition: #68d100;
153
+ --code--light-syntax-color-built-in: #68d100;
154
+ --code--light-syntax-color-bullet: #68d100;
155
+ --code--light-syntax-color-code: #68d100;
156
+ --code--light-syntax-color-comment: #b8b8b8;
157
+ --code--light-syntax-color-deletion: #ff9e9e;
158
+ --code--light-syntax-color-link: #dcacac;
159
+ --code--light-syntax-color-literal: #9fc28e;
160
+ --code--light-syntax-color-meta: #77c0e4;
161
+ --code--light-syntax-color-meta-string: #8ebfd7;
162
+ --code--light-syntax-color-number: #ff9e9e;
163
+ --code--light-syntax-color-pseudo: #dcacac;
164
+ --code--light-syntax-color-quote: #ff9e9e;
165
+ --code--light-syntax-color-regexp: #dcacac;
166
+ --code--light-syntax-color-section: #ff9e9e;
167
+ --code--light-syntax-color-selector-attr: #dcacac;
168
+ --code--light-syntax-color-selector-class: #ff9e9e;
169
+ --code--light-syntax-color-selector-id: #ff9e9e;
170
+ --code--light-syntax-color-string: #ff9e9e;
171
+ --code--light-syntax-color-symbol: #dcacac;
172
+ --code--light-syntax-color-template-tag: #ff9e9e;
173
+ --code--light-syntax-color-template-variable: #dcacac;
174
+ --code--light-syntax-color-title: #ff9e9e;
175
+ --code--light-syntax-color-type: #ff9e9e;
176
+ --code--light-syntax-color-variable: #dcacac;
177
+ --code--dark-syntax-color-addition: #306100;
178
+ --code--dark-syntax-color-built-in: #306100;
179
+ --code--dark-syntax-color-bullet: #306100;
180
+ --code--dark-syntax-color-code: #306100;
181
+ --code--dark-syntax-color-comment: #575757;
182
+ --code--dark-syntax-color-deletion: #880000;
183
+ --code--dark-syntax-color-link: #8c3b3b;
184
+ --code--dark-syntax-color-literal: #405d32;
185
+ --code--dark-syntax-color-meta: #195b7b;
186
+ --code--dark-syntax-color-meta-string: #2a5b74;
187
+ --code--dark-syntax-color-number: #880000;
188
+ --code--dark-syntax-color-pseudo: #8c3b3b;
189
+ --code--dark-syntax-color-quote: #880000;
190
+ --code--dark-syntax-color-regexp: #8c3b3b;
191
+ --code--dark-syntax-color-section: #880000;
192
+ --code--dark-syntax-color-selector-attr: #8c3b3b;
193
+ --code--dark-syntax-color-selector-class: #880000;
194
+ --code--dark-syntax-color-selector-id: #880000;
195
+ --code--dark-syntax-color-string: #880000;
196
+ --code--dark-syntax-color-symbol: #8c3b3b;
197
+ --code--dark-syntax-color-template-tag: #880000;
198
+ --code--dark-syntax-color-template-variable: #8c3b3b;
199
+ --code--dark-syntax-color-title: #880000;
200
+ --code--dark-syntax-color-type: #880000;
201
+ --code--dark-syntax-color-variable: #8c3b3b;
202
+ --icon--size--s: 1rem;
203
+ --icon--size--m: 1.5rem;
204
+ --icon--size--l: 4rem;
205
+ --text--max-width: 780px;
206
+ --font-weight--normal: normal;
207
+ --font-weight--bold: bold;
208
+ --line-height--default: 1.5;
209
+ --font-size-text--s: 0.875rem;
210
+ --font-size-text--m: 1rem;
211
+ --font-size-heading--xs: 1rem;
212
+ --font-size-heading--s: 1.125rem;
213
+ --font-size-heading--m: 1.25rem;
214
+ --font-size-heading--l: 1.5rem;
215
+ --font-size-heading--xl: 2rem;
216
+ --font-size-heading--xxl: 2.625rem;
217
+ --calendar--cell-size: 2.25rem;
218
+ --switch--track-height: 1.5rem;
219
+ --switch--track-width: 2.75rem;
220
+ --switch--track-corner-radius: 0.75rem;
221
+ --switch--handle-size: 1.25rem;
222
+ --contextual-help--max-width: 500px;
223
+ --modal--size--s: 660px;
224
+ --modal--size--m: 900px;
225
+ --popover--min-width: 200px;
226
+ --tooltip--max-width: 300px;
227
+ --size-rem--xxxs: 0.0625rem;
228
+ --size-rem--xxs: 0.125rem;
229
+ --size-rem--xs: 0.25rem;
230
+ --size-rem--s: 0.5rem;
231
+ --size-rem--m: 1rem;
232
+ --size-rem--l: 1.5rem;
233
+ --size-rem--xl: 2rem;
234
+ --size-rem--xxl: 4rem;
235
+ --size-px--xxxs: 1px;
236
+ --size-px--xxs: 2px;
237
+ --size-px--xs: 4px;
238
+ --size-px--s: 8px;
239
+ --size-px--m: 16px;
240
+ --size-px--l: 24px;
241
+ --size-px--xl: 32px;
242
+ --size-px--xxl: 64px;
243
+ --counter-badge--font-size: 0.625rem;
244
+ --counter-badge--height: 1.25rem;
245
+ --counter-badge--height-empty: 0.75rem;
246
+ --loading-spinner--transition-duration: 2000ms;
247
+ --notification--width: 355px;
248
+ --progress-bar--height-s: 0.375rem;
249
+ --transition--duration--default: 200ms;
250
+ --transition--duration--slow: 300ms;
251
+ --action-group--spacing--m: var(--size-px--m);
252
+ --action-group--spacing--s: var(--size-px--s);
253
+ --button--padding-x: var(--size-px--m);
254
+ --button--padding-y: var(--size-px--s);
255
+ --button--padding-icon-only: var(--size-px--s);
256
+ --button--spacing: var(--size-rem--s);
257
+ --button--border-style: var(--border-style--default);
258
+ --button--padding-s-icon-only: var(--size-px--xs);
259
+ --button--padding-s-x: var(--size-px--s);
260
+ --button--padding-s-y: var(--size-px--xs);
261
+ --button--spacing-s: var(--size-rem--xs);
262
+ --button--font-size-s: var(--font-size-text--s);
263
+ --button--line-height-s: var(--size-rem--m);
264
+ --context-menu--padding: var(--size-px--s);
265
+ --image-button--hover-icon-color: var(--color--gray--100);
266
+ --menu--item-to-item-spacing: var(--size-px--xs);
267
+ --menu--group-to-group-spacing: var(--size-px--m);
268
+ --menu--label-to-group-spacing: var(--size-px--xs);
269
+ --menu--separator-to-item-spacing: var(--size-px--s);
270
+ --menu-item--font-weight--current: var(--font-weight--bold);
271
+ --menu-item--padding-x: var(--size-px--s);
272
+ --menu-item--padding-y: var(--size-px--xs);
273
+ --menu-item--icon-to-text-spacing: var(--size-rem--s);
274
+ --menu-item--background-color--default: var(--color--transparent);
275
+ --corner-radius--default: var(--size-px--xs);
276
+ --border-width--100: var(--size-px--xxxs);
277
+ --border-width--200: var(--size-px--xxs);
278
+ --border-width--300: var(--size-px--xs);
279
+ --border-width--400: var(--size-px--s);
280
+ --primary--color--100: var(--color--hosting-blue--100);
281
+ --primary--color--200: var(--color--hosting-blue--200);
282
+ --primary--color--300: var(--color--hosting-blue--300);
283
+ --primary--color--400: var(--color--hosting-blue--400);
284
+ --primary--color--500: var(--color--hosting-blue--500);
285
+ --primary--color--600: var(--color--hosting-blue--600);
286
+ --primary--color--700: var(--color--hosting-blue--700);
287
+ --primary--color--800: var(--color--hosting-blue--800);
288
+ --primary--color--900: var(--color--hosting-blue--900);
289
+ --primary--color--1000: var(--color--hosting-blue--1000);
290
+ --primary--color--1100: var(--color--hosting-blue--1100);
291
+ --info--color--100: var(--color--hosting-blue--100);
292
+ --info--color--200: var(--color--hosting-blue--200);
293
+ --info--color--300: var(--color--hosting-blue--300);
294
+ --info--color--400: var(--color--hosting-blue--400);
295
+ --info--color--500: var(--color--hosting-blue--500);
296
+ --info--color--600: var(--color--hosting-blue--600);
297
+ --info--color--700: var(--color--hosting-blue--700);
298
+ --info--color--800: var(--color--hosting-blue--800);
299
+ --info--color--900: var(--color--hosting-blue--900);
300
+ --info--color--1000: var(--color--hosting-blue--1000);
301
+ --info--color--1100: var(--color--hosting-blue--1100);
302
+ --success--color--100: var(--color--espelkamp-green--100);
303
+ --success--color--200: var(--color--espelkamp-green--200);
304
+ --success--color--300: var(--color--espelkamp-green--300);
305
+ --success--color--400: var(--color--espelkamp-green--400);
306
+ --success--color--500: var(--color--espelkamp-green--500);
307
+ --success--color--600: var(--color--espelkamp-green--600);
308
+ --success--color--700: var(--color--espelkamp-green--700);
309
+ --success--color--800: var(--color--espelkamp-green--800);
310
+ --success--color--900: var(--color--espelkamp-green--900);
311
+ --success--color--1000: var(--color--espelkamp-green--1000);
312
+ --success--color--1100: var(--color--espelkamp-green--1100);
313
+ --neutral--color--100: var(--color--gray--100);
314
+ --neutral--color--200: var(--color--gray--200);
315
+ --neutral--color--300: var(--color--gray--300);
316
+ --neutral--color--400: var(--color--gray--400);
317
+ --neutral--color--500: var(--color--gray--500);
318
+ --neutral--color--600: var(--color--gray--600);
319
+ --neutral--color--700: var(--color--gray--700);
320
+ --neutral--color--800: var(--color--gray--800);
321
+ --neutral--color--900: var(--color--gray--900);
322
+ --neutral--color--1000: var(--color--gray--1000);
323
+ --neutral--color--1100: var(--color--gray--1100);
324
+ --danger--color--100: var(--color--amaranth-red--100);
325
+ --danger--color--200: var(--color--amaranth-red--200);
326
+ --danger--color--300: var(--color--amaranth-red--300);
327
+ --danger--color--400: var(--color--amaranth-red--400);
328
+ --danger--color--500: var(--color--amaranth-red--500);
329
+ --danger--color--600: var(--color--amaranth-red--600);
330
+ --danger--color--700: var(--color--amaranth-red--700);
331
+ --danger--color--800: var(--color--amaranth-red--800);
332
+ --danger--color--900: var(--color--amaranth-red--900);
333
+ --danger--color--1000: var(--color--amaranth-red--1000);
334
+ --danger--color--1100: var(--color--amaranth-red--1100);
335
+ --warning--color--100: var(--color--royal-orange--100);
336
+ --warning--color--200: var(--color--royal-orange--200);
337
+ --warning--color--300: var(--color--royal-orange--300);
338
+ --warning--color--400: var(--color--royal-orange--400);
339
+ --warning--color--500: var(--color--royal-orange--500);
340
+ --warning--color--600: var(--color--royal-orange--600);
341
+ --warning--color--700: var(--color--royal-orange--700);
342
+ --warning--color--800: var(--color--royal-orange--800);
343
+ --warning--color--900: var(--color--royal-orange--900);
344
+ --warning--color--1000: var(--color--royal-orange--1000);
345
+ --warning--color--1100: var(--color--royal-orange--1100);
346
+ --primary-plain-background-color--default: var(--color--transparent);
347
+ --primary-outline-background-color--default: var(--color--transparent);
348
+ --danger-plain-background-color--default: var(--color--transparent);
349
+ --danger-outline-background-color--default: var(--color--transparent);
350
+ --info-outline-background-color--default: var(--color--transparent);
351
+ --info-plain-background-color--default: var(--color--transparent);
352
+ --success-plain-background-color--default: var(--color--transparent);
353
+ --success-outline-background-color--default: var(--color--transparent);
354
+ --warning-outline-background-color--default: var(--color--transparent);
355
+ --warning-plain-background-color--default: var(--color--transparent);
356
+ --neutral-plain-background-color--default: var(--color--transparent);
357
+ --neutral-outline-background-color--default: var(--color--transparent);
358
+ --disabled-solid-dark-background-color: var(--dark--color--300);
359
+ --disabled-solid-dark-content-color: var(--light--color--300);
360
+ --disabled-solid-light-background-color: var(--light--color--300);
361
+ --disabled-solid-light-content-color: var(--dark--color--300);
362
+ --disabled-plain-background-color: var(--color--transparent);
363
+ --disabled-plain-dark-content-color: var(--dark--color--300);
364
+ --disabled-plain-light-content-color: var(--light--color--300);
365
+ --disabled-outline-dark-background-color: var(--color--transparent);
366
+ --disabled-outline-dark-border-color: var(--dark--color--300);
367
+ --disabled-outline-dark-content-color: var(--dark--color--300);
368
+ --disabled-outline-light-background-color: var(--color--transparent);
369
+ --disabled-outline-light-border-color: var(--light--color--300);
370
+ --disabled-outline-light-content-color: var(--light--color--300);
371
+ --disabled-soft-dark-background-color: var(--dark--color--100);
372
+ --disabled-soft-dark-content-color: var(--dark--color--200);
373
+ --disabled-soft-light-background-color: var(--light--color--100);
374
+ --disabled-soft-light-content-color: var(--light--color--200);
375
+ --dark-solid-background-color--default: var(--dark--color--800);
376
+ --dark-solid-background-color--hover: var(--dark--color--700);
377
+ --dark-solid-background-color--pressed: var(--dark--color--600);
378
+ --dark-solid-content-color: var(--light--color--800);
379
+ --dark-soft-background-color--default: var(--dark--color--100);
380
+ --dark-soft-background-color--hover: var(--dark--color--200);
381
+ --dark-soft-background-color--pressed: var(--dark--color--300);
382
+ --dark-soft-content-color: var(--dark--color--800);
383
+ --dark-plain-background-color--default: var(--color--transparent);
384
+ --dark-plain-background-color--hover: var(--dark--color--100);
385
+ --dark-plain-background-color--pressed: var(--dark--color--200);
386
+ --dark-plain-content-color: var(--dark--color--800);
387
+ --dark-outline-background-color--default: var(--color--transparent);
388
+ --dark-outline-background-color--hover: var(--dark--color--100);
389
+ --dark-outline-background-color--pressed: var(--dark--color--200);
390
+ --dark-outline-border-color: var(--dark--color--700);
391
+ --dark-outline-content-color: var(--dark--color--800);
392
+ --light-solid-background-color--default: var(--light--color--800);
393
+ --light-solid-background-color--hover: var(--light--color--700);
394
+ --light-solid-background-color--pressed: var(--light--color--600);
395
+ --light-solid-content-color: var(--dark--color--800);
396
+ --light-soft-background-color--default: var(--light--color--100);
397
+ --light-soft-background-color--hover: var(--light--color--200);
398
+ --light-soft-background-color--pressed: var(--light--color--300);
399
+ --light-soft-content-color: var(--light--color--800);
400
+ --light-plain-background-color--default: var(--color--transparent);
401
+ --light-plain-background-color--hover: var(--light--color--100);
402
+ --light-plain-background-color--pressed: var(--light--color--200);
403
+ --light-plain-content-color: var(--light--color--800);
404
+ --light-outline-background-color--default: var(--color--transparent);
405
+ --light-outline-background-color--hover: var(--light--color--100);
406
+ --light-outline-background-color--pressed: var(--light--color--200);
407
+ --light-outline-border-color: var(--light--color--800);
408
+ --light-outline-content-color: var(--light--color--700);
409
+ --avatar--size--xs: var(--size-rem--l);
410
+ --avatar--size--s: var(--size-rem--xl);
411
+ --avatar--size--l: var(--size-rem--xxl);
412
+ --code--font-size: var(--font-size-text--s);
413
+ --code--padding-x: var(--size-px--xs);
414
+ --code--padding: var(--size-px--m);
415
+ --code--spacing: var(--size-px--m);
416
+ --decorative--blue-background-color: var(--color--hosting-blue--200);
417
+ --decorative--blue-content-accent-color: var(--color--hosting-blue--800);
418
+ --decorative--blue-content-color: var(--color--hosting-blue--1000);
419
+ --decorative--teal-background-color: var(--color--super-teal--200);
420
+ --decorative--teal-content-accent-color: var(--color--super-teal--800);
421
+ --decorative--teal-content-color: var(--color--super-teal--1000);
422
+ --decorative--green-background-color: var(--color--espelkamp-green--200);
423
+ --decorative--green-content-accent-color: var(--color--espelkamp-green--800);
424
+ --decorative--green-content-color: var(--color--espelkamp-green--1000);
425
+ --decorative--violet-background-color: var(--color--soft-contrast-violet--200);
426
+ --decorative--violet-content-accent-color: var(--color--soft-contrast-violet--800);
427
+ --decorative--violet-content-color: var(--color--soft-contrast-violet--1000);
428
+ --decorative--lilac-background-color: var(--color--bright-lilac--200);
429
+ --decorative--lilac-content-accent-color: var(--color--bright-lilac--800);
430
+ --decorative--lilac-content-color: var(--color--bright-lilac--1000);
431
+ --decorative--disabled-background-color: var(--color--gray--300);
432
+ --decorative--disabled-content-accent-color: var(--color--gray--500);
433
+ --decorative--disabled-content-color: var(--color--gray--600);
434
+ --heading--icon-to-text-spacing: var(--size-rem--s);
435
+ --heading--font-weight: var(--font-weight--bold);
436
+ --illustrated-message--padding: var(--size-px--m);
437
+ --illustrated-message--spacing: var(--size-rem--m);
438
+ --initials--font-weight: var(--font-weight--bold);
439
+ --label--font-size: var(--font-size-text--s);
440
+ --label--font-weight: var(--font-weight--bold);
441
+ --label--spacing: var(--size-rem--xs);
442
+ --labeled-value--label-to-value-spacing: var(--size-rem--xxs);
443
+ --labeled-value--value-to-action-spacing: var(--size-rem--xs);
444
+ --markdown--spacing: var(--size-rem--m);
445
+ --message--padding-y: var(--size-px--s);
446
+ --message--padding-x: var(--size-px--m);
447
+ --message--spacing-y: var(--size-rem--s);
448
+ --message--spacing-x: var(--size-rem--m);
449
+ --message--background-color-responder: var(--color--gray--400);
450
+ --message--background-color-sender: var(--color--hosting-blue--200);
451
+ --focus--outline-offset: var(--size-px--xxs);
452
+ --line-height--m: calc(var(--font-size-text--m) * 1.5);
453
+ --line-height--s: calc(var(--font-size-text--s) * 1.5);
454
+ --font-size-text--default: var(--font-size-text--m);
455
+ --date-picker--date-segment-corner-radius: var(--size-px--xs);
456
+ --calendar--spacing: var(--size-rem--xs);
457
+ --calendar--cell-corner-radius: var(--corner-radius--round);
458
+ --calendar--cell-font-size: var(--font-size-text--s);
459
+ --calendar--header-cell-font-weight: var(--font-weight--bold);
460
+ --field-description--font-size: var(--font-size-text--s);
461
+ --field-error--font-size: var(--font-size-text--s);
462
+ --field-error--spacing: var(--size-rem--xs);
463
+ --form-control--label-to-control-spacing: var(--size-rem--xxs);
464
+ --form-control--control-to-info-spacing: var(--size-rem--xs);
465
+ --form-control--spacing-x: var(--size-rem--s);
466
+ --form-control--spacing-y: var(--size-rem--xs);
467
+ --form-control--padding-x: var(--size-px--m);
468
+ --form-control--padding-y: var(--size-px--s);
469
+ --form-control--border-style: var(--border-style--default);
470
+ --segmented-button--text-to-text-spacing: var(--size-rem--xs);
471
+ --slider--value-font-weight: var(--font-weight--bold);
472
+ --slider--value-to-label-spacing: var(--size-rem--xs);
473
+ --slider--text-to-track-spacing: var(--size-rem--xs);
474
+ --slider--track-height: var(--size-rem--xs);
475
+ --slider--thumb-border-width: var(--size-rem--xs);
476
+ --slider--thumb-border-style: var(--border-style--default);
477
+ --slider--thumb-corner-radius: var(--corner-radius--round);
478
+ --slider--thumb-size: var(--size-rem--l);
479
+ --slider--initial-marker-height: var(--size-rem--m);
480
+ --slider--initial-marker-width: var(--size-rem--xs);
481
+ --switch--label-to-track-spacing: var(--size-rem--s);
482
+ --switch--track-padding: var(--size-rem--xxs);
483
+ --time-field--date-segment-corner-radius: var(--size-px--xs);
484
+ --breadcrumb-item--padding-x: var(--size-px--xs);
485
+ --breadcrumb-item--font-size: var(--font-size-text--s);
486
+ --breadcrumb-item--font-weight--default: var(--font-weight--normal);
487
+ --breadcrumb-item--font-weight--current: var(--font-weight--bold);
488
+ --header-navigation--item-to-item-spacing: var(--size-rem--m);
489
+ --header-navigation--item-padding: var(--size-px--s);
490
+ --header-navigation--item-font-weight-current: var(--font-weight--bold);
491
+ --link--font-size: var(--font-size-text--s);
492
+ --link--font-weight: var(--font-weight--bold);
493
+ --link--text-to-icon-spacing: var(--size-rem--xs);
494
+ --link--color-dark--default: var(--dark--color--800);
495
+ --link--color-dark--hover: var(--dark--color--700);
496
+ --link--color-dark--pressed: var(--dark--color--600);
497
+ --link--color-light--default: var(--light--color--800);
498
+ --link--color-light--hover: var(--light--color--700);
499
+ --link--color-light--pressed: var(--light--color--600);
500
+ --tab--padding-y: var(--size-px--m);
501
+ --tab--padding-x: var(--size-px--l);
502
+ --tab--font-weight--selected: var(--font-weight--bold);
503
+ --tab--text-to-status-spacing: var(--size-rem--s);
504
+ --tab-panel--padding: var(--size-px--xl);
505
+ --contextual-help--content-to-content-spacing: var(--size-rem--s);
506
+ --light-box--overlay-background-color: var(--dark--color--600);
507
+ --light-box--max-width: calc(100dvw - var(--size-px--l));
508
+ --light-box--max-height: calc(100dvh - var(--size-px--l));
509
+ --light-box--spacing: var(--size-px--s);
510
+ --modal--padding: var(--size-px--l);
511
+ --modal--padding-bottom: var(--size-px--xl);
512
+ --modal--action-group-padding: var(--size-rem--l);
513
+ --modal--action-group-border-style: var(--border-style--default);
514
+ --modal--off-canvas-padding-y: var(--size-px--s);
515
+ --modal--off-canvas-max-width: calc(100vw - var(--size-px--m));
516
+ --overlay--background-color: var(--dark--color--200);
517
+ --popover--padding: var(--size-px--m);
518
+ --popover--border-style: var(--border-style--default);
519
+ --popover--popover-to-trigger-spacing: var(--size-px--m);
520
+ --popover--tip-height: var(--size-px--s);
521
+ --popover--tip-width: var(--size-px--m);
522
+ --tooltip--padding-x: var(--size-px--s);
523
+ --tooltip--padding-y: var(--size-px--xs);
524
+ --tooltip--font-size: var(--font-size-text--s);
525
+ --tooltip--tooltip-to-content-spacing: var(--size-px--s);
526
+ --tooltip--arrow-size: var(--size-px--s);
527
+ --shadow--content: rgba(0, 0, 0, 0.1) 0 var(--size-px--xs) var(--size-px--s);
528
+ --shadow--overlay: rgba(0, 0, 0, 0.14) 0 var(--size-px--m) var(--size-px--l);
529
+ --alert-badge--icon-to-text-spacing: var(--size-rem--xs);
530
+ --alert--padding: var(--size-px--m);
531
+ --alert--border-style: var(--border-style--default);
532
+ --alert--heading-to-content-spacing: var(--size-rem--xs);
533
+ --alert--content-to-content-spacing: var(--size-rem--s);
534
+ --alert--font-size-heading: var(--font-size-text--m);
535
+ --badge--font-size: var(--font-size-text--s);
536
+ --badge--font-weight: var(--font-weight--bold);
537
+ --badge--line-height: var(--size-rem--m);
538
+ --badge--corner-radius: var(--size-rem--m);
539
+ --badge--border-style: var(--border-style--default);
540
+ --badge--padding-y: var(--size-rem--xs);
541
+ --badge--padding-x: var(--size-rem--s);
542
+ --badge--content-to-content-spacing: var(--size-rem--xs);
543
+ --badge--neutral-border-color: var(--color--gray--800);
544
+ --badge--neutral-background-color--default: var(--color--gray--300);
545
+ --badge--neutral-background-color--hover: var(--color--gray--400);
546
+ --badge--neutral-background-color--pressed: var(--color--gray--500);
547
+ --badge--neutral-content-color--default: var(--color--gray--900);
548
+ --badge--neutral-content-color--hover: var(--color--gray--900);
549
+ --badge--neutral-content-color--pressed: var(--color--gray--1000);
550
+ --badge--neutral-scope-background-color: var(--color--gray--800);
551
+ --badge--blue-border-color: var(--color--hosting-blue--800);
552
+ --badge--blue-background-color--default: var(--color--hosting-blue--100);
553
+ --badge--blue-background-color--hover: var(--color--hosting-blue--200);
554
+ --badge--blue-background-color--pressed: var(--color--hosting-blue--300);
555
+ --badge--blue-content-color--default: var(--color--hosting-blue--900);
556
+ --badge--blue-content-color--hover: var(--color--hosting-blue--900);
557
+ --badge--blue-content-color--pressed: var(--color--hosting-blue--1000);
558
+ --badge--blue-scope-background-color: var(--color--hosting-blue--800);
559
+ --badge--navy-border-color: var(--color--mittwald-navy--800);
560
+ --badge--navy-background-color--default: var(--color--mittwald-navy--100);
561
+ --badge--navy-background-color--hover: var(--color--mittwald-navy--200);
562
+ --badge--navy-background-color--pressed: var(--color--mittwald-navy--300);
563
+ --badge--navy-content-color--default: var(--color--mittwald-navy--900);
564
+ --badge--navy-content-color--hover: var(--color--mittwald-navy--900);
565
+ --badge--navy-content-color--pressed: var(--color--mittwald-navy--1000);
566
+ --badge--navy-scope-background-color: var(--color--mittwald-navy--800);
567
+ --badge--violet-border-color: var(--color--soft-contrast-violet--800);
568
+ --badge--violet-background-color--default: var(--color--soft-contrast-violet--100);
569
+ --badge--violet-background-color--hover: var(--color--soft-contrast-violet--200);
570
+ --badge--violet-background-color--pressed: var(--color--soft-contrast-violet--300);
571
+ --badge--violet-content-color--default: var(--color--soft-contrast-violet--900);
572
+ --badge--violet-content-color--hover: var(--color--soft-contrast-violet--900);
573
+ --badge--violet-content-color--pressed: var(--color--soft-contrast-violet--1000);
574
+ --badge--violet-scope-background-color: var(--color--soft-contrast-violet--800);
575
+ --badge--teal-border-color: var(--color--super-teal--800);
576
+ --badge--teal-background-color--default: var(--color--super-teal--100);
577
+ --badge--teal-background-color--hover: var(--color--super-teal--200);
578
+ --badge--teal-background-color--pressed: var(--color--super-teal--300);
579
+ --badge--teal-content-color--default: var(--color--super-teal--900);
580
+ --badge--teal-content-color--hover: var(--color--super-teal--900);
581
+ --badge--teal-content-color--pressed: var(--color--super-teal--1000);
582
+ --badge--teal-scope-background-color: var(--color--super-teal--800);
583
+ --badge--lilac-border-color: var(--color--bright-lilac--800);
584
+ --badge--lilac-background-color--default: var(--color--bright-lilac--100);
585
+ --badge--lilac-background-color--hover: var(--color--bright-lilac--200);
586
+ --badge--lilac-background-color--pressed: var(--color--bright-lilac--300);
587
+ --badge--lilac-content-color--default: var(--color--bright-lilac--900);
588
+ --badge--lilac-content-color--hover: var(--color--bright-lilac--900);
589
+ --badge--lilac-content-color--pressed: var(--color--bright-lilac--1000);
590
+ --badge--lilac-scope-background-color: var(--color--bright-lilac--800);
591
+ --badge--red-border-color: var(--color--amaranth-red--800);
592
+ --badge--red-background-color--default: var(--color--amaranth-red--100);
593
+ --badge--red-background-color--hover: var(--color--amaranth-red--200);
594
+ --badge--red-background-color--pressed: var(--color--amaranth-red--300);
595
+ --badge--red-content-color--default: var(--color--amaranth-red--900);
596
+ --badge--red-content-color--hover: var(--color--amaranth-red--900);
597
+ --badge--red-content-color--pressed: var(--color--amaranth-red--1000);
598
+ --badge--red-scope-background-color: var(--color--amaranth-red--800);
599
+ --badge--green-border-color: var(--color--espelkamp-green--800);
600
+ --badge--green-background-color--default: var(--color--espelkamp-green--100);
601
+ --badge--green-background-color--hover: var(--color--espelkamp-green--200);
602
+ --badge--green-background-color--pressed: var(--color--espelkamp-green--300);
603
+ --badge--green-content-color--default: var(--color--espelkamp-green--900);
604
+ --badge--green-content-color--hover: var(--color--espelkamp-green--900);
605
+ --badge--green-content-color--pressed: var(--color--espelkamp-green--1000);
606
+ --badge--green-scope-background-color: var(--color--espelkamp-green--800);
607
+ --badge--orange-border-color: var(--color--royal-orange--900);
608
+ --badge--orange-background-color--default: var(--color--royal-orange--100);
609
+ --badge--orange-background-color--hover: var(--color--royal-orange--200);
610
+ --badge--orange-background-color--pressed: var(--color--royal-orange--300);
611
+ --badge--orange-content-color--default: var(--color--royal-orange--900);
612
+ --badge--orange-content-color--hover: var(--color--royal-orange--900);
613
+ --badge--orange-content-color--pressed: var(--color--royal-orange--1000);
614
+ --badge--orange-scope-background-color: var(--color--royal-orange--900);
615
+ --badge--dark-border-color: var(--dark--color--800);
616
+ --badge--dark-background-color--default: var(--dark--color--100);
617
+ --badge--dark-background-color--hover: var(--dark--color--200);
618
+ --badge--dark-background-color--pressed: var(--dark--color--300);
619
+ --badge--dark-content-color--default: var(--dark--color--800);
620
+ --badge--dark-content-color--hover: var(--dark--color--800);
621
+ --badge--dark-content-color--pressed: var(--dark--color--800);
622
+ --badge--dark-scope-background-color: var(--dark--color--800);
623
+ --badge--light-border-color: var(--light--color--800);
624
+ --badge--light-background-color--default: var(--light--color--100);
625
+ --badge--light-background-color--hover: var(--light--color--200);
626
+ --badge--light-background-color--pressed: var(--light--color--300);
627
+ --badge--light-content-color--default: var(--light--color--800);
628
+ --badge--light-content-color--hover: var(--light--color--800);
629
+ --badge--light-content-color--pressed: var(--light--color--800);
630
+ --badge--light-scope-background-color: var(--light--color--800);
631
+ --counter-badge--font-weight: var(--font-weight--bold);
632
+ --counter-badge--padding-inline: var(--size-rem--xs);
633
+ --counter-badge--border-style: var(--border-style--default);
634
+ --notification-provider--window-to-provider-spacing: var(--size-px--xl);
635
+ --notification-provider--notification-to-notification-spacing: var(--size-px--m);
636
+ --notification--padding: var(--size-px--s);
637
+ --notification--border-style: var(--border-style--default);
638
+ --notification--heading-to-text-spacing: var(--size-rem--xs);
639
+ --notification--font-size: var(--font-size-text--s);
640
+ --progress-bar--font-size: var(--font-size-text--m);
641
+ --progress-bar--font-size-s: var(--font-size-text--s);
642
+ --progress-bar--value-font-weight: var(--font-weight--bold);
643
+ --progress-bar--spacing-y: var(--size-rem--xs);
644
+ --progress-bar--spacing-x: var(--size-rem--m);
645
+ --progress-bar--height: var(--size-rem--s);
646
+ --progress-bar--corner-radius: var(--size-rem--xs);
647
+ --accordion--heading-to-chevron-spacing: var(--size-rem--s);
648
+ --accordion--header-padding-x: var(--size-px--s);
649
+ --accordion--header-padding-y: var(--size-px--xs);
650
+ --accordion--content-padding: var(--size-px--s);
651
+ --align--avatar-text--spacing: var(--size-rem--s);
652
+ --column-layout--content-to-content-spacing: var(--size-rem--m);
653
+ --column-layout--gap--s: var(--size-px--s);
654
+ --column-layout--gap--m: var(--size-px--m);
655
+ --column-layout--gap--l: var(--size-px--l);
656
+ --layout-card--padding: var(--size-px--xl);
657
+ --list--content-to-content-spacing: var(--size-px--s);
658
+ --list--block-to-block-spacing: var(--size-px--m);
659
+ --list-item--padding: var(--size-px--s);
660
+ --list-item--border-style: var(--border-style--default);
661
+ --list-item--content-to-content-spacing: var(--size-px--m);
662
+ --list-item--subtitle-font-size: var(--font-size-text--s);
663
+ --section--border-style: var(--border-style--default);
664
+ --section--section-to-section-spacing: var(--size-rem--xl);
665
+ --section--content-to-content-spacing: var(--size-rem--m);
666
+ --section--sub-heading-spacing: var(--size-rem--s);
667
+ --section-header--action-to-action-spacing: var(--size-rem--s);
668
+ --section-header--heading-to-actions-spacing: var(--size-rem--m);
669
+ --table--border-style: var(--border-style--default);
670
+ --table--padding-x: var(--size-px--m);
671
+ --table--padding-y: var(--size-px--s);
672
+ --table--header-font-weight: var(--font-weight--bold);
673
+ --table--footer-font-weight: var(--font-weight--bold);
674
+ --file-card--padding-x: var(--size-px--s);
675
+ --file-card--padding-y: var(--size-px--xs);
676
+ --file-card--spacing: var(--size-rem--s);
677
+ --file-card--border-style: var(--border-style--default);
678
+ --file-card--sub-title-font-size: var(--font-size-text--s);
679
+ --button--corner-radius: var(--corner-radius--default);
680
+ --button--pending-icon-color: var(--neutral--color--1000);
681
+ --button--succeeded-icon-color: var(--success--color--800);
682
+ --button--failed-icon-color: var(--danger--color--800);
683
+ --button--border-width: var(--border-width--100);
684
+ --button--accent-plain-background-color--default: var(--success-plain-background-color--default);
685
+ --button--accent-plain-background-color--disabled: var(--disabled-plain-background-color);
686
+ --button--accent-outline-background-color--default: var(--success-outline-background-color--default);
687
+ --button--primary-plain-background-color--default: var(--primary-plain-background-color--default);
688
+ --button--primary-plain-background-color--disabled: var(--disabled-plain-background-color);
689
+ --button--primary-outline-background-color--default: var(--primary-outline-background-color--default);
690
+ --button--secondary-plain-background-color--default: var(--neutral-plain-background-color--default);
691
+ --button--secondary-plain-background-color--disabled: var(--disabled-plain-background-color);
692
+ --button--secondary-outline-background-color--default: var(--neutral-outline-background-color--default);
693
+ --button--danger-plain-background-color--default: var(--danger-plain-background-color--default);
694
+ --button--danger-plain-background-color--disabled: var(--disabled-plain-background-color);
695
+ --button--danger-outline-background-color--default: var(--danger-outline-background-color--default);
696
+ --button--dark-solid-background-color--default: var(--dark-solid-background-color--default);
697
+ --button--dark-solid-background-color--hover: var(--dark-solid-background-color--hover);
698
+ --button--dark-solid-background-color--pressed: var(--dark-solid-background-color--pressed);
699
+ --button--dark-solid-background-color--disabled: var(--disabled-solid-dark-background-color);
700
+ --button--dark-solid-content-color--default: var(--dark-solid-content-color);
701
+ --button--dark-solid-content-color--hover: var(--dark-solid-content-color);
702
+ --button--dark-solid-content-color--pressed: var(--dark-solid-content-color);
703
+ --button--dark-solid-content-color--disabled: var(--disabled-solid-dark-content-color);
704
+ --button--dark-plain-background-color--default: var(--dark-plain-background-color--default);
705
+ --button--dark-plain-background-color--hover: var(--dark-plain-background-color--hover);
706
+ --button--dark-plain-background-color--pressed: var(--dark-plain-background-color--pressed);
707
+ --button--dark-plain-background-color--disabled: var(--disabled-plain-background-color);
708
+ --button--dark-plain-content-color--default: var(--dark-plain-content-color);
709
+ --button--dark-plain-content-color--hover: var(--dark-plain-content-color);
710
+ --button--dark-plain-content-color--pressed: var(--dark-plain-content-color);
711
+ --button--dark-plain-content-color--disabled: var(--disabled-plain-dark-content-color);
712
+ --button--dark-soft-background-color--default: var(--dark-soft-background-color--default);
713
+ --button--dark-soft-background-color--hover: var(--dark-soft-background-color--hover);
714
+ --button--dark-soft-background-color--pressed: var(--dark-soft-background-color--pressed);
715
+ --button--dark-soft-background-color--disabled: var(--disabled-soft-dark-background-color);
716
+ --button--dark-soft-content-color--default: var(--dark-soft-content-color);
717
+ --button--dark-soft-content-color--hover: var(--dark-soft-content-color);
718
+ --button--dark-soft-content-color--pressed: var(--dark-soft-content-color);
719
+ --button--dark-soft-content-color--disabled: var(--disabled-soft-dark-content-color);
720
+ --button--dark-outline-background-color--default: var(--dark-outline-background-color--default);
721
+ --button--dark-outline-background-color--hover: var(--dark-outline-background-color--hover);
722
+ --button--dark-outline-background-color--pressed: var(--dark-outline-background-color--pressed);
723
+ --button--dark-outline-background-color--disabled: var(--disabled-outline-dark-background-color);
724
+ --button--dark-outline-content-color--default: var(--dark-outline-content-color);
725
+ --button--dark-outline-content-color--hover: var(--dark-outline-content-color);
726
+ --button--dark-outline-content-color--pressed: var(--dark-outline-content-color);
727
+ --button--dark-outline-content-color--disabled: var(--disabled-outline-dark-content-color);
728
+ --button--dark-outline-border-color--default: var(--dark-outline-border-color);
729
+ --button--dark-outline-border-color--disabled: var(--disabled-outline-dark-border-color);
730
+ --button--light-solid-background-color--default: var(--light-solid-background-color--default);
731
+ --button--light-solid-background-color--hover: var(--light-solid-background-color--hover);
732
+ --button--light-solid-background-color--pressed: var(--light-solid-background-color--pressed);
733
+ --button--light-solid-background-color--disabled: var(--disabled-solid-light-background-color);
734
+ --button--light-solid-content-color--default: var(--light-solid-content-color);
735
+ --button--light-solid-content-color--hover: var(--light-solid-content-color);
736
+ --button--light-solid-content-color--pressed: var(--light-solid-content-color);
737
+ --button--light-solid-content-color--disabled: var(--disabled-solid-light-content-color);
738
+ --button--light-plain-background-color--default: var(--light-plain-background-color--default);
739
+ --button--light-plain-background-color--hover: var(--light-plain-background-color--hover);
740
+ --button--light-plain-background-color--pressed: var(--light-plain-background-color--pressed);
741
+ --button--light-plain-background-color--disabled: var(--disabled-plain-background-color);
742
+ --button--light-plain-content-color--default: var(--light-plain-content-color);
743
+ --button--light-plain-content-color--hover: var(--light-plain-content-color);
744
+ --button--light-plain-content-color--pressed: var(--light-plain-content-color);
745
+ --button--light-plain-content-color--disabled: var(--disabled-plain-light-content-color);
746
+ --button--light-soft-background-color--default: var(--light-soft-background-color--default);
747
+ --button--light-soft-background-color--hover: var(--light-soft-background-color--hover);
748
+ --button--light-soft-background-color--pressed: var(--light-soft-background-color--pressed);
749
+ --button--light-soft-background-color--disabled: var(--disabled-soft-light-background-color);
750
+ --button--light-soft-content-color--default: var(--light-soft-content-color);
751
+ --button--light-soft-content-color--hover: var(--light-soft-content-color);
752
+ --button--light-soft-content-color--pressed: var(--light-soft-content-color);
753
+ --button--light-soft-content-color--disabled: var(--disabled-soft-light-content-color);
754
+ --button--light-outline-background-color--default: var(--light-outline-background-color--default);
755
+ --button--light-outline-background-color--hover: var(--light-outline-background-color--hover);
756
+ --button--light-outline-background-color--pressed: var(--light-outline-background-color--pressed);
757
+ --button--light-outline-background-color--disabled: var(--disabled-outline-light-background-color);
758
+ --button--light-outline-content-color--default: var(--light-outline-content-color);
759
+ --button--light-outline-content-color--hover: var(--light-outline-content-color);
760
+ --button--light-outline-content-color--pressed: var(--light-outline-content-color);
761
+ --button--light-outline-content-color--disabled: var(--disabled-outline-light-content-color);
762
+ --button--light-outline-border-color--default: var(--light-outline-border-color);
763
+ --button--light-outline-border-color--disabled: var(--disabled-outline-light-border-color);
764
+ --menu-item--corner-radius: var(--corner-radius--default);
765
+ --menu-item--color--current: var(--primary--color--800);
766
+ --menu-item--icon-color--default: var(--neutral--color--800);
767
+ --menu-item--icon-color--current: var(--primary--color--800);
768
+ --menu-item--disabled-background-color: var(--disabled-plain-background-color);
769
+ --primary-solid-background-color--default: var(--primary--color--800);
770
+ --primary-solid-background-color--hover: var(--primary--color--900);
771
+ --primary-solid-background-color--pressed: var(--primary--color--1000);
772
+ --primary-solid-content-color: var(--neutral--color--100);
773
+ --primary-plain-background-color--hover: var(--primary--color--100);
774
+ --primary-plain-background-color--pressed: var(--primary--color--200);
775
+ --primary-plain-content-color: var(--primary--color--800);
776
+ --primary-soft-background-color--default: var(--primary--color--100);
777
+ --primary-soft-background-color--hover: var(--primary--color--200);
778
+ --primary-soft-background-color--pressed: var(--primary--color--300);
779
+ --primary-soft-content-color--default: var(--primary--color--900);
780
+ --primary-soft-content-color--pressed: var(--primary--color--1000);
781
+ --primary-outline-background-color--hover: var(--primary--color--100);
782
+ --primary-outline-background-color--pressed: var(--primary--color--200);
783
+ --primary-outline-content-color: var(--primary--color--900);
784
+ --primary-outline-border-color: var(--primary--color--800);
785
+ --danger-solid-background-color--default: var(--danger--color--800);
786
+ --danger-solid-background-color--hover: var(--danger--color--900);
787
+ --danger-solid-background-color--pressed: var(--danger--color--1000);
788
+ --danger-solid-content-color: var(--neutral--color--100);
789
+ --danger-plain-background-color--hover: var(--danger--color--100);
790
+ --danger-plain-background-color--pressed: var(--danger--color--200);
791
+ --danger-plain-content-color: var(--danger--color--800);
792
+ --danger-outline-background-color--hover: var(--danger--color--100);
793
+ --danger-outline-background-color--pressed: var(--danger--color--200);
794
+ --danger-outline-content-color: var(--danger--color--900);
795
+ --danger-outline-border-color: var(--danger--color--800);
796
+ --danger-soft-background-color--default: var(--danger--color--100);
797
+ --danger-soft-background-color--hover: var(--danger--color--200);
798
+ --danger-soft-background-color--pressed: var(--danger--color--300);
799
+ --danger-soft-content-color--default: var(--danger--color--900);
800
+ --danger-soft-content-color--pressed: var(--danger--color--1000);
801
+ --info-solid-background-color--default: var(--info--color--800);
802
+ --info-solid-background-color--hover: var(--info--color--900);
803
+ --info-solid-background-color--pressed: var(--info--color--1000);
804
+ --info-solid-content-color: var(--neutral--color--100);
805
+ --info-outline-background-color--hover: var(--info--color--100);
806
+ --info-outline-background-color--pressed: var(--info--color--200);
807
+ --info-outline-content-color: var(--info--color--900);
808
+ --info-outline-border-color: var(--info--color--800);
809
+ --info-soft-background-color--default: var(--info--color--100);
810
+ --info-soft-background-color--hover: var(--info--color--200);
811
+ --info-soft-background-color--pressed: var(--info--color--300);
812
+ --info-soft-content-color--default: var(--info--color--900);
813
+ --info-soft-content-color--pressed: var(--info--color--1000);
814
+ --info-plain-background-color--hover: var(--info--color--100);
815
+ --info-plain-background-color--pressed: var(--info--color--200);
816
+ --info-plain-content-color: var(--info--color--800);
817
+ --success-solid-background-color--default: var(--success--color--800);
818
+ --success-solid-background-color--hover: var(--success--color--900);
819
+ --success-solid-background-color--pressed: var(--success--color--1000);
820
+ --success-solid-content-color: var(--neutral--color--100);
821
+ --success-plain-background-color--hover: var(--success--color--100);
822
+ --success-plain-background-color--pressed: var(--success--color--200);
823
+ --success-plain-content-color: var(--success--color--800);
824
+ --success-outline-background-color--hover: var(--success--color--100);
825
+ --success-outline-background-color--pressed: var(--success--color--200);
826
+ --success-outline-content-color: var(--success--color--900);
827
+ --success-outline-border-color: var(--success--color--800);
828
+ --success-soft-background-color--default: var(--success--color--100);
829
+ --success-soft-background-color--hover: var(--success--color--200);
830
+ --success-soft-background-color--pressed: var(--success--color--300);
831
+ --success-soft-content-color--default: var(--success--color--900);
832
+ --success-soft-content-color--pressed: var(--success--color--1000);
833
+ --warning-solid-background-color--default: var(--warning--color--800);
834
+ --warning-solid-background-color--hover: var(--warning--color--900);
835
+ --warning-solid-background-color--pressed: var(--warning--color--1000);
836
+ --warning-solid-content-color: var(--neutral--color--100);
837
+ --warning-outline-background-color--hover: var(--warning--color--100);
838
+ --warning-outline-background-color--pressed: var(--warning--color--200);
839
+ --warning-outline-content-color: var(--warning--color--900);
840
+ --warning-outline-border-color: var(--warning--color--800);
841
+ --warning-soft-background-color--default: var(--warning--color--100);
842
+ --warning-soft-background-color--hover: var(--warning--color--200);
843
+ --warning-soft-background-color--pressed: var(--warning--color--300);
844
+ --warning-soft-content-color--default: var(--warning--color--900);
845
+ --warning-soft-content-color--pressed: var(--warning--color--1000);
846
+ --warning-plain-background-color--hover: var(--info--color--100);
847
+ --warning-plain-background-color--pressed: var(--info--color--200);
848
+ --warning-plain-content-color: var(--info--color--800);
849
+ --neutral-solid-background-color--default: var(--neutral--color--800);
850
+ --neutral-solid-background-color--hover: var(--neutral--color--900);
851
+ --neutral-solid-background-color--pressed: var(--neutral--color--1000);
852
+ --neutral-solid-content-color: var(--neutral--color--100);
853
+ --neutral-plain-background-color--hover: var(--neutral--color--400);
854
+ --neutral-plain-background-color--pressed: var(--neutral--color--500);
855
+ --neutral-plain-content-color: var(--neutral--color--1000);
856
+ --neutral-outline-background-color--hover: var(--neutral--color--400);
857
+ --neutral-outline-background-color--selected: var(--neutral--color--500);
858
+ --neutral-outline-background-color--pressed: var(--neutral--color--500);
859
+ --neutral-outline-content-color: var(--neutral--color--1000);
860
+ --neutral-outline-border-color: var(--neutral--color--700);
861
+ --neutral-soft-background-color--default: var(--neutral--color--400);
862
+ --neutral-soft-background-color--hover: var(--neutral--color--500);
863
+ --neutral-soft-background-color--pressed: var(--neutral--color--600);
864
+ --neutral-soft-content-color--default: var(--neutral--color--1000);
865
+ --neutral-soft-content-color--pressed: var(--neutral--color--1100);
866
+ --disabled-solid-background-color: var(--neutral--color--400);
867
+ --disabled-solid-content-color: var(--neutral--color--600);
868
+ --disabled-plain-content-color: var(--neutral--color--400);
869
+ --disabled-outline-background-color: var(--neutral--color--300);
870
+ --disabled-outline-content-color: var(--neutral--color--500);
871
+ --disabled-outline-border-color: var(--neutral--color--400);
872
+ --disabled-soft-background-color: var(--neutral--color--300);
873
+ --disabled-soft-content-color: var(--neutral--color--500);
874
+ --code--line-height: var(--line-height--m);
875
+ --code--corner-radius: var(--corner-radius--default);
876
+ --code--light-background-color: var(--light-soft-background-color--default);
877
+ --code--light-content-color: var(--light-soft-content-color);
878
+ --code--dark-background-color: var(--dark-soft-background-color--default);
879
+ --code--dark-content-color: var(--dark-soft-content-color);
880
+ --heading--color: var(--primary--color--1000);
881
+ --heading--color-dark: var(--dark-plain-content-color);
882
+ --heading--color-light: var(--light-plain-content-color);
883
+ --icon--color: var(--neutral--color--800);
884
+ --illustrated-message--primary-icon-color: var(--primary--color--900);
885
+ --illustrated-message--danger-icon-color: var(--danger--color--900);
886
+ --illustrated-message--danger-heading-color: var(--danger--color--1000);
887
+ --illustrated-message--dark-icon-color: var(--dark-plain-content-color);
888
+ --illustrated-message--light-icon-color: var(--light-plain-content-color);
889
+ --label--line-height: var(--line-height--m);
890
+ --label--color--default: var(--neutral--color--800);
891
+ --message--corner-radius: var(--corner-radius--default);
892
+ --text--color--default: var(--neutral--color--1000);
893
+ --text--color--light: var(--light-plain-content-color);
894
+ --text--color--dark: var(--dark-plain-content-color);
895
+ --focus--outline-color: var(--primary--color--800);
896
+ --focus--outline-width: var(--border-width--200);
897
+ --choice--icon-color--selected: var(--primary--color--800);
898
+ --calendar--heading-font-size: var(--font-size-text--default);
899
+ --calendar--cell-background-color--disabled: var(--disabled-plain-background-color);
900
+ --calendar--cell-background-color--hover: var(--dark-plain-background-color--hover);
901
+ --calendar--cell-background-color--pressed: var(--dark-plain-background-color--pressed);
902
+ --calendar--cell-range-background-color: var(--primary--color--100);
903
+ --field-error--color: var(--danger--color--800);
904
+ --form-control--corner-radius: var(--corner-radius--default);
905
+ --form-control--border-width: var(--border-width--100);
906
+ --form-control--placeholder-color--default: var(--neutral--color--900);
907
+ --form-control--placeholder-color--disabled: var(--neutral--color--500);
908
+ --form-control--background-color--default: var(--neutral--color--300);
909
+ --form-control--background-color--hover: var(--primary--color--100);
910
+ --form-control--background-color--focused: var(--neutral--color--300);
911
+ --form-control--background-color--invalid: var(--danger--color--100);
912
+ --form-control--background-color--selected: var(--primary--color--200);
913
+ --slider--track-corner-radius: var(--corner-radius--default);
914
+ --slider--thumb-background-color--default: var(--neutral--color--100);
915
+ --slider--initial-marker-corner-radius: var(--corner-radius--default);
916
+ --switch--handle-color--disabled: var(--neutral--color--500);
917
+ --switch--handle-background-color--default: var(--neutral--color--100);
918
+ --switch--handle-background-color--disabled: var(--neutral--color--300);
919
+ --breadcrumb-item--color-light: var(--light-plain-content-color);
920
+ --breadcrumb-item--color-dark: var(--dark-plain-content-color);
921
+ --header-navigation--item-color-dark: var(--dark-plain-content-color);
922
+ --header-navigation--item-color-light: var(--light-plain-content-color);
923
+ --header-navigation--item-background-color-dark--hover: var(--dark-plain-background-color--hover);
924
+ --header-navigation--item-background-color-dark--pressed: var(--dark-plain-background-color--pressed);
925
+ --header-navigation--item-background-color-light--hover: var(--light-plain-background-color--hover);
926
+ --header-navigation--item-background-color-light--pressed: var(--light-plain-background-color--pressed);
927
+ --header-navigation--item-corner-radius: var(--corner-radius--default);
928
+ --header-navigation--item-underline-width-current: var(--border-width--200);
929
+ --link--line-height: var(--line-height--m);
930
+ --link--color--default: var(--primary--color--800);
931
+ --link--color--hover: var(--primary--color--900);
932
+ --link--color--pressed: var(--primary--color--1000);
933
+ --link--color-dark--disabled: var(--disabled-plain-dark-content-color);
934
+ --link--color-light--disabled: var(--disabled-plain-light-content-color);
935
+ --tab-list--background-color: var(--neutral--color--400);
936
+ --tab--background-color--selected: var(--neutral--color--100);
937
+ --tab--disabled-color: var(--neutral--color--600);
938
+ --modal--corner-radius: var(--corner-radius--default);
939
+ --modal--background-color: var(--neutral--color--100);
940
+ --modal--action-group-background-color: var(--neutral--color--300);
941
+ --modal--action-group-border-color: var(--neutral--color--400);
942
+ --modal--action-group-border-top-width: var(--border-width--100);
943
+ --modal--off-canvas-header-background-color: var(--neutral--color--200);
944
+ --popover--box-shadow: var(--shadow--overlay);
945
+ --popover--corner-radius: var(--corner-radius--default);
946
+ --popover--background-color: var(--neutral--color--100);
947
+ --popover--border-width: var(--border-width--100);
948
+ --tooltip--background-color: var(--neutral--color--900);
949
+ --tooltip--color: var(--neutral--color--100);
950
+ --tooltip--box-shadow: var(--shadow--overlay);
951
+ --alert--corner-radius: var(--corner-radius--default);
952
+ --alert--border-width: var(--border-width--100);
953
+ --alert--border-x-start-width: var(--border-width--400);
954
+ --badge--border-width: var(--border-width--100);
955
+ --badge--disabled-dark-border-color: var(--disabled-outline-dark-border-color);
956
+ --badge--disabled-dark-background-color: var(--disabled-soft-dark-background-color);
957
+ --badge--disabled-dark-content-color: var(--disabled-soft-dark-content-color);
958
+ --badge--disabled-dark-scope-background-color: var(--disabled-solid-dark-background-color);
959
+ --badge--disabled-dark-scope-content-color: var(--disabled-solid-dark-content-color);
960
+ --badge--disabled-light-border-color: var(--disabled-outline-light-border-color);
961
+ --badge--disabled-light-background-color: var(--disabled-soft-light-background-color);
962
+ --badge--disabled-light-content-color: var(--disabled-soft-light-content-color);
963
+ --badge--disabled-light-scope-background-color: var(--disabled-solid-light-background-color);
964
+ --badge--disabled-light-scope-content-color: var(--disabled-solid-light-content-color);
965
+ --counter-badge--border-width: var(--border-width--200);
966
+ --counter-badge--border-color: var(--neutral--color--100);
967
+ --notification--corner-radius: var(--corner-radius--default);
968
+ --notification--border-x-start-width: var(--border-width--300);
969
+ --notification--box-shadow: var(--shadow--overlay);
970
+ --notification--info-background-color--default: var(--neutral--color--100);
971
+ --notification--warning-background-color--default: var(--neutral--color--100);
972
+ --notification--danger-background-color--default: var(--neutral--color--100);
973
+ --notification--success-background-color--default: var(--neutral--color--100);
974
+ --progress-bar--border-width: var(--border-width--100);
975
+ --progress-bar--background-color: var(--neutral-outline-background-color--default);
976
+ --accordion--header-corner-radius: var(--corner-radius--default);
977
+ --layout-card--background-color: var(--neutral--color--100);
978
+ --layout-card--corner-radius: var(--corner-radius--default);
979
+ --layout-card--box-shadow: var(--shadow--content);
980
+ --list-item--corner-radius: var(--corner-radius--default);
981
+ --list-item--border-width: var(--border-width--100);
982
+ --list-item--background-color--default: var(--neutral--color--200);
983
+ --list-item--background-color--hover: var(--primary--color--100);
984
+ --list-item--background-color--pressed: var(--primary--color--200);
985
+ --separator--color: var(--neutral--color--700);
986
+ --separator--height: var(--border-width--100);
987
+ --table--corner-radius: var(--corner-radius--default);
988
+ --table--border-width: var(--border-width--100);
989
+ --table--header-color: var(--primary--color--1000);
990
+ --table--header-border-width: var(--border-width--200);
991
+ --table--footer-border-width: var(--border-width--200);
992
+ --table--background-color: var(--neutral--color--100);
993
+ --table--background-color-accent: var(--neutral--color--300);
994
+ --file-card--corner-radius: var(--corner-radius--default);
995
+ --file-card--border-width: var(--border-width--100);
996
+ --file-card--background-color--default: var(--neutral--color--100);
1238
997
  --button--accent-solid-background-color--default: var(--success-solid-background-color--default);
998
+ --button--accent-solid-background-color--hover: var(--success-solid-background-color--hover);
999
+ --button--accent-solid-background-color--pressed: var(--success-solid-background-color--pressed);
1000
+ --button--accent-solid-background-color--disabled: var(--disabled-solid-background-color);
1001
+ --button--accent-solid-content-color--default: var(--success-solid-content-color);
1002
+ --button--accent-solid-content-color--hover: var(--success-solid-content-color);
1003
+ --button--accent-solid-content-color--pressed: var(--success-solid-content-color);
1004
+ --button--accent-solid-content-color--disabled: var(--disabled-solid-content-color);
1005
+ --button--accent-plain-background-color--hover: var(--success-plain-background-color--hover);
1006
+ --button--accent-plain-background-color--pressed: var(--success-plain-background-color--pressed);
1007
+ --button--accent-plain-content-color--default: var(--success-plain-content-color);
1008
+ --button--accent-plain-content-color--hover: var(--success-plain-content-color);
1009
+ --button--accent-plain-content-color--pressed: var(--success-plain-content-color);
1010
+ --button--accent-plain-content-color--disabled: var(--disabled-plain-content-color);
1011
+ --button--accent-soft-background-color--default: var(--success-soft-background-color--default);
1012
+ --button--accent-soft-background-color--hover: var(--success-soft-background-color--hover);
1013
+ --button--accent-soft-background-color--pressed: var(--success-soft-background-color--pressed);
1014
+ --button--accent-soft-background-color--disabled: var(--disabled-soft-background-color);
1015
+ --button--accent-soft-content-color--default: var(--success-soft-content-color--default);
1016
+ --button--accent-soft-content-color--hover: var(--success-soft-content-color--default);
1017
+ --button--accent-soft-content-color--pressed: var(--success-soft-content-color--pressed);
1018
+ --button--accent-soft-content-color--disabled: var(--disabled-soft-content-color);
1019
+ --button--accent-outline-background-color--hover: var(--success-outline-background-color--hover);
1020
+ --button--accent-outline-background-color--pressed: var(--success-outline-background-color--pressed);
1021
+ --button--accent-outline-background-color--disabled: var(--disabled-outline-background-color);
1022
+ --button--accent-outline-content-color--default: var(--success-outline-border-color);
1023
+ --button--accent-outline-content-color--hover: var(--success-outline-border-color);
1024
+ --button--accent-outline-content-color--pressed: var(--success-outline-border-color);
1025
+ --button--accent-outline-content-color--disabled: var(--disabled-outline-content-color);
1026
+ --button--accent-outline-border-color--default: var(--success-outline-border-color);
1027
+ --button--accent-outline-border-color--disabled: var(--disabled-outline-border-color);
1028
+ --button--primary-solid-background-color--default: var(--primary-solid-background-color--default);
1029
+ --button--primary-solid-background-color--hover: var(--primary-solid-background-color--hover);
1030
+ --button--primary-solid-background-color--pressed: var(--primary-solid-background-color--pressed);
1031
+ --button--primary-solid-background-color--disabled: var(--disabled-solid-background-color);
1032
+ --button--primary-solid-content-color--default: var(--primary-solid-content-color);
1033
+ --button--primary-solid-content-color--hover: var(--primary-solid-content-color);
1034
+ --button--primary-solid-content-color--pressed: var(--primary-solid-content-color);
1035
+ --button--primary-solid-content-color--disabled: var(--disabled-solid-content-color);
1036
+ --button--primary-plain-background-color--hover: var(--primary-plain-background-color--hover);
1037
+ --button--primary-plain-background-color--pressed: var(--primary-plain-background-color--pressed);
1038
+ --button--primary-plain-content-color--default: var(--primary-plain-content-color);
1039
+ --button--primary-plain-content-color--hover: var(--primary-plain-content-color);
1040
+ --button--primary-plain-content-color--pressed: var(--primary-plain-content-color);
1041
+ --button--primary-plain-content-color--disabled: var(--disabled-plain-content-color);
1042
+ --button--primary-soft-background-color--default: var(--primary-soft-background-color--default);
1043
+ --button--primary-soft-background-color--hover: var(--primary-soft-background-color--hover);
1044
+ --button--primary-soft-background-color--pressed: var(--primary-soft-background-color--pressed);
1045
+ --button--primary-soft-background-color--disabled: var(--disabled-soft-background-color);
1046
+ --button--primary-soft-content-color--default: var(--primary-soft-content-color--default);
1047
+ --button--primary-soft-content-color--hover: var(--primary-soft-content-color--default);
1048
+ --button--primary-soft-content-color--pressed: var(--primary-soft-content-color--pressed);
1049
+ --button--primary-soft-content-color--disabled: var(--disabled-soft-content-color);
1050
+ --button--primary-outline-background-color--hover: var(--primary-outline-background-color--hover);
1051
+ --button--primary-outline-background-color--pressed: var(--primary-outline-background-color--pressed);
1052
+ --button--primary-outline-background-color--disabled: var(--disabled-outline-background-color);
1053
+ --button--primary-outline-content-color--default: var(--primary-outline-border-color);
1054
+ --button--primary-outline-content-color--hover: var(--primary-outline-border-color);
1055
+ --button--primary-outline-content-color--pressed: var(--primary-outline-border-color);
1056
+ --button--primary-outline-content-color--disabled: var(--disabled-outline-content-color);
1057
+ --button--primary-outline-border-color--default: var(--primary-outline-border-color);
1058
+ --button--primary-outline-border-color--disabled: var(--disabled-outline-border-color);
1059
+ --button--secondary-solid-background-color--default: var(--neutral-solid-background-color--default);
1060
+ --button--secondary-solid-background-color--hover: var(--neutral-solid-background-color--hover);
1061
+ --button--secondary-solid-background-color--pressed: var(--neutral-solid-background-color--pressed);
1062
+ --button--secondary-solid-background-color--disabled: var(--disabled-solid-background-color);
1063
+ --button--secondary-solid-content-color--default: var(--neutral-solid-content-color);
1064
+ --button--secondary-solid-content-color--hover: var(--neutral-solid-content-color);
1065
+ --button--secondary-solid-content-color--pressed: var(--neutral-solid-content-color);
1066
+ --button--secondary-solid-content-color--disabled: var(--disabled-solid-content-color);
1067
+ --button--secondary-plain-background-color--hover: var(--neutral-plain-background-color--hover);
1068
+ --button--secondary-plain-background-color--pressed: var(--neutral-plain-background-color--pressed);
1069
+ --button--secondary-plain-content-color--default: var(--neutral-plain-content-color);
1070
+ --button--secondary-plain-content-color--hover: var(--neutral-plain-content-color);
1071
+ --button--secondary-plain-content-color--pressed: var(--neutral-plain-content-color);
1072
+ --button--secondary-plain-content-color--disabled: var(--disabled-plain-content-color);
1073
+ --button--secondary-soft-background-color--default: var(--neutral-soft-background-color--default);
1074
+ --button--secondary-soft-background-color--hover: var(--neutral-soft-background-color--hover);
1075
+ --button--secondary-soft-background-color--pressed: var(--neutral-soft-background-color--pressed);
1076
+ --button--secondary-soft-background-color--disabled: var(--disabled-soft-background-color);
1077
+ --button--secondary-soft-content-color--default: var(--neutral-soft-content-color--default);
1078
+ --button--secondary-soft-content-color--hover: var(--neutral-soft-content-color--default);
1079
+ --button--secondary-soft-content-color--pressed: var(--neutral-soft-content-color--pressed);
1080
+ --button--secondary-soft-content-color--disabled: var(--disabled-soft-content-color);
1081
+ --button--secondary-outline-background-color--hover: var(--neutral-outline-background-color--hover);
1082
+ --button--secondary-outline-background-color--pressed: var(--neutral-outline-background-color--pressed);
1083
+ --button--secondary-outline-background-color--disabled: var(--disabled-outline-background-color);
1084
+ --button--secondary-outline-content-color--default: var(--neutral-outline-content-color);
1085
+ --button--secondary-outline-content-color--hover: var(--neutral-outline-content-color);
1086
+ --button--secondary-outline-content-color--pressed: var(--neutral-outline-content-color);
1087
+ --button--secondary-outline-content-color--disabled: var(--disabled-outline-content-color);
1088
+ --button--secondary-outline-border-color--default: var(--neutral-outline-border-color);
1089
+ --button--secondary-outline-border-color--disabled: var(--disabled-outline-border-color);
1090
+ --button--danger-solid-background-color--default: var(--danger-solid-background-color--default);
1091
+ --button--danger-solid-background-color--hover: var(--danger-solid-background-color--hover);
1092
+ --button--danger-solid-background-color--pressed: var(--danger-solid-background-color--pressed);
1093
+ --button--danger-solid-background-color--disabled: var(--disabled-solid-background-color);
1094
+ --button--danger-solid-content-color--default: var(--danger-solid-content-color);
1095
+ --button--danger-solid-content-color--hover: var(--danger-solid-content-color);
1096
+ --button--danger-solid-content-color--pressed: var(--danger-solid-content-color);
1097
+ --button--danger-solid-content-color--disabled: var(--disabled-solid-content-color);
1098
+ --button--danger-plain-background-color--hover: var(--danger-plain-background-color--hover);
1099
+ --button--danger-plain-background-color--pressed: var(--danger-plain-background-color--pressed);
1100
+ --button--danger-plain-content-color--default: var(--danger-plain-content-color);
1101
+ --button--danger-plain-content-color--hover: var(--danger-plain-content-color);
1102
+ --button--danger-plain-content-color--pressed: var(--danger-plain-content-color);
1103
+ --button--danger-plain-content-color--disabled: var(--disabled-plain-content-color);
1104
+ --button--danger-soft-background-color--default: var(--danger-soft-background-color--default);
1105
+ --button--danger-soft-background-color--hover: var(--danger-soft-background-color--hover);
1106
+ --button--danger-soft-background-color--pressed: var(--danger-soft-background-color--pressed);
1107
+ --button--danger-soft-background-color--disabled: var(--disabled-soft-background-color);
1108
+ --button--danger-soft-content-color--default: var(--danger-soft-content-color--default);
1109
+ --button--danger-soft-content-color--hover: var(--danger-soft-content-color--default);
1110
+ --button--danger-soft-content-color--pressed: var(--danger-soft-content-color--pressed);
1111
+ --button--danger-soft-content-color--disabled: var(--disabled-soft-content-color);
1112
+ --button--danger-outline-background-color--hover: var(--danger-outline-background-color--hover);
1113
+ --button--danger-outline-background-color--pressed: var(--danger-outline-background-color--pressed);
1114
+ --button--danger-outline-background-color--disabled: var(--disabled-outline-background-color);
1115
+ --button--danger-outline-content-color--default: var(--danger-outline-border-color);
1116
+ --button--danger-outline-content-color--hover: var(--danger-outline-border-color);
1117
+ --button--danger-outline-content-color--pressed: var(--danger-outline-border-color);
1118
+ --button--danger-outline-content-color--disabled: var(--disabled-outline-content-color);
1119
+ --button--danger-outline-border-color--default: var(--danger-outline-border-color);
1120
+ --button--danger-outline-border-color--disabled: var(--disabled-outline-border-color);
1121
+ --menu-item--icon-color--disabled: var(--disabled-plain-content-color);
1122
+ --menu-item--background-color--hover: var(--primary-plain-background-color--hover);
1123
+ --menu-item--background-color--current: var(--primary-plain-background-color--pressed);
1124
+ --menu-item--disabled-color: var(--disabled-plain-content-color);
1125
+ --code--default-background-color: var(--neutral-soft-background-color--default);
1126
+ --code--default-content-color: var(--neutral-soft-content-color--default);
1127
+ --illustrated-message--primary-heading-color: var(--heading--color);
1128
+ --illustrated-message--dark-heading-color: var(--heading--color-dark);
1129
+ --illustrated-message--light-heading-color: var(--heading--color-light);
1130
+ --label--color--disabled: var(--disabled-plain-content-color);
1131
+ --text--color--disabled: var(--disabled-plain-content-color);
1132
+ --choice--icon-color--default: var(--icon--color);
1133
+ --choice--icon-color--disabled: var(--disabled-outline-content-color);
1134
+ --date-picker--date-segment-background-color--focused: var(--primary-plain-background-color--pressed);
1135
+ --calendar--cell-background-color--selected: var(--primary-solid-background-color--default);
1136
+ --calendar--cell-content-color--disabled: var(--disabled-plain-content-color);
1137
+ --calendar--cell-content-color--selected: var(--primary-solid-content-color);
1138
+ --form-control--border-color--default: var(--neutral-outline-border-color);
1139
+ --form-control--border-color--disabled: var(--disabled-outline-border-color);
1140
+ --form-control--border-color--invalid: var(--danger-outline-border-color);
1141
+ --form-control--border-color--focused: var(--focus--outline-color);
1142
+ --form-control--border-color--selected: var(--neutral-outline-border-color);
1143
+ --form-control--background-color--disabled: var(--disabled-outline-background-color);
1144
+ --form-control--content-color--default: var(--neutral-outline-content-color);
1145
+ --form-control--content-color--disabled: var(--disabled-outline-content-color);
1146
+ --form-control--content-color--selected: var(--neutral-outline-content-color);
1147
+ --slider--text-color--disabled: var(--disabled-plain-content-color);
1148
+ --slider--track-background-color--default: var(--primary-soft-background-color--default);
1149
+ --slider--track-background-color--disabled: var(--disabled-soft-background-color);
1150
+ --slider--track-background-color-fill--default: var(--primary-solid-background-color--default);
1151
+ --slider--track-background-color-fill--disabled: var(--disabled-solid-background-color);
1152
+ --slider--thumb-border-color--default: var(--primary-solid-background-color--default);
1153
+ --slider--thumb-border-color--disabled: var(--disabled-solid-background-color);
1154
+ --slider--thumb-background-color--pressed: var(--primary-solid-background-color--default);
1155
+ --slider--initial-marker-background-color--default: var(--primary-solid-background-color--default);
1156
+ --slider--initial-marker-background-color--disabled: var(--disabled-solid-background-color);
1157
+ --switch--track-background-color--default: var(--neutral-solid-background-color--default);
1158
+ --switch--track-background-color--disabled: var(--disabled-solid-background-color);
1159
+ --switch--track-background-color--selected: var(--success-solid-background-color--default);
1160
+ --switch--handle-color--default: var(--neutral-solid-content-color);
1161
+ --time-field--date-segment-background-color--focused: var(--primary-plain-background-color--pressed);
1162
+ --breadcrumb-item--color: var(--heading--color);
1163
+ --header-navigation--item-color: var(--heading--color);
1164
+ --header-navigation--item-background-color--hover: var(--primary-plain-background-color--hover);
1165
+ --header-navigation--item-background-color--pressed: var(--primary-plain-background-color--pressed);
1166
+ --link--color--disabled: var(--disabled-plain-content-color);
1167
+ --tab--background-color--default: var(--neutral-soft-background-color--default);
1168
+ --tab--background-color--hover: var(--neutral-soft-background-color--hover);
1169
+ --tab--background-color--pressed: var(--neutral-soft-background-color--pressed);
1170
+ --tab--color--default: var(--neutral-soft-content-color--default);
1171
+ --tab--color--hover: var(--neutral-soft-content-color--default);
1172
+ --tab--color--pressed: var(--neutral-soft-content-color--pressed);
1173
+ --tab--disabled-background-color: var(--neutral-soft-background-color--default);
1174
+ --popover--border-color: var(--neutral-outline-border-color);
1175
+ --alert-badge--info-background-color: var(--info-soft-background-color--default);
1176
+ --alert-badge--info-content-color: var(--info-soft-content-color--default);
1177
+ --alert-badge--info-border-color: var(--info-outline-border-color);
1178
+ --alert-badge--success-background-color: var(--success-soft-background-color--default);
1179
+ --alert-badge--success-content-color: var(--success-soft-content-color--default);
1180
+ --alert-badge--success-border-color: var(--success-outline-border-color);
1181
+ --alert-badge--warning-background-color: var(--warning-soft-background-color--default);
1182
+ --alert-badge--warning-content-color: var(--warning-soft-content-color--default);
1183
+ --alert-badge--warning-border-color: var(--warning-outline-border-color);
1184
+ --alert-badge--danger-background-color: var(--danger-soft-background-color--default);
1185
+ --alert-badge--danger-content-color: var(--danger-soft-content-color--default);
1186
+ --alert-badge--danger-border-color: var(--danger-outline-border-color);
1187
+ --alert-icon--info-color: var(--info-outline-content-color);
1188
+ --alert-icon--warning-color: var(--warning-outline-content-color);
1189
+ --alert-icon--danger-color: var(--danger-outline-content-color);
1190
+ --alert-icon--success-color: var(--success-outline-content-color);
1191
+ --alert--info-border-color: var(--info-outline-border-color);
1192
+ --alert--info-heading-color: var(--info-outline-content-color);
1193
+ --alert--warning-border-color: var(--warning-outline-border-color);
1194
+ --alert--warning-heading-color: var(--warning-outline-content-color);
1195
+ --alert--danger-border-color: var(--danger-outline-border-color);
1196
+ --alert--danger-heading-color: var(--danger-outline-content-color);
1197
+ --alert--success-border-color: var(--success-outline-border-color);
1198
+ --alert--success-heading-color: var(--success-outline-content-color);
1199
+ --badge--neutral-scope-content-color: var(--text--color--light);
1200
+ --badge--blue-scope-content-color: var(--text--color--light);
1201
+ --badge--navy-scope-content-color: var(--text--color--light);
1202
+ --badge--violet-scope-content-color: var(--text--color--light);
1203
+ --badge--teal-scope-content-color: var(--text--color--light);
1204
+ --badge--lilac-scope-content-color: var(--text--color--light);
1205
+ --badge--red-scope-content-color: var(--text--color--light);
1206
+ --badge--green-scope-content-color: var(--text--color--light);
1207
+ --badge--orange-scope-content-color: var(--text--color--light);
1208
+ --badge--dark-scope-content-color: var(--text--color--light);
1209
+ --badge--light-scope-content-color: var(--text--color--dark);
1210
+ --badge--disabled-border-color: var(--disabled-outline-border-color);
1211
+ --badge--disabled-background-color: var(--disabled-soft-background-color);
1212
+ --badge--disabled-content-color: var(--disabled-soft-content-color);
1213
+ --badge--disabled-scope-background-color: var(--disabled-solid-background-color);
1214
+ --badge--disabled-scope-content-color: var(--disabled-solid-content-color);
1215
+ --counter-badge--background-color: var(--success-solid-background-color--default);
1216
+ --counter-badge--color: var(--success-solid-content-color);
1217
+ --notification--info-border-color: var(--info-outline-border-color);
1218
+ --notification--info-heading-color: var(--info-outline-content-color);
1219
+ --notification--info-background-color--hover: var(--info-outline-background-color--hover);
1220
+ --notification--info-background-color--pressed: var(--info-outline-background-color--pressed);
1221
+ --notification--warning-border-color: var(--warning-outline-border-color);
1222
+ --notification--warning-heading-color: var(--warning-outline-content-color);
1223
+ --notification--warning-background-color--hover: var(--warning-outline-background-color--hover);
1224
+ --notification--warning-background-color--pressed: var(--warning-outline-background-color--pressed);
1225
+ --notification--danger-border-color: var(--danger-outline-border-color);
1226
+ --notification--danger-heading-color: var(--danger-outline-content-color);
1227
+ --notification--danger-background-color--hover: var(--danger-outline-background-color--hover);
1228
+ --notification--danger-background-color--pressed: var(--danger-outline-background-color--pressed);
1229
+ --notification--success-border-color: var(--success-outline-border-color);
1230
+ --notification--success-heading-color: var(--success-outline-content-color);
1231
+ --notification--success-background-color--hover: var(--success-outline-background-color--hover);
1232
+ --notification--success-background-color--pressed: var(--success-outline-background-color--pressed);
1233
+ --progress-bar--border-color: var(--neutral-outline-border-color);
1234
+ --progress-bar--info-fill-background-color: var(--info-solid-background-color--default);
1235
+ --progress-bar--success-fill-background-color: var(--success-solid-background-color--default);
1236
+ --progress-bar--warning-fill-background-color: var(--warning-solid-background-color--default);
1237
+ --progress-bar--danger-fill-background-color: var(--danger-solid-background-color--default);
1238
+ --accordion--header-background-color--hover: var(--primary-plain-background-color--hover);
1239
+ --list-item--border-color: var(--neutral-outline-border-color);
1240
+ --section--border-width: var(--separator--height);
1241
+ --section--border-color: var(--separator--color);
1242
+ --table--border-color: var(--neutral-outline-border-color);
1243
+ --file-card--border-color: var(--neutral-outline-border-color);
1244
+ --file-card--background-color--hover: var(--neutral-outline-background-color--hover);
1245
+ --file-card--background-color--pressed: var(--neutral-outline-background-color--pressed);
1239
1246
  }