@solid-design-system/tokens 7.0.0-next.1 → 7.0.0-next.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,7 +5,7 @@
5
5
  --sd-accordion--hover-color-background: var(--sd-color-neutral-100);
6
6
  --sd-accordion--open-color-text: var(--sd-color-black);
7
7
  --sd-accordion-border-width: var(--sd-spacing-0\.5);
8
- --sd-accordion-color-border: var(--sd-color-neutral-500);
8
+ --sd-accordion-color-border: var(--sd-color-neutral-400);
9
9
  --sd-accordion-color-icon-fill: var(--sd-color-neutral-700);
10
10
  --sd-accordion-color-text: var(--sd-color-black);
11
11
  --sd-accordion-padding-block: 0.9375rem;
@@ -62,7 +62,7 @@
62
62
  --sd-button--primary--default-color-background: var(--sd-color-info);
63
63
  --sd-button--primary--default-color-text: var(--sd-color-white);
64
64
  --sd-button--primary--disabled-color-background: var(--sd-color-primary-300);
65
- --sd-button--primary--hover-color-background: var(--sd-color-primary-750);
65
+ --sd-button--primary--hover-color-background: var(--sd-color-primary-700);
66
66
  --sd-button--primary--hover-color-text: var(--sd-color-primary-100);
67
67
  --sd-button--primary--inverted--active-color-background: var(--sd-color-primary-100);
68
68
  --sd-button--primary--inverted--active-color-text: var(--sd-color-primary-800);
@@ -124,16 +124,42 @@
124
124
  --sd-carousel__pager-dot-border-width: var(--sd-spacing-0\.5);
125
125
  --sd-checkbox--invalid-color-background: 253 237 237;
126
126
  --sd-checkbox-border-width: var(--sd-spacing-0\.5);
127
- --sd-chip--primary-200-color-background: 237 240 244;
128
- --sd-chip--primary-200-color-border: var(--sd-color-primary-900);
129
- --sd-chip--primary-300-color-background: 237 248 253;
130
- --sd-chip--primary-300-color-border: 0 121 168;
131
- --sd-chip--primary-500-color-background: 237 248 253;
132
- --sd-chip--primary-500-color-border: 0 121 168;
133
- --sd-chip--primary-500-color-text: var(--sd-color-black);
134
- --sd-chip--white-color-background: 250 250 250;
135
- --sd-chip--white-color-border: var(--sd-color-primary-900);
127
+ --sd-chip--neutral-high-color-background: 237 248 253;
128
+ --sd-chip--neutral-high-color-border: 0 121 168;
129
+ --sd-chip--neutral-high-color-filled-border: 0 121 168;
130
+ --sd-chip--neutral-high-color-outline-fill: 237 248 253;
131
+ --sd-chip--neutral-low-color-background: 237 240 244;
132
+ --sd-chip--neutral-low-color-border: var(--sd-color-primary-900);
133
+ --sd-chip--neutral-low-color-filled-border: var(--sd-color-primary-900);
134
+ --sd-chip--neutral-low-color-outline-fill: 237 240 244;
135
+ --sd-chip--neutral-medium-color-background: 237 248 253;
136
+ --sd-chip--neutral-medium-color-border: 0 121 168;
137
+ --sd-chip--neutral-medium-color-filled-border: 0 121 168;
138
+ --sd-chip--neutral-medium-color-outline-fill: 237 248 253;
139
+ --sd-chip--neutral-strong-color-border: 0 121 168;
140
+ --sd-chip--neutral-strong-color-outline-fill: 237 248 253;
141
+ --sd-chip--neutral-subtle-color-background: 237 240 244;
142
+ --sd-chip--neutral-subtle-color-filled-border: var(--sd-color-primary-900);
143
+ --sd-chip--primary-high-color-background: 237 248 253;
144
+ --sd-chip--primary-high-color-border: 0 121 168;
145
+ --sd-chip--primary-high-color-filled-border: 0 121 168;
146
+ --sd-chip--primary-high-color-outline-fill: 237 248 253;
147
+ --sd-chip--primary-low-color-background: 237 240 244;
148
+ --sd-chip--primary-low-color-border: var(--sd-color-primary-900);
149
+ --sd-chip--primary-low-color-filled-border: var(--sd-color-primary-900);
150
+ --sd-chip--primary-low-color-outline-fill: 237 240 244;
151
+ --sd-chip--primary-medium-color-background: 237 248 253;
152
+ --sd-chip--primary-medium-color-border: 0 121 168;
153
+ --sd-chip--primary-medium-color-filled-border: 0 121 168;
154
+ --sd-chip--primary-medium-color-outline-fill: 237 248 253;
155
+ --sd-chip--primary-strong-color-border: 0 121 168;
156
+ --sd-chip--primary-strong-color-outline-fill: 237 248 253;
157
+ --sd-chip--primary-subtle-color-background: 237 240 244;
158
+ --sd-chip--primary-subtle-color-filled-border: var(--sd-color-primary-900);
159
+ --sd-chip--white-color-background: 237 240 244;
160
+ --sd-chip--white-color-filled-border: var(--sd-color-primary-900);
136
161
  --sd-chip-border-radius: var(--sd-spacing-1);
162
+ --sd-chip-border-width: var(--sd-spacing-0\.25);
137
163
  --sd-choice-control-font-weight: var(--sd-font-weight-bold);
138
164
  --sd-color-accent-100: 253 177 179;
139
165
  --sd-color-accent-200: 248 178 128;
@@ -146,38 +172,42 @@
146
172
  --sd-color-accent-800: 233 72 0;
147
173
  --sd-color-accent: 240 100 0;
148
174
  --sd-color-background-accent-300: var(--sd-color-primary-400);
149
- --sd-color-background-accent-500: var(--sd-color-primary-750);
150
- --sd-color-background-accent-550: var(--sd-color-info);
175
+ --sd-color-background-accent-500: var(--sd-color-primary-700);
176
+ --sd-color-background-accent-550: var(--sd-color-primary-600);
151
177
  --sd-color-background-accent-700: var(--sd-color-primary-800);
152
178
  --sd-color-background-accent: var(--sd-color-info);
153
- --sd-color-background-error-400: var(--sd-color-error);
154
- --sd-color-background-error: var(--sd-color-error);
179
+ --sd-color-background-error-400: var(--sd-color-error-400);
180
+ --sd-color-background-error: var(--sd-color-error-300);
155
181
  --sd-color-background-info: var(--sd-color-info);
156
182
  --sd-color-background-neutral-100: var(--sd-color-neutral-100);
157
183
  --sd-color-background-neutral-200: var(--sd-color-neutral-100);
158
184
  --sd-color-background-neutral-300: var(--sd-color-neutral-200);
159
185
  --sd-color-background-neutral-400: var(--sd-color-neutral-300);
