@i-cell/ids-styles 0.0.24 → 0.0.26

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 (13) hide show
  1. package/dist/components.css +318 -655
  2. package/dist/components.min.css +1 -1
  3. package/dist/components.plugin.js +407 -730
  4. package/dist/segmented-control/segmented-control-toggle.css +117 -228
  5. package/dist/segmented-control/segmented-control-toggle.min.css +1 -1
  6. package/dist/segmented-control/segmented-control-toggle.plugin.js +206 -334
  7. package/dist/segmented-control/segmented-control.css +4 -267
  8. package/dist/segmented-control/segmented-control.min.css +1 -1
  9. package/dist/segmented-control/segmented-control.plugin.js +4 -252
  10. package/dist/tooltip/tooltip.css +197 -160
  11. package/dist/tooltip/tooltip.min.css +1 -1
  12. package/dist/tooltip/tooltip.plugin.js +197 -144
  13. package/package.json +1 -1
package/dist/segmented-control/segmented-control.css CHANGED
@@ -181,61 +181,9 @@
181
181
  .ids-segmented-control.ids-segmented-control-primary .ids-segmented-control-item > button:focus, .ids-segmented-control.ids-segmented-control-primary .ids-segmented-control-item > button:focus-visible {
182
182
  outline-color: var(--ids-comp-segmented-control-focused-outline-color-dark-focused);
183
183
  }
184
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled {
185
- background-color: var(--ids-comp-segmented-control-container-filled-color-bg-primary-default);
186
- border-color: var(--ids-comp-segmented-control-container-filled-color-border-primary-default);
187
- }
188
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button {
189
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-primary-default);
190
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-default);
191
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-primary-default);
192
- }
193
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button .ids-icon {
194
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-default);
195
- }
196
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) {
197
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-primary-active);
198
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-active);
199
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-primary-active);
200
- }
201
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) .ids-icon {
202
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-active);
203
- }
204
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:hover {
205
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-primary-hovered);
206
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-hovered);
207
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-primary-hovered);
208
- }
209
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:hover .ids-icon {
210
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-hovered);
211
- }
212
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:active {
213
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-primary-pressed);
214
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-pressed);
215
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-primary-pressed);
216
- }
217
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:active .ids-icon {
218
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-pressed);
219
- }
220
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:focus, .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:focus-visible {
221
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-primary-focused);
222
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-focused);
223
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-primary-focused);
224
- }
225
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:focus .ids-icon, .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:focus-visible .ids-icon {
226
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-focused);
227
- }
228
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:disabled {
229
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-primary-disabled);
230
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-disabled);
231
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-primary-disabled);
232
- }
233
- .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item > button:disabled .ids-icon {
234
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-disabled);
235
- }
236
184
  .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined {
237
- background-color: var(--ids-comp-segmented-control-container-outlined-color-bg-primary-default);
238
- border-color: var(--ids-comp-segmented-control-container-outlined-color-border-primary-default);
185
+ background-color: var(--ids-comp-segmented-control-container-outlined-color-bg-surface-default);
186
+ border-color: var(--ids-comp-segmented-control-container-outlined-color-border-surface-default);
239
187
  }
