@mittwald/flow-design-tokens 0.1.0-alpha.27 → 0.1.0-alpha.271

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