160
- --sd-color-background-neutral-500: var(--sd-color-neutral-500);
161
- --sd-color-background-neutral-600: var(--sd-color-neutral-700);
162
- --sd-color-background-neutral-800: var(--sd-color-black);
186
+ --sd-color-background-neutral-500: var(--sd-color-neutral-400);
187
+ --sd-color-background-neutral-600: var(--sd-color-neutral-600);
188
+ --sd-color-background-neutral-800: var(--sd-color-neutral-800);
189
+ --sd-color-background-neutral-blue: 237 248 253;
190
+ --sd-color-background-neutral-grey: 237 240 244;
163
191
  --sd-color-background-primary-100: var(--sd-color-primary-100);
164
192
  --sd-color-background-primary-200: var(--sd-color-primary-200);
165
193
  --sd-color-background-primary-300: var(--sd-color-primary-300);
166
194
  --sd-color-background-primary-500: var(--sd-color-primary-500);
167
195
  --sd-color-background-primary-800: var(--sd-color-primary-800);
168
- --sd-color-background-primary: var(--sd-color-info);
196
+ --sd-color-background-primary: var(--sd-color-primary-600);
169
197
  --sd-color-background-success: var(--sd-color-success);
170
198
  --sd-color-background-warning: var(--sd-color-warning);
199
+ --sd-color-background-white-translucent: 255 255 255 / 0;
171
200
  --sd-color-background-white: var(--sd-color-white);
172
201
  --sd-color-black: 0 0 0 / 0.86;
173
- --sd-color-border-accent-550: var(--sd-color-info);
202
+ --sd-color-border-accent-550: var(--sd-color-primary-600);
174
203
  --sd-color-border-accent: var(--sd-color-info);
175
- --sd-color-border-error-400: var(--sd-color-error);
176
- --sd-color-border-error: var(--sd-color-error);
204
+ --sd-color-border-error-400: var(--sd-color-error-400);
205
+ --sd-color-border-error: var(--sd-color-error-300);
177
206
  --sd-color-border-neutral-400: var(--sd-color-neutral-300);
178
- --sd-color-border-neutral-500: var(--sd-color-neutral-500);
179
- --sd-color-border-neutral-600: var(--sd-color-neutral-700);
180
- --sd-color-border-neutral-800: var(--sd-color-black);
207
+ --sd-color-border-neutral-500: var(--sd-color-neutral-400);
208
+ --sd-color-border-neutral-600: var(--sd-color-neutral-600);
209
+ --sd-color-border-neutral-800: var(--sd-color-neutral-800);
210
+ --sd-color-border-neutral-blue: 0 121 168;
181
211
  --sd-color-border-primary-100: var(--sd-color-primary-100);
182
212
  --sd-color-border-primary-200: var(--sd-color-primary-200);
183
213
  --sd-color-border-primary-400: var(--sd-color-primary-400);
@@ -191,15 +221,15 @@
191
221
  --sd-color-error-400: 210 0 0;
192
222
  --sd-color-error-500: 210 0 0;
193
223
  --sd-color-error: 210 0 0;
194
- --sd-color-icon-fill-accent-550: var(--sd-color-accent);
224
+ --sd-color-icon-fill-accent-550: var(--sd-color-accent-550);
195
225
  --sd-color-icon-fill-accent: var(--sd-color-accent-300);
196
226
  --sd-color-icon-fill-content-icons-primary: var(--sd-color-info);
197
- --sd-color-icon-fill-error-400: var(--sd-color-error);
198
- --sd-color-icon-fill-error: var(--sd-color-error);
227
+ --sd-color-icon-fill-error-400: var(--sd-color-error-400);
228
+ --sd-color-icon-fill-error: var(--sd-color-error-300);
199
229
  --sd-color-icon-fill-neutral-400: var(--sd-color-neutral-200);
200
- --sd-color-icon-fill-neutral-500: var(--sd-color-neutral-500);
230
+ --sd-color-icon-fill-neutral-500: var(--sd-color-neutral-400);
201
231
  --sd-color-icon-fill-neutral-600: 255 255 255 / 0.4;
202
- --sd-color-icon-fill-neutral-800: var(--sd-color-black);
232
+ --sd-color-icon-fill-neutral-800: var(--sd-color-neutral-800);
203
233
  --sd-color-icon-fill-primary-100: var(--sd-color-primary-100);
204
234
  --sd-color-icon-fill-primary-200: var(--sd-color-primary-200);
205
235
  --sd-color-icon-fill-primary-400: 255 255 255 / 0.84;
@@ -240,15 +270,15 @@
240
270
  --sd-color-risk-veryhigh: 255 0 0;
241
271
  --sd-color-success: 12 115 54;
242
272
  --sd-color-text-accent: var(--sd-color-accent);
243
- --sd-color-text-black: var(--sd-color-black);
244
- --sd-color-text-error: var(--sd-color-error);
273
+ --sd-color-text-black: var(--sd-color-neutral-800);
274
+ --sd-color-text-error: var(--sd-color-error-300);
245
275
  --sd-color-text-neutral-500: var(--sd-color-neutral-500);
246
276
  --sd-color-text-neutral-600: 255 255 255 / 0.4;
247
- --sd-color-text-neutral-700: var(--sd-color-neutral-700);
277
+ --sd-color-text-neutral-700: var(--sd-color-neutral-600);
248
278
  --sd-color-text-primary-100: var(--sd-color-primary-100);
249
279
  --sd-color-text-primary-200: var(--sd-color-white);
250
280
  --sd-color-text-primary-400: var(--sd-color-white);
251
- --sd-color-text-primary-500: var(--sd-color-info);
281
+ --sd-color-text-primary-500: var(--sd-color-primary-600);
252
282
  --sd-color-text-primary-800: var(--sd-color-primary-800);
253
283
  --sd-color-text-primary: var(--sd-color-info);
254
284
  --sd-color-text-success: var(--sd-color-success);
@@ -261,12 +291,12 @@
261
291
  --sd-datepicker__date-item--current-font-weight: var(--sd-font-weight-bold);
262
292
  --sd-datepicker__date-item--default-color-text: var(--sd-color-black);
263
293
  --sd-datepicker__date-item--hover--default-color-background: var(--sd-color-primary-100);
264
- --sd-datepicker__date-item--hover--default-color-border: var(--sd-color-primary-750);
265
- --sd-datepicker__date-item--hover--default-color-text: var(--sd-color-primary-750);
294
+ --sd-datepicker__date-item--hover--default-color-border: var(--sd-color-primary-700);
295
+ --sd-datepicker__date-item--hover--default-color-text: var(--sd-color-primary-700);
266
296
  --sd-datepicker__date-item--hover--prev-next-color-background: var(--sd-color-primary-100);
267
297
  --sd-datepicker__date-item--hover--prev-next-color-text: var(--sd-color-neutral-700);
268
298
  --sd-datepicker__date-item--range-color-background: var(--sd-color-primary-100);