240
188
  .ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item > button {
241
189
  background-color: var(--ids-comp-segmented-control-button-outlined-color-bg-primary-default);
@@ -288,58 +236,6 @@
288
236
  .ids-segmented-control.ids-segmented-control-surface .ids-segmented-control-item > button:focus, .ids-segmented-control.ids-segmented-control-surface .ids-segmented-control-item > button:focus-visible {
289
237
  outline-color: var(--ids-comp-segmented-control-focused-outline-color-dark-focused);
290
238
  }
291
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled {
292
- background-color: var(--ids-comp-segmented-control-container-filled-color-bg-surface-default);
293
- border-color: var(--ids-comp-segmented-control-container-filled-color-border-surface-default);
294
- }
295
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button {
296
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-surface-default);
297
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-default);
298
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-surface-default);
299
- }
300
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button .ids-icon {
301
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-default);
302
- }
303
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) {
304
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-surface-active);
305
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-active);
306
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-surface-active);
307
- }
308
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) .ids-icon {
309
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-active);
310
- }
311
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:hover {
312
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-surface-hovered);
313
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-hovered);
314
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-surface-hovered);
315
- }
316
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:hover .ids-icon {
317
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-hovered);
318
- }
319
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:active {
320
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-surface-pressed);
321
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-pressed);
322
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-surface-pressed);
323
- }
324
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:active .ids-icon {
325
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-pressed);
326
- }
327
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:focus, .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:focus-visible {
328
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-surface-focused);
329
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-focused);
330
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-surface-focused);
331
- }
332
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:focus .ids-icon, .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:focus-visible .ids-icon {
333
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-focused);
334
- }
335
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:disabled {
336
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-surface-disabled);
337
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-disabled);
338
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-surface-disabled);
339
- }
340
- .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item > button:disabled .ids-icon {
341
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-disabled);
342
- }
343
239
  .ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined {
344
240
  background-color: var(--ids-comp-segmented-control-container-outlined-color-bg-surface-default);
345
241
  border-color: var(--ids-comp-segmented-control-container-outlined-color-border-surface-default);
@@ -395,61 +291,9 @@
395
291
  .ids-segmented-control.ids-segmented-control-light .ids-segmented-control-item > button:focus, .ids-segmented-control.ids-segmented-control-light .ids-segmented-control-item > button:focus-visible {
396
292
  outline-color: var(--ids-comp-segmented-control-focused-outline-color-light-focused);
397
293
  }
398
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled {
399
- background-color: var(--ids-comp-segmented-control-container-filled-color-bg-light-default);
400
- border-color: var(--ids-comp-segmented-control-container-filled-color-border-light-default);
401
- }
402
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button {
403
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-light-default);
404
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-light-default);
405
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-light-default);
406
- }
407
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button .ids-icon {
408
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-default);
409
- }
410
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) {
411
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-light-active);
412
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-light-active);
413
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-light-active);
414
- }
415
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) .ids-icon {
416
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-active);
417
- }
418
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:hover {
419
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-light-hovered);
420
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-light-hovered);
421
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-light-hovered);
422
- }
423
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:hover .ids-icon {
424
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-hovered);
425
- }
426
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:active {
427
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-light-pressed);
428
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-light-pressed);
429
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-light-pressed);
430
- }
431
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:active .ids-icon {
432
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-pressed);
433
- }
434
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:focus, .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:focus-visible {
435
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-light-focused);
436
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-light-focused);
437
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-light-focused);
438
- }
439
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:focus .ids-icon, .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:focus-visible .ids-icon {
440
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-focused);
441
- }
442
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:disabled {
443
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-light-disabled);
444
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-light-disabled);
445
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-light-disabled);
446
- }
447
- .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item > button:disabled .ids-icon {
448
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-disabled);
449
- }
450
294
  .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined {
451
- background-color: var(--ids-comp-segmented-control-container-outlined-color-bg-light-default);
452
- border-color: var(--ids-comp-segmented-control-container-outlined-color-border-light-default);
295
+ background-color: var(--ids-comp-segmented-control-container-outlined-color-bg-surface-default);
296
+ border-color: var(--ids-comp-segmented-control-container-outlined-color-border-surface-default);
453
297
  }
454
298
  .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item > button {
455
299
  background-color: var(--ids-comp-segmented-control-button-outlined-color-bg-light-default);
@@ -498,111 +342,4 @@
498
342
  }
499
343
  .ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item > button:disabled .ids-icon {
500
344
  color: var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-disabled);
