@boostdev/design-system-components 0.1.16 → 0.1.17

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 (27) hide show
  1. package/AGENTS.md +4 -4
  2. package/README.md +50 -1
  3. package/dist/client.cjs +202 -115
  4. package/dist/client.css +514 -425
  5. package/dist/client.d.cts +20 -1
  6. package/dist/client.d.ts +20 -1
  7. package/dist/client.js +201 -115
  8. package/dist/index.cjs +202 -115
  9. package/dist/index.css +514 -425
  10. package/dist/index.d.cts +20 -1
  11. package/dist/index.d.ts +20 -1
  12. package/dist/index.js +201 -115
  13. package/package.json +1 -1
  14. package/src/components/interaction/Command/Command.mdx +1 -0
  15. package/src/components/interaction/Command/Command.spec.tsx +18 -0
  16. package/src/components/interaction/Command/Command.tsx +5 -0
  17. package/src/components/interaction/Dialog/Dialog.spec.tsx +18 -0
  18. package/src/components/interaction/Drawer/Drawer.spec.tsx +18 -0
  19. package/src/components/interaction/Drawer/Drawer.tsx +5 -0
  20. package/src/components/interaction/form/SegmentedControl/SegmentedControl.mdx +64 -0
  21. package/src/components/interaction/form/SegmentedControl/SegmentedControl.module.css +99 -0
  22. package/src/components/interaction/form/SegmentedControl/SegmentedControl.spec.tsx +87 -0
  23. package/src/components/interaction/form/SegmentedControl/SegmentedControl.stories.tsx +110 -0
  24. package/src/components/interaction/form/SegmentedControl/SegmentedControl.tsx +89 -0
  25. package/src/components/interaction/form/SegmentedControl/index.ts +2 -0
  26. package/src/index.ts +2 -0
  27. package/src/stories/Introduction.mdx +4 -3
package/dist/index.css CHANGED
@@ -1,22 +1,22 @@
1
1
  /* src/components/ui/Accordion/Accordion.module.css */