269
- --sd-datepicker__date-item--selected--hover-color-background: var(--sd-color-primary-750);
299
+ --sd-datepicker__date-item--selected--hover-color-background: var(--sd-color-primary-700);
270
300
  --sd-datepicker__date-item--selected--hover-color-text: var(--sd-color-white);
271
301
  --sd-datepicker__date-item--selected-color-background: var(--sd-color-info);
272
302
  --sd-datepicker__date-item--selected-color-text: var(--sd-color-white);
@@ -280,27 +310,18 @@
280
310
  --sd-duration-medium: 300ms;
281
311
  --sd-duration-slow: 500ms;
282
312
  --sd-duration-x-slow: 750ms;
283
- --sd-flag--neutral-200-color-background: 250 250 250;
284
- --sd-flag--neutral-200-color-border: var(--sd-color-primary-900);
285
- --sd-flag--neutral-300-color-background: 237 248 253;
286
- --sd-flag--neutral-300-color-border: 0 121 168;
287
- --sd-flag--neutral-500-color-background: 237 248 253;
288
- --sd-flag--neutral-500-color-border: 0 121 168;
289
- --sd-flag--white-color-background: 250 250 250;
290
- --sd-flag--white-color-border: var(--sd-color-primary-900);
291
- --sd-flag-border-radius: var(--sd-spacing-1);
292
313
  --sd-font-primary: 'GenosGFG';
293
314
  --sd-font-weight-bold: 600;
294
315
  --sd-font-weight-normal: 400;
295
316
  --sd-footnotes--target--inverted-color-background: var(--sd-color-primary-750);
296
317
  --sd-form-control--disabled-color-text: var(--sd-color-primary-300);
297
- --sd-form-control--filled__floating-label-color-text: var(--sd-color-neutral-700);
318
+ --sd-form-control--filled__floating-label-color-text: var(--sd-color-neutral-600);
298
319
  --sd-form-control--hover-color-background: 243 247 250;
299
320
  --sd-form-control--invalid-color-background: 253 237 237;
300
321
  --sd-form-control--read-only-color-background: var(--sd-color-neutral-100);
301
322
  --sd-form-control-border-radius: var(--sd-spacing-1);
302
323
  --sd-form-control-color-border: var(--sd-color-black);
303
- --sd-form-control-color-icon-fill: var(--sd-color-neutral-700);
324
+ --sd-form-control-color-icon-fill: var(--sd-color-neutral-600);
304
325
  --sd-form-control-color-text: var(--sd-color-neutral-700);
305
326
  --sd-form-control__listbox-border-bottom-left-radius: var(--sd-spacing-1);
306
327
  --sd-form-control__listbox-border-bottom-right-radius: var(--sd-spacing-1);
@@ -323,7 +344,6 @@
323
344
  --sd-map-marker--pin--default-color-background: var(--sd-color-white);
324
345
  --sd-map-marker--pin--hover-color-background: var(--sd-color-primary-100);
325
346
  --sd-map-marker--pin-color-text: var(--sd-color-info);
326
- --sd-marker-border-width: var(--sd-spacing-0\.25);
327
347
  --sd-marker-font-size: 0.875rem;
328
348
  --sd-marker-font-weight: var(--sd-font-weight-normal);
329
349
  --sd-menu-item--disabled-color-icon-fill: 0 0 0 / 0.2;
@@ -363,12 +383,12 @@
363
383
  --sd-panel-color-border: 255 255 255 / 0;
364
384
  --sd-progress-bar--active--inverted-color-background: var(--sd-color-white);
365
385
  --sd-progress-bar__slide-bar--inverted-color-background: 255 255 255 / 0.5;
366
- --sd-progress-bar__slide-bar-color-background: var(--sd-color-neutral-500);
386
+ --sd-progress-bar__slide-bar-color-background: var(--sd-color-neutral-400);
367
387
  --sd-quickfact--expandable-color-text: var(--sd-color-black);
368
388
  --sd-radio--checked--default-color-background: var(--sd-color-info);
369
389
  --sd-radio--checked--default__icon-color-background: var(--sd-color-white);
370
390
  --sd-radio--checked--disabled__icon-color-background: var(--sd-color-white);
371
- --sd-radio--checked--hover-color-background: var(--sd-color-info);
391
+ --sd-radio--checked--hover-color-background: var(--sd-color-primary-600);
372
392
  --sd-radio--checked--hover__icon-color-background: var(--sd-color-white);
373
393
  --sd-radio--checked--invalid--default-color-background: var(--sd-color-error);
374
394
  --sd-radio--checked--invalid--default__icon-color-background: var(--sd-color-white);
@@ -390,7 +410,7 @@
390
410
  --sd-radius-none: 0;
391
411
  --sd-radius-sm: 0.125rem;
392
412
  --sd-radius: 0.25rem;
393
- --sd-range-scale-ticks-color-text: var(--sd-color-neutral-700);
413
+ --sd-range-scale-ticks-color-text: var(--sd-color-neutral-600);
394
414
  --sd-shadow-listbox: 0px 10px 20px 0px rgba(0, 0, 0, 0.25);
395
415
  --sd-shadow-sm: 0.5px 0.5px 1.5px 0px rgba(0, 0, 0, 0.86);
396
416
  --sd-shadow-xs: 0.5px 0.5px 1.5px 0px rgba(0, 0, 0, 0.86);
@@ -434,22 +454,22 @@
434
454
  --sd-step-color-text: var(--sd-color-neutral-700);
435
455
  --sd-step__circle-border-width: var(--sd-spacing-0\.5);
436
456
  --sd-step__tail-border-width: var(--sd-spacing-1);
437
- --sd-switch--checked--hover-color-background: var(--sd-color-info);
457
+ --sd-switch--checked--hover-color-background: var(--sd-color-primary-600);
438
458
  --sd-switch--unchecked--hover-color-background: var(--sd-color-neutral-100);
439
459
  --sd-switch--unchecked-color-border: var(--sd-color-black);
440
460
  --sd-switch--unchecked__icon-color-background: var(--sd-color-black);
441
461
  --sd-switch-border-width: var(--sd-spacing-0\.5);
442
462
  --sd-switch-color-text: var(--sd-color-black);
443
463
  --sd-tab--active-color-text: var(--sd-color-info);
444
- --sd-tab--disabled-color-text: var(--sd-color-neutral-500);
464
+ --sd-tab--disabled-color-text: var(--sd-color-neutral-400);
445
465
  --sd-tab--hover-color-background: var(--sd-color-neutral-100);
446
- --sd-tab-color-border: var(--sd-color-neutral-500);
466
+ --sd-tab-color-border: var(--sd-color-neutral-400);
447
467
  --sd-tab-color-text: var(--sd-color-neutral-700);
448
468
  --sd-tag--default--hover-color-background: var(--sd-color-primary-100);
449
469
  --sd-tag--default-color-background: 255 255 255 / 0;
450
470
  --sd-tag--default-color-border: var(--sd-color-info);