501
- }
502
- .ids-segmented-control.ids-segmented-control-dark .ids-segmented-control-item > button:focus, .ids-segmented-control.ids-segmented-control-dark .ids-segmented-control-item > button:focus-visible {
503
- outline-color: var(--ids-comp-segmented-control-focused-outline-color-dark-focused);
504
- }
505
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled {
506
- background-color: var(--ids-comp-segmented-control-container-filled-color-bg-dark-default);
507
- border-color: var(--ids-comp-segmented-control-container-filled-color-border-dark-default);
508
- }
509
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button {
510
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-dark-default);
511
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-default);
512
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-dark-default);
513
- }
514
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button .ids-icon {
515
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-default);
516
- }
517
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) {
518
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-dark-active);
519
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-active);
520
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-dark-active);
521
- }
522
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) .ids-icon {
523
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-active);
524
- }
525
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:hover {
526
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-dark-hovered);
527
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-hovered);
528
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-dark-hovered);
529
- }
530
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:hover .ids-icon {
531
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-hovered);
532
- }
533
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:active {
534
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-dark-pressed);
535
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-pressed);
536
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-dark-pressed);
537
- }
538
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:active .ids-icon {
539
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-pressed);
540
- }
541
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:focus, .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:focus-visible {
542
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-dark-focused);
543
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-focused);
544
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-dark-focused);
545
- }
546
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:focus .ids-icon, .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:focus-visible .ids-icon {
547
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-focused);
548
- }
549
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:disabled {
550
- background-color: var(--ids-comp-segmented-control-button-filled-color-bg-dark-disabled);
551
- color: var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-disabled);
552
- border-color: var(--ids-comp-segmented-control-button-filled-color-border-dark-disabled);
553
- }
554
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item > button:disabled .ids-icon {
555
- color: var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-disabled);
556
- }
557
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined {
558
- background-color: var(--ids-comp-segmented-control-container-outlined-color-bg-dark-default);
559
- border-color: var(--ids-comp-segmented-control-container-outlined-color-border-dark-default);
560
- }
561
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button {
562
- background-color: var(--ids-comp-segmented-control-button-outlined-color-bg-dark-default);
563
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-default);
564
- border-color: var(--ids-comp-segmented-control-button-outlined-color-border-dark-default);
565
- }
566
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button .ids-icon {
567
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-default);
568
- }
569
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) {
570
- background-color: var(--ids-comp-segmented-control-button-outlined-color-bg-dark-active);
571
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-active);
572
- border-color: var(--ids-comp-segmented-control-button-outlined-color-border-dark-active);
573
- }
574
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button.ids-segmented-control-item-selected:not(:disabled) .ids-icon {
575
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-active);
576
- }
577
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:hover {
578
- background-color: var(--ids-comp-segmented-control-button-outlined-color-bg-dark-hovered);
579
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-hovered);
580
- border-color: var(--ids-comp-segmented-control-button-outlined-color-border-dark-hovered);
581
- }
582
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:hover .ids-icon {
583
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-hovered);
584
- }
585
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:active {
586
- background-color: var(--ids-comp-segmented-control-button-outlined-color-bg-dark-pressed);
587
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-pressed);
588
- border-color: var(--ids-comp-segmented-control-button-outlined-color-border-dark-pressed);
589
- }
590
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:active .ids-icon {
591
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-pressed);
592
- }
593
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:focus, .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:focus-visible {
594
- background-color: var(--ids-comp-segmented-control-button-outlined-color-bg-dark-focused);
595
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-focused);
596
- border-color: var(--ids-comp-segmented-control-button-outlined-color-border-dark-focused);
597
- }
598
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:focus .ids-icon, .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:focus-visible .ids-icon {
599
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-focused);
600
- }
601
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:disabled {
602
- background-color: var(--ids-comp-segmented-control-button-outlined-color-bg-dark-disabled);
603
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-disabled);
604
- border-color: var(--ids-comp-segmented-control-button-outlined-color-border-dark-disabled);
605
- }
606
- .ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item > button:disabled .ids-icon {
607
- color: var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-disabled);
608
345
  }
