@solid-design-system/tokens 6.18.1 → 6.21.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/cdn/themes/bb/bb.css +1 -0
  2. package/cdn/themes/kid/kid.css +1 -1
  3. package/cdn/themes/tailwind.css +1 -1
  4. package/cdn/themes/ui-dark/ui-dark.css +1 -1
  5. package/cdn/themes/ui-light/ui-light.css +1 -1
  6. package/cdn/themes/vb/vb.css +1 -1
  7. package/dist/theme.js +1 -1
  8. package/dist/themes/bb/bb.css +538 -0
  9. package/dist/themes/kid/kid.css +36 -21
  10. package/dist/themes/tailwind.css +1 -1
  11. package/dist/themes/ui-dark/ui-dark.css +35 -21
  12. package/dist/themes/ui-light/ui-light.css +29 -14
  13. package/dist/themes/vb/vb.css +70 -55
  14. package/dist/tokens.scss +24 -9
  15. package/dist/tokens.tailwind.json +0 -4
  16. package/package.json +6 -6
package/dist/themes/bb/bb.css ADDED
@@ -0,0 +1,538 @@
1
+ :root, .sd-theme-bb {
2
+ color-scheme: light;
3
+
4
+ --sd-theme: 'bb';
5
+ --sd-accordion--hover-color-background: var(--sd-color-primary-100);
6
+ --sd-accordion--open-color-text: var(--sd-color-black);
7
+ --sd-accordion-border-width: var(--sd-spacing-0\.5);
8
+ --sd-accordion-color-border: var(--sd-color-neutral-200);
9
+ --sd-accordion-color-icon-fill: var(--sd-color-neutral-700);
10
+ --sd-accordion-color-text: var(--sd-color-black);
11
+ --sd-accordion-padding-block: 0.9375rem;
12
+ --sd-accordion__indicator-color: 255 255 255 / 0;
13
+ --sd-aspect-16\/10: 16 / 10;
14
+ --sd-aspect-21\/9: 21 / 9;
15
+ --sd-aspect-2\/1: 2 / 1;
16
+ --sd-aspect-3\/2: 3 / 2;
17
+ --sd-aspect-3\/4: 3 / 4;
18
+ --sd-aspect-4\/3: 4 / 3;
19
+ --sd-aspect-4\/5: 4 / 5;
20
+ --sd-aspect-5\/4: 5 / 4;
21
+ --sd-aspect-6\/5: 6 / 5;
22
+ --sd-aspect-golden-ratio: 1.6180339887498948482 / 1;
23
+ --sd-aspect-square: 1 / 1;
24
+ --sd-aspect-video: 16 / 9;
25
+ --sd-audio__slide-bar--inverted-color-background: 255 255 255 / 0.5;
26
+ --sd-audio__track-bar--inverted-color-background: var(--sd-color-white);
27
+ --sd-badge--blue--inverted-color-background: var(--sd-color-white);
28
+ --sd-badge--blue--inverted-color-text: var(--sd-color-info);
29
+ --sd-badge--blue-color-background: var(--sd-color-info);
30
+ --sd-badge--green-color--inverted-background: var(--sd-color-success);
31
+ --sd-badge--green-color--inverted-text: var(--sd-color-white);
32
+ --sd-badge--green-color-background: var(--sd-color-success);
33
+ --sd-badge--inverted-color-border: var(--sd-color-info);
34
+ --sd-badge--red--inverted-background: var(--sd-color-error);
35
+ --sd-badge--red--inverted-text: var(--sd-color-white);
36
+ --sd-badge--red-color-background: var(--sd-color-error);
37
+ --sd-border-width-2: 0.125rem;
38
+ --sd-border-width-4: 0.25rem;
39
+ --sd-border-width-6: 0.375rem;
40
+ --sd-border-width: 0.0625rem;
41
+ --sd-brandshape--neutral-100-color-background: 255 255 255 / 0;
42
+ --sd-brandshape--primary-80-color-background: 255 255 255 / 0;
43
+ --sd-brandshape--primary-color-background: 255 255 255 / 0;
44
+ --sd-brandshape--primary-color-border: 255 255 255 / 0;
45
+ --sd-brandshape--white-80-color-background: 255 255 255 / 0;
46
+ --sd-brandshape--white-color-background: 255 255 255 / 0;
47
+ --sd-brandshape-color-border-white: 255 255 255 / 0;
48
+ --sd-breadcrumb--current-color-text: var(--sd-color-neutral-600);
49
+ --sd-breadcrumb__separator--current-color: 134 205 210;
50
+ --sd-breadcrumb__separator-color: var(--sd-color-neutral-200);
51
+ --sd-button--cta--inverted--active-color-background: var(--sd-color-primary-100);
52
+ --sd-button--cta--inverted--active-color-text: var(--sd-color-primary-800);
53
+ --sd-button--cta--inverted--default-color-background: var(--sd-color-white);
54
+ --sd-button--cta--inverted--default-color-text: var(--sd-color-info);
55
+ --sd-button--cta--inverted--hover-color-background: var(--sd-color-primary-100);
56
+ --sd-button--cta--inverted--hover-color-text: var(--sd-color-primary-700);
57
+ --sd-button--inverted--disabled-color-background: var(--sd-color-primary-500);
58
+ --sd-button--inverted--disabled-color-border: var(--sd-color-primary-300);
59
+ --sd-button--inverted--disabled-color-text: var(--sd-color-primary-300);
60
+ --sd-button--primary--active-color-background: var(--sd-color-primary-800);
61
+ --sd-button--primary--active-color-text: var(--sd-color-primary-100);
62
+ --sd-button--primary--default-color-background: var(--sd-color-info);
63
+ --sd-button--primary--default-color-text: var(--sd-color-white);
64
+ --sd-button--primary--disabled-color-background: var(--sd-color-primary-200);
65
+ --sd-button--primary--hover-color-background: var(--sd-color-primary-700);
66
+ --sd-button--primary--hover-color-text: var(--sd-color-primary-100);
67
+ --sd-button--primary--inverted--active-color-background: var(--sd-color-primary-100);
68
+ --sd-button--primary--inverted--active-color-text: var(--sd-color-primary-800);
69
+ --sd-button--primary--inverted--default-color-background: var(--sd-color-white);
70
+ --sd-button--primary--inverted--default-color-text: var(--sd-color-info);
71
+ --sd-button--primary--inverted--hover-color-background: var(--sd-color-primary-100);
72
+ --sd-button--primary--inverted--hover-color-text: var(--sd-color-primary-700);
73
+ --sd-button--secondary--active-color-background: var(--sd-color-primary-100);
74
+ --sd-button--secondary--active-color-border: var(--sd-color-primary-800);
75
+ --sd-button--secondary--active-color-text: var(--sd-color-primary-800);
76
+ --sd-button--secondary--default-color-border: var(--sd-color-info);
77
+ --sd-button--secondary--default-color-text: var(--sd-color-info);
78
+ --sd-button--secondary--disabled-color-border: var(--sd-color-primary-200);
79
+ --sd-button--secondary--disabled-color-text: var(--sd-color-primary-200);
80
+ --sd-button--secondary--hover-color-background: var(--sd-color-primary-100);
81
+ --sd-button--secondary--hover-color-border: var(--sd-color-primary-700);
82
+ --sd-button--secondary--hover-color-text: var(--sd-color-primary-700);
83
+ --sd-button--secondary--inverted--active-color-background: var(--sd-color-primary-750);
84
+ --sd-button--secondary--inverted--active-color-text: var(--sd-color-primary-100);
85
+ --sd-button--secondary--inverted--hover-color-background: var(--sd-color-primary-750);
86
+ --sd-button--secondary--inverted--hover-color-text: var(--sd-color-white);
87
+ --sd-button--secondary--inverted-color-border: var(--sd-color-white);
88
+ --sd-button--secondary--inverted-color-text: var(--sd-color-white);
89
+ --sd-button--secondary--size-lg-padding-block: var(--sd-spacing-2);
90
+ --sd-button--secondary--size-md-padding-block: var(--sd-spacing-2);
91
+ --sd-button--secondary--size-sm-padding-block: 0.21875rem;
92
+ --sd-button--secondary-padding-inline: 1.375rem;
93
+ --sd-button--size-lg-font-size: 0.875rem;
94
+ --sd-button--size-lg-icon-height: 1.25rem;
95
+ --sd-button--size-lg-min-height: 2.75rem;
96
+ --sd-button--size-lg-padding-block: var(--sd-spacing-2\.5);
97
+ --sd-button--size-md--icon-only-padding-inline: var(--sd-spacing-3);
98
+ --sd-button--size-md-font-size: 0.875rem;
99
+ --sd-button--size-md-min-height: 2.75rem;
100
+ --sd-button--size-md-padding-block: var(--sd-spacing-2\.5);
101
+ --sd-button--size-sm-font-size: 0.875rem;
102
+ --sd-button--size-sm-padding-block: 0.34375rem;
103
+ --sd-button--tertiary--active-color-background: var(--sd-color-primary-100);
104
+ --sd-button--tertiary--active-color-text: var(--sd-color-primary-800);
105
+ --sd-button--tertiary--default-color-text: var(--sd-color-info);
106
+ --sd-button--tertiary--disabled-color-text: var(--sd-color-primary-200);
107
+ --sd-button--tertiary--hover-color-background: var(--sd-color-primary-100);
108
+ --sd-button--tertiary--hover-color-text: var(--sd-color-primary-700);
109
+ --sd-button--tertiary--inverted--active-color-background: var(--sd-color-primary-750);
110
+ --sd-button--tertiary--inverted--active-color-text: var(--sd-color-primary-100);
111
+ --sd-button--tertiary--inverted--hover-color-background: var(--sd-color-primary-750);
112
+ --sd-button--tertiary--inverted--hover-color-text: var(--sd-color-white);
113
+ --sd-button--tertiary--inverted-color-text: var(--sd-color-white);
114
+ --sd-button-border-radius: 0;
115
+ --sd-button-border-width: var(--sd-spacing-0\.5);
116
+ --sd-button-font-weight: var(--sd-font-weight-bold);
117
+ --sd-button-padding-inline: var(--sd-spacing-6);
118
+ --sd-carousel--active--inverted-color-border: var(--sd-color-white);
119
+ --sd-carousel--active-color-border: var(--sd-color-info);
120
+ --sd-carousel__pager-dot--inverted--hovered-background: var(--sd-color-white);
121
+ --sd-carousel__pager-dot--inverted-background: var(--sd-color-white);
122
+ --sd-carousel__pager-dot--inverted-border: var(--sd-color-white);
123
+ --sd-carousel__pager-dot-background: var(--sd-color-info);
124
+ --sd-carousel__pager-dot-border-width: var(--sd-spacing-0\.5);
125
+ --sd-checkbox-border-width: var(--sd-spacing-0\.5);
126
+ --sd-chip--primary-200-color-background: var(--sd-color-neutral-100);
127
+ --sd-chip--primary-200-color-border: var(--sd-color-primary-900);
128
+ --sd-chip--primary-300-color-background: var(--sd-color-primary-100);
129
+ --sd-chip--primary-300-color-border: var(--sd-color-info);
130
+ --sd-chip--primary-500-color-background: var(--sd-color-primary-100);
131
+ --sd-chip--primary-500-color-border: var(--sd-color-info);
132
+ --sd-chip--primary-500-color-text: var(--sd-color-black);
133
+ --sd-chip--white-color-background: var(--sd-color-neutral-100);
134
+ --sd-chip--white-color-border: var(--sd-color-primary-900);
135
+ --sd-chip-border-radius: var(--sd-spacing-1);
136
+ --sd-choice-control-font-weight: var(--sd-font-weight-bold);
137
+ --sd-color-accent-100: 253 235 235;
138
+ --sd-color-accent-200: 240 128 128;
139
+ --sd-color-accent-300: 233 77 77;
140
+ --sd-color-accent-400: 229 38 38;
141
+ --sd-color-accent-500: 210 0 0;
142
+ --sd-color-accent-550: 210 0 0;
143
+ --sd-color-accent-600: 220 0 0;
144
+ --sd-color-accent-700: 202 0 0;
145
+ --sd-color-accent-800: 211 0 0;
146
+ --sd-color-accent: 210 0 0;
147
+ --sd-color-background-accent-300: var(--sd-color-primary-400);
148
+ --sd-color-background-accent-500: var(--sd-color-primary-700);
149
+ --sd-color-background-accent-550: var(--sd-color-info);
150
+ --sd-color-background-accent-700: var(--sd-color-primary-800);
151
+ --sd-color-background-accent: var(--sd-color-info);
152
+ --sd-color-background-error-400: var(--sd-color-error);
153
+ --sd-color-background-error: var(--sd-color-error);
154
+ --sd-color-background-info: var(--sd-color-info);
155
+ --sd-color-background-neutral-100: var(--sd-color-neutral-100);
156
+ --sd-color-background-neutral-200: var(--sd-color-neutral-100);
157
+ --sd-color-background-neutral-300: var(--sd-color-neutral-200);
158
+ --sd-color-background-neutral-400: var(--sd-color-neutral-300);
159
+ --sd-color-background-neutral-500: var(--sd-color-neutral-500);
160
+ --sd-color-background-neutral-600: var(--sd-color-neutral-600);
161
+ --sd-color-background-neutral-800: var(--sd-color-black);
162
+ --sd-color-background-primary-100: var(--sd-color-primary-100);
163
+ --sd-color-background-primary-200: var(--sd-color-primary-200);
164
+ --sd-color-background-primary-300: var(--sd-color-primary-300);
165
+ --sd-color-background-primary-500: var(--sd-color-primary-500);
166
+ --sd-color-background-primary-800: var(--sd-color-primary-800);
167
+ --sd-color-background-primary: var(--sd-color-info);
168
+ --sd-color-background-success: var(--sd-color-success);
169
+ --sd-color-background-warning: var(--sd-color-warning);
170
+ --sd-color-background-white: var(--sd-color-white);
171
+ --sd-color-black: 0 0 0 / 0.86;
172
+ --sd-color-border-accent-550: var(--sd-color-info);
173
+ --sd-color-border-accent: var(--sd-color-info);
174
+ --sd-color-border-error-400: var(--sd-color-error);
175
+ --sd-color-border-error: var(--sd-color-error);
176
+ --sd-color-border-neutral-400: var(--sd-color-neutral-400);
177
+ --sd-color-border-neutral-500: var(--sd-color-neutral-500);
178
+ --sd-color-border-neutral-600: var(--sd-color-neutral-600);
179
+ --sd-color-border-neutral-800: var(--sd-color-black);
180
+ --sd-color-border-primary-100: var(--sd-color-primary-100);
181
+ --sd-color-border-primary-200: var(--sd-color-primary-100);
182
+ --sd-color-border-primary-400: var(--sd-color-neutral-400);
183
+ --sd-color-border-primary-500: var(--sd-color-info);
184
+ --sd-color-border-primary-800: var(--sd-color-primary-800);
185
+ --sd-color-border-primary: var(--sd-color-info);
186
+ --sd-color-border-success: var(--sd-color-success);
187
+ --sd-color-border-white: var(--sd-color-white);
188
+ --sd-color-error-250: 210 0 0;
189
+ --sd-color-error-300: 210 0 0;
190
+ --sd-color-error-400: 210 0 0;
191
+ --sd-color-error-500: 210 0 0;
192
+ --sd-color-error: 210 0 0;
193
+ --sd-color-icon-fill-accent-550: 134 205 210;
194
+ --sd-color-icon-fill-accent: 134 205 210;
195
+ --sd-color-icon-fill-error-400: var(--sd-color-error);
196
+ --sd-color-icon-fill-error: var(--sd-color-error);
197
+ --sd-color-icon-fill-neutral-400: var(--sd-color-neutral-200);
198
+ --sd-color-icon-fill-neutral-500: var(--sd-color-neutral-500);
199
+ --sd-color-icon-fill-neutral-600: 255 255 255 / 0.4;
200
+ --sd-color-icon-fill-neutral-800: var(--sd-color-black);
201
+ --sd-color-icon-fill-primary-100: var(--sd-color-primary-100);
202
+ --sd-color-icon-fill-primary-200: var(--sd-color-primary-200);
203
+ --sd-color-icon-fill-primary-400: 255 255 255 / 0.84;
204
+ --sd-color-icon-fill-primary-500: var(--sd-color-info);
205
+ --sd-color-icon-fill-primary-800: var(--sd-color-primary-800);
206
+ --sd-color-icon-fill-primary: var(--sd-color-info);
207
+ --sd-color-icon-fill-risk-high: var(--sd-color-risk-high);
208
+ --sd-color-icon-fill-risk-increased: var(--sd-color-risk-increased);
209
+ --sd-color-icon-fill-risk-low: var(--sd-color-risk-low);
210
+ --sd-color-icon-fill-risk-moderate: var(--sd-color-risk-moderate);
211
+ --sd-color-icon-fill-risk-veryhigh: var(--sd-color-risk-veryhigh);
212
+ --sd-color-icon-fill-success: var(--sd-color-success);
213
+ --sd-color-icon-fill-white: var(--sd-color-white);
214
+ --sd-color-info: 0 92 169;
215
+ --sd-color-neutral-100: 250 250 250;
216
+ --sd-color-neutral-200: 229 229 229;
217
+ --sd-color-neutral-300: 219 219 219;
218
+ --sd-color-neutral-400: 204 204 204;
219
+ --sd-color-neutral-500: 158 158 158;
220
+ --sd-color-neutral-600: 0 0 0 / 0.62;
221
+ --sd-color-neutral-700: 0 0 0 / 0.65;
222
+ --sd-color-neutral-800: 0 0 0 / 0.86;
223
+ --sd-color-primary-100: 235 242 248;
224
+ --sd-color-primary-200: 179 206 229;
225
+ --sd-color-primary-300: 128 174 212;
226
+ --sd-color-primary-400: 77 141 195;
227
+ --sd-color-primary-500: 38 116 182;
228
+ --sd-color-primary-600: 0 92 169;
229
+ --sd-color-primary-700: 0 84 162;
230
+ --sd-color-primary-750: 0 74 152;
231
+ --sd-color-primary-800: 0 65 143;
232
+ --sd-color-primary-900: 0 48 126;
233
+ --sd-color-primary: 0 92 169;
234
+ --sd-color-risk-high: 250 155 30;
235
+ --sd-color-risk-increased: 255 240 0;
236
+ --sd-color-risk-low: 1 125 195;
237
+ --sd-color-risk-moderate: 0 165 147;
238
+ --sd-color-risk-veryhigh: 255 0 0;
239
+ --sd-color-success: 12 115 54;
240
+ --sd-color-text-accent: 134 205 210;
241
+ --sd-color-text-black: var(--sd-color-black);
242
+ --sd-color-text-error: var(--sd-color-error);
243
+ --sd-color-text-neutral-500: var(--sd-color-neutral-500);
244
+ --sd-color-text-neutral-600: 255 255 255 / 0.4;
245
+ --sd-color-text-neutral-700: var(--sd-color-neutral-700);
246
+ --sd-color-text-primary-100: var(--sd-color-primary-100);
247
+ --sd-color-text-primary-200: var(--sd-color-primary-200);
248
+ --sd-color-text-primary-400: 255 255 255 / 0.84;
249
+ --sd-color-text-primary-500: var(--sd-color-info);
250
+ --sd-color-text-primary-800: var(--sd-color-primary-800);
251
+ --sd-color-text-primary: var(--sd-color-info);
252
+ --sd-color-text-success: var(--sd-color-success);
253
+ --sd-color-text-white: var(--sd-color-white);
254
+ --sd-color-warning: 243 94 1;
255
+ --sd-color-white: 255 255 255;
256
+ --sd-combobox__tag-border-width: var(--sd-spacing-0\.25);
257
+ --sd-container--primary-800-color-background: var(--sd-color-info);
258
+ --sd-datepicker__date-item--current-color-text: var(--sd-color-info);
259
+ --sd-datepicker__date-item--current-font-weight: var(--sd-font-weight-bold);
260
+ --sd-datepicker__date-item--default-color-text: var(--sd-color-black);
261
+ --sd-datepicker__date-item--hover--default-color-background: var(--sd-color-primary-100);
262
+ --sd-datepicker__date-item--hover--default-color-border: var(--sd-color-primary-700);
263
+ --sd-datepicker__date-item--hover--default-color-text: var(--sd-color-primary-700);
264
+ --sd-datepicker__date-item--hover--prev-next-color-background: var(--sd-color-primary-100);
265
+ --sd-datepicker__date-item--hover--prev-next-color-text: var(--sd-color-neutral-700);
266
+ --sd-datepicker__date-item--range-color-background: var(--sd-color-primary-100);
267
+ --sd-datepicker__date-item--selected--hover-color-background: var(--sd-color-primary-700);
268
+ --sd-datepicker__date-item--selected--hover-color-text: var(--sd-color-white);
269
+ --sd-datepicker__date-item--selected-color-background: var(--sd-color-info);
270
+ --sd-datepicker__date-item--selected-color-text: var(--sd-color-white);
271
+ --sd-divider--inverted-color-border: 255 255 255 / 0.4;
272
+ --sd-drop-shadow-listbox: 0px 10px 20px rgba(0, 0, 0, 0.25);
273
+ --sd-drop-shadow-sm: 0.5px 0.5px 1.5px rgba(0, 0, 0, 0.86);
274
+ --sd-drop-shadow-xs: 0.5px 0.5px 1.5px rgba(0, 0, 0, 0.86);
275
+ --sd-drop-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25);
276
+ --sd-dropdown-color-background: var(--sd-color-white);
277
+ --sd-duration-fast: 150ms;
278
+ --sd-duration-medium: 300ms;
279
+ --sd-duration-slow: 500ms;
280
+ --sd-duration-x-slow: 750ms;
281
+ --sd-flag--neutral-200-color-background: var(--sd-color-neutral-100);
282
+ --sd-flag--neutral-200-color-border: var(--sd-color-primary-900);
283
+ --sd-flag--neutral-300-color-background: 237 248 253;
284
+ --sd-flag--neutral-300-color-border: var(--sd-color-info);
285
+ --sd-flag--neutral-500-color-background: var(--sd-color-primary-100);
286
+ --sd-flag--neutral-500-color-border: var(--sd-color-info);
287
+ --sd-flag--white-color-background: var(--sd-color-neutral-100);
288
+ --sd-flag--white-color-border: var(--sd-color-primary-900);
289
+ --sd-flag-border-radius: var(--sd-spacing-1);
290
+ --sd-font-primary: 'BBBank Type TT';
291
+ --sd-font-weight-bold: 600;
292
+ --sd-font-weight-normal: 400;
293
+ --sd-footnotes--target--inverted-color-background: var(--sd-color-primary-750);
294
+ --sd-form-control--disabled-color-text: var(--sd-color-primary-200);
295
+ --sd-form-control--filled__floating-label-color-text: var(--sd-color-neutral-600);
296
+ --sd-form-control--hover-color-background: var(--sd-color-primary-100);
297
+ --sd-form-control--invalid-color-background: 253 237 237;
298
+ --sd-form-control--read-only-color-background: var(--sd-color-primary-100);
299
+ --sd-form-control-border-radius: var(--sd-spacing-1);
300
+ --sd-form-control-color-border: var(--sd-color-black);
301
+ --sd-form-control-color-text: var(--sd-color-neutral-600);
302
+ --sd-form-control__listbox-border-bottom-left-radius: var(--sd-spacing-1);
303
+ --sd-form-control__listbox-border-bottom-right-radius: var(--sd-spacing-1);
304
+ --sd-form-control__listbox-border-top-left-radius: var(--sd-spacing-1);
305
+ --sd-form-control__listbox-border-top-right-radius: var(--sd-spacing-1);
306
+ --sd-header-color-background: var(--sd-color-white);
307
+ --sd-header-padding-bottom: var(--sd-spacing-0\.5);
308
+ --sd-header__shadow-height: 0;
309
+ --sd-header__underline-color-background: var(--sd-color-neutral-200);
310
+ --sd-header__underline-height: var(--sd-spacing-0\.25);
311
+ --sd-headline--3xl-onwards-color-text: var(--sd-color-info);
312
+ --sd-informational-gradient--primary-800-color-background: var(--sd-color-black);
313
+ --sd-informational-gradient--white-color-background: var(--sd-color-white);
314
+ --sd-interactive--active-color-text: var(--sd-color-info);
315
+ --sd-interactive--default-color-text: var(--sd-color-info);
316
+ --sd-map-marker--cluster--default-color-background: var(--sd-color-info);
317
+ --sd-map-marker--cluster--hover-color-background: var(--sd-color-primary-700);
318
+ --sd-map-marker--cluster-color-text: var(--sd-color-white);
319
+ --sd-map-marker--main-color-background: var(--sd-color-info);
320
+ --sd-map-marker--pin--default-color-background: var(--sd-color-white);
321
+ --sd-map-marker--pin--hover-color-background: var(--sd-color-primary-100);
322
+ --sd-map-marker--pin-color-text: var(--sd-color-info);
323
+ --sd-marker-border-width: var(--sd-spacing-0\.25);
324
+ --sd-marker-font-size: 0.875rem;
325
+ --sd-marker-font-weight: var(--sd-font-weight-normal);
326
+ --sd-menu-item--disabled-color-icon-fill: 0 0 0 / 0.2;
327
+ --sd-menu-item--disabled-color-text: 0 0 0 / 0.2;
328
+ --sd-menu-item-color-icon-fill: var(--sd-color-black);
329
+ --sd-menu-item-color-text: var(--sd-color-black);
330
+ --sd-navigable-border-radius: var(--sd-spacing-0\.5);
331
+ --sd-navigable-font-size: 0.875rem;
332
+ --sd-navigable__current-indicator-border-radius: 624.9375rem;
333
+ --sd-navigable__current-indicator-height: 0.1875rem;
334
+ --sd-navigable__current-indicator-width: 0.1875rem;
335
+ --sd-navigation-item-color-text: var(--sd-color-black);
336
+ --sd-notification--error-color-background: 253 237 237;
337
+ --sd-notification--info-color-background: var(--sd-color-neutral-100);
338
+ --sd-notification--success-color-background: 238 246 242;
339
+ --sd-notification--warning-color-background: 255 245 224;
340
+ --sd-notification-color-border: var(--sd-color-primary-800);
341
+ --sd-notification__duration-indicator-color-background: var(--sd-color-info);
342
+ --sd-opacity-0: 0%;
343
+ --sd-opacity-100: 100%;
344
+ --sd-opacity-10: 10%;
345
+ --sd-opacity-20: 20%;
346
+ --sd-opacity-30: 30%;
347
+ --sd-opacity-50: 50%;
348
+ --sd-opacity-55: 55%;
349
+ --sd-opacity-5: 5%;
350
+ --sd-opacity-60: 60%;
351
+ --sd-opacity-70: 70%;
352
+ --sd-opacity-75: 75%;
353
+ --sd-opacity-80: 80%;
354
+ --sd-opacity-85: 85%;
355
+ --sd-opacity-90: 90%;
356
+ --sd-overlay-color-background: 0 0 0 / 0.2;
357
+ --sd-pagination--default-border: var(--sd-color-primary-500);
358
+ --sd-pagination--inverted-border: var(--sd-color-white);
359
+ --sd-panel-color-border: 255 255 255 / 0;
360
+ --sd-quickfact--expandable-color-text: var(--sd-color-black);
361
+ --sd-radio--checked--default-color-background: var(--sd-color-info);
362
+ --sd-radio--checked--default__icon-color-background: var(--sd-color-white);
363
+ --sd-radio--checked--disabled__icon-color-background: var(--sd-color-white);
364
+ --sd-radio--checked--hover-color-background: var(--sd-color-info);
365
+ --sd-radio--checked--hover__icon-color-background: var(--sd-color-white);
366
+ --sd-radio--checked--invalid--default-color-background: var(--sd-color-error);
367
+ --sd-radio--checked--invalid--default__icon-color-background: var(--sd-color-white);
368
+ --sd-radio--checked--invalid--hover__icon-color-background: var(--sd-color-white);
369
+ --sd-radio--default--invalid-color-background: 253 237 237;
370
+ --sd-radio-border-width: var(--sd-spacing-0\.5);
371
+ --sd-radio-button--hover-color-background: var(--sd-color-primary-100);
372
+ --sd-radio-button--hover-color-text: var(--sd-color-black);
373
+ --sd-radio-button-border-radius: var(--sd-spacing-1);
374
+ --sd-radio-button-color-text: var(--sd-color-black);
375
+ --sd-radio-button-group-border-radius: var(--sd-spacing-2);
376
+ --sd-radio-button-group-border-width: var(--sd-spacing-0\.5);
377
+ --sd-radio-button-group-padding: var(--sd-spacing-1);
378
+ --sd-radio__checked-height: var(--sd-spacing-1\.5);
379
+ --sd-radio__checked-width: var(--sd-spacing-1\.5);
380
+ --sd-radius-full: 624.9375rem;
381
+ --sd-radius-lg: 0.5rem;
382
+ --sd-radius-md: 0.375rem;
383
+ --sd-radius-none: 0;
384
+ --sd-radius-sm: 0.125rem;
385
+ --sd-radius: 0.25rem;
386
+ --sd-range-scale-ticks-color-text: var(--sd-color-neutral-600);
387
+ --sd-shadow-listbox: 0px 10px 20px 0px rgba(0, 0, 0, 0.25);
388
+ --sd-shadow-sm: 0.5px 0.5px 1.5px 0px rgba(0, 0, 0, 0.86);
389
+ --sd-shadow-xs: 0.5px 0.5px 1.5px 0px rgba(0, 0, 0, 0.86);
390
+ --sd-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
391
+ --sd-sizing-0: 0;
392
+ --sd-sizing-0\.25: 0.0625rem;
393
+ --sd-sizing-0\.5: 0.125rem;
394
+ --sd-sizing-10: 2.5rem;
395
+ --sd-sizing-12: 3rem;
396
+ --sd-sizing-16: 4rem;
397
+ --sd-sizing-1: 0.25rem;
398
+ --sd-sizing-1\.5: 0.375rem;
399
+ --sd-sizing-20: 5rem;
400
+ --sd-sizing-24: 6rem;
401
+ --sd-sizing-2: 0.5rem;
402
+ --sd-sizing-2\.5: 0.625rem;
403
+ --sd-sizing-3: 0.75rem;
404
+ --sd-sizing-4: 1rem;
405
+ --sd-sizing-5: 1.25rem;
406
+ --sd-sizing-6: 1.5rem;
407
+ --sd-sizing-8: 2rem;
408
+ --sd-skeleton-color: var(--sd-color-neutral-200);
409
+ --sd-spacing-0\.25: 0.0625rem;
410
+ --sd-spacing-0\.5: 0.125rem;
411
+ --sd-spacing-10: 2.5rem;
412
+ --sd-spacing-12: 3rem;
413
+ --sd-spacing-14: 3.5rem;
414
+ --sd-spacing-16: 4rem;
415
+ --sd-spacing-1: 0.25rem;
416
+ --sd-spacing-1\.5: 0.375rem;
417
+ --sd-spacing-20: 5rem;
418
+ --sd-spacing-24: 6rem;
419
+ --sd-spacing-2: 0.5rem;
420
+ --sd-spacing-2\.5: 0.625rem;
421
+ --sd-spacing-32: 8rem;
422
+ --sd-spacing-3: 0.75rem;
423
+ --sd-spacing-40: 10rem;
424
+ --sd-spacing-4: 1rem;
425
+ --sd-spacing-6: 1.5rem;
426
+ --sd-spacing-8: 2rem;
427
+ --sd-step-color-text: var(--sd-color-neutral-700);
428
+ --sd-step__circle-border-width: var(--sd-spacing-0\.5);
429
+ --sd-step__tail-border-width: var(--sd-spacing-1);
430
+ --sd-switch--checked--hover-color-background: var(--sd-color-info);
431
+ --sd-switch--unchecked--hover-color-background: var(--sd-color-neutral-100);
432
+ --sd-switch--unchecked-color-border: var(--sd-color-black);
433
+ --sd-switch--unchecked__icon-color-background: var(--sd-color-black);
434
+ --sd-switch-border-width: var(--sd-spacing-0\.5);
435
+ --sd-switch-color-text: var(--sd-color-black);
436
+ --sd-tab--active-color-text: var(--sd-color-info);
437
+ --sd-tab--disabled-color-text: var(--sd-color-neutral-400);
438
+ --sd-tab--hover-color-background: var(--sd-color-neutral-100);
439
+ --sd-tab-color-border: var(--sd-color-neutral-300);
440
+ --sd-tab-color-text: var(--sd-color-neutral-600);
441
+ --sd-tag--default--hover-color-background: var(--sd-color-primary-100);
442
+ --sd-tag--default-color-background: 255 255 255 / 0;
443
+ --sd-tag--default-color-border: var(--sd-color-info);
444
+ --sd-tag--default-color-text: var(--sd-color-info);
445
+ --sd-tag--disabled-color-text: var(--sd-color-neutral-400);
446
+ --sd-tag--selected--default-color-background: var(--sd-color-primary-100);
447
+ --sd-tag--selected--default-color-border: var(--sd-color-primary-800);
448
+ --sd-tag--selected--default-color-text: var(--sd-color-primary-800);
449
+ --sd-tag--selected--hover-color-background: var(--sd-color-primary-100);
450
+ --sd-tag--selected--hover-color-border: var(--sd-color-primary-800);
451
+ --sd-tag--selected--hover-color-text: var(--sd-color-primary-800);
452
+ --sd-tag--selected-border-width: var(--sd-spacing-0\.25);
453
+ --sd-tag--size-lg-font-size: var(--sd-spacing-4);
454
+ --sd-tag--size-sm-font-size: 0.875rem;
455
+ --sd-tag-border-radius: 0;
456
+ --sd-teaser--neutral-100-color-background: var(--sd-color-neutral-100);
457
+ --sd-teaser--neutral-400-color-border: var(--sd-color-neutral-400);
458
+ --sd-teaser--primary-100-color-background: var(--sd-color-primary-100);
459
+ --sd-teaser-border-radius: 0;
460
+ --sd-teaser-media--neutral-100--hover-color-background: 235 242 248 / 0.9;
461
+ --sd-teaser-media--neutral-100-color-background: 235 242 248 / 0.8;
462
+ --sd-teaser-media--primary-100--hover-color-background: 235 242 248 / 0.9;
463
+ --sd-teaser-media--primary-100-color-background: 235 242 248 / 0.8;
464
+ --sd-teaser-media--white--hover-color-background: 255 255 255 / 0.9;
465
+ --sd-teaser-media--white-color-background: 255 255 255 / 0.8;
466
+ --sd-text-2xl: 1.75rem;
467
+ --sd-text-3xl: 2rem;
468
+ --sd-text-4xl: 2.375rem;
469
+ --sd-text-base: 1rem;
470
+ --sd-text-lg: 1.25rem;
471
+ --sd-text-sm: 0.875rem;
472
+ --sd-text-xl: 1.5rem;
473
+ --sd-text-xs: 0.75rem;
474
+ --sd-tooltip-color-background: var(--sd-color-white);
475
+ --sd-tooltip-color-text: var(--sd-color-neutral-600);
476
+ --sd-video--play-button-color-background: var(--sd-color-white);
477
+ --sd-video--play-button-color-icon-fill: var(--sd-color-info);
478
+ }
479
+
480
+ .sd-theme-bb {
481
+ --sd-icon--calendar: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M21 4.55h-3.25V2.88H16.1v1.67H7.9V2.88H6.25v1.67H3v15.33h17.84v-.01H21zM19.36 6.3v1.67H4.64V6.3zM4.64 9.68h14.72v8.5H4.64z"/><path d="M7.91 11.38H6.28v1.7H7.9zM11.19 11.38H9.55v1.7h1.64zM7.91 14.78H6.28v1.7H7.9zM11.19 14.78H9.55v1.7h1.64zM14.45 11.38H12.8v1.7h1.64zM17.72 11.38H16.1v1.7h1.63zM14.45 14.78H12.8v1.7h1.64zM17.72 14.78H16.1v1.7h1.63z"/></svg>';
482
+ --sd-icon--chevron-down: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" viewBox="0 0 24 24" fill="none"><path d="m5.62 9.82 6.5 6.41 6.5-6.4-1.6-1.6-4.9 4.83-4.89-4.83z"/></svg>';
483
+ --sd-icon--chevron-left: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m14.63 5.64-6.42 6.5 6.42 6.5 1.58-1.6-4.82-4.9 4.82-4.89z"/></svg>';
484
+ --sd-icon--chevron-right: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m9.45 5.71 6.4 6.5-6.4 6.5-1.6-1.6 4.83-4.9-4.82-4.89z"/></svg>';
485
+ --sd-icon--chevron-sm-left: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M13.91 6 7.5 12.5l6.41 6.5 1.59-1.61-4.82-4.89 4.82-4.89z"/></svg>';
486
+ --sd-icon--chevron-sm-right: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m10.09 6 6.41 6.5-6.41 6.5-1.59-1.61 4.82-4.89L8.5 7.61z"/></svg>';
487
+ --sd-icon--chevron-up: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m5.95 13.08 6.5-6.4 6.5 6.4-1.6 1.6-4.9-4.83-4.89 4.82z"/></svg>';
488
+ --sd-icon--chevrons-sm-left: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M17.41 5.5 11 12l6.41 6.5L19 16.89 14.18 12 19 7.11z"/><path d="M11.41 5.5 5 12l6.41 6.5L13 16.89 8.18 12 13 7.11z"/></svg>';
489
+ --sd-icon--chevrons-sm-right: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m6.76 6 6.42 6.5L6.76 19l-1.58-1.61L10 12.5 5.18 7.61z"/><path d="m12.76 6 6.42 6.5-6.42 6.5-1.58-1.61L16 12.5l-4.82-4.89z"/></svg>';
490
+ --sd-icon--clock: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M20.09 11.98a8.12 8.12 0 1 0-16.24-.01 8.12 8.12 0 0 0 16.24 0m-18.13 0c0-5.5 4.5-10 10-10s10 4.5 10 10-4.49 10-10 10-10-4.5-10-10m9.07-5.31v-.94h1.87v5.74c2.66 1.76 4.02 2.7 4.1 2.73L16 15.78l-.78-.51-3.75-2.5-.43-.27z"/></svg>';
491
+ --sd-icon--close: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m17.94 7.83-4.69 4.65 5.32 5.31-1.3 1.33-5.3-5.31-5.32 5.3-1.33-1.32 5.32-5.31-5.32-5.31 1.33-1.33.67.66 4.64 4.69 5.32-5.31 1.32 1.29z"/></svg>';
492
+ --sd-icon--closing-round: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M11.964 4.347a8.12 8.12 0 0 0-8.125 8.125 8.12 8.12 0 0 0 8.125 8.125 8.12 8.12 0 0 0 8.125-8.125 8.12 8.12 0 0 0-8.125-8.125m0 18.125c-5.508 0-10-4.492-10-10s4.492-10 10-10 10 4.492 10 10-4.492 10-10 10m-1.328-10L8.019 9.855l1.328-1.328 2.617 2.617 2.617-2.617 1.328 1.328-2.617 2.617 2.617 2.617-1.328 1.329-2.617-2.618-2.617 2.617-1.328-1.328z"/></svg>';
493
+ --sd-icon--confirm-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M12 2.5a10 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="m15.8 8-.5-.2a1 1 0 0 0-.8.5l-3.7 6.2-1.7-1.7a1 1 0 0 0-1.7.7q0 .4.2.7l2.7 2.7q.3.2.7.3h.1q.5-.1.8-.5l4.3-7.4.1-.5a1 1 0 0 0-.5-.8"/></svg>';
494
+ --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 8a1 1 0 1 1 2 0 1 1 0 1 1-2 0" clip-rule="evenodd"/></svg>';
495
+ --sd-icon--eye-crossed-out: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m2.63 1.8 3.7 3.72a9.8 9.8 0 0 1 5.63-1.8c6.21 0 10.08 5.82 11.25 8.75-.62 1.56-1.99 3.95-4.1 5.82l3.52 3.52.66.66-1.33 1.33-.66-.66-20-20-.66-.67 1.32-1.33zm5.04 5.05 1.48 1.48a4.98 4.98 0 0 1 6.95 6.95l1.68 1.68c.12-.11.28-.23.4-.39 1.4-1.32 2.42-2.89 3-4.1a15 15 0 0 0-3-4.1c-1.68-1.6-3.76-2.77-6.22-2.77-1.6 0-3 .47-4.3 1.25m7.07 7.07a3.13 3.13 0 0 0-4.22-4.22zM4.85 9.35a13 13 0 0 0-2.07 3.12c.59 1.21 1.6 2.78 2.97 4.1 1.68 1.64 3.75 2.78 6.21 2.78q1.34-.02 2.5-.4l1.45 1.45c-1.17.51-2.5.82-3.95.82C5.8 21.22 1.9 15.4.71 12.47c.51-1.2 1.45-2.89 2.82-4.45z"/></svg>';
496
+ --sd-icon--eye: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M2.78 11.98c.59 1.2 1.6 2.77 2.97 4.1 1.68 1.6 3.75 2.77 6.21 2.77s4.54-1.13 6.21-2.77c1.41-1.33 2.39-2.9 3.01-4.1a15 15 0 0 0-3-4.1c-1.68-1.6-3.76-2.78-6.22-2.78s-4.53 1.18-6.2 2.78a15 15 0 0 0-2.98 4.1m20.43 0c-1.17 2.93-5.07 8.75-11.25 8.75S1.9 14.9.71 11.98C1.9 9.05 5.8 3.23 11.96 3.23s10.08 5.82 11.25 8.75M11.96 15.1c1.72 0 3.13-1.4 3.13-3.12a3.1 3.1 0 0 0-1.88-2.85v4.1h-4.1a3.1 3.1 0 0 0 2.85 1.87m-3.04-3.75h2.42V8.93a3.1 3.1 0 0 0-2.42 2.42m3.04-4.37c2.78 0 5 2.23 5 5s-2.22 5-5 5-5-2.23-5-5 2.23-5 5-5"/></svg>';
497
+ --sd-icon--info-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M12 2a10 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="M13.3 9.5h-2v7.8h2zM12.3 8a1.2 1.2 0 1 0 0-2.5 1.2 1.2 0 0 0 0 2.5"/><path d="M13.3 11.3v-2h-4v2zM15.3 17.5v-2h-6v2z"/></svg>';
498
+ --sd-icon--magnifying-glass: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m22 21.134-4.517-4.517a8.693 8.693 0 1 0-1.366 1.366l4.517 4.517zm-11.307-3.18a6.77 6.77 0 0 1-6.761-6.761 6.77 6.77 0 0 1 6.76-6.761 6.77 6.77 0 0 1 6.762 6.76 6.77 6.77 0 0 1-6.761 6.761"/></svg>';
499
+ --sd-icon--minus-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M2 11v2h20v-2z"/></svg>';
500
+ --sd-icon--mute: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m6.3 14.32 3.79 3.24V6.39L6.3 9.63l-.5.47H2.58v3.75h3.2zm-5.59 1.4v-7.5H5.1c3.87-3.32 6.13-5.31 6.87-5.94v19.38c-.74-.63-3-2.62-6.87-5.94zm21.33-6.25-2.5 2.5 2.5 2.5-1.33 1.33-2.5-2.5-2.5 2.5-1.32-1.33 2.5-2.5-2.5-2.5 1.32-1.33 2.5 2.5 2.5-2.5z"/></svg>';
501
+ --sd-icon--pause: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M6.3 5.1v13.7h2.5V5.1zM4.5 3.2h6.2v17.5H4.5zM15 5.1v13.7h2.5V5.1zm-1.9-1.9h6.3v17.5h-6.3z"/></svg>';
502
+ --sd-icon--plus-circle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M13 2h-2v20h2z"/><path d="M2 11v2h20v-2z"/></svg>';
503
+ --sd-icon--reload: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M13.96 1.7v2.06a8.01 8.01 0 0 1-2 15.74A8 8 0 0 1 7.4 4.94L9.96 7.5v-6h-6l2 2a9.98 9.98 0 0 0 6 18 10 10 0 0 0 2-19.8"/></svg>';
504
+ --sd-icon--risk: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M21.9 19.5A1 1 0 0 1 21 21H3a1 1 0 0 1-.9-1.5l9-16a1 1 0 0 1 1.8 0zM12 6 4.7 19h14.6zm-1 4a1 1 0 1 1 2 0v4a1 1 0 1 1-2 0zm0 7a1 1 0 1 1 2 0 1 1 0 1 1-2 0" clip-rule="evenodd"/></svg>';
505
+ --sd-icon--start: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m4.5 2.62 1.87 1.06 13.08 7.26L21.37 12l-1.92 1.1-13.08 7.22-1.88 1.05zm1.87 15.55L17.5 12 6.37 5.83z"/></svg>';
506
+ --sd-icon--status-check: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m20.487 7.59-.664.664-9.922 9.883-.664.664-.664-.664-4.922-4.922-.664-.664 1.29-1.328.663.663 4.297 4.258 9.258-9.218.664-.664z"/></svg>';
507
+ --sd-icon--status-minus: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill="#fff" d="M19.8 12.6H3.5v-1.9h16.3z"/></svg>';
508
+ --sd-icon--transcript: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M4 2v20h15V5.35L15.67 2zm13.33 18.33H5.67V3.67h10l1.66 1.67z"/><path d="M18.41 5.34h-2.74v-2.7H14v4.37h4.41zM12.33 5.35h-5V7h5zM15.67 8.68H7.33v1.67h8.34zM15.67 12.01H7.33v1.67h8.34zM15.67 15.35H7.33V17h8.34z"/><path d="m15.26 3.27.13 3.31 2.13-.16.54-.93s-.32-.84-.45-.94-2.35-1.28-2.35-1.28"/></svg>';
509
+ --sd-icon--volume: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="m7.55 14.32 3.79 3.24V6.39L7.55 9.63l-.5.47H3.83v3.75h3.2zm-5.59 1.4v-7.5h4.38c3.87-3.32 6.13-5.31 6.87-5.94v19.38c-.74-.63-3-2.62-6.87-5.94zm13.68-5.2-.43-.34 1.13-1.53.5.43a3.7 3.7 0 0 1 1.37 2.9c0 1.16-.54 2.22-1.36 2.92l-.51.4-1.13-1.5.43-.38a1.85 1.85 0 0 0 0-2.9m2.38-2.92-.55-.43 1.1-1.53.62.51a7.52 7.52 0 0 1 0 11.64l-.62.51-1.1-1.52.55-.43a5.7 5.7 0 0 0 2.07-4.38c0-1.76-.82-3.32-2.07-4.37"/></svg>';
510
+ --sd-icon--warning: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" d="M21.9 19.5A1 1 0 0 1 21 21H3a1 1 0 0 1-.9-1.5l9-16a1 1 0 0 1 1.8 0zM12 6 4.7 19h14.6zm-1 4a1 1 0 1 1 2 0v4a1 1 0 1 1-2 0zm0 7a1 1 0 1 1 2 0 1 1 0 1 1-2 0" clip-rule="evenodd"/></svg>';
511
+ }
512
+
513
+ :root, .sd-theme-bb {
514
+ /*
515
+ * Deprecated variables – manually overriding these in custom themes might lead to problems in future versions of Solid.
516
+ * Use the actual used value instead. Example:
517
+ * Instead of --sd-chip-border-width use --sd-marker-border-width for your overrides.
518
+ */
519
+ --sd-button--size-lg-border-radius: var(--sd-button-border-radius);
520
+ --sd-button--size-md-border-radius: var(--sd-button-border-radius);
521
+ --sd-button--size-sm-border-radius: var(--sd-button-border-radius);
522
+ --sd-button--secondary--inverted--color-border: var(--sd-button-secondary-inverted-color-border);
523
+ --sd-chip-font-size: var(--sd-marker-font-size);
524
+ --sd-chip-border-width: var(--sd-marker-border-width);
525
+ --sd-chip-font-weight: var(--sd-marker-font-weight);
526
+ --sd-flag-border-width: var(--sd-marker-border-width);
527
+ --sd-form-control-color-icon: var(--sd-form-control-color-icon-fill);
528
+ --sd-menu-color-icon: var(--sd-menu-item-color-icon-fill);
529
+ --sd-menu-color-text: var(--sd-menu-item-color-text);
530
+ --sd-menu--disabled-color-icon: var(--sd-menu-item--disabled-color-icon-fill);
531
+ --sd-menu--disabled-color-text: var(--sd-menu-item--disabled-color-text);
532
+ --sd-tag-font-weight: var(--sd-choice-control-font-weight);
533
+ --sd-tag--disabled-color-border: var(--sd-color-border-neutral-500);
534
+ --sd-navigation-item--current-color-text: var(--sd-navigation-item-color-text);
535
+ --sd-option--disabled-color-border: var(--sd-color-border-neutral-500);
536
+ --sd-audio__timestamp-color-text: var(--sd-color-text-neutral-700);
537
+ --sd-accordion__chevron-color-text: var(--sd-accordion-color-icon-fill, var(--sd-color-icon-fill-primary));
538
+ }