451
471
  --sd-tag--default-color-text: var(--sd-color-info);
452
- --sd-tag--disabled-color-text: var(--sd-color-neutral-500);
472
+ --sd-tag--disabled-color-text: var(--sd-color-neutral-400);
453
473
  --sd-tag--removable--size-lg-padding-left: var(--sd-spacing-3);
454
474
  --sd-tag--removable--size-lg-padding-right: var(--sd-spacing-2);
455
475
  --sd-tag--removable--size-sm-padding-left: var(--sd-spacing-2);
@@ -476,7 +496,7 @@
476
496
  --sd-teaser-media--primary-100-color-background: 245 247 249 / 0.8;
477
497
  --sd-teaser-media--white--hover-color-background: 255 255 255 / 0.9;
478
498
  --sd-teaser-media--white-color-background: 255 255 255 / 0.8;
479
- --sd-teaser-media-color-icon-fill: var(--sd-color-neutral-700);
499
+ --sd-teaser-media-color-icon-fill: var(--sd-color-neutral-600);
480
500
  --sd-text-2xl: 1.75rem;
481
501
  --sd-text-3xl: 2rem;
482
502
  --sd-text-4xl: 2.375rem;
@@ -491,53 +511,72 @@
491
511
  --sd-video--play-button-color-icon-fill: var(--sd-color-info);
492
512
  }
493
513
 