package/dist/segmented-control/segmented-control.min.css CHANGED
@@ -1 +1 @@
1
- .ids-segmented-control{display:inline-flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.ids-segmented-control .ids-segmented-control-item>button{display:flex;align-items:center;border-style:solid;position:relative;text-wrap:nowrap}.ids-segmented-control .ids-segmented-control-item>button:focus,.ids-segmented-control .ids-segmented-control-item>button:focus-visible{z-index:1;outline-style:solid;outline-offset:2px}.ids-segmented-control .ids-segmented-control-item>button:not(:disabled){cursor:pointer}.ids-segmented-control .ids-segmented-control-item>button:disabled{cursor:not-allowed}.ids-segmented-control.ids-segmented-control-compact{padding:var(--ids-comp-segmented-control-container-size-padding-y-compact) var(--ids-comp-segmented-control-container-size-padding-x-compact);gap:var(--ids-comp-segmented-control-container-size-gap-compact);border-top-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-compact);border-bottom-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-compact);border-top-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-compact);border-bottom-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item>button{border-width:var(--ids-comp-segmented-control-button-size-border-width-compact);padding:var(--ids-comp-segmented-control-button-size-padding-y-compact) var(--ids-comp-segmented-control-button-size-padding-x-compact);gap:var(--ids-comp-segmented-control-button-size-gap-compact);font-family:var(--ids-comp-segmented-control-button-typography-font-family-compact);font-size:var(--ids-comp-segmented-control-button-typography-font-size-compact);font-weight:var(--ids-comp-segmented-control-button-typography-font-weight-compact);letter-spacing:var(--ids-comp-segmented-control-button-typography-letter-spacing-compact);line-height:var(--ids-comp-segmented-control-button-typography-line-height-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item>button:focus-visible{outline-width:var(--ids-comp-segmented-control-focused-outline-size-outline-width-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item:first-of-type>button{border-top-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-compact);border-bottom-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item:last-of-type>button{border-top-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-compact);border-bottom-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item:not(:last-of-type)>button{border-right-width:0}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item .ids-icon{height:var(--ids-comp-segmented-control-button-size-icon-compact);width:var(--ids-comp-segmented-control-button-size-icon-compact);font-size:var(--ids-comp-segmented-control-button-icon-typography-font-size-compact);font-weight:var(--ids-comp-segmented-control-button-icon-typography-font-weight-compact);line-height:var(--ids-comp-segmented-control-button-icon-typography-line-height-compact)}.ids-segmented-control.ids-segmented-control-comfortable{padding:var(--ids-comp-segmented-control-container-size-padding-y-comfortable) var(--ids-comp-segmented-control-container-size-padding-x-comfortable);gap:var(--ids-comp-segmented-control-container-size-gap-comfortable);border-top-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-comfortable);border-bottom-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-comfortable);border-top-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-comfortable);border-bottom-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item>button{border-width:var(--ids-comp-segmented-control-button-size-border-width-comfortable);padding:var(--ids-comp-segmented-control-button-size-padding-y-comfortable) var(--ids-comp-segmented-control-button-size-padding-x-comfortable);gap:var(--ids-comp-segmented-control-button-size-gap-comfortable);font-family:var(--ids-comp-segmented-control-button-typography-font-family-comfortable);font-size:var(--ids-comp-segmented-control-button-typography-font-size-comfortable);font-weight:var(--ids-comp-segmented-control-button-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-segmented-control-button-typography-letter-spacing-comfortable);line-height:var(--ids-comp-segmented-control-button-typography-line-height-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item>button:focus-visible{outline-width:var(--ids-comp-segmented-control-focused-outline-size-outline-width-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item:first-of-type>button{border-top-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-comfortable);border-bottom-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item:last-of-type>button{border-top-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-comfortable);border-bottom-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item:not(:last-of-type)>button{border-right-width:0}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item .ids-icon{height:var(--ids-comp-segmented-control-button-size-icon-comfortable);width:var(--ids-comp-segmented-control-button-size-icon-comfortable);font-size:var(--ids-comp-segmented-control-button-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-segmented-control-button-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-segmented-control-button-icon-typography-line-height-comfortable)}.ids-segmented-control.ids-segmented-control-spacious{padding:var(--ids-comp-segmented-control-container-size-padding-y-spacious) var(--ids-comp-segmented-control-container-size-padding-x-spacious);gap:var(--ids-comp-segmented-control-container-size-gap-spacious);border-top-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-spacious);border-bottom-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-spacious);border-top-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-spacious);border-bottom-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item>button{border-width:var(--ids-comp-segmented-control-button-size-border-width-spacious);padding:var(--ids-comp-segmented-control-button-size-padding-y-spacious) var(--ids-comp-segmented-control-button-size-padding-x-spacious);gap:var(--ids-comp-segmented-control-button-size-gap-spacious);font-family:var(--ids-comp-segmented-control-button-typography-font-family-spacious);font-size:var(--ids-comp-segmented-control-button-typography-font-size-spacious);font-weight:var(--ids-comp-segmented-control-button-typography-font-weight-spacious);letter-spacing:var(--ids-comp-segmented-control-button-typography-letter-spacing-spacious);line-height:var(--ids-comp-segmented-control-button-typography-line-height-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item>button:focus-visible{outline-width:var(--ids-comp-segmented-control-focused-outline-size-outline-width-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item:first-of-type>button{border-top-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-spacious);border-bottom-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item:last-of-type>button{border-top-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-spacious);border-bottom-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item:not(:last-of-type)>button{border-right-width:0}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item .ids-icon{height:var(--ids-comp-segmented-control-button-size-icon-spacious);width:var(--ids-comp-segmented-control-button-size-icon-spacious);font-size:var(--ids-comp-segmented-control-button-icon-typography-font-size-spacious);font-weight:var(--ids-comp-segmented-control-button-icon-typography-font-weight-spacious);line-height:var(--ids-comp-segmented-control-button-icon-typography-line-height-spacious)}.ids-segmented-control.ids-segmented-control-dense{padding:var(--ids-comp-segmented-control-container-size-padding-y-dense) var(--ids-comp-segmented-control-container-size-padding-x-dense);gap:var(--ids-comp-segmented-control-container-size-gap-dense);border-top-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-dense);border-bottom-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-dense);border-top-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-dense);border-bottom-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item>button{border-width:var(--ids-comp-segmented-control-button-size-border-width-dense);padding:var(--ids-comp-segmented-control-button-size-padding-y-dense) var(--ids-comp-segmented-control-button-size-padding-x-dense);gap:var(--ids-comp-segmented-control-button-size-gap-dense);font-family:var(--ids-comp-segmented-control-button-typography-font-family-dense);font-size:var(--ids-comp-segmented-control-button-typography-font-size-dense);font-weight:var(--ids-comp-segmented-control-button-typography-font-weight-dense);letter-spacing:var(--ids-comp-segmented-control-button-typography-letter-spacing-dense);line-height:var(--ids-comp-segmented-control-button-typography-line-height-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item>button:focus-visible{outline-width:var(--ids-comp-segmented-control-focused-outline-size-outline-width-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item:first-of-type>button{border-top-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-dense);border-bottom-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item:last-of-type>button{border-top-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-dense);border-bottom-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item:not(:last-of-type)>button{border-right-width:0}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item .ids-icon{height:var(--ids-comp-segmented-control-button-size-icon-dense);width:var(--ids-comp-segmented-control-button-size-icon-dense);font-size:var(--ids-comp-segmented-control-button-icon-typography-font-size-dense);font-weight:var(--ids-comp-segmented-control-button-icon-typography-font-weight-dense);line-height:var(--ids-comp-segmented-control-button-icon-typography-line-height-dense)}.ids-segmented-control.ids-segmented-control-primary .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-primary .ids-segmented-control-item>button:focus-visible{outline-color:var(--ids-comp-segmented-control-focused-outline-color-dark-focused)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled{background-color:var(--ids-comp-segmented-control-container-filled-color-bg-primary-default);border-color:var(--ids-comp-segmented-control-container-filled-color-border-primary-default)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-primary-default);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-default);border-color:var(--ids-comp-segmented-control-button-filled-color-border-primary-default)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-default)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-filled-color-bg-primary-active);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-active);border-color:var(--ids-comp-segmented-control-button-filled-color-border-primary-active)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-active)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-primary-hovered);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-hovered);border-color:var(--ids-comp-segmented-control-button-filled-color-border-primary-hovered)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-hovered)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-primary-pressed);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-pressed);border-color:var(--ids-comp-segmented-control-button-filled-color-border-primary-pressed)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-pressed)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-primary-focused);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-focused);border-color:var(--ids-comp-segmented-control-button-filled-color-border-primary-focused)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-focused)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-primary-disabled);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-disabled);border-color:var(--ids-comp-segmented-control-button-filled-color-border-primary-disabled)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-disabled)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined{background-color:var(--ids-comp-segmented-control-container-outlined-color-bg-primary-default);border-color:var(--ids-comp-segmented-control-container-outlined-color-border-primary-default)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-default);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-default);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-default)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-default)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-active);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-active);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-active)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-active)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-hovered);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-hovered);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-hovered)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-hovered)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-pressed);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-pressed);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-pressed)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-pressed)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-focused);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-focused);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-focused)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-focused)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-disabled);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-disabled);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-disabled)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-disabled)}.ids-segmented-control.ids-segmented-control-surface .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-surface .ids-segmented-control-item>button:focus-visible{outline-color:var(--ids-comp-segmented-control-focused-outline-color-dark-focused)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled{background-color:var(--ids-comp-segmented-control-container-filled-color-bg-surface-default);border-color:var(--ids-comp-segmented-control-container-filled-color-border-surface-default)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-surface-default);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-default);border-color:var(--ids-comp-segmented-control-button-filled-color-border-surface-default)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-default)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-filled-color-bg-surface-active);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-active);border-color:var(--ids-comp-segmented-control-button-filled-color-border-surface-active)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-active)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-surface-hovered);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-hovered);border-color:var(--ids-comp-segmented-control-button-filled-color-border-surface-hovered)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-hovered)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-surface-pressed);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-pressed);border-color:var(--ids-comp-segmented-control-button-filled-color-border-surface-pressed)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-pressed)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-surface-focused);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-focused);border-color:var(--ids-comp-segmented-control-button-filled-color-border-surface-focused)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-focused)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-surface-disabled);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-disabled);border-color:var(--ids-comp-segmented-control-button-filled-color-border-surface-disabled)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-disabled)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined{background-color:var(--ids-comp-segmented-control-container-outlined-color-bg-surface-default);border-color:var(--ids-comp-segmented-control-container-outlined-color-border-surface-default)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-default);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-default);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-default)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-default)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-active);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-active);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-active)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-active)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-hovered);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-hovered);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-hovered)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-hovered)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-pressed);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-pressed);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-pressed)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-pressed)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-focused);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-focused);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-focused)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-focused)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-disabled);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-disabled);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-disabled)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-disabled)}.ids-segmented-control.ids-segmented-control-light .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-light .ids-segmented-control-item>button:focus-visible{outline-color:var(--ids-comp-segmented-control-focused-outline-color-light-focused)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled{background-color:var(--ids-comp-segmented-control-container-filled-color-bg-light-default);border-color:var(--ids-comp-segmented-control-container-filled-color-border-light-default)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-light-default);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-light-default);border-color:var(--ids-comp-segmented-control-button-filled-color-border-light-default)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-default)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-filled-color-bg-light-active);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-light-active);border-color:var(--ids-comp-segmented-control-button-filled-color-border-light-active)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-active)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-light-hovered);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-light-hovered);border-color:var(--ids-comp-segmented-control-button-filled-color-border-light-hovered)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-hovered)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-light-pressed);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-light-pressed);border-color:var(--ids-comp-segmented-control-button-filled-color-border-light-pressed)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-pressed)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-light-focused);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-light-focused);border-color:var(--ids-comp-segmented-control-button-filled-color-border-light-focused)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-focused)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-light-disabled);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-light-disabled);border-color:var(--ids-comp-segmented-control-button-filled-color-border-light-disabled)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-disabled)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined{background-color:var(--ids-comp-segmented-control-container-outlined-color-bg-light-default);border-color:var(--ids-comp-segmented-control-container-outlined-color-border-light-default)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-default);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-default);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-default)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-default)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-active);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-active);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-active)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-active)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-hovered);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-hovered);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-hovered)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-hovered)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-pressed);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-pressed);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-pressed)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-pressed)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-focused);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-focused);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-focused)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-focused)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-disabled);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-disabled);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-disabled)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-disabled)}.ids-segmented-control.ids-segmented-control-dark .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-dark .ids-segmented-control-item>button:focus-visible{outline-color:var(--ids-comp-segmented-control-focused-outline-color-dark-focused)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled{background-color:var(--ids-comp-segmented-control-container-filled-color-bg-dark-default);border-color:var(--ids-comp-segmented-control-container-filled-color-border-dark-default)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-dark-default);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-default);border-color:var(--ids-comp-segmented-control-button-filled-color-border-dark-default)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-default)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-filled-color-bg-dark-active);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-active);border-color:var(--ids-comp-segmented-control-button-filled-color-border-dark-active)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-active)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-dark-hovered);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-hovered);border-color:var(--ids-comp-segmented-control-button-filled-color-border-dark-hovered)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-hovered)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-dark-pressed);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-pressed);border-color:var(--ids-comp-segmented-control-button-filled-color-border-dark-pressed)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-pressed)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-dark-focused);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-focused);border-color:var(--ids-comp-segmented-control-button-filled-color-border-dark-focused)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-focused)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-filled-color-bg-dark-disabled);color:var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-disabled);border-color:var(--ids-comp-segmented-control-button-filled-color-border-dark-disabled)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-disabled)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined{background-color:var(--ids-comp-segmented-control-container-outlined-color-bg-dark-default);border-color:var(--ids-comp-segmented-control-container-outlined-color-border-dark-default)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-dark-default);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-default);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-dark-default)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-default)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-dark-active);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-active);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-dark-active)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-active)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-dark-hovered);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-hovered);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-dark-hovered)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-hovered)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-dark-pressed);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-pressed);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-dark-pressed)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-pressed)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-dark-focused);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-focused);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-dark-focused)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-focused)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-dark-disabled);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-disabled);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-dark-disabled)}.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-disabled)}
1
+ .ids-segmented-control{display:inline-flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.ids-segmented-control .ids-segmented-control-item>button{display:flex;align-items:center;border-style:solid;position:relative;text-wrap:nowrap}.ids-segmented-control .ids-segmented-control-item>button:focus,.ids-segmented-control .ids-segmented-control-item>button:focus-visible{z-index:1;outline-style:solid;outline-offset:2px}.ids-segmented-control .ids-segmented-control-item>button:not(:disabled){cursor:pointer}.ids-segmented-control .ids-segmented-control-item>button:disabled{cursor:not-allowed}.ids-segmented-control.ids-segmented-control-compact{padding:var(--ids-comp-segmented-control-container-size-padding-y-compact) var(--ids-comp-segmented-control-container-size-padding-x-compact);gap:var(--ids-comp-segmented-control-container-size-gap-compact);border-top-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-compact);border-bottom-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-compact);border-top-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-compact);border-bottom-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item>button{border-width:var(--ids-comp-segmented-control-button-size-border-width-compact);padding:var(--ids-comp-segmented-control-button-size-padding-y-compact) var(--ids-comp-segmented-control-button-size-padding-x-compact);gap:var(--ids-comp-segmented-control-button-size-gap-compact);font-family:var(--ids-comp-segmented-control-button-typography-font-family-compact);font-size:var(--ids-comp-segmented-control-button-typography-font-size-compact);font-weight:var(--ids-comp-segmented-control-button-typography-font-weight-compact);letter-spacing:var(--ids-comp-segmented-control-button-typography-letter-spacing-compact);line-height:var(--ids-comp-segmented-control-button-typography-line-height-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item>button:focus-visible{outline-width:var(--ids-comp-segmented-control-focused-outline-size-outline-width-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item:first-of-type>button{border-top-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-compact);border-bottom-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item:last-of-type>button{border-top-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-compact);border-bottom-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-compact)}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item:not(:last-of-type)>button{border-right-width:0}.ids-segmented-control.ids-segmented-control-compact .ids-segmented-control-item .ids-icon{height:var(--ids-comp-segmented-control-button-size-icon-compact);width:var(--ids-comp-segmented-control-button-size-icon-compact);font-size:var(--ids-comp-segmented-control-button-icon-typography-font-size-compact);font-weight:var(--ids-comp-segmented-control-button-icon-typography-font-weight-compact);line-height:var(--ids-comp-segmented-control-button-icon-typography-line-height-compact)}.ids-segmented-control.ids-segmented-control-comfortable{padding:var(--ids-comp-segmented-control-container-size-padding-y-comfortable) var(--ids-comp-segmented-control-container-size-padding-x-comfortable);gap:var(--ids-comp-segmented-control-container-size-gap-comfortable);border-top-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-comfortable);border-bottom-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-comfortable);border-top-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-comfortable);border-bottom-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item>button{border-width:var(--ids-comp-segmented-control-button-size-border-width-comfortable);padding:var(--ids-comp-segmented-control-button-size-padding-y-comfortable) var(--ids-comp-segmented-control-button-size-padding-x-comfortable);gap:var(--ids-comp-segmented-control-button-size-gap-comfortable);font-family:var(--ids-comp-segmented-control-button-typography-font-family-comfortable);font-size:var(--ids-comp-segmented-control-button-typography-font-size-comfortable);font-weight:var(--ids-comp-segmented-control-button-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-segmented-control-button-typography-letter-spacing-comfortable);line-height:var(--ids-comp-segmented-control-button-typography-line-height-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item>button:focus-visible{outline-width:var(--ids-comp-segmented-control-focused-outline-size-outline-width-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item:first-of-type>button{border-top-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-comfortable);border-bottom-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item:last-of-type>button{border-top-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-comfortable);border-bottom-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-comfortable)}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item:not(:last-of-type)>button{border-right-width:0}.ids-segmented-control.ids-segmented-control-comfortable .ids-segmented-control-item .ids-icon{height:var(--ids-comp-segmented-control-button-size-icon-comfortable);width:var(--ids-comp-segmented-control-button-size-icon-comfortable);font-size:var(--ids-comp-segmented-control-button-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-segmented-control-button-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-segmented-control-button-icon-typography-line-height-comfortable)}.ids-segmented-control.ids-segmented-control-spacious{padding:var(--ids-comp-segmented-control-container-size-padding-y-spacious) var(--ids-comp-segmented-control-container-size-padding-x-spacious);gap:var(--ids-comp-segmented-control-container-size-gap-spacious);border-top-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-spacious);border-bottom-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-spacious);border-top-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-spacious);border-bottom-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item>button{border-width:var(--ids-comp-segmented-control-button-size-border-width-spacious);padding:var(--ids-comp-segmented-control-button-size-padding-y-spacious) var(--ids-comp-segmented-control-button-size-padding-x-spacious);gap:var(--ids-comp-segmented-control-button-size-gap-spacious);font-family:var(--ids-comp-segmented-control-button-typography-font-family-spacious);font-size:var(--ids-comp-segmented-control-button-typography-font-size-spacious);font-weight:var(--ids-comp-segmented-control-button-typography-font-weight-spacious);letter-spacing:var(--ids-comp-segmented-control-button-typography-letter-spacing-spacious);line-height:var(--ids-comp-segmented-control-button-typography-line-height-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item>button:focus-visible{outline-width:var(--ids-comp-segmented-control-focused-outline-size-outline-width-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item:first-of-type>button{border-top-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-spacious);border-bottom-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item:last-of-type>button{border-top-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-spacious);border-bottom-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-spacious)}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item:not(:last-of-type)>button{border-right-width:0}.ids-segmented-control.ids-segmented-control-spacious .ids-segmented-control-item .ids-icon{height:var(--ids-comp-segmented-control-button-size-icon-spacious);width:var(--ids-comp-segmented-control-button-size-icon-spacious);font-size:var(--ids-comp-segmented-control-button-icon-typography-font-size-spacious);font-weight:var(--ids-comp-segmented-control-button-icon-typography-font-weight-spacious);line-height:var(--ids-comp-segmented-control-button-icon-typography-line-height-spacious)}.ids-segmented-control.ids-segmented-control-dense{padding:var(--ids-comp-segmented-control-container-size-padding-y-dense) var(--ids-comp-segmented-control-container-size-padding-x-dense);gap:var(--ids-comp-segmented-control-container-size-gap-dense);border-top-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-dense);border-bottom-left-radius:var(--ids-comp-segmented-control-container-size-border-radius-left-dense);border-top-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-dense);border-bottom-right-radius:var(--ids-comp-segmented-control-container-size-border-radius-right-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item>button{border-width:var(--ids-comp-segmented-control-button-size-border-width-dense);padding:var(--ids-comp-segmented-control-button-size-padding-y-dense) var(--ids-comp-segmented-control-button-size-padding-x-dense);gap:var(--ids-comp-segmented-control-button-size-gap-dense);font-family:var(--ids-comp-segmented-control-button-typography-font-family-dense);font-size:var(--ids-comp-segmented-control-button-typography-font-size-dense);font-weight:var(--ids-comp-segmented-control-button-typography-font-weight-dense);letter-spacing:var(--ids-comp-segmented-control-button-typography-letter-spacing-dense);line-height:var(--ids-comp-segmented-control-button-typography-line-height-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item>button:focus-visible{outline-width:var(--ids-comp-segmented-control-focused-outline-size-outline-width-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item:first-of-type>button{border-top-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-dense);border-bottom-left-radius:var(--ids-comp-segmented-control-button-size-border-radius-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item:last-of-type>button{border-top-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-dense);border-bottom-right-radius:var(--ids-comp-segmented-control-button-size-border-radius-dense)}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item:not(:last-of-type)>button{border-right-width:0}.ids-segmented-control.ids-segmented-control-dense .ids-segmented-control-item .ids-icon{height:var(--ids-comp-segmented-control-button-size-icon-dense);width:var(--ids-comp-segmented-control-button-size-icon-dense);font-size:var(--ids-comp-segmented-control-button-icon-typography-font-size-dense);font-weight:var(--ids-comp-segmented-control-button-icon-typography-font-weight-dense);line-height:var(--ids-comp-segmented-control-button-icon-typography-line-height-dense)}.ids-segmented-control.ids-segmented-control-primary .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-primary .ids-segmented-control-item>button:focus-visible{outline-color:var(--ids-comp-segmented-control-focused-outline-color-dark-focused)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined{background-color:var(--ids-comp-segmented-control-container-outlined-color-bg-surface-default);border-color:var(--ids-comp-segmented-control-container-outlined-color-border-surface-default)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-default);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-default);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-default)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-default)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-active);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-active);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-active)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-active)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-hovered);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-hovered);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-hovered)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-hovered)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-pressed);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-pressed);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-pressed)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-pressed)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-focused);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-focused);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-focused)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-focused)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-primary-disabled);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-disabled);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-primary-disabled)}.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-disabled)}.ids-segmented-control.ids-segmented-control-surface .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-surface .ids-segmented-control-item>button:focus-visible{outline-color:var(--ids-comp-segmented-control-focused-outline-color-dark-focused)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined{background-color:var(--ids-comp-segmented-control-container-outlined-color-bg-surface-default);border-color:var(--ids-comp-segmented-control-container-outlined-color-border-surface-default)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-default);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-default);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-default)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-default)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-active);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-active);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-active)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-active)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-hovered);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-hovered);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-hovered)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-hovered)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-pressed);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-pressed);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-pressed)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-pressed)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-focused);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-focused);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-focused)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-focused)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-surface-disabled);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-disabled);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-surface-disabled)}.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-disabled)}.ids-segmented-control.ids-segmented-control-light .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-light .ids-segmented-control-item>button:focus-visible{outline-color:var(--ids-comp-segmented-control-focused-outline-color-light-focused)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined{background-color:var(--ids-comp-segmented-control-container-outlined-color-bg-surface-default);border-color:var(--ids-comp-segmented-control-container-outlined-color-border-surface-default)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-default);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-default);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-default)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-default)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled){background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-active);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-active);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-active)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-active)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:hover{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-hovered);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-hovered);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-hovered)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-hovered)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:active{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-pressed);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-pressed);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-pressed)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-pressed)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus,.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-focused);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-focused);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-focused)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon,.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus-visible .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-focused)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled{background-color:var(--ids-comp-segmented-control-button-outlined-color-bg-light-disabled);color:var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-disabled);border-color:var(--ids-comp-segmented-control-button-outlined-color-border-light-disabled)}.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon{color:var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-disabled)}