@tedi-design-system/core 2.2.0 → 2.4.0

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.
@@ -0,0 +1,640 @@
1
+ .tedi-theme--muis {
2
+ --alert-default-background-danger: var(--general-status-danger-background-primary);
3
+ --alert-default-background-info: var(--general-status-info-background-light);
4
+ --alert-default-background-success: var(--general-status-success-background-primary);
5
+ --alert-default-background-warning: var(--general-status-warning-background-light);
6
+ --alert-default-border-danger: var(--general-status-danger-border);
7
+ --alert-default-border-info: var(--general-status-info-border);
8
+ --alert-default-border-success: var(--general-status-success-border);
9
+ --alert-default-border-warning: var(--general-status-warning-border);
10
+ --alert-default-text-danger: var(--general-text-primary);
11
+ --alert-default-text-info: var(--general-text-primary);
12
+ --alert-default-text-success: var(--general-text-primary);
13
+ --alert-default-text-warning: var(--general-text-primary);
14
+ --alert-toast-background-danger: var(--alert-default-background-danger);
15
+ --alert-toast-background-info: var(--alert-default-background-info);
16
+ --alert-toast-background-success: var(--alert-default-background-success);
17
+ --alert-toast-background-warning: var(--alert-default-background-warning);
18
+ --alert-toast-border-danger: var(--alert-default-border-danger);
19
+ --alert-toast-border-info: var(--alert-default-border-info);
20
+ --alert-toast-border-success: var(--alert-default-border-success);
21
+ --alert-toast-border-warning: var(--alert-default-border-warning);
22
+ --alert-toast-text-danger: var(--alert-default-text-danger);
23
+ --alert-toast-text-info: var(--alert-default-text-info);
24
+ --alert-toast-text-success: var(--alert-default-text-success);
25
+ --alert-toast-text-warning: var(--alert-default-text-warning);
26
+ --avatar-background-default: var(--general-status-neutral-background-light);
27
+ --brand-logo: var(--muis-primary-200);
28
+ --button-card-active-background: var(--general-surface-brand-tertiary);
29
+ --button-card-active-border: var(--tedi-primary-400);
30
+ --button-card-active-icon-background: var(--general-surface-brand-primary);
31
+ --button-card-disabled-background: var(--form-general-background-disabled);
32
+ --button-card-disabled-border: var(--form-general-border-disabled);
33
+ --button-card-hover-background: var(--muis-blue-00);
34
+ --button-card-hover-border: var(--muis-primary-900);
35
+ --button-card-hover-icon-background: var(--muis-primary-600);
36
+ --button-card-icon-default: var(--general-icon-secondary);
37
+ --button-card-icon-disabled: var(--general-text-disabled);
38
+ --button-card-icon-hover: var(--general-icon-brand);
39
+ --button-close-background-active: var(--tedi-alpha-20);
40
+ --button-close-background-default: var(--tedi-alpha-01);
41
+ --button-close-background-focus: var(--tedi-alpha-01);
42
+ --button-close-background-hover: var(--tedi-alpha-10);
43
+ --button-close-text-active: var(--general-text-primary);
44
+ --button-close-text-default: var(--general-text-tertiary);
45
+ --button-close-text-focus: var(--general-text-primary);
46
+ --button-close-text-hover: var(--general-text-primary);
47
+ --button-floating-primary-background-active: var(--button-main-primary-background-active);
48
+ --button-floating-primary-background-default: var(--button-main-primary-background-default);
49
+ --button-floating-primary-background-focus: var(--button-main-primary-background-focus);
50
+ --button-floating-primary-background-hover: var(--button-main-primary-background-hover);
51
+ --button-floating-primary-border-active: var(--button-main-primary-background-active);
52
+ --button-floating-primary-border-default: var(--button-main-primary-border-default);
53
+ --button-floating-primary-border-focus: var(--button-main-primary-border-focus);
54
+ --button-floating-primary-border-hover: var(--button-main-primary-border-hover);
55
+ --button-floating-primary-text-active: var(--button-main-primary-text-default);
56
+ --button-floating-primary-text-default: var(--button-main-primary-text-default);
57
+ --button-floating-primary-text-hover: var(--button-main-primary-text-default);
58
+ --button-floating-secondary-background-active: var(--button-main-primary-inverted-background-active);
59
+ --button-floating-secondary-background-default: var(--button-main-primary-inverted-background-default);
60
+ --button-floating-secondary-background-focus: var(--button-main-primary-inverted-background-focus);
61
+ --button-floating-secondary-background-hover: var(--button-main-primary-inverted-background-hover);
62
+ --button-floating-secondary-border-active: var(--button-main-primary-inverted-border-active);
63
+ --button-floating-secondary-border-default: var(--button-main-primary-inverted-border-default);
64
+ --button-floating-secondary-border-focus: var(--button-main-primary-inverted-border-focus);
65
+ --button-floating-secondary-border-hover: var(--button-main-primary-inverted-border-hover);
66
+ --button-floating-secondary-text-active: var(--button-main-primary-inverted-text-active);
67
+ --button-floating-secondary-text-default: var(--button-main-primary-inverted-text-default);
68
+ --button-floating-secondary-text-hover: var(--button-main-primary-inverted-text-hover);
69
+ --button-group-primary-disabled-background: var(--button-main-disabled-general-background);
70
+ --button-group-primary-disabled-border: var(--button-group-primary-inactive-border);
71
+ --button-group-primary-disabled-text: var(--button-main-disabled-general-text);
72
+ --button-group-primary-hover-background: var(--form-checkbox-radio-card-primary-hover-background);
73
+ --button-group-primary-hover-border: var(--form-checkbox-radio-card-primary-hover-border);
74
+ --button-group-primary-hover-text: var(--form-checkbox-radio-card-primary-hover-text);
75
+ --button-group-primary-inactive-background: var(--form-checkbox-radio-card-primary-default-background);
76
+ --button-group-primary-inactive-border: var(--form-checkbox-radio-card-primary-default-border-group);
77
+ --button-group-primary-inactive-text: var(--form-checkbox-radio-card-primary-default-text);
78
+ --button-group-primary-selected-background: var(--form-checkbox-radio-card-primary-selected-background);
79
+ --button-group-primary-selected-border: var(--form-checkbox-radio-card-primary-selected-border-group);
80
+ --button-group-primary-selected-text: var(--form-checkbox-radio-card-primary-selected-text);
81
+ --button-group-secondary-disabled-background: var(--tedi-alpha-01);
82
+ --button-group-secondary-disabled-border: var(--button-main-disabled-general-border);
83
+ --button-group-secondary-disabled-text: var(--button-main-disabled-general-text);
84
+ --button-group-secondary-hover-background: var(--form-checkbox-radio-card-secondary-hover-background);
85
+ --button-group-secondary-hover-border: var(--form-checkbox-radio-card-secondary-hover-border);
86
+ --button-group-secondary-hover-text: var(--form-checkbox-radio-card-secondary-hover-text);
87
+ --button-group-secondary-inactive-background: var(--form-checkbox-radio-card-secondary-default-background);
88
+ --button-group-secondary-inactive-border: var(--form-checkbox-radio-card-secondary-default-border);
89
+ --button-group-secondary-inactive-text: var(--form-checkbox-radio-card-secondary-default-text);
90
+ --button-group-secondary-selected-background: var(--form-checkbox-radio-card-secondary-selected-background);
91
+ --button-group-secondary-selected-border: var(--form-checkbox-radio-card-secondary-selected-border);
92
+ --button-group-secondary-selected-text: var(--form-checkbox-radio-card-secondary-selected-text);
93
+ --button-main-danger-background-active: var(--tedi-red-800);
94
+ --button-main-danger-background-default: var(--tedi-red-600);
95
+ --button-main-danger-background-focus: var(--tedi-red-600);
96
+ --button-main-danger-background-hover: var(--tedi-red-700);
97
+ --button-main-danger-border-active: var(--button-main-danger-background-active);
98
+ --button-main-danger-border-default: var(--button-main-danger-background-default);
99
+ --button-main-danger-border-focus: var(--button-main-danger-background-focus);
100
+ --button-main-danger-border-hover: var(--button-main-danger-background-hover);
101
+ --button-main-danger-neutral-background-active: var(--tedi-alpha-01);
102
+ --button-main-danger-neutral-background-default: var(--tedi-alpha-01);
103
+ --button-main-danger-neutral-background-focus: var(--tedi-alpha-01);
104
+ --button-main-danger-neutral-background-hover: var(--tedi-alpha-01);
105
+ --button-main-danger-neutral-border-active: var(--tedi-alpha-01);
106
+ --button-main-danger-neutral-border-default: var(--tedi-alpha-01);
107
+ --button-main-danger-neutral-border-focus: var(--tedi-neutral-100);
108
+ --button-main-danger-neutral-border-hover: var(--tedi-alpha-01);
109
+ --button-main-danger-neutral-icon-only-background-active: var(--tedi-red-200);
110
+ --button-main-danger-neutral-icon-only-background-default: var(--button-main-danger-neutral-background-default);
111
+ --button-main-danger-neutral-icon-only-background-focus: var(--button-main-danger-neutral-background-focus);
112
+ --button-main-danger-neutral-icon-only-background-hover: var(--tedi-red-100);
113
+ --button-main-danger-neutral-text-active: var(--tedi-red-800);
114
+ --button-main-danger-neutral-text-default: var(--muis-red-600);
115
+ --button-main-danger-neutral-text-focus: var(--tedi-red-600);
116
+ --button-main-danger-neutral-text-hover: var(--tedi-red-700);
117
+ --button-main-danger-text-default: var(--general-text-white);
118
+ --button-main-disabled-general-background: var(--muis-neutral-500);
119
+ --button-main-disabled-general-border: var(--muis-neutral-500);
120
+ --button-main-disabled-general-text: var(--muis-neutral-100);
121
+ --button-main-disabled-neutral-background: var(--button-main-neutral-background-default);
122
+ --button-main-disabled-neutral-border: var(--button-main-neutral-border-default);
123
+ --button-main-neutral-background-active: var(--tedi-alpha-01);
124
+ --button-main-neutral-background-default: var(--tedi-alpha-01);
125
+ --button-main-neutral-background-focus: var(--tedi-alpha-01);
126
+ --button-main-neutral-background-hover: var(--muis-blue-00);
127
+ --button-main-neutral-border-active: var(--tedi-alpha-01);
128
+ --button-main-neutral-border-default: var(--tedi-alpha-01);
129
+ --button-main-neutral-border-focus: var(--tedi-neutral-100);
130
+ --button-main-neutral-border-hover: var(--tedi-alpha-01);
131
+ --button-main-neutral-icon-only-background-active: var(--muis-primary-100);
132
+ --button-main-neutral-icon-only-background-default: var(--tedi-alpha-01);
133
+ --button-main-neutral-icon-only-background-focus: var(--button-main-neutral-icon-only-background-default);
134
+ --button-main-neutral-icon-only-background-hover: var(--muis-blue-00);
135
+ --button-main-neutral-inverted-background-active: var(--tedi-alpha-01);
136
+ --button-main-neutral-inverted-background-default: var(--tedi-alpha-01);
137
+ --button-main-neutral-inverted-background-focus: var(--tedi-alpha-01);
138
+ --button-main-neutral-inverted-background-hover: var(--tedi-alpha-01);
139
+ --button-main-neutral-inverted-border-active: var(--tedi-alpha-01);
140
+ --button-main-neutral-inverted-border-default: var(--tedi-alpha-01);
141
+ --button-main-neutral-inverted-border-focus: var(--tedi-neutral-100);
142
+ --button-main-neutral-inverted-border-hover: var(--tedi-alpha-01);
143
+ --button-main-neutral-inverted-icon-only-background-active: var(--button-main-secondary-inverted-background-active);
144
+ --button-main-neutral-inverted-icon-only-background-default: var(--button-main-secondary-inverted-background-default);
145
+ --button-main-neutral-inverted-icon-only-background-focus: var(--button-main-secondary-inverted-background-focus);
146
+ --button-main-neutral-inverted-icon-only-background-hover: var(--button-main-secondary-inverted-background-hover);
147
+ --button-main-neutral-inverted-text-active: var(--tedi-neutral-100);
148
+ --button-main-neutral-inverted-text-default: var(--tedi-neutral-100);
149
+ --button-main-neutral-inverted-text-focus: var(--tedi-neutral-100);
150
+ --button-main-neutral-inverted-text-hover: var(--tedi-primary-200);
151
+ --button-main-neutral-text-active: var(--muis-primary-500);
152
+ --button-main-neutral-text-default: var(--muis-primary-500);
153
+ --button-main-neutral-text-focus: var(--muis-primary-500);
154
+ --button-main-neutral-text-hover: var(--muis-primary-500);
155
+ --button-main-primary-background-active: var(--muis-primary-900);
156
+ --button-main-primary-background-default: var(--muis-primary-600);
157
+ --button-main-primary-background-focus: var(--muis-primary-900);
158
+ --button-main-primary-background-hover: var(--muis-primary-900);
159
+ --button-main-primary-border-active: var(--button-main-primary-background-active);
160
+ --button-main-primary-border-default: var(--button-main-primary-background-default);
161
+ --button-main-primary-border-focus: var(--button-main-primary-background-focus);
162
+ --button-main-primary-border-hover: var(--button-main-primary-background-hover);
163
+ --button-main-primary-inverted-background-active: var(--tedi-primary-300);
164
+ --button-main-primary-inverted-background-default: var(--tedi-primary-200);
165
+ --button-main-primary-inverted-background-focus: var(--button-main-primary-inverted-background-default);
166
+ --button-main-primary-inverted-background-hover: var(--tedi-primary-300);
167
+ --button-main-primary-inverted-border-active: var(--button-main-primary-inverted-background-active);
168
+ --button-main-primary-inverted-border-default: var(--button-main-primary-inverted-background-default);
169
+ --button-main-primary-inverted-border-focus: var(--button-main-primary-inverted-background-focus);
170
+ --button-main-primary-inverted-border-hover: var(--button-main-primary-inverted-background-hover);
171
+ --button-main-primary-inverted-text-active: var(--tedi-primary-800);
172
+ --button-main-primary-inverted-text-default: var(--tedi-primary-600);
173
+ --button-main-primary-inverted-text-hover: var(--tedi-primary-700);
174
+ --button-main-primary-text-active: var(--general-text-white);
175
+ --button-main-primary-text-default: var(--general-text-white);
176
+ --button-main-primary-text-hover: var(--general-text-white);
177
+ --button-main-secondary-background-active: var(--muis-primary-900);
178
+ --button-main-secondary-background-default: var(--muis-blue-0);
179
+ --button-main-secondary-background-focus: var(--muis-primary-900);
180
+ --button-main-secondary-background-hover: var(--muis-primary-900);
181
+ --button-main-secondary-border-active: var(--muis-primary-900);
182
+ --button-main-secondary-border-default: var(--muis-primary-900);
183
+ --button-main-secondary-border-focus: var(--muis-primary-900);
184
+ --button-main-secondary-border-hover: var(--muis-primary-900);
185
+ --button-main-secondary-inverted-background-active: var(--tedi-alpha-white-10);
186
+ --button-main-secondary-inverted-background-default: var(--tedi-alpha-01);
187
+ --button-main-secondary-inverted-background-focus: var(--tedi-alpha-01);
188
+ --button-main-secondary-inverted-background-hover: var(--tedi-alpha-white-10);
189
+ --button-main-secondary-inverted-border-active: var(--tedi-neutral-100);
190
+ --button-main-secondary-inverted-border-default: var(--tedi-alpha-white-50);
191
+ --button-main-secondary-inverted-border-focus: var(--tedi-neutral-100);
192
+ --button-main-secondary-inverted-border-hover: var(--tedi-neutral-100);
193
+ --button-main-secondary-inverted-text-default: var(--general-text-white);
194
+ --button-main-secondary-text-default: var(--muis-primary-600);
195
+ --button-main-success-background-active: var(--tedi-green-800);
196
+ --button-main-success-background-default: var(--tedi-green-600);
197
+ --button-main-success-background-focus: var(--tedi-green-600);
198
+ --button-main-success-background-hover: var(--tedi-green-700);
199
+ --button-main-success-border-active: var(--button-main-success-background-active);
200
+ --button-main-success-border-default: var(--button-main-success-background-default);
201
+ --button-main-success-border-focus: var(--button-main-success-background-focus);
202
+ --button-main-success-border-hover: var(--button-main-success-background-hover);
203
+ --button-main-success-text-default: var(--general-text-white);
204
+ --card-background-accent: var(--general-surface-accent);
205
+ --card-background-brand-primary: var(--general-surface-brand-primary);
206
+ --card-background-brand-quaternary: var(--general-surface-brand-quaternary);
207
+ --card-background-brand-secondary: var(--general-surface-brand-secondary);
208
+ --card-background-brand-tertiary: var(--general-surface-brand-tertiary);
209
+ --card-background-danger: var(--general-status-danger-background-primary);
210
+ --card-background-primary: var(--general-surface-tertiary);
211
+ --card-background-secondary: var(--general-surface-primary);
212
+ --card-background-success: var(--general-status-success-background-primary);
213
+ --card-background-tertiary: var(--general-surface-secondary);
214
+ --card-background-tertiary-2: var(--general-surface-tertiary);
215
+ --card-background-warning: var(--general-status-warning-background-light);
216
+ --card-body-background-distinctive-primary: var(--general-surface-brand-primary);
217
+ --card-body-background-primary: var(--general-surface-primary);
218
+ --card-body-background-secondary: var(--general-surface-secondary);
219
+ --card-border-distinctive: var(--card-body-background-distinctive-primary);
220
+ --card-border-primary: var(--muis-primary-400);
221
+ --card-border-selected: var(--general-border-brand);
222
+ --carousel-dot-background-active: var(--button-main-primary-background-active);
223
+ --carousel-dot-background-focus: var(--general-surface-primary);
224
+ --carousel-dot-background-selected: var(--button-main-primary-background-default);
225
+ --carousel-dot-border-active: var(--button-main-primary-background-active);
226
+ --carousel-dot-border-default: var(--button-main-primary-background-default);
227
+ --carousel-dot-border-focus: var(--button-main-primary-background-focus);
228
+ --carousel-dot-border-hover: var(--button-main-primary-background-hover);
229
+ --carousel-dot-border-selected: var(--button-main-primary-background-default);
230
+ --choice-group-active-text: var(--tedi-primary-600);
231
+ --dropdown-item-active-background: var(--general-surface-selected);
232
+ --dropdown-item-active-text: var(--general-text-white);
233
+ --dropdown-item-default-background: var(--general-surface-tertiary);
234
+ --dropdown-item-default-text: var(--general-text-primary);
235
+ --dropdown-item-disabled-background: var(--general-surface-disabled);
236
+ --dropdown-item-disabled-text: var(--general-text-disabled);
237
+ --dropdown-item-hover-background: var(--general-surface-hover);
238
+ --dropdown-item-hover-text: var(--tedi-primary-700);
239
+ --empty-state-background-primary: var(--general-surface-primary);
240
+ --empty-state-background-secondary: var(--general-surface-secondary);
241
+ --empty-state-background-tertiary: var(--general-surface-tertiary);
242
+ --empty-state-border: var(--card-border-primary);
243
+ --empty-state-icon-primary: var(--general-icon-brand);
244
+ --empty-state-icon-secondary: var(--general-icon-tertiary);
245
+ --file-dropzone-background-default: var(--form-input-background-default);
246
+ --file-dropzone-background-disabled: var(--form-general-background-disabled);
247
+ --file-dropzone-background-drop-over: var(--general-surface-brand-quaternary);
248
+ --file-dropzone-background-hover: var(--general-surface-hover);
249
+ --file-dropzone-border-active: var(--general-surface-active);
250
+ --file-dropzone-border-default: var(--form-input-border-default);
251
+ --file-dropzone-border-disabled: var(--form-general-border-disabled);
252
+ --file-dropzone-border-drop-over: var(--muis-primary-300);
253
+ --file-dropzone-border-focus: var(--form-input-border-focus);
254
+ --file-dropzone-border-hover: var(--form-input-border-hover);
255
+ --file-dropzone-text-default: var(--general-text-brand);
256
+ --file-dropzone-text-drop-over: var(--general-text-tertiary);
257
+ --filter-primary-active-background: var(--form-checkbox-radio-card-primary-selected-background);
258
+ --filter-primary-active-border: var(--form-checkbox-radio-card-primary-selected-border-group);
259
+ --filter-primary-active-text: var(--form-checkbox-radio-card-primary-selected-text);
260
+ --filter-primary-hover-background: var(--form-checkbox-radio-card-primary-hover-background);
261
+ --filter-primary-hover-border: var(--form-checkbox-radio-card-primary-hover-border);
262
+ --filter-primary-hover-text: var(--form-checkbox-radio-card-primary-hover-text);
263
+ --filter-primary-inactive-background: var(--form-checkbox-radio-card-primary-default-background);
264
+ --filter-primary-inactive-border: var(--form-checkbox-radio-card-primary-default-border-separate);
265
+ --filter-primary-inactive-text: var(--form-checkbox-radio-card-primary-default-text);
266
+ --filter-secondary-active-background: var(--form-checkbox-radio-card-secondary-selected-background);
267
+ --filter-secondary-active-border: var(--form-checkbox-radio-card-secondary-selected-border);
268
+ --filter-secondary-active-text: var(--form-checkbox-radio-card-secondary-selected-text);
269
+ --filter-secondary-hover-background: var(--form-checkbox-radio-card-secondary-hover-background);
270
+ --filter-secondary-hover-border: var(--form-checkbox-radio-card-secondary-hover-border);
271
+ --filter-secondary-hover-text: var(--form-checkbox-radio-card-secondary-hover-text);
272
+ --filter-secondary-inactive-background: var(--form-checkbox-radio-card-secondary-default-background);
273
+ --filter-secondary-inactive-border: var(--form-checkbox-radio-card-secondary-default-border);
274
+ --filter-secondary-inactive-text: var(--form-checkbox-radio-card-secondary-default-text);
275
+ --footer-background: var(--general-surface-inverted-secondary);
276
+ --footer-bottom-background: var(--general-surface-inverted-tertiary);
277
+ --footer-icon-background: var(--tedi-alpha-white-20);
278
+ --form-checkbox-radio-card-disabled-text: var(--button-main-disabled-general-text);
279
+ --form-checkbox-radio-card-primary-default-background: var(--general-surface-tertiary);
280
+ --form-checkbox-radio-card-primary-default-border-group: var(--button-main-secondary-border-default);
281
+ --form-checkbox-radio-card-primary-default-border-separate: var(--form-checkbox-radio-card-primary-default-background);
282
+ --form-checkbox-radio-card-primary-default-text: var(--general-text-secondary);
283
+ --form-checkbox-radio-card-primary-disabled-default-background: var(--form-general-background-disabled);
284
+ --form-checkbox-radio-card-primary-disabled-default-text: var(--general-text-disabled);
285
+ --form-checkbox-radio-card-primary-disabled-selected-background: var(--form-checkbox-radio-default-background-selected-disabled);
286
+ --form-checkbox-radio-card-primary-disabled-selected-text: var(--form-checkbox-radio-card-primary-selected-text);
287
+ --form-checkbox-radio-card-primary-hover-background: var(--muis-blue-00);
288
+ --form-checkbox-radio-card-primary-hover-border: var(--muis-primary-900);
289
+ --form-checkbox-radio-card-primary-hover-text: var(--muis-primary-900);
290
+ --form-checkbox-radio-card-primary-selected-background: var(--button-main-primary-background-default);
291
+ --form-checkbox-radio-card-primary-selected-border-group: var(--button-main-primary-border-active);
292
+ --form-checkbox-radio-card-primary-selected-border-separate: var(--form-checkbox-radio-card-primary-selected-background);
293
+ --form-checkbox-radio-card-primary-selected-text: var(--button-main-primary-text-default);
294
+ --form-checkbox-radio-card-secondary-default-background: var(--button-main-secondary-background-default);
295
+ --form-checkbox-radio-card-secondary-default-border: var(--form-checkbox-radio-card-primary-default-border-group);
296
+ --form-checkbox-radio-card-secondary-default-text: var(--form-checkbox-radio-card-primary-default-text);
297
+ --form-checkbox-radio-card-secondary-disabled-default-background: var(--general-surface-primary);
298
+ --form-checkbox-radio-card-secondary-disabled-default-border: var(--form-input-border-disabled);
299
+ --form-checkbox-radio-card-secondary-disabled-default-text: var(--general-text-disabled);
300
+ --form-checkbox-radio-card-secondary-disabled-selected-background: var(--general-surface-primary);
301
+ --form-checkbox-radio-card-secondary-disabled-selected-border: var(--form-checkbox-radio-default-border-selected-disabled);
302
+ --form-checkbox-radio-card-secondary-disabled-selected-text: var(--form-checkbox-radio-card-primary-disabled-selected-background);
303
+ --form-checkbox-radio-card-secondary-hover-background: var(--button-main-secondary-background-hover);
304
+ --form-checkbox-radio-card-secondary-hover-border: var(--button-main-secondary-border-hover);
305
+ --form-checkbox-radio-card-secondary-hover-text: var(--button-main-secondary-text-default);
306
+ --form-checkbox-radio-card-secondary-selected-background: var(--button-main-secondary-background-default);
307
+ --form-checkbox-radio-card-secondary-selected-border: var(--general-border-brand);
308
+ --form-checkbox-radio-card-secondary-selected-text: var(--general-text-brand);
309
+ --form-checkbox-radio-default-background-active: var(--tedi-primary-700);
310
+ --form-checkbox-radio-default-background-default: var(--tedi-neutral-100);
311
+ --form-checkbox-radio-default-background-error: var(--tedi-neutral-100);
312
+ --form-checkbox-radio-default-background-focus: var(--tedi-neutral-100);
313
+ --form-checkbox-radio-default-background-hover: var(--tedi-neutral-100);
314
+ --form-checkbox-radio-default-background-inverted: var(--tedi-primary-600);
315
+ --form-checkbox-radio-default-background-selected: var(--tedi-primary-600);
316
+ --form-checkbox-radio-default-background-selected-disabled: var(--tedi-primary-300);
317
+ --form-checkbox-radio-default-background-selected-inverted: var(--tedi-neutral-100);
318
+ --form-checkbox-radio-default-border-active: var(--tedi-primary-700);
319
+ --form-checkbox-radio-default-border-default: var(--form-general-border-default);
320
+ --form-checkbox-radio-default-border-focus: var(--form-general-border-default);
321
+ --form-checkbox-radio-default-border-hover: var(--tedi-primary-600);
322
+ --form-checkbox-radio-default-border-inverted: var(--tedi-neutral-100);
323
+ --form-checkbox-radio-default-border-selected: var(--tedi-primary-600);
324
+ --form-checkbox-radio-default-border-selected-disabled: var(--tedi-primary-300);
325
+ --form-checkbox-radio-default-border-selected-inverted: var(--tedi-neutral-100);
326
+ --form-checkbox-radio-default-check-indicator-active: var(--tedi-neutral-100);
327
+ --form-checkbox-radio-default-check-indicator-default: var(--tedi-neutral-100);
328
+ --form-datepicker-date-active: var(--muis-primary-200);
329
+ --form-datepicker-date-available: var(--general-status-success-background-primary);
330
+ --form-datepicker-date-default: var(--button-main-secondary-background-default);
331
+ --form-datepicker-date-hover: var(--muis-blue-00);
332
+ --form-datepicker-date-selected: var(--general-surface-brand-primary);
333
+ --form-datepicker-date-text-available: var(--general-status-success-text);
334
+ --form-datepicker-date-text-muted: var(--general-text-disabled);
335
+ --form-datepicker-date-text-selected: var(--general-text-white);
336
+ --form-datepicker-today-border: var(--general-border-brand);
337
+ --form-datepicker-today-border-secondary: var(--tedi-neutral-100);
338
+ --form-general-background-action-background: var(--general-surface-secondary);
339
+ --form-general-background-default: var(--general-surface-tertiary);
340
+ --form-general-background-disabled: var(--muis-neutral-500);
341
+ --form-general-border-default: var(--tedi-neutral-500);
342
+ --form-general-border-disabled: var(--tedi-neutral-350);
343
+ --form-general-feedback-error-border: var(--tedi-red-700);
344
+ --form-general-feedback-error-text: var(--general-status-danger-text);
345
+ --form-general-feedback-success-border: var(--tedi-green-600);
346
+ --form-general-feedback-success-text: var(--general-status-success-text);
347
+ --form-hidden-default: var(--tedi-alpha-01);
348
+ --form-hidden-hover: var(--general-surface-secondary);
349
+ --form-input-background-default: var(--form-general-background-default);
350
+ --form-input-background-disabled: var(--form-general-background-disabled);
351
+ --form-input-border-active: var(--muis-primary-400);
352
+ --form-input-border-default: var(--form-general-border-default);
353
+ --form-input-border-disabled: var(--form-general-border-disabled);
354
+ --form-input-border-focus: var(--form-input-border-hover);
355
+ --form-input-border-hover: var(--muis-primary-900);
356
+ --form-input-text-disabled: var(--general-text-secondary);
357
+ --form-input-text-filled: var(--general-text-primary);
358
+ --form-input-text-placeholder: var(--tedi-neutral-550);
359
+ --form-slider-active-background-active: var(--tedi-blue-800);
360
+ --form-slider-active-background-default: var(--tedi-blue-600);
361
+ --form-slider-active-background-disabled: var(--tedi-neutral-400);
362
+ --form-slider-active-background-focus: var(--tedi-blue-600);
363
+ --form-slider-active-background-hover: var(--tedi-blue-700);
364
+ --form-slider-border-default: var(--tedi-neutral-500);
365
+ --form-slider-passive-background-default: var(--tedi-neutral-200);
366
+ --form-slider-range-label-text: var(--general-text-tertiary);
367
+ --form-slider-thumb-background-active: var(--general-surface-brand-tertiary);
368
+ --form-slider-thumb-background-default: var(--tedi-neutral-100);
369
+ --form-slider-thumb-background-disabled: var(--tedi-neutral-100);
370
+ --form-slider-thumb-background-focus: var(--tedi-neutral-100);
371
+ --form-slider-thumb-background-hover: var(--general-surface-brand-tertiary);
372
+ --form-slider-thumb-border-active: var(--tedi-blue-800);
373
+ --form-slider-thumb-border-default: var(--tedi-blue-600);
374
+ --form-slider-thumb-border-disabled: var(--tedi-neutral-400);
375
+ --form-slider-thumb-border-focus: var(--tedi-blue-600);
376
+ --form-slider-thumb-border-hover: var(--tedi-blue-700);
377
+ --form-slider-track: var(--general-surface-primary);
378
+ --form-toggl-colored-active-active: var(--button-main-success-background-active);
379
+ --form-toggl-colored-active-default: var(--button-main-success-background-default);
380
+ --form-toggl-colored-active-hover: var(--button-main-success-background-hover);
381
+ --form-toggl-colored-active-icon: var(--general-icon-success);
382
+ --form-toggl-colored-active-icon-outlined: var(--general-icon-white);
383
+ --form-toggl-colored-active-indicator: var(--tedi-neutral-100);
384
+ --form-toggl-colored-inactive-active: var(--button-main-danger-background-active);
385
+ --form-toggl-colored-inactive-default: var(--button-main-danger-background-default);
386
+ --form-toggl-colored-inactive-hover: var(--button-main-danger-background-hover);
387
+ --form-toggl-colored-inactive-icon: var(--general-icon-danger);
388
+ --form-toggl-colored-inactive-icon-outlined: var(--general-icon-white);
389
+ --form-toggl-colored-inactive-indicator: var(--tedi-neutral-100);
390
+ --form-toggl-outlined-background: var(--tedi-alpha-01);
391
+ --form-toggl-primary-active-active: var(--button-main-primary-background-active);
392
+ --form-toggl-primary-active-default: var(--button-main-primary-background-default);
393
+ --form-toggl-primary-active-hover: var(--button-main-primary-background-hover);
394
+ --form-toggl-primary-active-icon: var(--general-icon-brand);
395
+ --form-toggl-primary-active-icon-outlined: var(--general-icon-white);
396
+ --form-toggl-primary-active-indicator: var(--tedi-neutral-100);
397
+ --form-toggl-primary-inactive-active: var(--tedi-neutral-550);
398
+ --form-toggl-primary-inactive-default: var(--tedi-neutral-450);
399
+ --form-toggl-primary-inactive-hover: var(--tedi-neutral-500);
400
+ --form-toggl-primary-inactive-icon: var(--general-icon-tertiary);
401
+ --form-toggl-primary-inactive-icon-outlined: var(--general-icon-white);
402
+ --form-toggl-primary-inactive-indicator: var(--tedi-neutral-100);
403
+ --general-border-accent: var(--muis-red-600);
404
+ --general-border-brand: var(--muis-primary-400);
405
+ --general-border-primary: var(--muis-neutral-650);
406
+ --general-border-secondary: var(--tedi-neutral-450);
407
+ --general-border-white: var(--muis-neutral-100);
408
+ --general-icon-accent: var(--tedi-orange-700);
409
+ --general-icon-background-brand-primary: var(--general-surface-brand-primary);
410
+ --general-icon-background-brand-secondary: var(--general-surface-brand-tertiary);
411
+ --general-icon-background-primary: var(--tedi-neutral-100);
412
+ --general-icon-background-secondary: var(--tedi-alpha-white-30);
413
+ --general-icon-brand: var(--muis-primary-500);
414
+ --general-icon-brand-dark: var(--muis-primary-900);
415
+ --general-icon-danger: var(--muis-red-600);
416
+ --general-icon-primary: var(--muis-primary-500);
417
+ --general-icon-secondary: var(--muis-primary-900);
418
+ --general-icon-success: var(--tedi-green-700);
419
+ --general-icon-tertiary: var(--muis-primary-600);
420
+ --general-icon-warning: var(--tedi-yellow-700);
421
+ --general-icon-warning-dark: var(--tedi-yellow-800);
422
+ --general-icon-white: var(--muis-neutral-100);
423
+ --general-separator-primary: var(--general-border-primary);
424
+ --general-status-danger-background-primary: var(--tedi-red-100);
425
+ --general-status-danger-background-secondary: var(--tedi-red-600);
426
+ --general-status-danger-background-tertiary: var(--tedi-red-700);
427
+ --general-status-danger-border: var(--tedi-red-500);
428
+ --general-status-danger-text: var(--tedi-red-700);
429
+ --general-status-info-background-dark: var(--tedi-blue-600);
430
+ --general-status-info-background-light: var(--tedi-blue-200);
431
+ --general-status-info-border: var(--tedi-blue-500);
432
+ --general-status-info-text: var(--tedi-blue-700);
433
+ --general-status-neutral-background-dark: var(--tedi-neutral-450);
434
+ --general-status-neutral-background-light: var(--tedi-neutral-300);
435
+ --general-status-neutral-border: var(--tedi-neutral-450);
436
+ --general-status-neutral-text: var(--general-text-primary);
437
+ --general-status-success-background-primary: var(--tedi-green-100);
438
+ --general-status-success-background-primary: var(--tedi-green-200);
439
+ --general-status-success-background-secondary: var(--tedi-green-600);
440
+ --general-status-success-background-tertiary: var(--tedi-green-700);
441
+ --general-status-success-border: var(--tedi-green-500);
442
+ --general-status-success-text: var(--tedi-green-700);
443
+ --general-status-warning-background-dark: var(--tedi-yellow-600);
444
+ --general-status-warning-background-light: var(--tedi-yellow-200);
445
+ --general-status-warning-background-primary: var(--tedi-yellow-100);
446
+ --general-status-warning-border: var(--tedi-yellow-600);
447
+ --general-status-warning-text: var(--tedi-yellow-800);
448
+ --general-surface-accent: var(--muis-blue-0);
449
+ --general-surface-active: var(--muis-primary-400);
450
+ --general-surface-brand-primary: var(--muis-primary-500);
451
+ --general-surface-brand-quaternary: var(--muis-blue-0);
452
+ --general-surface-brand-secondary: var(--muis-primary-900);
453
+ --general-surface-brand-tertiary: var(--tedi-primary-200);
454
+ --general-surface-disabled: var(--muis-neutral-500);
455
+ --general-surface-hover: var(--muis-blue-00);
456
+ --general-surface-inverted-primary: var(--tedi-neutral-600);
457
+ --general-surface-inverted-secondary: var(--tedi-neutral-750);
458
+ --general-surface-inverted-tertiary: var(--tedi-neutral-800);
459
+ --general-surface-overlay: var(--tedi-alpha-40);
460
+ --general-surface-primary: var(--muis-neutral-200);
461
+ --general-surface-secondary: var(--muis-neutral-350);
462
+ --general-surface-selected: var(--muis-primary-900);
463
+ --general-surface-success: var(--general-status-success-background-primary);
464
+ --general-surface-tertiary: var(--muis-neutral-100);
465
+ --general-text-brand: var(--muis-primary-500);
466
+ --general-text-dark: var(--muis-primary-900);
467
+ --general-text-disabled: var(--muis-neutral-100);
468
+ --general-text-primary: var(--muis-primary-1000);
469
+ --general-text-secondary: var(--muis-neutral-700);
470
+ --general-text-tertiary: var(--muis-neutral-700);
471
+ --general-text-text-inverted-tehik: var(--tedi-neutral-100);
472
+ --general-text-white: var(--muis-neutral-100);
473
+ --header-background: var(--general-surface-tertiary);
474
+ --header-bottom-border: var(--tedi-neutral-100);
475
+ --header-modal-item-active-background: var(--dropdown-item-active-background);
476
+ --header-modal-item-active-text: var(--dropdown-item-active-text);
477
+ --header-modal-item-default-background: var(--dropdown-item-default-background);
478
+ --header-modal-item-default-text: var(--general-text-brand);
479
+ --header-modal-item-disabled-background: var(--dropdown-item-disabled-background);
480
+ --header-modal-item-disabled-text: var(--dropdown-item-disabled-text);
481
+ --header-modal-item-hover-background: var(--dropdown-item-hover-background);
482
+ --header-modal-item-hover-text: var(--dropdown-item-hover-text);
483
+ --header-popover-border-top: var(--tedi-primary-400);
484
+ --header-popover-item-active: var(--general-surface-active);
485
+ --header-popover-item-hover: var(--general-surface-hover);
486
+ --header-popover-item-selected: var(--general-surface-selected);
487
+ --link-inverted-active: var(--general-text-white);
488
+ --link-inverted-default: var(--general-text-white);
489
+ --link-inverted-focus: var(--general-text-white);
490
+ --link-inverted-hover: var(--general-text-white);
491
+ --link-primary-active: var(--muis-primary-900);
492
+ --link-primary-default: var(--muis-primary-500);
493
+ --link-primary-focus: var(--muis-primary-500);
494
+ --link-primary-hover: var(--muis-primary-600);
495
+ --loader-skeleton-color: rgb(146 147 164 / 20%);
496
+ --loader-spinner-color-primary: var(--tedi-neutral-450);
497
+ --loader-spinner-color-secondary: var(--tedi-alpha-white-80);
498
+ --modal-background: var(--muis-neutral-100);
499
+ --modal-border-inner: var(--general-border-primary);
500
+ --modal-border-outer: var(--general-border-primary);
501
+ --modal-footer-border-top: var(--general-border-primary);
502
+ --navigation-horizontal-background: var(--navigation-vertical-background);
503
+ --navigation-horizontal-group-title-text: var(--navigation-vertical-group-title-text);
504
+ --navigation-horizontal-item-background-active: var(--navigation-vertical-item-background-active);
505
+ --navigation-horizontal-item-background-default: var(--navigation-vertical-item-background-default);
506
+ --navigation-horizontal-item-background-focus: var(--navigation-vertical-item-background-focus);
507
+ --navigation-horizontal-item-background-hover: var(--navigation-vertical-item-background-hover);
508
+ --navigation-horizontal-item-background-selected: var(--navigation-vertical-item-background-active);
509
+ --navigation-horizontal-item-border: var(--navigation-vertical-item-border);
510
+ --navigation-horizontal-item-text: var(--navigation-vertical-item-text);
511
+ --navigation-horizontal-submenu-background: var(--navigation-horizontal-item-background-selected);
512
+ --navigation-horizontal-submenu-item-border: var(--navigation-vertical-item-border);
513
+ --navigation-horizontal-submenu-item-border-active: var(--tedi-neutral-100);
514
+ --navigation-horizontal-submenu-item-border-default: var(--tedi-primary-200);
515
+ --navigation-horizontal-submenu-item-border-focus: var(--tedi-alpha-01);
516
+ --navigation-horizontal-submenu-item-border-hover: var(--tedi-neutral-100);
517
+ --navigation-horizontal-submenu-item-border-selected: var(--tedi-neutral-100);
518
+ --navigation-horizontal-submenu-item-text-active: var(--tedi-neutral-100);
519
+ --navigation-horizontal-submenu-item-text-default: var(--tedi-primary-200);
520
+ --navigation-horizontal-submenu-item-text-focus: var(--navigation-horizontal-submenu-item-text-default);
521
+ --navigation-horizontal-submenu-item-text-hover: var(--tedi-neutral-100);
522
+ --navigation-horizontal-submenu-item-text-selected: var(--tedi-neutral-100);
523
+ --navigation-vertical-background: var(--navigation-vertical-item-background-default);
524
+ --navigation-vertical-group-title-text: var(--tedi-primary-200);
525
+ --navigation-vertical-item-background-active: var(--tedi-primary-800);
526
+ --navigation-vertical-item-background-arrow-button-active: var(--button-main-primary-background-active);
527
+ --navigation-vertical-item-background-arrow-button-hover: var(--button-main-primary-background-active);
528
+ --navigation-vertical-item-background-default: var(--tedi-primary-600);
529
+ --navigation-vertical-item-background-focus: var(--tedi-primary-600);
530
+ --navigation-vertical-item-background-hover: var(--tedi-primary-700);
531
+ --navigation-vertical-item-border: var(--tedi-primary-800);
532
+ --navigation-vertical-item-text: var(--general-text-white);
533
+ --navigation-vertical-tree-brand-active: var(--tedi-primary-500);
534
+ --navigation-vertical-tree-brand-default: var(--tedi-primary-400);
535
+ --navigation-vertical-tree-brand-hover: var(--tedi-primary-500);
536
+ --navigation-vertical-tree-neutral-active: var(--tedi-neutral-450);
537
+ --navigation-vertical-tree-neutral-default: var(--tedi-neutral-350);
538
+ --navigation-vertical-tree-neutral-hover: var(--tedi-neutral-400);
539
+ --popover-background: var(--general-surface-primary);
540
+ --popover-border: var(--general-border-white);
541
+ --popover-text: var(--general-text-primary);
542
+ --progress-bar-background-active: var(--form-slider-active-background-default);
543
+ --progress-bar-background-passive: var(--form-slider-passive-background-default);
544
+ --progress-bar-border-default: var(--form-slider-border-default);
545
+ --progress-bar-range-label-text: var(--form-slider-range-label-text);
546
+ --status-badge-background-accent: var(--tedi-orange-200);
547
+ --status-badge-background-brand: var(--general-status-info-background-light);
548
+ --status-badge-background-danger: var(--general-status-danger-background-primary);
549
+ --status-badge-background-neutral: var(--general-status-neutral-background-light);
550
+ --status-badge-background-success: var(--general-status-success-background-primary);
551
+ --status-badge-background-transparent: var(--tedi-alpha-01);
552
+ --status-badge-background-warning: var(--general-status-warning-background-light);
553
+ --status-badge-border-accent: var(--tedi-orange-600);
554
+ --status-badge-border-brand: var(--general-status-info-border);
555
+ --status-badge-border-danger: var(--general-status-danger-border);
556
+ --status-badge-border-neutral: var(--general-status-neutral-border);
557
+ --status-badge-border-success: var(--general-status-success-border);
558
+ --status-badge-border-warning: var(--general-status-warning-border);
559
+ --status-badge-icon-accent: var(--general-icon-accent);
560
+ --status-badge-icon-brand: var(--general-icon-brand-dark);
561
+ --status-badge-icon-danger: var(--general-icon-danger);
562
+ --status-badge-icon-neutral: var(--general-icon-primary);
563
+ --status-badge-icon-success: var(--general-icon-success);
564
+ --status-badge-icon-warning: var(--general-icon-warning-dark);
565
+ --status-badge-indicator-border: var(--general-surface-primary);
566
+ --status-badge-indicator-danger: var(--general-status-danger-background-secondary);
567
+ --status-badge-indicator-inactive: var(--general-status-neutral-background-dark);
568
+ --status-badge-indicator-success: var(--general-status-success-background-secondary);
569
+ --status-badge-indicator-warning: var(--general-status-warning-background-dark);
570
+ --status-badge-text-accent: var(--tedi-orange-700);
571
+ --status-badge-text-brand: var(--general-status-info-text);
572
+ --status-badge-text-danger: var(--general-status-danger-text);
573
+ --status-badge-text-neutral: var(--general-status-neutral-text);
574
+ --status-badge-text-success: var(--general-status-success-text);
575
+ --status-badge-text-warning: var(--general-status-warning-text);
576
+ --stepper-background: var(--general-surface-tertiary);
577
+ --stepper-item-horizontal-text-completed-default: var(--tedi-green-700);
578
+ --stepper-item-horizontal-text-completed-hover: var(--tedi-green-800);
579
+ --stepper-item-horizontal-text-danger-default: var(--tedi-red-700);
580
+ --stepper-item-horizontal-text-danger-hover: var(--tedi-red-800);
581
+ --stepper-item-horizontal-text-default: var(--general-text-secondary);
582
+ --stepper-item-horizontal-text-hover: var(--muis-primary-900);
583
+ --stepper-item-horizontal-text-selected: var(--general-text-white);
584
+ --stepper-item-horizontal-type-completed-bg-active: var(--tedi-green-300);
585
+ --stepper-item-horizontal-type-completed-bg-default: var(--general-status-success-background-primary);
586
+ --stepper-item-horizontal-type-completed-bg-hover: var(--tedi-green-200);
587
+ --stepper-item-horizontal-type-danger-bg-active: var(--tedi-red-300);
588
+ --stepper-item-horizontal-type-danger-bg-default: var(--tedi-red-200);
589
+ --stepper-item-horizontal-type-danger-bg-hover: var(--tedi-red-300);
590
+ --stepper-item-horizontal-type-default-bg-active: var(--muis-primary-100);
591
+ --stepper-item-horizontal-type-default-bg-default: var(--general-surface-tertiary);
592
+ --stepper-item-horizontal-type-default-bg-hover: var(--muis-blue-00);
593
+ --stepper-item-horizontal-type-selected-bg-default: var(--general-border-brand);
594
+ --stepper-item-vertical-line: var(--timeline-default);
595
+ --stepper-item-vertical-mobile-progressbar-completed: var(--general-status-success-background-tertiary);
596
+ --stepper-item-vertical-mobile-progressbar-default: var(--stepper-item-vertical-line);
597
+ --stepper-item-vertical-text-default: var(--general-text-primary);
598
+ --stepper-item-vertical-text-disabled: var(--general-text-disabled);
599
+ --stepper-item-vertical-text-hover: var(--link-primary-hover);
600
+ --stepper-item-vertical-text-selected: var(--link-primary-hover);
601
+ --stepper-step-completed-bg: var(--general-status-success-background-tertiary);
602
+ --stepper-step-completed-bg-hover: var(--tedi-green-800);
603
+ --stepper-step-danger-bg: var(--general-status-danger-background-tertiary);
604
+ --stepper-step-danger-bg-hover: var(--tedi-red-800);
605
+ --stepper-step-default-bg: var(--general-surface-primary);
606
+ --stepper-step-default-bg-hover: var(--tedi-primary-800);
607
+ --stepper-step-default-border: var(--timeline-default);
608
+ --stepper-step-default-border-hover: var(--general-border-brand);
609
+ --stepper-step-disabled-bg: var(--general-surface-disabled);
610
+ --stepper-step-disabled-border: var(--timeline-default);
611
+ --stepper-step-selected-bg: var(--general-surface-primary);
612
+ --stepper-step-selected-border: var(--general-surface-active);
613
+ --stepper-step-selected-border-hover: var(--tedi-primary-800);
614
+ --tab-background: var(--general-surface-secondary);
615
+ --tab-item-active-background: var(--general-surface-brand-tertiary);
616
+ --tab-item-active-text: var(--tedi-primary-700);
617
+ --tab-item-default-background: var(--tedi-alpha-01);
618
+ --tab-item-default-text: var(--general-text-primary);
619
+ --tab-item-hover-background: var(--general-surface-hover);
620
+ --tab-item-hover-text: var(--tedi-primary-700);
621
+ --tab-item-selected-background: var(--general-surface-primary);
622
+ --tab-item-selected-border: var(--general-surface-selected);
623
+ --tab-item-selected-text: var(--tedi-primary-600);
624
+ --table-active: var(--general-surface-brand-tertiary);
625
+ --table-border: var(--general-border-primary);
626
+ --table-border-th: var(--general-border-secondary);
627
+ --table-default: var(--general-surface-tertiary);
628
+ --table-hover: var(--general-surface-hover);
629
+ --table-striped: var(--general-surface-secondary);
630
+ --tag-danger-background: var(--general-status-danger-background-primary);
631
+ --tag-danger-border: var(--tedi-red-300);
632
+ --tag-primary-background: var(--tedi-primary-100);
633
+ --tag-primary-border: var(--tedi-primary-200);
634
+ --tag-secondary-background: var(--tedi-neutral-300);
635
+ --tag-secondary-border: var(--tedi-neutral-300);
636
+ --timeline-completed: var(--general-border-accent);
637
+ --timeline-default: var(--general-border-secondary);
638
+ --tooltip-background: var(--general-surface-inverted-primary);
639
+ --tooltip-text: var(--general-text-white);
640
+ }