514
+ :root, .sd-theme-sp {
494
515
  .sd-theme-sp {
495
- --sd-icon--calendar: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M17 4h3q1 0 1 1v14q0 1-1 1H4a1 1 0 0 1-1-1V5q0-1 1-1h3V3a1 1 0 0 1 2 0v1h6V3a1 1 0 1 1 2 0zm0 2v1a1 1 0 1 1-2 0V6H9v1a1 1 0 0 1-2 0V6H5v12h14V6zm-1 4a1 1 0 1 1 0 2H8a1 1 0 1 1 0-2zm-5 4a1 1 0 1 1 0 2H8a1 1 0 1 1 0-2zm5 0a1 1 0 1 1 0 2h-2a1 1 0 1 1 0-2z" clip-rule="evenodd"/></svg>';
496
- --sd-icon--chevron-down: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M16.2 8.8a1 1 0 1 1 1.5 1.4l-5 5a1 1 0 0 1-1.4 0l-5-5a1 1 0 0 1 1.5-1.4l4.2 4.3z" clip-rule="evenodd"/></svg>';
497
- --sd-icon--chevron-left: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M15.2 16.2a1 1 0 0 1-1.4 1.5l-5-5a1 1 0 0 1 0-1.4l5-5a1 1 0 0 1 1.4 1.5L10.9 12z" clip-rule="evenodd"/></svg>';
498
- --sd-icon--chevron-right: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M8.8 16.2a1 1 0 1 0 1.4 1.5l5-5q.6-.7 0-1.4l-5-5a1 1 0 1 0-1.4 1.5l4.3 4.2z" clip-rule="evenodd"/></svg>';
499
- --sd-icon--chevron-sm-left: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="m11 12 4.2-4.2a1 1 0 0 0-1.4-1.5l-5 5a1 1 0 0 0 0 1.4l5 5a1 1 0 0 0 1.4-1.5z" clip-rule="evenodd"/></svg>';
500
- --sd-icon--chevron-sm-right: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M13.06 12 8.82 7.76a1 1 0 0 1 1.41-1.42l4.95 4.95a1 1 0 0 1 0 1.42l-4.95 4.95a1 1 0 0 1-1.41-1.42L13.06 12Z" clip-rule="evenodd"/></svg>';
501
- --sd-icon--chevron-up: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M16.2 15.2 12 10.9l-4.2 4.3a1 1 0 0 1-1.5-1.4l5-5a1 1 0 0 1 1.4 0l5 5a1 1 0 0 1-1.5 1.4" clip-rule="evenodd"/></svg>';
502
- --sd-icon--chevrons-sm-left: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M12.7 7.7a1 1 0 1 0-1.4-1.4l-5 5a1 1 0 0 0 0 1.4l5 5a1 1 0 0 0 1.4-1.4L8.4 12zm.7 4.3 4.3-4.3a1 1 0 1 0-1.4-1.4l-5 5a1 1 0 0 0 0 1.4l5 5a1 1 0 0 0 1.4-1.4z" clip-rule="evenodd"/></svg>';
503
- --sd-icon--chevrons-sm-right: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M11.3 7.73a1 1 0 1 1 1.43-1.42l4.99 4.99a1 1 0 0 1 0 1.42l-4.97 4.97a1 1 0 0 1-1.43-1.42L15.58 12zM10.57 12 6.28 7.73A1 1 0 1 1 7.7 6.3l5 4.99a1 1 0 0 1 0 1.42L7.73 17.7a1 1 0 0 1-1.43-1.42z" clip-rule="evenodd"/></svg>';
504
- --sd-icon--clock: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M13 6v5.4l3.4 1.7a1 1 0 1 1-.8 1.8l-4-2a1 1 0 0 1-.6-.9V6a1 1 0 1 1 2 0m-1 16a10 10 0 1 1 0-20 10 10 0 0 1 0 20m0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16" clip-rule="evenodd"/></svg>';
505
- --sd-icon--close: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M6.6 5.2h.1l5.3 5.4 5.3-5.3a1 1 0 0 1 1.5 1.3v.1L13.3 12l5.3 5.3a1 1 0 0 1-1.3 1.5h-.1L12 13.3l-5.3 5.3a1 1 0 0 1-1.5-1.3v-.1l5.4-5.3-5.3-5.3a1 1 0 0 1 1.3-1.5" clip-rule="evenodd"/></svg>';
506
- --sd-icon--closing-round: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none"><path d="M10 0a10 10 0 1 0 0 20 10 10 0 0 0 0-20m0 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16"/><path d="M14.4 5.6a1 1 0 0 0-1.4 0l-3 3-3-3a1 1 0 0 0-1.6.8q0 .4.2.6l3 3-3 3a1 1 0 0 0 0 1.4 1 1 0 0 0 1.4 0l3-3 3 3a1 1 0 0 0 1.4 0 1 1 0 0 0 0-1.4l-3-3 3-3a1 1 0 0 0 0-1.4"/></svg>';
507
- --sd-icon--confirm-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M18.67 5.47a1 1 0 0 1 1.5 1.32l-7.76 8.87a1 1 0 0 1-1.53-.04l-3.66-4.6a1 1 0 1 1 1.56-1.24l2.92 3.66zm-2.5-2.56a1 1 0 0 1-.83 1.82 8 8 0 1 0 4.56 5.97 1 1 0 1 1 1.97-.32q.13.8.13 1.62a10 10 0 1 1-5.83-9.09" clip-rule="evenodd"/></svg>';
508
- --sd-icon--exclamation-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M12 22a10 10 0 1 1 0-20 10 10 0 0 1 0 20m0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16M11 8a1 1 0 1 1 2 0v5a1 1 0 1 1-2 0zm0 7.99a1 1 0 1 1 2 0V16a1 1 0 1 1-2 0z" clip-rule="evenodd"/></svg>';
509
- --sd-icon--eye-crossed-out: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M15.6 1.5a1 1 0 0 1 1.9.8v.1l-1.6 3.3q4 1.4 7 5.7.3.6 0 1.2Q18.5 19 12 19q-1 0-2-.2l-1.6 3.6v.1a1 1 0 0 1-1.9-.8v-.1l1.6-3.3a14 14 0 0 1-7-5.7 1 1 0 0 1 0-1.2Q5.5 5.1 12 5q1 0 2 .2zm-.5 6-.6 1.4a4 4 0 0 1-3.2 7l-.4 1h.4l.4.1h.3q5 0 8.5-4.6l.2-.3V12a11 11 0 0 0-5.6-4.4M12 7q-5 0-8.5 4.6l-.2.3v.2q2.4 3.3 5.6 4.4l.6-1.4a4 4 0 0 1 3.2-7l.4-1h-.8zm1.6 3.8L12.2 14a2 2 0 0 0 1.4-3.2m-1.8-.8a2 2 0 0 0-1.4 3.2z" clip-rule="evenodd"/></svg>';
510
- --sd-icon--eye: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M12 19q-6.6 0-10.8-6.4a1 1 0 0 1 0-1.2Q5.4 5.1 12 5q6.6 0 10.8 6.4.4.6 0 1.2Q18.6 19 12 19m0-2q5.2 0 8.8-5-3.6-5-8.8-5t-8.8 5q3.6 5 8.8 5m0-1a4 4 0 1 1 0-8 4 4 0 0 1 0 8m0-2a2 2 0 1 0 0-4 2 2 0 0 0 0 4" clip-rule="evenodd"/></svg>';
511
- --sd-icon--info-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M12 2a10 10 0 1 1 0 20 10 10 0 0 1 0-20m0 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16m1 12a1 1 0 1 1-2 0v-5a1 1 0 1 1 2 0zm0-8a1 1 0 0 1-2 .1V8a1 1 0 0 1 2-.1z" clip-rule="evenodd"/></svg>';
512
- --sd-icon--magnifying-glass: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M14.05 15.46a7.5 7.5 0 1 1 1.41-1.41l6.25 6.24a1 1 0 0 1-1.42 1.42zM9.5 15a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11" clip-rule="evenodd"/></svg>';
513
- --sd-icon--minus-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M3 13a1 1 0 1 1 0-2h18a1 1 0 1 1 0 2z" clip-rule="evenodd"/></svg>';
514
- --sd-icon--mute: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M13.52 3.12a1 1 0 0 1 1.46.66l.01.1L15 4v16a1 1 0 0 1-1.38.93l-.1-.05L6.42 17H3a1 1 0 0 1-.97-.77L2 16.12 2 16V8a1 1 0 0 1 .88-1h3.53zM13 5.68l-5.85 3.2-.24.09-.12.02-.12.01H4v6h2.67l.24.03.12.04.12.05 5.85 3.2zm3.3 3.61a1 1 0 0 1 1.31-.08l.1.08L19 10.6l1.3-1.3a1 1 0 0 1 1.49 1.32l-.08.1L20.4 12l1.3 1.3.08.09a1 1 0 0 1-1.4 1.4l-.1-.08L19 13.4l-1.3 1.3a1 1 0 0 1-1.49-1.32l.08-.1L17.6 12l-1.3-1.3-.08-.09a1 1 0 0 1 .08-1.32" clip-rule="evenodd"/></svg>';
515
- --sd-icon--pause: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M9.5 3q1.4.2 1.5 1.5v15q-.1 1.4-1.5 1.5H4.6C3.8 21 3 20 3 19.2V4.8C3 3.9 3.8 3 4.6 3zm10 0q1.4.2 1.5 1.5v15q-.1 1.4-1.5 1.5h-4.9c-.8 0-1.6-1-1.6-1.8V4.8c0-.9.8-1.8 1.6-1.8zM9 5H5v14h4zm10 0h-4v14h4z" clip-rule="evenodd"/></svg>';
516
- --sd-icon--plus-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M11 11V3a1 1 0 1 1 2 0v8h8a1 1 0 1 1 0 2h-8v8a1 1 0 1 1-2 0v-8H3a1 1 0 1 1 0-2z" clip-rule="evenodd"/></svg>';
517
- --sd-icon--reload: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M4 18v1.03a1 1 0 1 1-2 0v-4a1 1 0 0 1 1-1h4a1 1 0 1 1 0 2H5.08a8 8 0 1 0-.7-6.5 1 1 0 0 1-1.9-.61A10 10 0 1 1 4 18" clip-rule="evenodd"/></svg>';
518
- --sd-icon--risk: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M21.87 19.51A1 1 0 0 1 21 21H3a1 1 0 0 1-.87-1.49l9-16a1 1 0 0 1 1.74 0zM12 6.04 4.71 19h14.58zM11 10a1 1 0 1 1 2 0v4a1 1 0 1 1-2 0zm0 6.99a1 1 0 1 1 2 0V17a1 1 0 1 1-2 0z" clip-rule="evenodd"/></svg>';
519
- --sd-icon--start: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M21.43 11.1a1 1 0 0 1 0 1.8l-17 8A1 1 0 0 1 3 20V4a1 1 0 0 1 1.43-.9zm-2.78.9L5 5.58v12.84z" clip-rule="evenodd"/></svg>';
520
- --sd-icon--status-check: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M17.93 6.88c.5.44.57 1.2.13 1.7l-7.2 8.4a1.2 1.2 0 0 1-1.67.14l-3.6-3a1.2 1.2 0 1 1 1.53-1.85l2.7 2.25 6.42-7.5a1.2 1.2 0 0 1 1.7-.14" clip-rule="evenodd"/></svg>';
521
- --sd-icon--status-minus: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M5.4 12c0-.66.54-1.2 1.2-1.2h10.8a1.2 1.2 0 0 1 0 2.4H6.6A1.2 1.2 0 0 1 5.4 12" clip-rule="evenodd"/></svg>';
522
- --sd-icon--transcript: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="m12 2 .25.03.03.01.1.03.02.01a1 1 0 0 1 .3.21l-.09-.08.02.01.08.07 7 7A1 1 0 0 1 20 10v-.13V21a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1zm-1 2H6v16h12v-9h-6a1 1 0 0 1-1-.88V4m5.59 5L13 5.42V9z" clip-rule="evenodd"/></svg>';
523
- --sd-icon--volume: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M13.52 3.12a1 1 0 0 1 1.46.66l.01.1L15 4v16a1 1 0 0 1-1.38.93l-.1-.05L6.42 17H3a1 1 0 0 1-.97-.77L2 16.12 2 16V8a1 1 0 0 1 .88-1h3.53zm6.31 2.32A11.7 11.7 0 0 1 22 12a12 12 0 0 1-2.16 6.62 1 1 0 0 1-1.68-1.1A10 10 0 0 0 20 12q0-2.7-1.83-5.44a1 1 0 1 1 1.66-1.12M13 5.68l-5.85 3.2-.24.09-.12.02-.12.01H4v6h2.67l.24.03.12.04.12.05 5.85 3.2zm4.83 2.77A6.4 6.4 0 0 1 19 12q0 1.81-1.17 3.55a1 1 0 1 1-1.66-1.1A4.4 4.4 0 0 0 17 12q0-1.19-.83-2.45a1 1 0 0 1 1.66-1.1" clip-rule="evenodd"/></svg>';
524
- --sd-icon--warning: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M21.87 19.51A1 1 0 0 1 21 21H3a1 1 0 0 1-.87-1.49l9-16a1 1 0 0 1 1.74 0zM12 6.04 4.71 19h14.58zM11 10a1 1 0 1 1 2 0v4a1 1 0 1 1-2 0zm0 6.99a1 1 0 1 1 2 0V17a1 1 0 1 1-2 0z" clip-rule="evenodd"/></svg>';
516
+ --sd-icon--calendar: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M17 4h3q1 0 1 1v14q0 1-1 1H4a1 1 0 0 1-1-1V5q0-1 1-1h3V3a1 1 0 0 1 2 0v1h6V3a1 1 0 1 1 2 0zm0 2v1a1 1 0 1 1-2 0V6H9v1a1 1 0 0 1-2 0V6H5v12h14V6zm-1 4a1 1 0 1 1 0 2H8a1 1 0 1 1 0-2zm-5 4a1 1 0 1 1 0 2H8a1 1 0 1 1 0-2zm5 0a1 1 0 1 1 0 2h-2a1 1 0 1 1 0-2z" clip-rule="evenodd"/></svg>';
517
+ --sd-icon--chevron-down: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M16.2 8.8a1 1 0 1 1 1.5 1.4l-5 5a1 1 0 0 1-1.4 0l-5-5a1 1 0 0 1 1.5-1.4l4.2 4.3z" clip-rule="evenodd"/></svg>';
518
+ --sd-icon--chevron-left: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M15.2 16.2a1 1 0 0 1-1.4 1.5l-5-5a1 1 0 0 1 0-1.4l5-5a1 1 0 0 1 1.4 1.5L10.9 12z" clip-rule="evenodd"/></svg>';
519
+ --sd-icon--chevron-right: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M8.8 16.2a1 1 0 1 0 1.4 1.5l5-5q.6-.7 0-1.4l-5-5a1 1 0 1 0-1.4 1.5l4.3 4.2z" clip-rule="evenodd"/></svg>';
520
+ --sd-icon--chevron-sm-left: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="m11 12 4.2-4.2a1 1 0 0 0-1.4-1.5l-5 5a1 1 0 0 0 0 1.4l5 5a1 1 0 0 0 1.4-1.5z" clip-rule="evenodd"/></svg>';
521
+ --sd-icon--chevron-sm-right: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M13.06 12 8.82 7.76a1 1 0 0 1 1.41-1.42l4.95 4.95a1 1 0 0 1 0 1.42l-4.95 4.95a1 1 0 0 1-1.41-1.42L13.06 12Z" clip-rule="evenodd"/></svg>';
522
+ --sd-icon--chevron-up: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M16.2 15.2 12 10.9l-4.2 4.3a1 1 0 0 1-1.5-1.4l5-5a1 1 0 0 1 1.4 0l5 5a1 1 0 0 1-1.5 1.4" clip-rule="evenodd"/></svg>';
523
+ --sd-icon--chevrons-sm-left: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M12.7 7.7a1 1 0 1 0-1.4-1.4l-5 5a1 1 0 0 0 0 1.4l5 5a1 1 0 0 0 1.4-1.4L8.4 12zm.7 4.3 4.3-4.3a1 1 0 1 0-1.4-1.4l-5 5a1 1 0 0 0 0 1.4l5 5a1 1 0 0 0 1.4-1.4z" clip-rule="evenodd"/></svg>';
524
+ --sd-icon--chevrons-sm-right: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M11.3 7.73a1 1 0 1 1 1.43-1.42l4.99 4.99a1 1 0 0 1 0 1.42l-4.97 4.97a1 1 0 0 1-1.43-1.42L15.58 12zM10.57 12 6.28 7.73A1 1 0 1 1 7.7 6.3l5 4.99a1 1 0 0 1 0 1.42L7.73 17.7a1 1 0 0 1-1.43-1.42z" clip-rule="evenodd"/></svg>';
525
+ --sd-icon--clock: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M13 6v5.4l3.4 1.7a1 1 0 1 1-.8 1.8l-4-2a1 1 0 0 1-.6-.9V6a1 1 0 1 1 2 0m-1 16a10 10 0 1 1 0-20 10 10 0 0 1 0 20m0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16" clip-rule="evenodd"/></svg>';
526
+ --sd-icon--close: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M6.6 5.2h.1l5.3 5.4 5.3-5.3a1 1 0 0 1 1.5 1.3v.1L13.3 12l5.3 5.3a1 1 0 0 1-1.3 1.5h-.1L12 13.3l-5.3 5.3a1 1 0 0 1-1.5-1.3v-.1l5.4-5.3-5.3-5.3a1 1 0 0 1 1.3-1.5" clip-rule="evenodd"/></svg>';
527
+ --sd-icon--closing-round: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none"><path d="M10 0a10 10 0 1 0 0 20 10 10 0 0 0 0-20m0 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16"/><path d="M14.4 5.6a1 1 0 0 0-1.4 0l-3 3-3-3a1 1 0 0 0-1.6.8q0 .4.2.6l3 3-3 3a1 1 0 0 0 0 1.4 1 1 0 0 0 1.4 0l3-3 3 3a1 1 0 0 0 1.4 0 1 1 0 0 0 0-1.4l-3-3 3-3a1 1 0 0 0 0-1.4"/></svg>';
528
+ --sd-icon--confirm-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M18.67 5.47a1 1 0 0 1 1.5 1.32l-7.76 8.87a1 1 0 0 1-1.53-.04l-3.66-4.6a1 1 0 1 1 1.56-1.24l2.92 3.66zm-2.5-2.56a1 1 0 0 1-.83 1.82 8 8 0 1 0 4.56 5.97 1 1 0 1 1 1.97-.32q.13.8.13 1.62a10 10 0 1 1-5.83-9.09" clip-rule="evenodd"/></svg>';
529
+ --sd-icon--exclamation-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M12 22a10 10 0 1 1 0-20 10 10 0 0 1 0 20m0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16M11 8a1 1 0 1 1 2 0v5a1 1 0 1 1-2 0zm0 7.99a1 1 0 1 1 2 0V16a1 1 0 1 1-2 0z" clip-rule="evenodd"/></svg>';
530
+ --sd-icon--eye-crossed-out: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M15.6 1.5a1 1 0 0 1 1.9.8v.1l-1.6 3.3q4 1.4 7 5.7.3.6 0 1.2Q18.5 19 12 19q-1 0-2-.2l-1.6 3.6v.1a1 1 0 0 1-1.9-.8v-.1l1.6-3.3a14 14 0 0 1-7-5.7 1 1 0 0 1 0-1.2Q5.5 5.1 12 5q1 0 2 .2zm-.5 6-.6 1.4a4 4 0 0 1-3.2 7l-.4 1h.4l.4.1h.3q5 0 8.5-4.6l.2-.3V12a11 11 0 0 0-5.6-4.4M12 7q-5 0-8.5 4.6l-.2.3v.2q2.4 3.3 5.6 4.4l.6-1.4a4 4 0 0 1 3.2-7l.4-1h-.8zm1.6 3.8L12.2 14a2 2 0 0 0 1.4-3.2m-1.8-.8a2 2 0 0 0-1.4 3.2z" clip-rule="evenodd"/></svg>';
531
+ --sd-icon--eye: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M12 19q-6.6 0-10.8-6.4a1 1 0 0 1 0-1.2Q5.4 5.1 12 5q6.6 0 10.8 6.4.4.6 0 1.2Q18.6 19 12 19m0-2q5.2 0 8.8-5-3.6-5-8.8-5t-8.8 5q3.6 5 8.8 5m0-1a4 4 0 1 1 0-8 4 4 0 0 1 0 8m0-2a2 2 0 1 0 0-4 2 2 0 0 0 0 4" clip-rule="evenodd"/></svg>';
532
+ --sd-icon--info-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M12 2a10 10 0 1 1 0 20 10 10 0 0 1 0-20m0 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16m1 12a1 1 0 1 1-2 0v-5a1 1 0 1 1 2 0zm0-8a1 1 0 0 1-2 .1V8a1 1 0 0 1 2-.1z" clip-rule="evenodd"/></svg>';
533
+ --sd-icon--magnifying-glass: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M14.05 15.46a7.5 7.5 0 1 1 1.41-1.41l6.25 6.24a1 1 0 0 1-1.42 1.42zM9.5 15a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11" clip-rule="evenodd"/></svg>';
534
+ --sd-icon--minus-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M3 13a1 1 0 1 1 0-2h18a1 1 0 1 1 0 2z" clip-rule="evenodd"/></svg>';
535
+ --sd-icon--mute: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M13.52 3.12a1 1 0 0 1 1.46.66l.01.1L15 4v16a1 1 0 0 1-1.38.93l-.1-.05L6.42 17H3a1 1 0 0 1-.97-.77L2 16.12 2 16V8a1 1 0 0 1 .88-1h3.53zM13 5.68l-5.85 3.2-.24.09-.12.02-.12.01H4v6h2.67l.24.03.12.04.12.05 5.85 3.2zm3.3 3.61a1 1 0 0 1 1.31-.08l.1.08L19 10.6l1.3-1.3a1 1 0 0 1 1.49 1.32l-.08.1L20.4 12l1.3 1.3.08.09a1 1 0 0 1-1.4 1.4l-.1-.08L19 13.4l-1.3 1.3a1 1 0 0 1-1.49-1.32l.08-.1L17.6 12l-1.3-1.3-.08-.09a1 1 0 0 1 .08-1.32" clip-rule="evenodd"/></svg>';
536
+ --sd-icon--pause: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M9.5 3q1.4.2 1.5 1.5v15q-.1 1.4-1.5 1.5H4.6C3.8 21 3 20 3 19.2V4.8C3 3.9 3.8 3 4.6 3zm10 0q1.4.2 1.5 1.5v15q-.1 1.4-1.5 1.5h-4.9c-.8 0-1.6-1-1.6-1.8V4.8c0-.9.8-1.8 1.6-1.8zM9 5H5v14h4zm10 0h-4v14h4z" clip-rule="evenodd"/></svg>';
537
+ --sd-icon--plus-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M11 11V3a1 1 0 1 1 2 0v8h8a1 1 0 1 1 0 2h-8v8a1 1 0 1 1-2 0v-8H3a1 1 0 1 1 0-2z" clip-rule="evenodd"/></svg>';
538
+ --sd-icon--reload: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M4 18v1.03a1 1 0 1 1-2 0v-4a1 1 0 0 1 1-1h4a1 1 0 1 1 0 2H5.08a8 8 0 1 0-.7-6.5 1 1 0 0 1-1.9-.61A10 10 0 1 1 4 18" clip-rule="evenodd"/></svg>';
539
+ --sd-icon--risk: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M21.87 19.51A1 1 0 0 1 21 21H3a1 1 0 0 1-.87-1.49l9-16a1 1 0 0 1 1.74 0zM12 6.04 4.71 19h14.58zM11 10a1 1 0 1 1 2 0v4a1 1 0 1 1-2 0zm0 6.99a1 1 0 1 1 2 0V17a1 1 0 1 1-2 0z" clip-rule="evenodd"/></svg>';
540
+ --sd-icon--start: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M21.43 11.1a1 1 0 0 1 0 1.8l-17 8A1 1 0 0 1 3 20V4a1 1 0 0 1 1.43-.9zm-2.78.9L5 5.58v12.84z" clip-rule="evenodd"/></svg>';
541
+ --sd-icon--status-check: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M17.93 6.88c.5.44.57 1.2.13 1.7l-7.2 8.4a1.2 1.2 0 0 1-1.67.14l-3.6-3a1.2 1.2 0 1 1 1.53-1.85l2.7 2.25 6.42-7.5a1.2 1.2 0 0 1 1.7-.14" clip-rule="evenodd"/></svg>';
542
+ --sd-icon--status-minus: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M5.4 12c0-.66.54-1.2 1.2-1.2h10.8a1.2 1.2 0 0 1 0 2.4H6.6A1.2 1.2 0 0 1 5.4 12" clip-rule="evenodd"/></svg>';
543
+ --sd-icon--transcript: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="m12 2 .25.03.03.01.1.03.02.01a1 1 0 0 1 .3.21l-.09-.08.02.01.08.07 7 7A1 1 0 0 1 20 10v-.13V21a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1zm-1 2H6v16h12v-9h-6a1 1 0 0 1-1-.88V4m5.59 5L13 5.42V9z" clip-rule="evenodd"/></svg>';
544
+ --sd-icon--upload: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M20 19v-4a1 1 0 1 1 2 0v5a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-5a1 1 0 1 1 2 0v4z" clip-rule="evenodd"/><path d="M11 15.02v-8.6L8.46 8.94a1 1 0 0 1-1.41-1.41l4.24-4.25a1 1 0 0 1 1.42 0l4.24 4.25a1 1 0 0 1-1.41 1.41L13 6.41v8.6a1 1 0 0 1-2 0"/></svg>';
545
+ --sd-icon--volume: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M13.52 3.12a1 1 0 0 1 1.46.66l.01.1L15 4v16a1 1 0 0 1-1.38.93l-.1-.05L6.42 17H3a1 1 0 0 1-.97-.77L2 16.12 2 16V8a1 1 0 0 1 .88-1h3.53zm6.31 2.32A11.7 11.7 0 0 1 22 12a12 12 0 0 1-2.16 6.62 1 1 0 0 1-1.68-1.1A10 10 0 0 0 20 12q0-2.7-1.83-5.44a1 1 0 1 1 1.66-1.12M13 5.68l-5.85 3.2-.24.09-.12.02-.12.01H4v6h2.67l.24.03.12.04.12.05 5.85 3.2zm4.83 2.77A6.4 6.4 0 0 1 19 12q0 1.81-1.17 3.55a1 1 0 1 1-1.66-1.1A4.4 4.4 0 0 0 17 12q0-1.19-.83-2.45a1 1 0 0 1 1.66-1.1" clip-rule="evenodd"/></svg>';
546
+ --sd-icon--warning: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M21.87 19.51A1 1 0 0 1 21 21H3a1 1 0 0 1-.87-1.49l9-16a1 1 0 0 1 1.74 0zM12 6.04 4.71 19h14.58zM11 10a1 1 0 1 1 2 0v4a1 1 0 1 1-2 0zm0 6.99a1 1 0 1 1 2 0V17a1 1 0 1 1-2 0z" clip-rule="evenodd"/></svg>';
547
+ }
525
548
  }