2
2
  @layer component {
3
- .bds0116Accordion-accordion {
3
+ .bds0117Accordion-accordion {
4
4
  display: flex;
5
5
  flex-direction: column;
6
6
  border: 1px solid var(--color_bg--subtle);
7
7
  border-radius: var(--border_radius--s);
8
8
  overflow: hidden;
9
9
  }
10
- .bds0116Accordion-item {
10
+ .bds0117Accordion-item {
11
11
  border-bottom: 1px solid var(--color_bg--subtle);
12
12
  }
13
- .bds0116Accordion-item:last-child {
13
+ .bds0117Accordion-item:last-child {
14
14
  border-bottom: none;
15
15
  }
16
- .bds0116Accordion-heading {
16
+ .bds0117Accordion-heading {
17
17
  margin: 0;
18
18
  }
19
- .bds0116Accordion-trigger {
19
+ .bds0117Accordion-trigger {
20
20
  all: unset;
21
21
  display: flex;
22
22
  align-items: center;
@@ -31,44 +31,44 @@
31
31
  transition: var(--animation_transition);
32
32
  box-sizing: border-box;
33
33
  }
34
- .bds0116Accordion-trigger:disabled {
34
+ .bds0117Accordion-trigger:disabled {
35
35
  opacity: 0.4;
36
36
  cursor: not-allowed;
37
37
  }
38
- .bds0116Accordion-trigger:focus-visible {
38
+ .bds0117Accordion-trigger:focus-visible {
39
39
  outline: var(--outline_default);
40
40
  outline-offset: calc(var(--outline_offset) * -1);
41
41
  border-radius: var(--border_radius--xs);
42
42
  }
43
43
  @media (hover: hover) and (pointer: fine) {
44
- .bds0116Accordion-trigger:not(:disabled):hover {
44
+ .bds0117Accordion-trigger:not(:disabled):hover {
45
45
  background-color: var(--color_bg--subtle);
46
46
  }
47
47
  }
48
- .bds0116Accordion-triggerLabel {
48
+ .bds0117Accordion-triggerLabel {
49
49
  flex: 1;
50
50
  text-align: start;
51
51
  }
52
- .bds0116Accordion-chevron {
52
+ .bds0117Accordion-chevron {
53
53
  width: 1.25rem;
54
54
  height: 1.25rem;
55
55
  flex-shrink: 0;
56
56
  transition: transform var(--animation_transition-duration) var(--animation_easing);
57
57
  }
58
- .bds0116Accordion-item.bds0116Accordion---open .bds0116Accordion-chevron {
58
+ .bds0117Accordion-item.bds0117Accordion---open .bds0117Accordion-chevron {
59
59
  transform: rotate(180deg);
60
60
  }
61
- .bds0116Accordion-panel {
61
+ .bds0117Accordion-panel {
62
62
  overflow: hidden;
63
63
  }
64
- .bds0116Accordion-panelContent {
64
+ .bds0117Accordion-panelContent {
65
65
  padding: 0 var(--space_m) var(--space_m);
66
66
  color: var(--color_on-bg);
67
67
  font-size: var(--font_size--body);
68
68
  line-height: var(--font_line-height--body);
69
69
  }
70
70
  @media (prefers-reduced-motion: reduce) {
71
- .bds0116Accordion-chevron {
71
+ .bds0117Accordion-chevron {
72
72
  transition: none;
73
73
  }
74
74
  }
@@ -76,7 +76,7 @@
76
76
 
77
77
  /* src/components/ui/Alert/Alert.module.css */
78
78
  @layer component {
79
- .bds0116Alert-alert {
79
+ .bds0117Alert-alert {
80
80
  display: flex;
81
81
  align-items: flex-start;
82
82
  gap: var(--space_s);
@@ -88,43 +88,43 @@
88
88
  font-size: var(--font_size--body);
89
89
  line-height: var(--font_line-height--body);
90
90
  }
91
- .bds0116Alert---variant_info {
91
+ .bds0117Alert---variant_info {
92
92
  --alert_bg: var(--color_blue--subtle);
93
93
  --alert_text: var(--color_on-blue--subtle);
94
94
  --alert_border: var(--color_blue);
95
95
  }
96
- .bds0116Alert---variant_success {
96
+ .bds0117Alert---variant_success {
97
97
  --alert_bg: var(--color_success--subtle);
98
98
  --alert_text: var(--color_on-success--subtle);
99
99
  --alert_border: var(--color_success);
100
100
  }
101
- .bds0116Alert---variant_warning {
101
+ .bds0117Alert---variant_warning {
102
102
  --alert_bg: var(--color_orange--subtle);
103
103
  --alert_text: var(--color_on-orange--subtle);
104
104
  --alert_border: var(--color_warning);
105
105
  }
106
- .bds0116Alert---variant_error {
106
+ .bds0117Alert---variant_error {
107
107
  --alert_bg: rgb(from var(--color_error) r g b / 12%);
108
108
  --alert_text: var(--color_on-bg);
109
109
  --alert_border: var(--color_error);
110
110
  }
111
- .bds0116Alert-icon {
111
+ .bds0117Alert-icon {
112
112
  display: flex;
113
113
  align-items: center;
114
114
  flex-shrink: 0;
115
115
  margin-block-start: 0.1em;
116
116
  }
117
- .bds0116Alert-content {
117
+ .bds0117Alert-content {
118
118
  flex: 1;
119
119
  display: flex;
120
120
  flex-direction: column;
121
121
  gap: var(--space_xxs);
122
122
  }
123
- .bds0116Alert-title {
123
+ .bds0117Alert-title {
124
124
  font-weight: var(--font_weight--semibold);
125
125
  font-size: var(--font_size--body);
126
126
  }
127
- .bds0116Alert-dismiss {
127
+ .bds0117Alert-dismiss {
128
128
  all: unset;
129
129
  display: flex;
130
130
  align-items: center;
@@ -136,16 +136,16 @@
136
136
  border: 1px solid currentcolor;
137
137
  border-radius: 50%;
138
138
  }
139
- .bds0116Alert-dismiss svg {
139
+ .bds0117Alert-dismiss svg {
140
140
  width: 1rem;
141
141
  height: 1rem;
142
142
  }
143
- .bds0116Alert-dismiss:focus-visible {
143
+ .bds0117Alert-dismiss:focus-visible {
144
144
  outline: var(--outline_default);
145
145
  outline-offset: var(--outline_offset);
146
146
  }
147
147
  @media (hover: hover) and (pointer: fine) {
148
- .bds0116Alert-dismiss:hover {
148
+ .bds0117Alert-dismiss:hover {
149
149
  opacity: 0.7;
150
150
  }
151
151
  }
@@ -153,7 +153,7 @@
153
153
 
154
154
  /* src/components/ui/Avatar/Avatar.module.css */
155
155
  @layer component {
156
- .bds0116Avatar-avatar {
156
+ .bds0117Avatar-avatar {
157
157
  display: inline-flex;
158
158
  align-items: center;
159
159
  justify-content: center;
@@ -163,42 +163,42 @@
163
163
  overflow: hidden;
164
164
  flex-shrink: 0;
165
165
  }
166
- .bds0116Avatar-avatar.bds0116Avatar---fallback {
166
+ .bds0117Avatar-avatar.bds0117Avatar---fallback {
167
167
  background-color: var(--avatar_bg, var(--color_blue));
168
168
  color: var(--avatar_text, var(--color_on-blue));
169
169
  font-weight: var(--font_weight--semibold);
170
170
  }
171
- .bds0116Avatar-avatar.bds0116Avatar---size_small {
171
+ .bds0117Avatar-avatar.bds0117Avatar---size_small {
172
172
  --avatar_size: 2em;
173
173
  }
174
- .bds0116Avatar-avatar.bds0116Avatar---size_medium {
174
+ .bds0117Avatar-avatar.bds0117Avatar---size_medium {
175
175
  --avatar_size: 3em;
176
176
  }
177
- .bds0116Avatar-avatar.bds0116Avatar---size_large {
177
+ .bds0117Avatar-avatar.bds0117Avatar---size_large {
178
178
  --avatar_size: 4.5em;
179
179
  }
180
- .bds0116Avatar-image {
180
+ .bds0117Avatar-image {
181
181
  width: 100%;
182
182
  height: 100%;
183
183
  object-fit: cover;
184
184
  display: block;
185
185
  }
186
- .bds0116Avatar-initials {
186
+ .bds0117Avatar-initials {
187
187
  line-height: 1;
188
188
  user-select: none;
189
189
  font-size: var(--font_size--body);
190
190
  }
191
- .bds0116Avatar-avatar.bds0116Avatar---size_small .bds0116Avatar-initials {
191
+ .bds0117Avatar-avatar.bds0117Avatar---size_small .bds0117Avatar-initials {
192
192
  font-size: var(--font_size--body--s);
193
193
  }
194
- .bds0116Avatar-avatar.bds0116Avatar---size_large .bds0116Avatar-initials {
194
+ .bds0117Avatar-avatar.bds0117Avatar---size_large .bds0117Avatar-initials {
195
195
  font-size: var(--font_size--heading-3);
196
196
  }
197
197
  }
198
198
 
199
199
  /* src/components/ui/Badge/Badge.module.css */
200
200
  @layer component {
201
- .bds0116Badge-badge {
201
+ .bds0117Badge-badge {
202
202
  display: inline-flex;
203
203
  align-items: center;
204
204
  justify-content: center;
@@ -211,23 +211,23 @@
211
211
  background-color: var(--badge_bg, var(--color_blue));
212
212
  color: var(--badge_text, var(--color_on-blue));
213
213
  }
214
- .bds0116Badge---variant_primary {
214
+ .bds0117Badge---variant_primary {
215
215
  --badge_bg: var(--color_interactive);
216
216
  --badge_text: var(--color_on-interactive);
217
217
  }
218
- .bds0116Badge---variant_secondary {
218
+ .bds0117Badge---variant_secondary {
219
219
  --badge_bg: var(--color_bg);
220
220
  --badge_text: var(--color_on-bg);
221
221
  }
222
- .bds0116Badge---variant_success {
222
+ .bds0117Badge---variant_success {
223
223
  --badge_bg: var(--color_success);
224
224
  --badge_text: var(--color_on-success);
225
225
  }
226
- .bds0116Badge---variant_error {
226
+ .bds0117Badge---variant_error {
227
227
  --badge_bg: var(--color_error);
228
228
  --badge_text: var(--color_on-error);
229
229
  }
230
- .bds0116Badge---variant_warning {
230
+ .bds0117Badge---variant_warning {
231
231
  --badge_bg: var(--color_warning);
232
232
  --badge_text: var(--color_on-warning);
233
233
  }
@@ -235,10 +235,10 @@
235
235
 
236
236
  /* src/components/ui/Breadcrumb/Breadcrumb.module.css */
237
237
  @layer component {
238
- .bds0116Breadcrumb-breadcrumb {
238
+ .bds0117Breadcrumb-breadcrumb {
239
239
  font-size: var(--font_size--body--s);
240
240
  }
241
- .bds0116Breadcrumb-list {
241
+ .bds0117Breadcrumb-list {
242
242
  display: flex;
243
243
  flex-wrap: wrap;
244
244
  align-items: center;
@@ -247,32 +247,32 @@
247
247
  margin: 0;
248
248
  padding: 0;
249
249
  }
250
- .bds0116Breadcrumb-item {
250
+ .bds0117Breadcrumb-item {
251
251
  display: flex;
252
252
  align-items: center;
253
253
  gap: var(--space_xxs);
254
254
  }
255
- .bds0116Breadcrumb-link {
255
+ .bds0117Breadcrumb-link {
256
256
  color: var(--color_interactive);
257
257
  text-decoration: none;
258
258
  transition: var(--animation_transition);
259
259
  }
260
- .bds0116Breadcrumb-link:focus-visible {
260
+ .bds0117Breadcrumb-link:focus-visible {
261
261
  outline: var(--outline_default);
262
262
  outline-offset: var(--outline_offset);
263
263
  border-radius: var(--border_radius--xs);
264
264
  }
265
265
  @media (hover: hover) and (pointer: fine) {
266
- .bds0116Breadcrumb-link:hover {
266
+ .bds0117Breadcrumb-link:hover {
267
267
  text-decoration: underline;
268
268
  text-underline-offset: 0.2em;
269
269
  }
270
270
  }
271
- .bds0116Breadcrumb-separator {
271
+ .bds0117Breadcrumb-separator {
272
272
  color: var(--color_on-bg--subtle);
273
273
  user-select: none;
274
274
  }
275
- .bds0116Breadcrumb-current {
275
+ .bds0117Breadcrumb-current {
276
276
  color: var(--color_on-bg--subtle);
277
277
  font-weight: var(--font_weight--semibold);
278
278
  }
@@ -280,12 +280,12 @@
280
280
 
281
281
  /* src/components/ui/Collapsible/Collapsible.module.css */
282
282
  @layer component {
283
- .bds0116Collapsible-collapsible {
283
+ .bds0117Collapsible-collapsible {
284
284
  border: var(--collapsible_border-width, 1px) solid var(--collapsible_border-color, var(--color_bg--subtle));
285
285
  border-radius: var(--collapsible_border-radius, var(--border_radius--m));
286
286
  overflow: hidden;
287
287
  }
288
- .bds0116Collapsible-summary {
288
+ .bds0117Collapsible-summary {
289
289
  list-style: none;
290
290
  display: flex;
291
291
  align-items: center;
@@ -300,25 +300,25 @@
300
300
  user-select: none;
301
301
  transition: var(--animation_transition);
302
302
  }
303
- .bds0116Collapsible-summary::-webkit-details-marker {
303
+ .bds0117Collapsible-summary::-webkit-details-marker {
304
304
  display: none;
305
305
  }
306
- .bds0116Collapsible-summary:focus-visible {
306
+ .bds0117Collapsible-summary:focus-visible {
307
307
  outline: var(--outline_default);
308
308
  outline-offset: calc(var(--outline_offset) * -1);
309
309
  }
310
310
  @media (hover: hover) and (pointer: fine) {
311
- .bds0116Collapsible-summary:hover {
311
+ .bds0117Collapsible-summary:hover {
312
312
  background-color: var(--collapsible_bg--hover, var(--color_bg--subtle));
313
313
  }
314
314
  }
315
- .bds0116Collapsible-collapsible[open] > .bds0116Collapsible-summary {
315
+ .bds0117Collapsible-collapsible[open] > .bds0117Collapsible-summary {
316
316
  border-block-end: var(--collapsible_border-width, 1px) solid var(--collapsible_border-color, var(--color_bg--subtle));
317
317
  }
318
- .bds0116Collapsible-summaryContent {
318
+ .bds0117Collapsible-summaryContent {
319
319
  flex: 1;
320
320
  }
321
- .bds0116Collapsible-icon {
321
+ .bds0117Collapsible-icon {
322
322
  width: 0.5rem;
323
323
  height: 0.5rem;
324
324
  border-right: 2px solid currentcolor;
@@ -327,17 +327,17 @@
327
327
  flex-shrink: 0;
328
328
  transition: transform var(--animation_transition-duration) var(--animation_easing);
329
329
  }
330
- .bds0116Collapsible-collapsible[open] > .bds0116Collapsible-summary .bds0116Collapsible-icon {
330
+ .bds0117Collapsible-collapsible[open] > .bds0117Collapsible-summary .bds0117Collapsible-icon {
331
331
  transform: rotate(-135deg);
332
332
  }
333
- .bds0116Collapsible-content {
333
+ .bds0117Collapsible-content {
334
334
  padding: var(--space_m);
335
335
  color: var(--collapsible_on-color, var(--color_on-bg));
336
336
  font-size: var(--font_size--body);
337
337
  line-height: var(--font_line-height--body);
338
338
  }
339
339
  @media (prefers-reduced-motion: reduce) {
340
- .bds0116Collapsible-icon {
340
+ .bds0117Collapsible-icon {
341
341
  transition: none;
342
342
  }
343
343
  }
@@ -345,7 +345,7 @@
345
345
 
346
346
  /* src/components/ui/Calendar/Calendar.module.css */
347
347
  @layer component {
348
- .bds0116Calendar-calendar {
348
+ .bds0117Calendar-calendar {
349
349
  display: inline-flex;
350
350
  flex-direction: column;
351
351
  gap: var(--space_s);
@@ -356,17 +356,17 @@
356
356
  box-shadow: var(--shadow_s);
357
357
  width: 20rem;
358
358
  }
359
- .bds0116Calendar-header {
359
+ .bds0117Calendar-header {
360
360
  display: flex;
361
361
  align-items: center;
362
362
  justify-content: space-between;
363
363
  }
364
- .bds0116Calendar-monthYear {
364
+ .bds0117Calendar-monthYear {
365
365
  font-size: var(--font_size--body);
366
366
  font-weight: var(--font_weight--semibold);
367
367
  color: var(--color_on-bg);
368
368
  }
369
- .bds0116Calendar-navBtn {
369
+ .bds0117Calendar-navBtn {
370
370
  all: unset;
371
371
  display: flex;
372
372
  align-items: center;
@@ -378,35 +378,35 @@
378
378
  color: var(--color_on-bg);
379
379
  transition: var(--animation_transition);
380
380
  }
381
- .bds0116Calendar-navBtn svg {
381
+ .bds0117Calendar-navBtn svg {
382
382
  width: 1rem;
383
383
  height: 1rem;
384
384
  }
385
- .bds0116Calendar-navBtn:focus-visible {
385
+ .bds0117Calendar-navBtn:focus-visible {
386
386
  outline: var(--outline_default);
387
387
  outline-offset: var(--outline_offset);
388
388
  }
389
389
  @media (hover: hover) and (pointer: fine) {
390
- .bds0116Calendar-navBtn:hover {
390
+ .bds0117Calendar-navBtn:hover {
391
391
  background-color: var(--color_bg--subtle);
392
392
  }
393
393
  }
394
- .bds0116Calendar-grid {
394
+ .bds0117Calendar-grid {
395
395
  border-collapse: collapse;
396
396
  width: 100%;
397
397
  table-layout: fixed;
398
398
  }
399
- .bds0116Calendar-weekday {
399
+ .bds0117Calendar-weekday {
400
400
  font-size: var(--font_size--body--s);
401
401
  font-weight: var(--font_weight--semibold);
402
402
  color: var(--color_on-bg--muted);
403
403
  text-align: center;
404
404
  padding-block-end: var(--space_xs);
405
405
  }
406
- .bds0116Calendar-empty {
406
+ .bds0117Calendar-empty {
407
407
  padding: 0;
408
408
  }
409
- .bds0116Calendar-day {
409
+ .bds0117Calendar-day {
410
410
  all: unset;
411
411
  display: flex;
412
412
  align-items: center;
@@ -420,30 +420,30 @@
420
420
  transition: var(--animation_transition);
421
421
  box-sizing: border-box;
422
422
  }
423
- .bds0116Calendar-day:focus-visible {
423
+ .bds0117Calendar-day:focus-visible {
424
424
  outline: var(--outline_default);
425
425
  outline-offset: var(--outline_offset);
426
426
  }
427
427
  @media (hover: hover) and (pointer: fine) {
428
- .bds0116Calendar-day:not(.bds0116Calendar-disabled, .bds0116Calendar-selected):hover {
428
+ .bds0117Calendar-day:not(.bds0117Calendar-disabled, .bds0117Calendar-selected):hover {
429
429
  background-color: var(--color_bg--subtle);
430
430
  }
431
431
  }
432
- .bds0116Calendar-today {
432
+ .bds0117Calendar-today {
433
433
  border: 2px solid var(--color_interactive);
434
434
  font-weight: var(--font_weight--semibold);
435
435
  }
436
- .bds0116Calendar-selected {
436
+ .bds0117Calendar-selected {
437
437
  background-color: var(--color_interactive);
438
438
  color: var(--color_on-interactive);
439
439
  font-weight: var(--font_weight--semibold);
440
440
  }
441
- .bds0116Calendar-disabled {
441
+ .bds0117Calendar-disabled {
442
442
  opacity: 0.35;
443
443
  cursor: not-allowed;
444
444
  }
445
445
  @media (prefers-reduced-motion: reduce) {
446
- .bds0116Calendar-day {
446
+ .bds0117Calendar-day {
447
447
  transition: none;
448
448
  }
449
449
  }
@@ -451,13 +451,13 @@
451
451
 
452
452
  /* src/components/ui/Carousel/Carousel.module.css */
453
453
  @layer component {
454
- .bds0116Carousel-carousel {
454
+ .bds0117Carousel-carousel {
455
455
  position: relative;
456
456
  display: flex;
457
457
  align-items: center;
458
458
  gap: var(--space_xs);
459
459
  }
460
- .bds0116Carousel-track {
460
+ .bds0117Carousel-track {
461
461
  display: flex;
462
462
  gap: var(--space_m);
463
463
  overflow-x: auto;
@@ -466,14 +466,14 @@
466
466
  flex: 1;
467
467
  scroll-behavior: smooth;
468
468
  }
469
- .bds0116Carousel-track::-webkit-scrollbar {
469
+ .bds0117Carousel-track::-webkit-scrollbar {
470
470
  display: none;
471
471
  }
472
- .bds0116Carousel-slide {
472
+ .bds0117Carousel-slide {
473
473
  scroll-snap-align: start;
474
474
  flex-shrink: 0;
475
475
  }
476
- .bds0116Carousel-navBtn {
476
+ .bds0117Carousel-navBtn {
477
477
  all: unset;
478
478
  display: flex;
479
479
  align-items: center;
@@ -489,21 +489,21 @@
489
489
  transition: var(--animation_transition);
490
490
  box-shadow: var(--shadow_s);
491
491
  }
492
- .bds0116Carousel-navBtn svg {
492
+ .bds0117Carousel-navBtn svg {
493
493
  width: 1.25rem;
494
494
  height: 1.25rem;
495
495
  }
496
- .bds0116Carousel-navBtn:focus-visible {
496
+ .bds0117Carousel-navBtn:focus-visible {
497
497
  outline: var(--outline_default);
498
498
  outline-offset: var(--outline_offset);
499
499
  }
500
500
  @media (hover: hover) and (pointer: fine) {
501
- .bds0116Carousel-navBtn:hover {
501
+ .bds0117Carousel-navBtn:hover {
502
502
  background-color: var(--color_bg--subtle);
503
503
  }
504
504
  }
505
505
  @media (prefers-reduced-motion: reduce) {
506
- .bds0116Carousel-track {
506
+ .bds0117Carousel-track {
507
507
  scroll-behavior: auto;
508
508
  }
509
509
  }
@@ -511,7 +511,7 @@
511
511
 
512
512
  /* src/components/ui/DescriptionList/DescriptionList.module.css */
513
513
  @layer component {
514
- .bds0116DescriptionList-list {
514
+ .bds0117DescriptionList-list {
515
515
  display: flex;
516
516
  flex-direction: column;
517
517
  gap: var(--space_s);
@@ -520,61 +520,61 @@
520
520
  font-size: var(--font_size--body);
521
521
  color: var(--color_on-bg);
522
522
  }
523
- .bds0116DescriptionList-group {
523
+ .bds0117DescriptionList-group {
524
524
  display: flex;
525
525
  flex-direction: column;
526
526
  gap: var(--space_xxs);
527
527
  }
528
- .bds0116DescriptionList-term {
528
+ .bds0117DescriptionList-term {
529
529
  font-weight: var(--font_weight--semibold);
530
530
  color: var(--color_on-bg);
531
531
  }
532
- .bds0116DescriptionList-details {
532
+ .bds0117DescriptionList-details {
533
533
  margin: 0;
534
534
  color: var(--color_on-bg--muted);
535
535
  }
536
- .bds0116DescriptionList---layout_inline .bds0116DescriptionList-group {
536
+ .bds0117DescriptionList---layout_inline .bds0117DescriptionList-group {
537
537
  display: grid;
538
538
  grid-template-columns: minmax(8rem, 1fr) 2fr;
539
539
  gap: var(--space_xs);
540
540
  align-items: baseline;
541
541
  }
542
- .bds0116DescriptionList---layout_inline .bds0116DescriptionList-term {
542
+ .bds0117DescriptionList---layout_inline .bds0117DescriptionList-term {
543
543
  grid-column: 1;
544
544
  }
545
- .bds0116DescriptionList---layout_inline .bds0116DescriptionList-details {
545
+ .bds0117DescriptionList---layout_inline .bds0117DescriptionList-details {
546
546
  grid-column: 2;
547
547
  }
548
548
  }
549
549
 
550
550
  /* src/components/ui/Link/Link.module.css */
551
551
  @layer component {
552
- .bds0116Link-link {
552
+ .bds0117Link-link {
553
553
  color: var(--link_color, var(--color_interactive));
554
554
  text-decoration: underline;
555
555
  text-underline-offset: 0.2em;
556
556
  transition: var(--animation_transition);
557
557
  cursor: pointer;
558
558
  }
559
- .bds0116Link-link:focus-visible {
559
+ .bds0117Link-link:focus-visible {
560
560
  outline: var(--outline_default);
561
561
  outline-offset: var(--outline_offset);
562
562
  border-radius: var(--border_radius--xs);
563
563
  }
564
564
  @media (hover: hover) and (pointer: fine) {
565
- .bds0116Link-link:hover {
565
+ .bds0117Link-link:hover {
566
566
  --link_color: var(--link_color-hover, var(--color_blue--strong));
567
567
  }
568
568
  }
569
- .bds0116Link---variant_default {
569
+ .bds0117Link---variant_default {
570
570
  --link_color: var(--color_interactive);
571
571
  --link_color-hover: var(--color_blue--strong);
572
572
  }
573
- .bds0116Link---variant_subtle {
573
+ .bds0117Link---variant_subtle {
574
574
  --link_color: var(--color_on-bg);
575
575
  --link_color-hover: var(--color_interactive);
576
576
  }
577
- .bds0116Link---variant_standalone {
577
+ .bds0117Link---variant_standalone {
578
578
  --link_color: var(--color_interactive);
579
579
  --link_color-hover: var(--color_blue--strong);
580
580
  display: inline-flex;
@@ -584,12 +584,12 @@
584
584
  text-decoration: none;
585
585
  }
586
586
  @media (hover: hover) and (pointer: fine) {
587
- .bds0116Link---variant_standalone:hover {
587
+ .bds0117Link---variant_standalone:hover {
588
588
  text-decoration: underline;
589
589
  text-underline-offset: 0.2em;
590
590
  }
591
591
  }
592
- .bds0116Link-externalLabel {
592
+ .bds0117Link-externalLabel {
593
593
  position: absolute;
594
594
  width: 1px;
595
595
  height: 1px;
@@ -604,12 +604,12 @@
604
604
 
605
605
  /* src/components/ui/Loading/Loading.module.css */
606
606
  @layer component {
607
- .bds0116Loading-loading {
607
+ .bds0117Loading-loading {
608
608
  display: flex;
609
609
  justify-content: center;
610
610
  align-items: center;
611
611
  }
612
- .bds0116Loading-spinner {
612
+ .bds0117Loading-spinner {
613
613
  width: 2.5em;
614
614
  height: 2.5em;
615
615
  border: 4px solid var(--color_bg);
@@ -617,12 +617,12 @@
617
617
  border-radius: 50%;
618
618
  animation: spin 1s linear infinite;
619
619
  }
620
- .bds0116Loading---size_small .bds0116Loading-spinner {
620
+ .bds0117Loading---size_small .bds0117Loading-spinner {
621
621
  width: 1.5em;
622
622
  height: 1.5em;
623
623
  border-width: 2px;
624
624
  }
625
- .bds0116Loading---size_large .bds0116Loading-spinner {
625
+ .bds0117Loading---size_large .bds0117Loading-spinner {
626
626
  width: 4em;
627
627
  height: 4em;
628
628
  border-width: 6px;
@@ -639,7 +639,7 @@
639
639
 
640
640
  /* src/components/ui/NotificationBanner/NotificationBanner.module.css */
641
641
  @layer component {
642
- .bds0116NotificationBanner-banner {
642
+ .bds0117NotificationBanner-banner {
643
643
  display: flex;
644
644
  align-items: center;
645
645
  gap: var(--space_m);
@@ -651,33 +651,33 @@
651
651
  line-height: var(--font_line-height--body);
652
652
  width: 100%;
653
653
  }
654
- .bds0116NotificationBanner---variant_info {
654
+ .bds0117NotificationBanner---variant_info {
655
655
  --banner_bg: var(--color_blue--subtle);
656
656
  --banner_text: var(--color_on-blue--subtle);
657
657
  --banner_border: var(--color_blue);
658
658
  }
659
- .bds0116NotificationBanner---variant_success {
659
+ .bds0117NotificationBanner---variant_success {
660
660
  --banner_bg: var(--color_success--subtle);
661
661
  --banner_text: var(--color_on-success--subtle);
662
662
  --banner_border: var(--color_success);
663
663
  }
664
- .bds0116NotificationBanner---variant_warning {
664
+ .bds0117NotificationBanner---variant_warning {
665
665
  --banner_bg: var(--color_orange--subtle);
666
666
  --banner_text: var(--color_on-orange--subtle);
667
667
  --banner_border: var(--color_warning);
668
668
  }
669
- .bds0116NotificationBanner---variant_error {
669
+ .bds0117NotificationBanner---variant_error {
670
670
  --banner_bg: rgb(from var(--color_error) r g b / 12%);
671
671
  --banner_text: var(--color_on-bg);
672
672
  --banner_border: var(--color_error);
673
673
  }
674
- .bds0116NotificationBanner-content {
674
+ .bds0117NotificationBanner-content {
675
675
  flex: 1;
676
676
  }
677
- .bds0116NotificationBanner-action {
677
+ .bds0117NotificationBanner-action {
678
678
  flex-shrink: 0;
679
679
  }
680
- .bds0116NotificationBanner-dismiss {
680
+ .bds0117NotificationBanner-dismiss {
681
681
  all: unset;
682
682
  display: flex;
683
683
  align-items: center;
@@ -689,16 +689,16 @@
689
689
  border: 1px solid currentcolor;
690
690
  transition: var(--animation_transition);
691
691
  }
692
- .bds0116NotificationBanner-dismiss svg {
692
+ .bds0117NotificationBanner-dismiss svg {
693
693
  width: 1rem;
694
694
  height: 1rem;
695
695
  }
696
- .bds0116NotificationBanner-dismiss:focus-visible {
696
+ .bds0117NotificationBanner-dismiss:focus-visible {
697
697
  outline: var(--outline_default);
698
698
  outline-offset: var(--outline_offset);
699
699
  }
700
700
  @media (hover: hover) and (pointer: fine) {
701
- .bds0116NotificationBanner-dismiss:hover {
701
+ .bds0117NotificationBanner-dismiss:hover {
702
702
  opacity: 0.7;
703
703
  }
704
704
  }
@@ -706,11 +706,11 @@
706
706
 
707
707
  /* src/components/ui/Pagination/Pagination.module.css */
708
708
  @layer component {
709
- .bds0116Pagination-pagination {
709
+ .bds0117Pagination-pagination {
710
710
  display: flex;
711
711
  justify-content: center;
712
712
  }
713
- .bds0116Pagination-list {
713
+ .bds0117Pagination-list {
714
714
  display: flex;
715
715
  align-items: center;
716
716
  gap: var(--space_xxs);
@@ -718,7 +718,7 @@
718
718
  margin: 0;
719
719
  padding: 0;
720
720
  }
721
- .bds0116Pagination-button {
721
+ .bds0117Pagination-button {
722
722
  all: unset;
723
723
  display: inline-flex;
724
724
  align-items: center;
@@ -737,30 +737,30 @@
737
737
  transition: var(--animation_transition);
738
738
  box-sizing: border-box;
739
739
  }
740
- .bds0116Pagination-button:disabled {
740
+ .bds0117Pagination-button:disabled {
741
741
  opacity: 0.4;
742
742
  cursor: not-allowed;
743
743
  }
744
- .bds0116Pagination-button:focus-visible {
744
+ .bds0117Pagination-button:focus-visible {
745
745
  outline: var(--outline_default);
746
746
  outline-offset: var(--outline_offset);
747
747
  }
748
748
  @media (hover: hover) and (pointer: fine) {
749
- .bds0116Pagination-button:not(:disabled, .bds0116Pagination---active):hover {
749
+ .bds0117Pagination-button:not(:disabled, .bds0117Pagination---active):hover {
750
750
  --btn_bg: var(--color_bg--subtle);
751
751
  --btn_color: var(--color_interactive);
752
752
  }
753
753
  }
754
- .bds0116Pagination-button.bds0116Pagination---active {
754
+ .bds0117Pagination-button.bds0117Pagination---active {
755
755
  --btn_bg: var(--color_interactive);
756
756
  --btn_color: var(--color_on-interactive);
757
757
  --btn_border: var(--color_interactive);
758
758
  }
759
- .bds0116Pagination-button.bds0116Pagination---nav svg {
759
+ .bds0117Pagination-button.bds0117Pagination---nav svg {
760
760
  width: 1rem;
761
761
  height: 1rem;
762
762
  }
763
- .bds0116Pagination-ellipsis {
763
+ .bds0117Pagination-ellipsis {
764
764
  display: inline-flex;
765
765
  align-items: center;
766
766
  justify-content: center;
@@ -774,46 +774,46 @@
774
774
 
775
775
  /* src/components/ui/Progress/Progress.module.css */
776
776
  @layer component {
777
- .bds0116Progress-container {
777
+ .bds0117Progress-container {
778
778
  display: flex;
779
779
  flex-direction: column;
780
780
  gap: var(--space_xxs);
781
781
  width: 100%;
782
782
  }
783
- .bds0116Progress-labelRow {
783
+ .bds0117Progress-labelRow {
784
784
  display: flex;
785
785
  justify-content: space-between;
786
786
  align-items: baseline;
787
787
  font-size: var(--font_size--body--s);
788
788
  color: var(--color_on-bg);
789
789
  }
790
- .bds0116Progress-value {
790
+ .bds0117Progress-value {
791
791
  font-variant-numeric: tabular-nums;
792
792
  }
793
- .bds0116Progress-track {
793
+ .bds0117Progress-track {
794
794
  width: 100%;
795
795
  height: var(--progress_height, var(--space_xs));
796
796
  background-color: var(--color_bg--subtle);
797
797
  border-radius: 999px;
798
798
  overflow: hidden;
799
799
  }
800
- .bds0116Progress-track.bds0116Progress---size_small {
800
+ .bds0117Progress-track.bds0117Progress---size_small {
801
801
  --progress_height: var(--space_xxs);
802
802
  }
803
- .bds0116Progress-track.bds0116Progress---size_medium {
803
+ .bds0117Progress-track.bds0117Progress---size_medium {
804
804
  --progress_height: var(--space_xs);
805
805
  }
806
- .bds0116Progress-track.bds0116Progress---size_large {
806
+ .bds0117Progress-track.bds0117Progress---size_large {
807
807
  --progress_height: var(--space_s);
808
808
  }
809
- .bds0116Progress-fill {
809
+ .bds0117Progress-fill {
810
810
  height: 100%;
811
811
  background-color: var(--progress_color-active, var(--color_active));
812
812
  border-radius: 999px;
813
813
  transition: width var(--animation_transition-duration) var(--animation_easing);
814
814
  }
815
815
  @media (prefers-reduced-motion: reduce) {
816
- .bds0116Progress-fill {
816
+ .bds0117Progress-fill {
817
817
  transition: none;
818
818
  }
819
819
  }
@@ -821,23 +821,23 @@
821
821
 
822
822
  /* src/components/ui/ProgressCircle/ProgressCircle.module.css */
823
823
  @layer component {
824
- .bds0116ProgressCircle-wrapper {
824
+ .bds0117ProgressCircle-wrapper {
825
825
  position: relative;
826
826
  display: inline-flex;
827
827
  align-items: center;
828
828
  justify-content: center;
829
829
  }
830
- .bds0116ProgressCircle-svg {
830
+ .bds0117ProgressCircle-svg {
831
831
  display: block;
832
832
  }
833
- .bds0116ProgressCircle-track {
833
+ .bds0117ProgressCircle-track {
834
834
  stroke: var(--color_bg--subtle);
835
835
  }
836
- .bds0116ProgressCircle-fill {
836
+ .bds0117ProgressCircle-fill {
837
837
  stroke: var(--progressCircle_color-active, var(--color_active));
838
838
  transition: stroke-dashoffset var(--animation_transition-duration) var(--animation_easing);
839
839
  }
840
- .bds0116ProgressCircle-value {
840
+ .bds0117ProgressCircle-value {
841
841
  position: absolute;
842
842
  font-size: var(--font_size--body--s);
843
843
  font-weight: var(--font_weight--semibold);
@@ -845,17 +845,17 @@
845
845
  color: var(--color_on-bg);
846
846
  line-height: 1;
847
847
  }
848
- .bds0116ProgressCircle---size_small .bds0116ProgressCircle-value {
848
+ .bds0117ProgressCircle---size_small .bds0117ProgressCircle-value {
849
849
  font-size: 0.5rem;
850
850
  }
851
- .bds0116ProgressCircle---size_medium .bds0116ProgressCircle-value {
851
+ .bds0117ProgressCircle---size_medium .bds0117ProgressCircle-value {
852
852
  font-size: var(--font_size--body--s);
853
853
  }
854
- .bds0116ProgressCircle---size_large .bds0116ProgressCircle-value {
854
+ .bds0117ProgressCircle---size_large .bds0117ProgressCircle-value {
855
855
  font-size: var(--font_size--body);
856
856
  }
857
857
  @media (prefers-reduced-motion: reduce) {
858
- .bds0116ProgressCircle-fill {
858
+ .bds0117ProgressCircle-fill {
859
859
  transition: none;
860
860
  }
861
861
  }
@@ -863,16 +863,16 @@
863
863
 
864
864
  /* src/components/ui/Separator/Separator.module.css */
865
865
  @layer component {
866
- .bds0116Separator-separator {
866
+ .bds0117Separator-separator {
867
867
  border: none;
868
868
  background-color: var(--separator_color, var(--color_on-bg));
869
869
  }
870
- .bds0116Separator-separator.bds0116Separator---horizontal {
870
+ .bds0117Separator-separator.bds0117Separator---horizontal {
871
871
  display: block;
872
872
  width: 100%;
873
873
  height: var(--separator_thickness, 1px);
874
874
  }
875
- .bds0116Separator-separator.bds0116Separator---vertical {
875
+ .bds0117Separator-separator.bds0117Separator---vertical {
876
876
  display: inline-block;
877
877
  width: var(--separator_thickness, 1px);
878
878
  align-self: stretch;
@@ -881,7 +881,7 @@
881
881
 
882
882
  /* src/components/ui/Skeleton/Skeleton.module.css */
883
883
  @layer component {
884
- .bds0116Skeleton-skeleton {
884
+ .bds0117Skeleton-skeleton {
885
885
  background:
886
886
  linear-gradient(
887
887
  90deg,
@@ -905,7 +905,7 @@
905
905
 
906
906
  /* src/components/ui/SkipLink/SkipLink.module.css */
907
907
  @layer component {
908
- .bds0116SkipLink-skipLink {
908
+ .bds0117SkipLink-skipLink {
909
909
  position: absolute;
910
910
  inset-block-start: var(--space_s);
911
911
  inset-inline-start: var(--space_s);
@@ -921,13 +921,13 @@
921
921
  transform: translateY(-200%);
922
922
  transition: transform var(--animation_transition-duration) var(--animation_easing);
923
923
  }
924
- .bds0116SkipLink-skipLink:focus-visible {
924
+ .bds0117SkipLink-skipLink:focus-visible {
925
925
  transform: translateY(0);
926
926
  outline: var(--outline_default);
927
927
  outline-offset: var(--outline_offset);
928
928
  }
929
929
  @media (prefers-reduced-motion: reduce) {
930
- .bds0116SkipLink-skipLink {
930
+ .bds0117SkipLink-skipLink {
931
931
  transition: none;
932
932
  }
933
933
  }
@@ -935,29 +935,29 @@
935
935
 
936
936
  /* src/components/ui/Table/Table.module.css */
937
937
  @layer component {
938
- .bds0116Table-wrapper {
938
+ .bds0117Table-wrapper {
939
939
  width: 100%;
940
940
  overflow-x: auto;
941
941
  border-radius: var(--border_radius--s);
942
942
  border: 1px solid var(--color_bg--subtle);
943
943
  }
944
- .bds0116Table-table {
944
+ .bds0117Table-table {
945
945
  width: 100%;
946
946
  border-collapse: collapse;
947
947
  font-size: var(--font_size--body);
948
948
  font-family: var(--font_family--body);
949
949
  }
950
- .bds0116Table-caption {
950
+ .bds0117Table-caption {
951
951
  caption-side: top;
952
952
  text-align: start;
953
953
  padding: var(--space_s) var(--space_m);
954
954
  font-weight: var(--font_weight--semibold);
955
955
  color: var(--color_on-bg);
956
956
  }
957
- .bds0116Table-thead {
957
+ .bds0117Table-thead {
958
958
  background-color: var(--color_bg--subtle);
959
959
  }
960
- .bds0116Table-th {
960
+ .bds0117Table-th {
961
961
  padding: var(--space_s) var(--space_m);
962
962
  text-align: start;
963
963
  font-weight: var(--font_weight--semibold);
@@ -966,10 +966,10 @@
966
966
  white-space: nowrap;
967
967
  border-bottom: 1px solid var(--color_bg--subtle);
968
968
  }
969
- .bds0116Table-th.bds0116Table---sortable {
969
+ .bds0117Table-th.bds0117Table---sortable {
970
970
  padding: 0;
971
971
  }
972
- .bds0116Table-sortButton {
972
+ .bds0117Table-sortButton {
973
973
  all: unset;
974
974
  display: flex;
975
975
  align-items: center;
@@ -983,47 +983,47 @@
983
983
  transition: var(--animation_transition);
984
984
  box-sizing: border-box;
985
985
  }
986
- .bds0116Table-sortButton:focus-visible {
986
+ .bds0117Table-sortButton:focus-visible {
987
987
  outline: var(--outline_default);
988
988
  outline-offset: calc(var(--outline_offset) * -1);
989
989
  }
990
990
  @media (hover: hover) and (pointer: fine) {
991
- .bds0116Table-sortButton:hover {
991
+ .bds0117Table-sortButton:hover {
992
992
  color: var(--color_on-bg);
993
993
  }
994
994
  }
995
- .bds0116Table-sortIcon {
995
+ .bds0117Table-sortIcon {
996
996
  width: 1rem;
997
997
  height: 1rem;
998
998
  opacity: 0.4;
999
999
  transition: transform var(--animation_transition-duration) var(--animation_easing), opacity var(--animation_transition-duration) var(--animation_easing);
1000
1000
  }
1001
- .bds0116Table-sortIcon.bds0116Table---sort-active {
1001
+ .bds0117Table-sortIcon.bds0117Table---sort-active {
1002
1002
  opacity: 1;
1003
1003
  color: var(--color_interactive);
1004
1004
  }
1005
- .bds0116Table-sortIcon.bds0116Table---sort-desc {
1005
+ .bds0117Table-sortIcon.bds0117Table---sort-desc {
1006
1006
  transform: rotate(180deg);
1007
1007
  }
1008
- .bds0116Table-tbody .bds0116Table-tr {
1008
+ .bds0117Table-tbody .bds0117Table-tr {
1009
1009
  border-bottom: 1px solid var(--color_bg--subtle);
1010
1010
  transition: var(--animation_transition);
1011
1011
  }
1012
- .bds0116Table-tbody .bds0116Table-tr:last-child {
1012
+ .bds0117Table-tbody .bds0117Table-tr:last-child {
1013
1013
  border-bottom: none;
1014
1014
  }
1015
1015
  @media (hover: hover) and (pointer: fine) {
1016
- .bds0116Table-tbody .bds0116Table-tr:hover {
1016
+ .bds0117Table-tbody .bds0117Table-tr:hover {
1017
1017
  background-color: var(--color_bg--subtle);
1018
1018
  }
1019
1019
  }
1020
- .bds0116Table-td {
1020
+ .bds0117Table-td {
1021
1021
  padding: var(--space_s) var(--space_m);
1022
1022
  color: var(--color_on-bg);
1023
1023
  vertical-align: middle;
1024
1024
  }
1025
1025
  @media (prefers-reduced-motion: reduce) {
1026
- .bds0116Table-sortIcon {
1026
+ .bds0117Table-sortIcon {
1027
1027
  transition: none;
1028
1028
  }
1029
1029
  }
@@ -1031,16 +1031,16 @@
1031
1031
 
1032
1032
  /* src/components/ui/Tabs/Tabs.module.css */
1033
1033
  @layer component {
1034
- .bds0116Tabs-tabs {
1034
+ .bds0117Tabs-tabs {
1035
1035
  display: flex;
1036
1036
  flex-direction: column;
1037
1037
  }
1038
- .bds0116Tabs-tabList {
1038
+ .bds0117Tabs-tabList {
1039
1039
  display: flex;
1040
1040
  border-bottom: 1px solid var(--color_bg--subtle);
1041
1041
  gap: var(--space_xxs);
1042
1042
  }
1043
- .bds0116Tabs-tab {
1043
+ .bds0117Tabs-tab {
1044
1044
  all: unset;
1045
1045
  display: inline-flex;
1046
1046
  align-items: center;
@@ -1054,28 +1054,28 @@
1054
1054
  cursor: pointer;
1055
1055
  transition: var(--animation_transition);
1056
1056
  }
1057
- .bds0116Tabs-tab.bds0116Tabs---active {
1057
+ .bds0117Tabs-tab.bds0117Tabs---active {
1058
1058
  --tab_color: var(--color_interactive);
1059
1059
  --tab_border-color: var(--color_interactive);
1060
1060
  }
1061
- .bds0116Tabs-tab:disabled {
1061
+ .bds0117Tabs-tab:disabled {
1062
1062
  opacity: 0.4;
1063
1063
  cursor: not-allowed;
1064
1064
  }
1065
- .bds0116Tabs-tab:focus-visible {
1065
+ .bds0117Tabs-tab:focus-visible {
1066
1066
  outline: var(--outline_default);
1067
1067
  outline-offset: var(--outline_offset);
1068
1068
  border-radius: var(--border_radius--xs);
1069
1069
  }
1070
1070
  @media (hover: hover) and (pointer: fine) {
1071
- .bds0116Tabs-tab:not(:disabled, .bds0116Tabs---active):hover {
1071
+ .bds0117Tabs-tab:not(:disabled, .bds0117Tabs---active):hover {
1072
1072
  --tab_color: var(--color_interactive);
1073
1073
  }
1074
1074
  }
1075
- .bds0116Tabs-panel {
1075
+ .bds0117Tabs-panel {
1076
1076
  padding-block-start: var(--space_m);
1077
1077
  }
1078
- .bds0116Tabs-panel:focus-visible {
1078
+ .bds0117Tabs-panel:focus-visible {
1079
1079
  outline: var(--outline_default);
1080
1080
  outline-offset: var(--outline_offset);
1081
1081
  }
@@ -1083,12 +1083,12 @@
1083
1083
 
1084
1084
  /* src/components/ui/Tooltip/Tooltip.module.css */
1085
1085
  @layer component {
1086
- .bds0116Tooltip-wrapper {
1086
+ .bds0117Tooltip-wrapper {
1087
1087
  position: relative;
1088
1088
  display: inline-flex;
1089
1089
  align-items: center;
1090
1090
  }
1091
- .bds0116Tooltip-tooltip {
1091
+ .bds0117Tooltip-tooltip {
1092
1092
  position: absolute;
1093
1093
  z-index: var(--z-index_popover);
1094
1094
  padding: var(--space_xxs) var(--space_xs);
@@ -1103,33 +1103,33 @@
1103
1103
  opacity: 0;
1104
1104
  transition: opacity var(--animation_transition-duration) var(--animation_easing);
1105
1105
  }
1106
- .bds0116Tooltip-wrapper:hover .bds0116Tooltip-tooltip,
1107
- .bds0116Tooltip-wrapper:focus-within .bds0116Tooltip-tooltip {
1106
+ .bds0117Tooltip-wrapper:hover .bds0117Tooltip-tooltip,
1107
+ .bds0117Tooltip-wrapper:focus-within .bds0117Tooltip-tooltip {
1108
1108
  visibility: visible;
1109
1109
  opacity: 1;
1110
1110
  }
1111
- .bds0116Tooltip---placement_top {
1111
+ .bds0117Tooltip---placement_top {
1112
1112
  bottom: calc(100% + var(--space_xs));
1113
1113
  left: 50%;
1114
1114
  transform: translateX(-50%);
1115
1115
  }
1116
- .bds0116Tooltip---placement_bottom {
1116
+ .bds0117Tooltip---placement_bottom {
1117
1117
  top: calc(100% + var(--space_xs));
1118
1118
  left: 50%;
1119
1119
  transform: translateX(-50%);
1120
1120
  }
1121
- .bds0116Tooltip---placement_left {
1121
+ .bds0117Tooltip---placement_left {
1122
1122
  right: calc(100% + var(--space_xs));
1123
1123
  top: 50%;
1124
1124
  transform: translateY(-50%);
1125
1125
  }
1126
- .bds0116Tooltip---placement_right {
1126
+ .bds0117Tooltip---placement_right {
1127
1127
  left: calc(100% + var(--space_xs));
1128
1128
  top: 50%;
1129
1129
  transform: translateY(-50%);
1130
1130
  }
1131
1131
  @media (prefers-reduced-motion: reduce) {
1132
- .bds0116Tooltip-tooltip {
1132
+ .bds0117Tooltip-tooltip {
1133
1133
  transition: none;
1134
1134
  }
1135
1135
  }
@@ -1137,34 +1137,34 @@
1137
1137
 
1138
1138
  /* src/components/ui/Typography/Typography.module.css */
1139
1139
  @layer component {
1140
- .bds0116Typography-typography {
1140
+ .bds0117Typography-typography {
1141
1141
  margin: 0;
1142
1142
  font-family: var(--font_family--body);
1143
1143
  color: var(--typography_color, var(--color_on-bg));
1144
1144
  }
1145
- .bds0116Typography---h1 {
1145
+ .bds0117Typography---h1 {
1146
1146
  font-family: var(--font_family--heading);
1147
1147
  font-size: var(--font_size--heading-1);
1148
1148
  font-weight: var(--font_weight--bold);
1149
1149
  line-height: var(--font_line-height--heading);
1150
1150
  }
1151
- .bds0116Typography---h2 {
1151
+ .bds0117Typography---h2 {
1152
1152
  font-family: var(--font_family--heading);
1153
1153
  font-size: var(--font_size--heading-2);
1154
1154
  font-weight: var(--font_weight--semibold);
1155
1155
  line-height: var(--font_line-height--heading);
1156
1156
  }
1157
- .bds0116Typography---h3 {
1157
+ .bds0117Typography---h3 {
1158
1158
  font-family: var(--font_family--heading);
1159
1159
  font-size: var(--font_size--heading-3);
1160
1160
  font-weight: var(--font_weight--semibold);
1161
1161
  line-height: var(--font_line-height--heading);
1162
1162
  }
1163
- .bds0116Typography---body {
1163
+ .bds0117Typography---body {
1164
1164
  font-size: var(--font_size--body);
1165
1165
  line-height: var(--font_line-height--body);
1166
1166
  }
1167
- .bds0116Typography---body_s {
1167
+ .bds0117Typography---body_s {
1168
1168
  font-size: var(--font_size--body--s);
1169
1169
  line-height: var(--font_line-height--body);
1170
1170
  }
@@ -1186,8 +1186,8 @@
1186
1186
  }
1187
1187
  }
1188
1188
  @layer component {
1189
- .bds0116Button-button,
1190
- .bds0116Button-button[href] {
1189
+ .bds0117Button-button,
1190
+ .bds0117Button-button[href] {
1191
1191
  all: unset;
1192
1192
  position: relative;
1193
1193
  font: inherit;
@@ -1208,68 +1208,68 @@
1208
1208
  border: 2px solid var(--button_border-color, var(--color_cta));
1209
1209
  transition: var(--animation_transition);
1210
1210
  }
1211
- .bds0116Button-button.bds0116Button---primary {
1211
+ .bds0117Button-button.bds0117Button---primary {
1212
1212
  --button_border-color: transparent;
1213
1213
  }
1214
- .bds0116Button-button.bds0116Button---secondary {
1214
+ .bds0117Button-button.bds0117Button---secondary {
1215
1215
  --button_bg: var(--color_bg);
1216
1216
  --button_text: var(--color_on-bg);
1217
1217
  --button_border-color: var(--button_text);
1218
1218
  }
1219
- .bds0116Button-button.bds0116Button---size_small {
1219
+ .bds0117Button-button.bds0117Button---size_small {
1220
1220
  --button_height: 2.25em;
1221
1221
  --button_font-size: var(--font_size--body--s);
1222
1222
  --button_border_radius--s: var(--border_radius--xs);
1223
1223
  padding-inline: var(--space_m);
1224
1224
  }
1225
- .bds0116Button-button.bds0116Button---size_medium {
1225
+ .bds0117Button-button.bds0117Button---size_medium {
1226
1226
  --button_height: 3em;
1227
1227
  padding-inline: var(--space_l);
1228
1228
  }
1229
- .bds0116Button-button.bds0116Button---size_large {
1229
+ .bds0117Button-button.bds0117Button---size_large {
1230
1230
  --button_font-size: var(--font_size--heading-3);
1231
1231
  padding-inline: var(--space_xl);
1232
1232
  --button_border_radius--s: var(--border_radius--m);
1233
1233
  }
1234
- .bds0116Button-button.bds0116Button---hasPulse {
1234
+ .bds0117Button-button.bds0117Button---hasPulse {
1235
1235
  animation: pulse 3s infinite;
1236
1236
  }
1237
- .bds0116Button-button[href] {
1237
+ .bds0117Button-button[href] {
1238
1238
  text-decoration: none;
1239
1239
  }
1240
- .bds0116Button-button svg {
1240
+ .bds0117Button-button svg {
1241
1241
  --icon__stroke: currentcolor;
1242
1242
  fill: currentcolor;
1243
1243
  color: currentcolor;
1244
1244
  flex-shrink: 0;
1245
1245
  }
1246
- .bds0116Button-prefix {
1246
+ .bds0117Button-prefix {
1247
1247
  display: flex;
1248
1248
  align-items: center;
1249
1249
  margin-inline-start: calc(var(--space_s) * -1);
1250
1250
  transition: var(--animation_transition);
1251
1251
  }
1252
- .bds0116Button-suffix {
1252
+ .bds0117Button-suffix {
1253
1253
  display: flex;
1254
1254
  align-items: center;
1255
1255
  margin-inline-end: calc(var(--space_s) * -1);
1256
1256
  transition: var(--animation_transition);
1257
1257
  }
1258
1258
  @media (hover: hover) and (pointer: fine) {
1259
- .bds0116Button-button:hover .bds0116Button-prefix svg {
1259
+ .bds0117Button-button:hover .bds0117Button-prefix svg {
1260
1260
  animation: 2s infinite fadeZoom ease-out;
1261
1261
  }
1262
- .bds0116Button-button:hover .bds0116Button-suffix svg {
1262
+ .bds0117Button-button:hover .bds0117Button-suffix svg {
1263
1263
  animation: 2s infinite fadeZoom ease-out;
1264
1264
  }
1265
1265
  }
1266
- .bds0116Button-button:focus-visible {
1266
+ .bds0117Button-button:focus-visible {
1267
1267
  outline-offset: var(--outline_offset);
1268
1268
  outline: var(--outline_default);
1269
1269
  border-radius: var(--border_radius--s);
1270
1270
  }
1271
1271
  @media (hover: hover) and (pointer: fine) {
1272
- .bds0116Button-button:hover {
1272
+ .bds0117Button-button:hover {
1273
1273
  --button_bg: var(--color_bg);
1274
1274
  --button_text: var(--color_interactive);
1275
1275
  --button_pulse-color: var(--color_interactive);
@@ -1280,7 +1280,7 @@
1280
1280
 
1281
1281
  /* src/components/interaction/Command/Command.module.css */
1282
1282
  @layer component {
1283
- .bds0116Command-dialog {
1283
+ .bds0117Command-dialog {
1284
1284
  padding: 0;
1285
1285
  border: none;
1286
1286
  border-radius: var(--border_radius--m);
@@ -1290,11 +1290,11 @@
1290
1290
  overflow: visible;
1291
1291
  margin-block-start: 10vh;
1292
1292
  }
1293
- .bds0116Command-dialog::backdrop {
1293
+ .bds0117Command-dialog::backdrop {
1294
1294
  background-color: var(--command_backdrop-color, rgb(0 0 0 / 50%));
1295
1295
  backdrop-filter: blur(3px);
1296
1296
  }
1297
- .bds0116Command-palette {
1297
+ .bds0117Command-palette {
1298
1298
  display: flex;
1299
1299
  flex-direction: column;
1300
1300
  background-color: var(--command_color, var(--color_bg));
@@ -1305,7 +1305,7 @@
1305
1305
  max-height: 70vh;
1306
1306
  border: 1px solid currentcolor;
1307
1307
  }
1308
- .bds0116Command-searchRow {
1308
+ .bds0117Command-searchRow {
1309
1309
  display: flex;
1310
1310
  align-items: center;
1311
1311
  gap: var(--space_xs);
@@ -1313,13 +1313,13 @@
1313
1313
  border-block-end: 1px solid currentcolor;
1314
1314
  flex-shrink: 0;
1315
1315
  }
1316
- .bds0116Command-searchIcon {
1316
+ .bds0117Command-searchIcon {
1317
1317
  width: 1.25rem;
1318
1318
  height: 1.25rem;
1319
1319
  color: var(--color_on-bg--muted);
1320
1320
  flex-shrink: 0;
1321
1321
  }
1322
- .bds0116Command-search {
1322
+ .bds0117Command-search {
1323
1323
  flex: 1;
1324
1324
  border: none;
1325
1325
  outline: none;
@@ -1329,10 +1329,10 @@
1329
1329
  background: transparent;
1330
1330
  min-width: 0;
1331
1331
  }
1332
- .bds0116Command-search::placeholder {
1332
+ .bds0117Command-search::placeholder {
1333
1333
  color: var(--color_on-bg--muted);
1334
1334
  }
1335
- .bds0116Command-escHint {
1335
+ .bds0117Command-escHint {
1336
1336
  font-size: var(--font_size--body--s);
1337
1337
  color: var(--color_on-bg--muted);
1338
1338
  border: 1px solid currentcolor;
@@ -1340,18 +1340,18 @@
1340
1340
  padding: 0.1em 0.4em;
1341
1341
  flex-shrink: 0;
1342
1342
  }
1343
- .bds0116Command-list {
1343
+ .bds0117Command-list {
1344
1344
  overflow-y: auto;
1345
1345
  list-style: none;
1346
1346
  margin: 0;
1347
1347
  padding: var(--space_xs) 0;
1348
1348
  }
1349
- .bds0116Command-groupList {
1349
+ .bds0117Command-groupList {
1350
1350
  list-style: none;
1351
1351
  margin: 0;
1352
1352
  padding: 0;
1353
1353
  }
1354
- .bds0116Command-group {
1354
+ .bds0117Command-group {
1355
1355
  padding: var(--space_xs) var(--space_m);
1356
1356
  font-size: var(--font_size--body--s);
1357
1357
  font-weight: var(--font_weight--semibold);
@@ -1359,7 +1359,7 @@
1359
1359
  text-transform: uppercase;
1360
1360
  letter-spacing: 0.05em;
1361
1361
  }
1362
- .bds0116Command-item {
1362
+ .bds0117Command-item {
1363
1363
  display: flex;
1364
1364
  align-items: center;
1365
1365
  gap: var(--space_s);
@@ -1367,26 +1367,26 @@
1367
1367
  cursor: pointer;
1368
1368
  transition: background-color var(--animation_transition-duration) var(--animation_easing);
1369
1369
  }
1370
- .bds0116Command-itemActive {
1370
+ .bds0117Command-itemActive {
1371
1371
  background-color: var(--color_bg--subtle);
1372
1372
  }
1373
- .bds0116Command-itemLabel {
1373
+ .bds0117Command-itemLabel {
1374
1374
  flex: 1;
1375
1375
  font-size: var(--font_size--body);
1376
1376
  color: var(--color_on-bg);
1377
1377
  }
1378
- .bds0116Command-itemDesc {
1378
+ .bds0117Command-itemDesc {
1379
1379
  font-size: var(--font_size--body--s);
1380
1380
  color: var(--color_on-bg--muted);
1381
1381
  }
1382
- .bds0116Command-shortcut {
1382
+ .bds0117Command-shortcut {
1383
1383
  font-size: var(--font_size--body--s);
1384
1384
  color: var(--color_on-bg--muted);
1385
1385
  border: 1px solid currentcolor;
1386
1386
  border-radius: var(--border_radius--xs);
1387
1387
  padding: 0.1em 0.4em;
1388
1388
  }
1389
- .bds0116Command-empty {
1389
+ .bds0117Command-empty {
1390
1390
  padding: var(--space_l) var(--space_m);
1391
1391
  text-align: center;
1392
1392
  color: var(--color_on-bg--muted);
@@ -1396,7 +1396,7 @@
1396
1396
 
1397
1397
  /* src/components/interaction/Dialog/Dialog.module.css */
1398
1398
  @layer component {
1399
- .bds0116Dialog-dialog {
1399
+ .bds0117Dialog-dialog {
1400
1400
  font-size: var(--font_size--body--s);
1401
1401
  border: 2px solid currentcolor;
1402
1402
  background-color: var(--dialog_color ,var(--color_grey--subtle));
@@ -1407,19 +1407,19 @@
1407
1407
  max-height: 90svh;
1408
1408
  overflow: visible;
1409
1409
  }
1410
- .bds0116Dialog-dialogContent {
1410
+ .bds0117Dialog-dialogContent {
1411
1411
  display: grid;
1412
1412
  gap: var(--grid_gap);
1413
1413
  overflow-y: auto;
1414
1414
  min-height: 0;
1415
1415
  flex: 1;
1416
1416
  }
1417
- .bds0116Dialog-closeForm {
1417
+ .bds0117Dialog-closeForm {
1418
1418
  position: absolute;
1419
1419
  inset-block-start: -1em;
1420
1420
  inset-inline-end: -1em;
1421
1421
  }
1422
- .bds0116Dialog-closeButton {
1422
+ .bds0117Dialog-closeButton {
1423
1423
  all: unset;
1424
1424
  width: 2em;
1425
1425
  height: 2em;
@@ -1432,11 +1432,11 @@
1432
1432
  border: 2px solid currentcolor;
1433
1433
  cursor: pointer;
1434
1434
  }
1435
- .bds0116Dialog-closeButton svg {
1435
+ .bds0117Dialog-closeButton svg {
1436
1436
  width: 1.25em;
1437
1437
  height: 1.25em;
1438
1438
  }
1439
- .bds0116Dialog-dialog::backdrop {
1439
+ .bds0117Dialog-dialog::backdrop {
1440
1440
  background-color: var(--dialog_backdrop-color, rgb(0 0 0 / 50%));
1441
1441
  backdrop-filter: blur(3px);
1442
1442
  }
@@ -1444,7 +1444,7 @@
1444
1444
 
1445
1445
  /* src/components/interaction/Drawer/Drawer.module.css */
1446
1446
  @layer component {
1447
- .bds0116Drawer-drawer {
1447
+ .bds0117Drawer-drawer {
1448
1448
  position: fixed;
1449
1449
  inset: 0;
1450
1450
  margin: 0;
@@ -1457,11 +1457,11 @@
1457
1457
  background: transparent;
1458
1458
  overflow: hidden;
1459
1459
  }
1460
- .bds0116Drawer-drawer::backdrop {
1460
+ .bds0117Drawer-drawer::backdrop {
1461
1461
  background-color: var(--drawer_backdrop-color, rgb(0 0 0 / 50%));
1462
1462
  backdrop-filter: blur(3px);
1463
1463
  }
1464
- .bds0116Drawer-panel {
1464
+ .bds0117Drawer-panel {
1465
1465
  position: absolute;
1466
1466
  inset-block: 0;
1467
1467
  display: flex;
@@ -1474,13 +1474,13 @@
1474
1474
  overflow: hidden;
1475
1475
  transition: var(--animation_transition);
1476
1476
  }
1477
- .bds0116Drawer---side_right .bds0116Drawer-panel {
1477
+ .bds0117Drawer---side_right .bds0117Drawer-panel {
1478
1478
  inset-inline-end: 0;
1479
1479
  }
1480
- .bds0116Drawer---side_left .bds0116Drawer-panel {
1480
+ .bds0117Drawer---side_left .bds0117Drawer-panel {
1481
1481
  inset-inline-start: 0;
1482
1482
  }
1483
- .bds0116Drawer-header {
1483
+ .bds0117Drawer-header {
1484
1484
  display: flex;
1485
1485
  align-items: center;
1486
1486
  justify-content: space-between;
@@ -1488,7 +1488,7 @@
1488
1488
  border-block-end: 1px solid currentcolor;
1489
1489
  flex-shrink: 0;
1490
1490
  }
1491
- .bds0116Drawer-closeButton {
1491
+ .bds0117Drawer-closeButton {
1492
1492
  all: unset;
1493
1493
  display: flex;
1494
1494
  align-items: center;
@@ -1499,26 +1499,26 @@
1499
1499
  cursor: pointer;
1500
1500
  transition: var(--animation_transition);
1501
1501
  }
1502
- .bds0116Drawer-closeButton svg {
1502
+ .bds0117Drawer-closeButton svg {
1503
1503
  width: 1.25rem;
1504
1504
  height: 1.25rem;
1505
1505
  }
1506
- .bds0116Drawer-closeButton:focus-visible {
1506
+ .bds0117Drawer-closeButton:focus-visible {
1507
1507
  outline: var(--outline_default);
1508
1508
  outline-offset: var(--outline_offset);
1509
1509
  }
1510
1510
  @media (hover: hover) and (pointer: fine) {
1511
- .bds0116Drawer-closeButton:hover {
1511
+ .bds0117Drawer-closeButton:hover {
1512
1512
  background-color: var(--color_bg--subtle);
1513
1513
  }
1514
1514
  }
1515
- .bds0116Drawer-body {
1515
+ .bds0117Drawer-body {
1516
1516
  flex: 1;
1517
1517
  overflow-y: auto;
1518
1518
  padding: var(--space_l);
1519
1519
  }
1520
1520
  @media (prefers-reduced-motion: reduce) {
1521
- .bds0116Drawer-panel {
1521
+ .bds0117Drawer-panel {
1522
1522
  transition: none;
1523
1523
  }
1524
1524
  }
@@ -1526,11 +1526,11 @@
1526
1526
 
1527
1527
  /* src/components/interaction/DropdownMenu/DropdownMenu.module.css */
1528
1528
  @layer component {
1529
- .bds0116DropdownMenu-wrapper {
1529
+ .bds0117DropdownMenu-wrapper {
1530
1530
  position: relative;
1531
1531
  display: inline-flex;
1532
1532
  }
1533
- .bds0116DropdownMenu-menu {
1533
+ .bds0117DropdownMenu-menu {
1534
1534
  position: absolute;
1535
1535
  top: calc(100% + var(--space_xxs));
1536
1536
  z-index: var(--z-index_dropdown);
@@ -1544,19 +1544,19 @@
1544
1544
  list-style: none;
1545
1545
  margin: 0;
1546
1546
  }
1547
- .bds0116DropdownMenu---placement_bottom-start {
1547
+ .bds0117DropdownMenu---placement_bottom-start {
1548
1548
  left: 0;
1549
1549
  }
1550
- .bds0116DropdownMenu---placement_bottom-end {
1550
+ .bds0117DropdownMenu---placement_bottom-end {
1551
1551
  right: 0;
1552
1552
  }
1553
- .bds0116DropdownMenu-separator {
1553
+ .bds0117DropdownMenu-separator {
1554
1554
  border: none;
1555
1555
  border-top: 1px solid currentcolor;
1556
1556
  margin: var(--space_xxs) 0;
1557
1557
  opacity: 0.15;
1558
1558
  }
1559
- .bds0116DropdownMenu-item {
1559
+ .bds0117DropdownMenu-item {
1560
1560
  all: unset;
1561
1561
  display: flex;
1562
1562
  align-items: center;
@@ -1570,22 +1570,22 @@
1570
1570
  box-sizing: border-box;
1571
1571
  transition: var(--animation_transition);
1572
1572
  }
1573
- .bds0116DropdownMenu-item:disabled {
1573
+ .bds0117DropdownMenu-item:disabled {
1574
1574
  opacity: 0.4;
1575
1575
  cursor: not-allowed;
1576
1576
  }
1577
- .bds0116DropdownMenu-item:focus-visible {
1577
+ .bds0117DropdownMenu-item:focus-visible {
1578
1578
  outline: var(--outline_default);
1579
1579
  outline-offset: calc(var(--outline_offset) * -1);
1580
1580
  border-radius: var(--border_radius--xs);
1581
1581
  }
1582
1582
  @media (hover: hover) and (pointer: fine) {
1583
- .bds0116DropdownMenu-item:not(:disabled):hover {
1583
+ .bds0117DropdownMenu-item:not(:disabled):hover {
1584
1584
  background-color: var(--color_bg--subtle);
1585
1585
  color: var(--color_interactive);
1586
1586
  }
1587
1587
  }
1588
- .bds0116DropdownMenu-icon {
1588
+ .bds0117DropdownMenu-icon {
1589
1589
  display: flex;
1590
1590
  align-items: center;
1591
1591
  flex-shrink: 0;
@@ -1594,11 +1594,11 @@
1594
1594
 
1595
1595
  /* src/components/interaction/Popover/Popover.module.css */
1596
1596
  @layer component {
1597
- .bds0116Popover-wrapper {
1597
+ .bds0117Popover-wrapper {
1598
1598
  position: relative;
1599
1599
  display: inline-flex;
1600
1600
  }
1601
- .bds0116Popover-panel {
1601
+ .bds0117Popover-panel {
1602
1602
  position: absolute;
1603
1603
  z-index: var(--z-index_popover);
1604
1604
  min-width: 12rem;
@@ -1610,19 +1610,19 @@
1610
1610
  color: var(--popover_on-color, var(--color_on-bg));
1611
1611
  font-size: var(--font_size--body);
1612
1612
  }
1613
- .bds0116Popover---placement_bottom {
1613
+ .bds0117Popover---placement_bottom {
1614
1614
  top: calc(100% + var(--space_xs));
1615
1615
  left: 0;
1616
1616
  }
1617
- .bds0116Popover---placement_top {
1617
+ .bds0117Popover---placement_top {
1618
1618
  bottom: calc(100% + var(--space_xs));
1619
1619
  left: 0;
1620
1620
  }
1621
- .bds0116Popover---placement_right {
1621
+ .bds0117Popover---placement_right {
1622
1622
  left: calc(100% + var(--space_xs));
1623
1623
  top: 0;
1624
1624
  }
1625
- .bds0116Popover---placement_left {
1625
+ .bds0117Popover---placement_left {
1626
1626
  right: calc(100% + var(--space_xs));
1627
1627
  top: 0;
1628
1628
  }
@@ -1630,23 +1630,23 @@
1630
1630
 
1631
1631
  /* src/components/interaction/Rating/Rating.module.css */
1632
1632
  @layer component {
1633
- .bds0116Rating-rating {
1633
+ .bds0117Rating-rating {
1634
1634
  display: inline-flex;
1635
1635
  gap: var(--space_xxxs);
1636
1636
  color: var(--color_bg);
1637
1637
  }
1638
- .bds0116Rating-star {
1638
+ .bds0117Rating-star {
1639
1639
  width: 1.5em;
1640
1640
  height: 1.5em;
1641
1641
  }
1642
- .bds0116Rating---filled {
1642
+ .bds0117Rating---filled {
1643
1643
  color: var(--color_warning);
1644
1644
  }
1645
1645
  }
1646
1646
 
1647
1647
  /* src/components/interaction/Toast/Toast.module.css */
1648
1648
  @layer component {
1649
- .bds0116Toast-toastContainer {
1649
+ .bds0117Toast-toastContainer {
1650
1650
  position: fixed;
1651
1651
  bottom: var(--space_xl);
1652
1652
  right: var(--space_xl);
@@ -1655,7 +1655,7 @@
1655
1655
  gap: var(--space_m);
1656
1656
  z-index: var(--z-index_toast);
1657
1657
  }
1658
- .bds0116Toast-toast {
1658
+ .bds0117Toast-toast {
1659
1659
  padding: var(--space_m) var(--space_l);
1660
1660
  background-color: var(--toast_color, var(--color_bg));
1661
1661
  color: var(--toast_on-color, var(--color_on-bg));
@@ -1667,26 +1667,26 @@
1667
1667
  min-width: 300px;
1668
1668
  animation: slideIn var(--animation_duration--fast) var(--animation_easing);
1669
1669
  }
1670
- .bds0116Toast-toast.bds0116Toast---variant_success {
1670
+ .bds0117Toast-toast.bds0117Toast---variant_success {
1671
1671
  --toast_color: var(--color_success);
1672
1672
  --toast_on-color: var(--color_on-success);
1673
1673
  }
1674
- .bds0116Toast-toast.bds0116Toast---variant_warning {
1674
+ .bds0117Toast-toast.bds0117Toast---variant_warning {
1675
1675
  --toast_color: var(--color_warning);
1676
1676
  --toast_on-color: var(--color_on-warning);
1677
1677
  }
1678
- .bds0116Toast-toast.bds0116Toast---variant_info {
1678
+ .bds0117Toast-toast.bds0117Toast---variant_info {
1679
1679
  --toast_color: var(--color_bg--subtle);
1680
1680
  --toast_on-color: var(--color_on-bg--subtle);
1681
1681
  }
1682
- .bds0116Toast-toast.bds0116Toast---variant_error {
1682
+ .bds0117Toast-toast.bds0117Toast---variant_error {
1683
1683
  --toast_color: var(--color_error);
1684
1684
  --toast_on-color: var(--color_on-error);
1685
1685
  }
1686
- .bds0116Toast-message {
1686
+ .bds0117Toast-message {
1687
1687
  flex: 1;
1688
1688
  }
1689
- .bds0116Toast-closeButton {
1689
+ .bds0117Toast-closeButton {
1690
1690
  display: flex;
1691
1691
  align-items: center;
1692
1692
  justify-content: center;
@@ -1699,7 +1699,7 @@
1699
1699
  cursor: pointer;
1700
1700
  color: var(--toast_on-color);
1701
1701
  }
1702
- .bds0116Toast-closeButton svg {
1702
+ .bds0117Toast-closeButton svg {
1703
1703
  width: 1rem;
1704
1704
  height: 1rem;
1705
1705
  }
@@ -1717,17 +1717,17 @@
1717
1717
 
1718
1718
  /* src/components/interaction/form/Checkbox/Checkbox.module.css */
1719
1719
  @layer component {
1720
- .bds0116Checkbox-checkboxGroup {
1720
+ .bds0117Checkbox-checkboxGroup {
1721
1721
  --inputSize: calc(var(--space_s) * 2);
1722
1722
  display: flex;
1723
1723
  flex-direction: column;
1724
1724
  }
1725
- .bds0116Checkbox-inputWrapper {
1725
+ .bds0117Checkbox-inputWrapper {
1726
1726
  display: flex;
1727
1727
  align-items: stretch;
1728
1728
  gap: var(--space_xs);
1729
1729
  }
1730
- .bds0116Checkbox-checkbox {
1730
+ .bds0117Checkbox-checkbox {
1731
1731
  margin-block-start: 0.25em;
1732
1732
  width: var(--inputSize);
1733
1733
  height: var(--inputSize);
@@ -1740,11 +1740,11 @@
1740
1740
  position: relative;
1741
1741
  transition: background-color 0.3s ease, border-color 0.3s ease;
1742
1742
  }
1743
- .bds0116Checkbox-checkbox:checked {
1743
+ .bds0117Checkbox-checkbox:checked {
1744
1744
  background-color: var(--checkbox_color-active, var(--color_active));
1745
1745
  border-color: var(--checkbox_color-active, var(--color_active));
1746
1746
  }
1747
- .bds0116Checkbox-checkbox:checked::after {
1747
+ .bds0117Checkbox-checkbox:checked::after {
1748
1748
  content: "";
1749
1749
  position: absolute;
1750
1750
  left: 0.6em;
@@ -1755,15 +1755,15 @@
1755
1755
  border-width: 0 2px 2px 0;
1756
1756
  transform: rotate(45deg);
1757
1757
  }
1758
- .bds0116Checkbox-checkbox:focus {
1758
+ .bds0117Checkbox-checkbox:focus {
1759
1759
  outline: none;
1760
1760
  border-color: var(--color_interactive);
1761
1761
  box-shadow: 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%);
1762
1762
  }
1763
- .bds0116Checkbox-checkboxError {
1763
+ .bds0117Checkbox-checkboxError {
1764
1764
  border-color: var(--color_error);
1765
1765
  }
1766
- .bds0116Checkbox-checkboxError:focus {
1766
+ .bds0117Checkbox-checkboxError:focus {
1767
1767
  border-color: var(--color_error);
1768
1768
  box-shadow: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
1769
1769
  }
@@ -1771,19 +1771,19 @@
1771
1771
 
1772
1772
  /* src/components/interaction/form/atoms/Message.module.css */
1773
1773
  @layer component {
1774
- .bds0116Message-error,
1775
- .bds0116Message-hint {
1774
+ .bds0117Message-error,
1775
+ .bds0117Message-hint {
1776
1776
  font-size: var(--font_size--body--s);
1777
1777
  margin-inline-start: var(--labelPosition);
1778
1778
  }
1779
- .bds0116Message-error {
1779
+ .bds0117Message-error {
1780
1780
  color: var(--color_error);
1781
1781
  }
1782
1782
  }
1783
1783
 
1784
1784
  /* src/components/interaction/form/atoms/Label.module.css */
1785
1785
  @layer component {
1786
- .bds0116Label-label {
1786
+ .bds0117Label-label {
1787
1787
  display: flex;
1788
1788
  align-items: center;
1789
1789
  font-family: var(--font_family--body);
@@ -1794,7 +1794,7 @@
1794
1794
 
1795
1795
  /* src/components/interaction/form/atoms/InputContainer.module.css */
1796
1796
  @layer component {
1797
- .bds0116InputContainer-container {
1797
+ .bds0117InputContainer-container {
1798
1798
  --labelPosition: calc(var(--inputSize) + var(--space_m));
1799
1799
  display: flex;
1800
1800
  flex-direction: column;
@@ -1804,16 +1804,16 @@
1804
1804
 
1805
1805
  /* src/components/interaction/form/Combobox/Combobox.module.css */
1806
1806
  @layer component {
1807
- .bds0116Combobox-formGroup {
1807
+ .bds0117Combobox-formGroup {
1808
1808
  display: flex;
1809
1809
  flex-direction: column;
1810
1810
  }
1811
- .bds0116Combobox-inputWrapper {
1811
+ .bds0117Combobox-inputWrapper {
1812
1812
  position: relative;
1813
1813
  display: flex;
1814
1814
  align-items: center;
1815
1815
  }
1816
- .bds0116Combobox-input {
1816
+ .bds0117Combobox-input {
1817
1817
  appearance: none;
1818
1818
  width: 100%;
1819
1819
  font-family: var(--font_family--body);
@@ -1826,22 +1826,22 @@
1826
1826
  color: var(--combobox_color, var(--color_on-bg));
1827
1827
  transition: var(--animation_transition);
1828
1828
  }
1829
- .bds0116Combobox-input:focus {
1829
+ .bds0117Combobox-input:focus {
1830
1830
  --combobox_border-color: var(--color_interactive);
1831
1831
  outline: none;
1832
1832
  box-shadow: var(--combobox_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
1833
1833
  }
1834
- .bds0116Combobox-input:disabled {
1834
+ .bds0117Combobox-input:disabled {
1835
1835
  opacity: 0.5;
1836
1836
  cursor: not-allowed;
1837
1837
  }
1838
- .bds0116Combobox-inputError {
1838
+ .bds0117Combobox-inputError {
1839
1839
  --combobox_border-color: var(--color_error);
1840
1840
  }
1841
- .bds0116Combobox-inputError:focus {
1841
+ .bds0117Combobox-inputError:focus {
1842
1842
  --combobox_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
1843
1843
  }
1844
- .bds0116Combobox-chevron {
1844
+ .bds0117Combobox-chevron {
1845
1845
  position: absolute;
1846
1846
  inset-inline-end: var(--space_s);
1847
1847
  display: flex;
@@ -1849,11 +1849,11 @@
1849
1849
  pointer-events: none;
1850
1850
  color: var(--combobox_color, var(--color_on-bg));
1851
1851
  }
1852
- .bds0116Combobox-chevron svg {
1852
+ .bds0117Combobox-chevron svg {
1853
1853
  width: 1rem;
1854
1854
  height: 1rem;
1855
1855
  }
1856
- .bds0116Combobox-listbox {
1856
+ .bds0117Combobox-listbox {
1857
1857
  position: absolute;
1858
1858
  top: calc(100% + var(--space_xxs));
1859
1859
  left: 0;
@@ -1870,7 +1870,7 @@
1870
1870
  color: var(--combobox_on-color, var(--color_on-bg));
1871
1871
  box-shadow: var(--shadow_m);
1872
1872
  }
1873
- .bds0116Combobox-option {
1873
+ .bds0117Combobox-option {
1874
1874
  display: flex;
1875
1875
  align-items: center;
1876
1876
  padding: var(--space_xs) var(--space_m);
@@ -1879,14 +1879,14 @@
1879
1879
  cursor: pointer;
1880
1880
  transition: var(--animation_transition);
1881
1881
  }
1882
- .bds0116Combobox-option.bds0116Combobox---highlighted {
1882
+ .bds0117Combobox-option.bds0117Combobox---highlighted {
1883
1883
  background-color: var(--color_bg--subtle);
1884
1884
  color: var(--color_interactive);
1885
1885
  }
1886
- .bds0116Combobox-option.bds0116Combobox---selected {
1886
+ .bds0117Combobox-option.bds0117Combobox---selected {
1887
1887
  font-weight: var(--font_weight--semibold);
1888
1888
  }
1889
- .bds0116Combobox-option.bds0116Combobox---disabled {
1889
+ .bds0117Combobox-option.bds0117Combobox---disabled {
1890
1890
  opacity: 0.4;
1891
1891
  cursor: not-allowed;
1892
1892
  }
@@ -1894,11 +1894,11 @@
1894
1894
 
1895
1895
  /* src/components/interaction/form/FileInput/FileInput.module.css */
1896
1896
  @layer component {
1897
- .bds0116FileInput-formGroup {
1897
+ .bds0117FileInput-formGroup {
1898
1898
  display: flex;
1899
1899
  flex-direction: column;
1900
1900
  }
1901
- .bds0116FileInput-dropZone {
1901
+ .bds0117FileInput-dropZone {
1902
1902
  display: flex;
1903
1903
  flex-direction: column;
1904
1904
  align-items: center;
@@ -1912,40 +1912,40 @@
1912
1912
  text-align: center;
1913
1913
  transition: var(--animation_transition);
1914
1914
  }
1915
- .bds0116FileInput-dropZone:focus-within {
1915
+ .bds0117FileInput-dropZone:focus-within {
1916
1916
  outline: var(--outline_default);
1917
1917
  outline-offset: var(--outline_offset);
1918
1918
  border-color: var(--fileInput_border-color, currentcolor);
1919
1919
  }
1920
- .bds0116FileInput-isDragging {
1920
+ .bds0117FileInput-isDragging {
1921
1921
  border-color: currentcolor;
1922
1922
  background-color: rgb(from currentcolor r g b / 8%);
1923
1923
  }
1924
- .bds0116FileInput-hasError {
1924
+ .bds0117FileInput-hasError {
1925
1925
  border-color: var(--color_error);
1926
1926
  }
1927
- .bds0116FileInput-isDisabled {
1927
+ .bds0117FileInput-isDisabled {
1928
1928
  opacity: 0.5;
1929
1929
  cursor: not-allowed;
1930
1930
  }
1931
- .bds0116FileInput-icon {
1931
+ .bds0117FileInput-icon {
1932
1932
  width: 2rem;
1933
1933
  height: 2rem;
1934
1934
  flex-shrink: 0;
1935
1935
  }
1936
- .bds0116FileInput-prompt {
1936
+ .bds0117FileInput-prompt {
1937
1937
  font-size: var(--font_size--body);
1938
1938
  color: var(--color_on-bg--muted);
1939
1939
  }
1940
- .bds0116FileInput-prompt strong {
1940
+ .bds0117FileInput-prompt strong {
1941
1941
  color: var(--color_interactive);
1942
1942
  font-weight: var(--font_weight--semibold);
1943
1943
  }
1944
- .bds0116FileInput-acceptHint {
1944
+ .bds0117FileInput-acceptHint {
1945
1945
  font-size: var(--font_size--body--s);
1946
1946
  color: var(--color_on-bg--muted);
1947
1947
  }
1948
- .bds0116FileInput-hiddenInput {
1948
+ .bds0117FileInput-hiddenInput {
1949
1949
  position: absolute;
1950
1950
  width: 1px;
1951
1951
  height: 1px;
@@ -1955,7 +1955,7 @@
1955
1955
  border: 0;
1956
1956
  }
1957
1957
  @media (hover: hover) and (pointer: fine) {
1958
- .bds0116FileInput-dropZone:not(.bds0116FileInput-isDisabled):hover {
1958
+ .bds0117FileInput-dropZone:not(.bds0117FileInput-isDisabled):hover {
1959
1959
  border-color: var(--color_interactive);
1960
1960
  background-color: rgb(from var(--color_interactive) r g b / 4%);
1961
1961
  }
@@ -1964,12 +1964,12 @@
1964
1964
 
1965
1965
  /* src/components/interaction/form/FormInput/FormInput.module.css */
1966
1966
  @layer component {
1967
- .bds0116FormInput-formGroup {
1967
+ .bds0117FormInput-formGroup {
1968
1968
  --labelPosition: 0;
1969
1969
  display: flex;
1970
1970
  flex-direction: column;
1971
1971
  }
1972
- .bds0116FormInput-input {
1972
+ .bds0117FormInput-input {
1973
1973
  font-family: var(--font_family--body);
1974
1974
  font-size: var(--font_size--body);
1975
1975
  padding: var(--space_s);
@@ -1979,26 +1979,26 @@
1979
1979
  color: var(--input_color, var(--color_on-bg));
1980
1980
  background-color: var(--input_color_bg, var(--color_bg));
1981
1981
  }
1982
- .bds0116FormInput-input:focus {
1982
+ .bds0117FormInput-input:focus {
1983
1983
  --input_border-color: var(--color_interactive);
1984
1984
  outline: none;
1985
1985
  box-shadow: var(--input_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
1986
1986
  }
1987
- .bds0116FormInput-inputError {
1987
+ .bds0117FormInput-inputError {
1988
1988
  --input_border-color: var(--color_error);
1989
1989
  }
1990
- .bds0116FormInput-inputError:focus {
1990
+ .bds0117FormInput-inputError:focus {
1991
1991
  --input_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
1992
1992
  }
1993
1993
  }
1994
1994
 
1995
1995
  /* src/components/interaction/form/NumberInput/NumberInput.module.css */
1996
1996
  @layer component {
1997
- .bds0116NumberInput-formGroup {
1997
+ .bds0117NumberInput-formGroup {
1998
1998
  display: flex;
1999
1999
  flex-direction: column;
2000
2000
  }
2001
- .bds0116NumberInput-inputRow {
2001
+ .bds0117NumberInput-inputRow {
2002
2002
  display: flex;
2003
2003
  align-items: stretch;
2004
2004
  border: 1px solid currentcolor;
@@ -2006,11 +2006,11 @@
2006
2006
  overflow: hidden;
2007
2007
  transition: var(--animation_transition);
2008
2008
  }
2009
- .bds0116NumberInput-inputRow:focus-within {
2009
+ .bds0117NumberInput-inputRow:focus-within {
2010
2010
  border-color: var(--numberInput_border-color, var(--color_interactive));
2011
2011
  box-shadow: var(--numberInput_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
2012
2012
  }
2013
- .bds0116NumberInput-input {
2013
+ .bds0117NumberInput-input {
2014
2014
  flex: 1;
2015
2015
  border: none;
2016
2016
  outline: none;
@@ -2023,17 +2023,17 @@
2023
2023
  min-width: 0;
2024
2024
  appearance: textfield;
2025
2025
  }
2026
- .bds0116NumberInput-input::-webkit-inner-spin-button,
2027
- .bds0116NumberInput-input::-webkit-outer-spin-button {
2026
+ .bds0117NumberInput-input::-webkit-inner-spin-button,
2027
+ .bds0117NumberInput-input::-webkit-outer-spin-button {
2028
2028
  appearance: none;
2029
2029
  }
2030
- .bds0116NumberInput-inputError {
2030
+ .bds0117NumberInput-inputError {
2031
2031
  --numberInput_border-color: var(--color_error);
2032
2032
  }
2033
- .bds0116NumberInput-inputError:focus-within {
2033
+ .bds0117NumberInput-inputError:focus-within {
2034
2034
  --numberInput_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
2035
2035
  }
2036
- .bds0116NumberInput-stepper {
2036
+ .bds0117NumberInput-stepper {
2037
2037
  all: unset;
2038
2038
  display: flex;
2039
2039
  align-items: center;
@@ -2045,16 +2045,16 @@
2045
2045
  transition: var(--animation_transition);
2046
2046
  flex-shrink: 0;
2047
2047
  }
2048
- .bds0116NumberInput-stepper svg {
2048
+ .bds0117NumberInput-stepper svg {
2049
2049
  width: 1rem;
2050
2050
  height: 1rem;
2051
2051
  }
2052
- .bds0116NumberInput-stepper:disabled {
2052
+ .bds0117NumberInput-stepper:disabled {
2053
2053
  opacity: 0.4;
2054
2054
  cursor: not-allowed;
2055
2055
  }
2056
2056
  @media (hover: hover) and (pointer: fine) {
2057
- .bds0116NumberInput-stepper:not(:disabled):hover {
2057
+ .bds0117NumberInput-stepper:not(:disabled):hover {
2058
2058
  background-color: var(--color_bg--subtle);
2059
2059
  opacity: 0.7;
2060
2060
  }
@@ -2063,29 +2063,29 @@
2063
2063
 
2064
2064
  /* src/components/interaction/form/Radio/Radio.module.css */
2065
2065
  @layer component {
2066
- .bds0116Radio-radioGroup {
2066
+ .bds0117Radio-radioGroup {
2067
2067
  --inputSize: calc(var(--space_s) * 2);
2068
2068
  --labelPosition: calc(var(--inputSize) + var(--space_m));
2069
2069
  display: flex;
2070
2070
  flex-direction: column;
2071
2071
  }
2072
- .bds0116Radio-inputWrapper {
2072
+ .bds0117Radio-inputWrapper {
2073
2073
  display: flex;
2074
2074
  align-items: flex-start;
2075
2075
  gap: var(--space_xs);
2076
2076
  }
2077
- .bds0116Radio-textWrapper {
2077
+ .bds0117Radio-textWrapper {
2078
2078
  display: flex;
2079
2079
  flex-direction: column;
2080
2080
  gap: var(--space_xxxs);
2081
2081
  padding-block-start: var(--space_xxxs);
2082
2082
  }
2083
- .bds0116Radio-description {
2083
+ .bds0117Radio-description {
2084
2084
  font-size: var(--font_size--body--s);
2085
2085
  color: var(--radio_description-color, var(--color_on-bg--subtle));
2086
2086
  line-height: var(--font_line-height--body);
2087
2087
  }
2088
- .bds0116Radio-radio {
2088
+ .bds0117Radio-radio {
2089
2089
  flex-shrink: 0;
2090
2090
  margin-block-start: 0.2em;
2091
2091
  width: var(--inputSize);
@@ -2099,11 +2099,11 @@
2099
2099
  position: relative;
2100
2100
  transition: background-color 0.2s ease, border-color 0.2s ease;
2101
2101
  }
2102
- .bds0116Radio-radio:checked {
2102
+ .bds0117Radio-radio:checked {
2103
2103
  background-color: var(--radio_color-active, var(--color_active));
2104
2104
  border-color: var(--radio_color-active, var(--color_active));
2105
2105
  }
2106
- .bds0116Radio-radio:checked::after {
2106
+ .bds0117Radio-radio:checked::after {
2107
2107
  content: "";
2108
2108
  position: absolute;
2109
2109
  left: 50%;
@@ -2114,32 +2114,121 @@
2114
2114
  border-radius: 50%;
2115
2115
  background-color: var(--radio_color-on-active, var(--color_on-active));
2116
2116
  }
2117
- .bds0116Radio-radio:focus {
2117
+ .bds0117Radio-radio:focus {
2118
2118
  outline: none;
2119
2119
  border-color: var(--color_interactive);
2120
2120
  box-shadow: 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%);
2121
2121
  }
2122
- .bds0116Radio-radioError {
2122
+ .bds0117Radio-radioError {
2123
2123
  border-color: var(--color_error);
2124
2124
  }
2125
- .bds0116Radio-radioError:focus {
2125
+ .bds0117Radio-radioError:focus {
2126
2126
  border-color: var(--color_error);
2127
2127
  box-shadow: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
2128
2128
  }
2129
2129
  }
2130
2130
 
2131
+ /* src/components/interaction/form/SegmentedControl/SegmentedControl.module.css */
2132
+ @layer component {
2133
+ .bds0117SegmentedControl-control {
2134
+ position: relative;
2135
+ display: inline-grid;
2136
+ grid-auto-flow: column;
2137
+ grid-auto-columns: 1fr;
2138
+ padding: var(--space_xxxs);
2139
+ background-color: var(--control_track-bg, var(--color_bg--subtle));
2140
+ border-radius: var(--border_radius--m);
2141
+ gap: 0;
2142
+ }
2143
+ .bds0117SegmentedControl-thumb {
2144
+ position: absolute;
2145
+ top: var(--space_xxxs);
2146
+ bottom: var(--space_xxxs);
2147
+ left: var(--space_xxxs);
2148
+ width: calc((100% - 2 * var(--space_xxxs)) / var(--control_count, 1));
2149
+ border-radius: var(--border_radius--s);
2150
+ background-color: var(--control_thumb-bg, var(--color_bg));
2151
+ box-shadow: var(--shadow_s);
2152
+ pointer-events: none;
2153
+ transform: translateX(calc(var(--control_selected-index, 0) * 100%));
2154
+ transition: transform var(--animation_transition-duration) var(--animation_easing);
2155
+ }
2156
+ .bds0117SegmentedControl-item {
2157
+ position: relative;
2158
+ z-index: 1;
2159
+ display: flex;
2160
+ align-items: center;
2161
+ justify-content: center;
2162
+ cursor: pointer;
2163
+ border-radius: var(--border_radius--s);
2164
+ transition: var(--animation_transition);
2165
+ }
2166
+ .bds0117SegmentedControl-item.bds0117SegmentedControl---disabled {
2167
+ opacity: 0.4;
2168
+ cursor: not-allowed;
2169
+ }
2170
+ .bds0117SegmentedControl-radio {
2171
+ position: absolute;
2172
+ opacity: 0;
2173
+ width: 0;
2174
+ height: 0;
2175
+ margin: 0;
2176
+ }
2177
+ .bds0117SegmentedControl-label {
2178
+ display: block;
2179
+ padding: var(--space_xs) var(--space_m);
2180
+ white-space: nowrap;
2181
+ font-size: var(--font_size--body);
2182
+ line-height: var(--font_line-height--body);
2183
+ color: var(--control_label-color, var(--color_on-bg--subtle));
2184
+ transition: color var(--animation_transition-duration) var(--animation_easing);
2185
+ pointer-events: none;
2186
+ user-select: none;
2187
+ }
2188
+ .bds0117SegmentedControl-control.bds0117SegmentedControl---size_small .bds0117SegmentedControl-label {
2189
+ padding: var(--space_xxs) var(--space_s);
2190
+ font-size: var(--font_size--body--s);
2191
+ }
2192
+ .bds0117SegmentedControl-control.bds0117SegmentedControl---size_large .bds0117SegmentedControl-label {
2193
+ padding: var(--space_s) var(--space_m);
2194
+ white-space: normal;
2195
+ text-align: center;
2196
+ }
2197
+ .bds0117SegmentedControl-item.bds0117SegmentedControl---active .bds0117SegmentedControl-label {
2198
+ color: var(--control_label-color--active, var(--color_on-bg));
2199
+ }
2200
+ .bds0117SegmentedControl-radio:focus-visible ~ .bds0117SegmentedControl-label {
2201
+ outline: var(--outline_default);
2202
+ outline-offset: calc(var(--outline_offset) * -1);
2203
+ border-radius: var(--border_radius--s);
2204
+ }
2205
+ @media (hover: hover) and (pointer: fine) {
2206
+ .bds0117SegmentedControl-item:not(.bds0117SegmentedControl---active, .bds0117SegmentedControl---disabled):hover .bds0117SegmentedControl-label {
2207
+ color: var(--control_label-color--hover, var(--color_on-bg));
2208
+ }
2209
+ }
2210
+ @media (prefers-reduced-motion: reduce) {
2211
+ .bds0117SegmentedControl-thumb {
2212
+ transition: none;
2213
+ }
2214
+ .bds0117SegmentedControl-label {
2215
+ transition: none;
2216
+ }
2217
+ }
2218
+ }
2219
+
2131
2220
  /* src/components/interaction/form/Select/Select.module.css */
2132
2221
  @layer component {
2133
- .bds0116Select-formGroup {
2222
+ .bds0117Select-formGroup {
2134
2223
  display: flex;
2135
2224
  flex-direction: column;
2136
2225
  }
2137
- .bds0116Select-selectWrapper {
2226
+ .bds0117Select-selectWrapper {
2138
2227
  position: relative;
2139
2228
  display: flex;
2140
2229
  align-items: center;
2141
2230
  }
2142
- .bds0116Select-select {
2231
+ .bds0117Select-select {
2143
2232
  appearance: none;
2144
2233
  width: 100%;
2145
2234
  font-family: var(--font_family--body);
@@ -2153,22 +2242,22 @@
2153
2242
  cursor: pointer;
2154
2243
  transition: var(--animation_transition);
2155
2244
  }
2156
- .bds0116Select-select:focus {
2245
+ .bds0117Select-select:focus {
2157
2246
  --select_border-color: var(--color_interactive);
2158
2247
  outline: none;
2159
2248
  box-shadow: var(--select_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
2160
2249
  }
2161
- .bds0116Select-select:disabled {
2250
+ .bds0117Select-select:disabled {
2162
2251
  opacity: 0.5;
2163
2252
  cursor: not-allowed;
2164
2253
  }
2165
- .bds0116Select-selectError {
2254
+ .bds0117Select-selectError {
2166
2255
  --select_border-color: var(--color_error);
2167
2256
  }
2168
- .bds0116Select-selectError:focus {
2257
+ .bds0117Select-selectError:focus {
2169
2258
  --select_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
2170
2259
  }
2171
- .bds0116Select-chevron {
2260
+ .bds0117Select-chevron {
2172
2261
  position: absolute;
2173
2262
  inset-inline-end: var(--space_s);
2174
2263
  display: flex;
@@ -2176,7 +2265,7 @@
2176
2265
  pointer-events: none;
2177
2266
  color: var(--select_color, var(--color_on-bg));
2178
2267
  }
2179
- .bds0116Select-chevron svg {
2268
+ .bds0117Select-chevron svg {
2180
2269
  width: 1rem;
2181
2270
  height: 1rem;
2182
2271
  }
@@ -2184,22 +2273,22 @@
2184
2273
 
2185
2274
  /* src/components/interaction/form/Slider/Slider.module.css */
2186
2275
  @layer component {
2187
- .bds0116Slider-formGroup {
2276
+ .bds0117Slider-formGroup {
2188
2277
  display: flex;
2189
2278
  flex-direction: column;
2190
2279
  gap: var(--space_xxs);
2191
2280
  }
2192
- .bds0116Slider-labelRow {
2281
+ .bds0117Slider-labelRow {
2193
2282
  display: flex;
2194
2283
  justify-content: space-between;
2195
2284
  align-items: baseline;
2196
2285
  }
2197
- .bds0116Slider-value {
2286
+ .bds0117Slider-value {
2198
2287
  font-size: var(--font_size--body--s);
2199
2288
  font-variant-numeric: tabular-nums;
2200
2289
  color: var(--color_on-bg--subtle);
2201
2290
  }
2202
- .bds0116Slider-slider {
2291
+ .bds0117Slider-slider {
2203
2292
  --slider_fill: 0%;
2204
2293
  --slider_track-height: var(--space_xxs);
2205
2294
  --slider_thumb-size: calc(var(--space_s) * 2);
@@ -2218,16 +2307,16 @@
2218
2307
  cursor: pointer;
2219
2308
  transition: var(--animation_transition);
2220
2309
  }
2221
- .bds0116Slider-slider:focus-visible {
2310
+ .bds0117Slider-slider:focus-visible {
2222
2311
  outline: var(--outline_default);
2223
2312
  outline-offset: var(--outline_offset);
2224
2313
  border-radius: 999px;
2225
2314
  }
2226
- .bds0116Slider-slider:disabled {
2315
+ .bds0117Slider-slider:disabled {
2227
2316
  opacity: 0.4;
2228
2317
  cursor: not-allowed;
2229
2318
  }
2230
- .bds0116Slider-slider::-webkit-slider-thumb {
2319
+ .bds0117Slider-slider::-webkit-slider-thumb {
2231
2320
  appearance: none;
2232
2321
  width: var(--slider_thumb-size);
2233
2322
  height: var(--slider_thumb-size);
@@ -2237,7 +2326,7 @@
2237
2326
  transition: var(--animation_transition);
2238
2327
  cursor: pointer;
2239
2328
  }
2240
- .bds0116Slider-slider::-moz-range-thumb {
2329
+ .bds0117Slider-slider::-moz-range-thumb {
2241
2330
  width: var(--slider_thumb-size);
2242
2331
  height: var(--slider_thumb-size);
2243
2332
  border: none;
@@ -2246,7 +2335,7 @@
2246
2335
  box-shadow: var(--shadow_s);
2247
2336
  cursor: pointer;
2248
2337
  }
2249
- .bds0116Slider-sliderError {
2338
+ .bds0117Slider-sliderError {
2250
2339
  background:
2251
2340
  linear-gradient(
2252
2341
  to right,
@@ -2255,16 +2344,16 @@
2255
2344
  var(--color_bg--subtle) var(--slider_fill),
2256
2345
  var(--color_bg--subtle) 100%);
2257
2346
  }
2258
- .bds0116Slider-sliderError::-webkit-slider-thumb {
2347
+ .bds0117Slider-sliderError::-webkit-slider-thumb {
2259
2348
  background-color: var(--color_error);
2260
2349
  }
2261
- .bds0116Slider-sliderError::-moz-range-thumb {
2350
+ .bds0117Slider-sliderError::-moz-range-thumb {
2262
2351
  background-color: var(--color_error);
2263
2352
  }
2264
2353
  @media (prefers-reduced-motion: reduce) {
2265
- .bds0116Slider-slider,
2266
- .bds0116Slider-slider::-webkit-slider-thumb,
2267
- .bds0116Slider-slider::-moz-range-thumb {
2354
+ .bds0117Slider-slider,
2355
+ .bds0117Slider-slider::-webkit-slider-thumb,
2356
+ .bds0117Slider-slider::-moz-range-thumb {
2268
2357
  transition: none;
2269
2358
  }
2270
2359
  }
@@ -2272,7 +2361,7 @@
2272
2361
 
2273
2362
  /* src/components/interaction/form/Switch/Switch.module.css */
2274
2363
  @layer component {
2275
- .bds0116Switch-switchGroup {
2364
+ .bds0117Switch-switchGroup {
2276
2365
  --switch_thumb-size: 1.25em;
2277
2366
  --switch_track-pad: var(--space_xxxs);
2278
2367
  --switch_track-height: calc(var(--switch_thumb-size) + var(--switch_track-pad) * 2);
@@ -2281,21 +2370,21 @@
2281
2370
  display: flex;
2282
2371
  flex-direction: column;
2283
2372
  }
2284
- .bds0116Switch-switchGroup.bds0116Switch---size_small {
2373
+ .bds0117Switch-switchGroup.bds0117Switch---size_small {
2285
2374
  --switch_thumb-size: 1em;
2286
2375
  }
2287
- .bds0116Switch-switchGroup.bds0116Switch---size_medium {
2376
+ .bds0117Switch-switchGroup.bds0117Switch---size_medium {
2288
2377
  --switch_thumb-size: 1.25em;
2289
2378
  }
2290
- .bds0116Switch-switchGroup.bds0116Switch---size_large {
2379
+ .bds0117Switch-switchGroup.bds0117Switch---size_large {
2291
2380
  --switch_thumb-size: 1.5em;
2292
2381
  }
2293
- .bds0116Switch-inputWrapper {
2382
+ .bds0117Switch-inputWrapper {
2294
2383
  display: flex;
2295
2384
  align-items: center;
2296
2385
  gap: var(--space_xs);
2297
2386
  }
2298
- .bds0116Switch-trackWrapper {
2387
+ .bds0117Switch-trackWrapper {
2299
2388
  position: relative;
2300
2389
  display: inline-flex;
2301
2390
  align-items: center;
@@ -2303,7 +2392,7 @@
2303
2392
  width: var(--switch_track-width);
2304
2393
  height: var(--switch_track-height);
2305
2394
  }
2306
- .bds0116Switch-switch {
2395
+ .bds0117Switch-switch {
2307
2396
  position: absolute;
2308
2397
  inset: 0;
2309
2398
  appearance: none;
@@ -2314,10 +2403,10 @@
2314
2403
  cursor: pointer;
2315
2404
  z-index: 1;
2316
2405
  }
2317
- .bds0116Switch-switch:disabled {
2406
+ .bds0117Switch-switch:disabled {
2318
2407
  cursor: not-allowed;
2319
2408
  }
2320
- .bds0116Switch-track {
2409
+ .bds0117Switch-track {
2321
2410
  display: inline-flex;
2322
2411
  align-items: center;
2323
2412
  width: var(--switch_track-width);
@@ -2330,7 +2419,7 @@
2330
2419
  outline: 1px solid var(--switch_thumb-bg, var(--color_grey));
2331
2420
  outline-offset: var(--outline_offset);
2332
2421
  }
2333
- .bds0116Switch-thumb {
2422
+ .bds0117Switch-thumb {
2334
2423
  display: block;
2335
2424
  width: var(--switch_thumb-size);
2336
2425
  height: var(--switch_thumb-size);
@@ -2340,28 +2429,28 @@
2340
2429
  transition: var(--animation_transition);
2341
2430
  transform: translateX(0);
2342
2431
  }
2343
- .bds0116Switch-switch.bds0116Switch-switchError + .bds0116Switch-track {
2432
+ .bds0117Switch-switch.bds0117Switch-switchError + .bds0117Switch-track {
2344
2433
  outline: 1px solid var(--color_error);
2345
2434
  }
2346
- .bds0116Switch-switch:checked + .bds0116Switch-track {
2435
+ .bds0117Switch-switch:checked + .bds0117Switch-track {
2347
2436
  background-color: var(--switch_track-bg--active, var(--color_active--subtle));
2348
2437
  outline-color: var(--switch_thumb-bg--active, var(--color_active--strong));
2349
2438
  }
2350
- .bds0116Switch-switch:checked + .bds0116Switch-track .bds0116Switch-thumb {
2439
+ .bds0117Switch-switch:checked + .bds0117Switch-track .bds0117Switch-thumb {
2351
2440
  background-color: var(--switch_thumb-bg--active, var(--color_active--strong));
2352
2441
  transform: translateX(var(--switch_thumb-size));
2353
2442
  }
2354
- .bds0116Switch-switch:focus-visible + .bds0116Switch-track {
2443
+ .bds0117Switch-switch:focus-visible + .bds0117Switch-track {
2355
2444
  outline: var(--outline_default);
2356
2445
  outline-offset: var(--outline_offset);
2357
2446
  border-radius: 999px;
2358
2447
  }
2359
- .bds0116Switch-switch:disabled + .bds0116Switch-track {
2448
+ .bds0117Switch-switch:disabled + .bds0117Switch-track {
2360
2449
  opacity: 0.4;
2361
2450
  }
2362
2451
  @media (prefers-reduced-motion: reduce) {
2363
- .bds0116Switch-track,
2364
- .bds0116Switch-thumb {
2452
+ .bds0117Switch-track,
2453
+ .bds0117Switch-thumb {
2365
2454
  transition: none;
2366
2455
  }
2367
2456
  }
@@ -2369,11 +2458,11 @@
2369
2458
 
2370
2459
  /* src/components/interaction/form/Textarea/Textarea.module.css */
2371
2460
  @layer component {
2372
- .bds0116Textarea-formGroup {
2461
+ .bds0117Textarea-formGroup {
2373
2462
  display: flex;
2374
2463
  flex-direction: column;
2375
2464
  }
2376
- .bds0116Textarea-textarea {
2465
+ .bds0117Textarea-textarea {
2377
2466
  font-family: var(--font_family--body);
2378
2467
  font-size: var(--font_size--body);
2379
2468
  line-height: var(--font_line-height--body);
@@ -2386,69 +2475,69 @@
2386
2475
  min-height: calc(var(--space_m) * 5);
2387
2476
  transition: var(--animation_transition);
2388
2477
  }
2389
- .bds0116Textarea-textarea:focus {
2478
+ .bds0117Textarea-textarea:focus {
2390
2479
  --textarea_border-color: var(--color_interactive);
2391
2480
  outline: none;
2392
2481
  box-shadow: var(--textarea_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
2393
2482
  }
2394
- .bds0116Textarea-textarea:disabled {
2483
+ .bds0117Textarea-textarea:disabled {
2395
2484
  opacity: 0.5;
2396
2485
  cursor: not-allowed;
2397
2486
  resize: none;
2398
2487
  }
2399
- .bds0116Textarea-textareaError {
2488
+ .bds0117Textarea-textareaError {
2400
2489
  --textarea_border-color: var(--color_error);
2401
2490
  }
2402
- .bds0116Textarea-textareaError:focus {
2491
+ .bds0117Textarea-textareaError:focus {
2403
2492
  --textarea_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
2404
2493
  }
2405
2494
  }
2406
2495
 
2407
2496
  /* src/components/layout/ButtonGroup/ButtonGroup.module.css */
2408
2497
  @layer component {
2409
- .bds0116ButtonGroup-buttonGroup {
2498
+ .bds0117ButtonGroup-buttonGroup {
2410
2499
  container-type: inline-size;
2411
2500
  container-name: button-group;
2412
2501
  grid-column: var(--grid_span-100);
2413
2502
  }
2414
- .bds0116ButtonGroup-buttonGroup .bds0116ButtonGroup-container {
2503
+ .bds0117ButtonGroup-buttonGroup .bds0117ButtonGroup-container {
2415
2504
  position: relative;
2416
2505
  display: flex;
2417
2506
  flex-direction: column-reverse;
2418
2507
  gap: var(--space_l);
2419
2508
  align-items: center;
2420
2509
  }
2421
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_card .bds0116ButtonGroup-container {
2510
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_card .bds0117ButtonGroup-container {
2422
2511
  align-items: stretch;
2423
2512
  }
2424
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_flow .bds0116ButtonGroup-container,
2425
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_modal .bds0116ButtonGroup-container {
2513
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_flow .bds0117ButtonGroup-container,
2514
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_modal .bds0117ButtonGroup-container {
2426
2515
  align-items: center;
2427
2516
  }
2428
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_content .bds0116ButtonGroup-container {
2517
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_content .bds0117ButtonGroup-container {
2429
2518
  align-items: flex-start;
2430
2519
  }
2431
2520
  @supports (contain: inline-size) {
2432
2521
  @container button-group (min-width: 30rem) {
2433
- .bds0116ButtonGroup-buttonGroup .bds0116ButtonGroup-container {
2522
+ .bds0117ButtonGroup-buttonGroup .bds0117ButtonGroup-container {
2434
2523
  flex-direction: row;
2435
2524
  justify-content: space-between;
2436
2525
  }
2437
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_modal .bds0116ButtonGroup-container > :first-child:last-child,
2438
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_flow .bds0116ButtonGroup-container > :first-child:last-child {
2526
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_modal .bds0117ButtonGroup-container > :first-child:last-child,
2527
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_flow .bds0117ButtonGroup-container > :first-child:last-child {
2439
2528
  margin-inline-start: auto;
2440
2529
  }
2441
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_card .bds0116ButtonGroup-container {
2530
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_card .bds0117ButtonGroup-container {
2442
2531
  justify-content: center;
2443
2532
  }
2444
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_modal .bds0116ButtonGroup-container {
2533
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_modal .bds0117ButtonGroup-container {
2445
2534
  justify-content: flex-end;
2446
2535
  }
2447
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_content .bds0116ButtonGroup-container {
2536
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_content .bds0117ButtonGroup-container {
2448
2537
  justify-content: flex-start;
2449
2538
  align-items: center;
2450
2539
  }
2451
- .bds0116ButtonGroup-buttonGroup.bds0116ButtonGroup---variant_grid .bds0116ButtonGroup-container {
2540
+ .bds0117ButtonGroup-buttonGroup.bds0117ButtonGroup---variant_grid .bds0117ButtonGroup-container {
2452
2541
  justify-content: center;
2453
2542
  }
2454
2543
  }
@@ -2457,59 +2546,59 @@
2457
2546
 
2458
2547
  /* src/components/layout/Card/Card.module.css */
2459
2548
  @layer component {
2460
- .bds0116Card-card {
2549
+ .bds0117Card-card {
2461
2550
  background-color: var(--card_color, var(--color_bg));
2462
2551
  color: var(--card_on-color, var(--color_on-bg));
2463
2552
  border-radius: var(--border_radius--m);
2464
2553
  transition: all 0.3s ease;
2465
2554
  position: relative;
2466
2555
  }
2467
- .bds0116Card-card.bds0116Card---default {
2556
+ .bds0117Card-card.bds0117Card---default {
2468
2557
  box-shadow: var(--shadow_s);
2469
2558
  }
2470
- .bds0116Card-card.bds0116Card---elevated {
2559
+ .bds0117Card-card.bds0117Card---elevated {
2471
2560
  box-shadow: var(--shadow_m);
2472
2561
  }
2473
- .bds0116Card-card.bds0116Card---outlined {
2562
+ .bds0117Card-card.bds0117Card---outlined {
2474
2563
  border: 1px solid currentcolor;
2475
2564
  box-shadow: var(--shadow_s);
2476
2565
  }
2477
- .bds0116Card-card.bds0116Card---clickable {
2566
+ .bds0117Card-card.bds0117Card---clickable {
2478
2567
  cursor: pointer;
2479
2568
  }
2480
- .bds0116Card-card.bds0116Card---padding-none {
2569
+ .bds0117Card-card.bds0117Card---padding-none {
2481
2570
  padding: 0;
2482
2571
  }
2483
- .bds0116Card-card.bds0116Card---padding-small {
2572
+ .bds0117Card-card.bds0117Card---padding-small {
2484
2573
  padding: var(--space_s);
2485
2574
  }
2486
- .bds0116Card-card.bds0116Card---padding-medium {
2575
+ .bds0117Card-card.bds0117Card---padding-medium {
2487
2576
  padding: var(--space_m);
2488
2577
  }
2489
- .bds0116Card-card.bds0116Card---padding-large {
2578
+ .bds0117Card-card.bds0117Card---padding-large {
2490
2579
  padding: var(--space_l);
2491
2580
  }
2492
- .bds0116Card-card.bds0116Card---text-start {
2581
+ .bds0117Card-card.bds0117Card---text-start {
2493
2582
  text-align: left;
2494
2583
  }
2495
- .bds0116Card-card.bds0116Card---text-center {
2584
+ .bds0117Card-card.bds0117Card---text-center {
2496
2585
  text-align: center;
2497
2586
  }
2498
- .bds0116Card-card.bds0116Card---text-end {
2587
+ .bds0117Card-card.bds0117Card---text-end {
2499
2588
  text-align: right;
2500
2589
  }
2501
2590
  @media (hover: hover) and (pointer: fine) {
2502
- .bds0116Card-card.bds0116Card---clickable:hover {
2591
+ .bds0117Card-card.bds0117Card---clickable:hover {
2503
2592
  transform: translateY(-2px);
2504
2593
  box-shadow: var(--shadow_xl);
2505
2594
  }
2506
- .bds0116Card-card.bds0116Card---default:hover {
2595
+ .bds0117Card-card.bds0117Card---default:hover {
2507
2596
  box-shadow: var(--shadow_m);
2508
2597
  }
2509
- .bds0116Card-card.bds0116Card---elevated:hover {
2598
+ .bds0117Card-card.bds0117Card---elevated:hover {
2510
2599
  box-shadow: var(--shadow_2xl);
2511
2600
  }
2512
- .bds0116Card-card.bds0116Card---outlined:hover {
2601
+ .bds0117Card-card.bds0117Card---outlined:hover {
2513
2602
  box-shadow: var(--shadow_s);
2514
2603
  }
2515
2604
  }
@@ -2517,60 +2606,60 @@
2517
2606
 
2518
2607
  /* src/components/layout/SectionHeader/SectionHeader.module.css */
2519
2608
  @layer component {
2520
- .bds0116SectionHeader-sectionHeader {
2609
+ .bds0117SectionHeader-sectionHeader {
2521
2610
  display: flex;
2522
2611
  flex-direction: column;
2523
2612
  gap: var(--space_m);
2524
2613
  grid-column: var(--grid_span-100);
2525
2614
  }
2526
- .bds0116SectionHeader-title {
2615
+ .bds0117SectionHeader-title {
2527
2616
  color: var(--sectionHeader-title-color, var(--color_on-bg));
2528
2617
  margin: 0;
2529
2618
  font-family: var(--font_family--body);
2530
2619
  }
2531
- .bds0116SectionHeader-subtitle {
2620
+ .bds0117SectionHeader-subtitle {
2532
2621
  color: var(--sectionHeader_subtitle-color, var(--color_grey--strong));
2533
2622
  margin: 0;
2534
2623
  font-family: var(--font_family--body);
2535
2624
  font-weight: var(--font_weight--medium);
2536
2625
  }
2537
- .bds0116SectionHeader-sectionHeader.bds0116SectionHeader---start {
2626
+ .bds0117SectionHeader-sectionHeader.bds0117SectionHeader---start {
2538
2627
  align-items: flex-start;
2539
2628
  text-align: left;
2540
2629
  }
2541
- .bds0116SectionHeader-sectionHeader.bds0116SectionHeader---center {
2630
+ .bds0117SectionHeader-sectionHeader.bds0117SectionHeader---center {
2542
2631
  align-items: center;
2543
2632
  text-align: center;
2544
2633
  }
2545
- .bds0116SectionHeader-sectionHeader.bds0116SectionHeader---end {
2634
+ .bds0117SectionHeader-sectionHeader.bds0117SectionHeader---end {
2546
2635
  align-items: flex-end;
2547
2636
  text-align: right;
2548
2637
  }
2549
- .bds0116SectionHeader-sectionHeader.bds0116SectionHeader---small .bds0116SectionHeader-title {
2638
+ .bds0117SectionHeader-sectionHeader.bds0117SectionHeader---small .bds0117SectionHeader-title {
2550
2639
  font-size: var(--font_size--heading-1);
2551
2640
  line-height: var(--font_line-height--heading);
2552
2641
  font-weight: var(--font_weight--bold);
2553
2642
  }
2554
- .bds0116SectionHeader-sectionHeader.bds0116SectionHeader---small .bds0116SectionHeader-subtitle {
2643
+ .bds0117SectionHeader-sectionHeader.bds0117SectionHeader---small .bds0117SectionHeader-subtitle {
2555
2644
  font-size: var(--font_size--body);
2556
2645
  line-height: 1.4;
2557
2646
  }
2558
- .bds0116SectionHeader-sectionHeader.bds0116SectionHeader---medium .bds0116SectionHeader-title {
2647
+ .bds0117SectionHeader-sectionHeader.bds0117SectionHeader---medium .bds0117SectionHeader-title {
2559
2648
  font-size: var(--font_size--display);
2560
2649
  line-height: var(--font_line-height--display);
2561
2650
  font-weight: var(--font_weight--bold);
2562
2651
  }
2563
- .bds0116SectionHeader-sectionHeader.bds0116SectionHeader---medium .bds0116SectionHeader-subtitle {
2652
+ .bds0117SectionHeader-sectionHeader.bds0117SectionHeader---medium .bds0117SectionHeader-subtitle {
2564
2653
  font-size: var(--font_size--heading-3);
2565
2654
  line-height: 1.3;
2566
2655
  }
2567
- .bds0116SectionHeader-sectionHeader.bds0116SectionHeader---large .bds0116SectionHeader-title {
2656
+ .bds0117SectionHeader-sectionHeader.bds0117SectionHeader---large .bds0117SectionHeader-title {
2568
2657
  font-size: var(--font_size--display);
2569
2658
  line-height: var(--font_line-height--display);
2570
2659
  font-weight: var(--font_weight--bold);
2571
2660
  letter-spacing: var(--font_tracking--tight);
2572
2661
  }
2573
- .bds0116SectionHeader-sectionHeader.bds0116SectionHeader---large .bds0116SectionHeader-subtitle {
2662
+ .bds0117SectionHeader-sectionHeader.bds0117SectionHeader---large .bds0117SectionHeader-subtitle {
2574
2663
  font-size: var(--font_size--heading-2);
2575
2664
  line-height: 1.3;
2576
2665
  font-weight: var(--font_weight--medium);
@@ -2579,7 +2668,7 @@
2579
2668
 
2580
2669
  /* src/components/layout/IconWrapper/IconWrapper.module.css */
2581
2670
  @layer component {
2582
- .bds0116IconWrapper-wrapper {
2671
+ .bds0117IconWrapper-wrapper {
2583
2672
  width: 2em;
2584
2673
  height: 2em;
2585
2674
  font-size: 3em;
@@ -2594,7 +2683,7 @@
2594
2683
  position: relative;
2595
2684
  transition: var(--animation_transition);
2596
2685
  }
2597
- .bds0116IconWrapper-wrapper svg {
2686
+ .bds0117IconWrapper-wrapper svg {
2598
2687
  fill: currentcolor;
2599
2688
  }
2600
2689
  }