526
549
 
527
550
  :root, .sd-theme-sp {
528
551
  /*
529
552
  * Deprecated variables – manually overriding these in custom themes might lead to problems in future versions of Solid.
530
553
  * Use the actual used value instead. Example:
531
- * Instead of --sd-chip-border-width use --sd-marker-border-width for your overrides.
554
+ * Instead of --sd-chip-font-size use --sd-marker-font-size for your overrides.
532
555
  */
533
556
  --sd-button--size-lg-border-radius: var(--sd-button-border-radius);
534
557
  --sd-button--size-md-border-radius: var(--sd-button-border-radius);
535
558
  --sd-button--size-sm-border-radius: var(--sd-button-border-radius);
536
559
  --sd-button--secondary--inverted--color-border: var(--sd-button-secondary-inverted-color-border);
537
560
  --sd-chip-font-size: var(--sd-marker-font-size);
538
- --sd-chip-border-width: var(--sd-marker-border-width);
539
561
  --sd-chip-font-weight: var(--sd-marker-font-weight);
540
- --sd-flag-border-width: var(--sd-marker-border-width);
562
+ --sd-chip--primary-200-color-background: var(--sd-chip--primary-low-color-background);
563
+ --sd-chip--primary-200-color-border: var(--sd-chip--primary-subtle-color-filled-border);
564
+ --sd-chip--primary-300-color-background: var(--sd-chip--primary-medium-color-background);
565
+ --sd-chip--primary-300-color-border: var(--sd-chip--primary-medium-color-filled-border);
566
+ --sd-chip--primary-500-color-background: var(--sd-chip--primary-high-color-background);
567
+ --sd-chip--primary-500-color-border: var(--sd-chip--primary-high-color-filled-border);
568
+ --sd-chip--primary-500-color-text: var(--sd-color-white);
569
+ --sd-chip--white-color-border: var(--sd-chip--white-color-filled-border);
570
+ --sd-flag-border-radius: var(--sd-chip-border-radius);
571
+ --sd-flag-border-width: var(--sd-chip-border-width);
572
+ --sd-flag--neutral-200-color-background: var(--sd-chip--neutral-low-color-background);
573
+ --sd-flag--neutral-200-color-border: var(--sd-chip--neutral-low-color-filled-border);
574
+ --sd-flag--neutral-300-color-background: var(--sd-chip--neutral-medium-color-background);
575
+ --sd-flag--neutral-300-color-border: var(--sd-chip--neutral-medium-color-filled-border);
576
+ --sd-flag--neutral-500-color-background: var(--sd-chip--neutral-high-color-background);
577
+ --sd-flag--neutral-500-color-border: var(--sd-chip--neutral-high-color-filled-border);
578
+ --sd-flag--white-color-background: var(--sd-chip--white-color-background);
579
+ --sd-flag--white-color-border: var(--sd-chip--white-color-filled-border);
541
580
  --sd-form-control-color-icon: var(--sd-form-control-color-icon-fill);
542
581
  --sd-menu-color-icon: var(--sd-menu-item-color-icon-fill);
543
582
  --sd-menu-color-text: var(--sd-menu-item-color-text);
@@ -35,6 +35,8 @@
35
35
  --background-color-neutral-500: rgba(var(--sd-color-background-neutral-500));
36
36
  --background-color-neutral-600: rgba(var(--sd-color-background-neutral-600));
37
37
  --background-color-neutral-800: rgba(var(--sd-color-background-neutral-800));
38
+ --background-color-neutral-blue: rgba(var(--sd-color-background-neutral-blue));
39
+ --background-color-neutral-grey: rgba(var(--sd-color-background-neutral-grey));
38
40
  --background-color-primary-100: rgba(var(--sd-color-background-primary-100));
39
41
  --background-color-primary-200: rgba(var(--sd-color-background-primary-200));
40
42
  --background-color-primary-300: rgba(var(--sd-color-background-primary-300));
@@ -43,6 +45,7 @@
43
45
  --background-color-primary: rgba(var(--sd-color-background-primary));
44
46
  --background-color-success: rgba(var(--sd-color-background-success));
45
47
  --background-color-warning: rgba(var(--sd-color-background-warning));
48
+ --background-color-white-translucent: rgba(var(--sd-color-background-white-translucent));
46
49
  --background-color-white: rgba(var(--sd-color-background-white));
47
50
  --border-color-accent-550: rgba(var(--sd-color-border-accent-550));
48
51
  --border-color-accent: rgba(var(--sd-color-border-accent));
@@ -52,6 +55,7 @@
52
55
  --border-color-neutral-500: rgba(var(--sd-color-border-neutral-500));
53
56
  --border-color-neutral-600: rgba(var(--sd-color-border-neutral-600));
54
57
  --border-color-neutral-800: rgba(var(--sd-color-border-neutral-800));
58
+ --border-color-neutral-blue: rgba(var(--sd-color-border-neutral-blue));
55
59
  --border-color-primary-100: rgba(var(--sd-color-border-primary-100));
56
60
  --border-color-primary-200: rgba(var(--sd-color-border-primary-200));
57
61
  --border-color-primary-400: rgba(var(--sd-color-border-primary-400));