@itcase/ui 1.8.159 → 1.8.161

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 (99) hide show
  1. package/dist/cjs/components/Modal.js +6 -6
  2. package/dist/components/Modal.js +6 -6
  3. package/dist/css/components/Accordion/Accordion.css +90 -10
  4. package/dist/css/components/Avatar/Avatar.css +219 -12
  5. package/dist/css/components/AvatarStack/AvatarStack.css +54 -8
  6. package/dist/css/components/Badge/Badge.css +1131 -25
  7. package/dist/css/components/Breadcrumbs/Breadcrumbs.css +27 -5
  8. package/dist/css/components/Button/Button.css +467 -21
  9. package/dist/css/components/Cell/Cell.css +31 -6
  10. package/dist/css/components/Checkbox/Checkbox.css +10896 -164
  11. package/dist/css/components/Checkmark/Checkmark.css +60 -9
  12. package/dist/css/components/Chips/Chips.css +53 -7
  13. package/dist/css/components/Choice/Choice.css +123 -13
  14. package/dist/css/components/Choice/css/__item/choice__item_size.css +78 -8
  15. package/dist/css/components/Code/Code.css +55 -11
  16. package/dist/css/components/DatePeriod/DatePeriod.css +61 -11
  17. package/dist/css/components/Divider/Divider.css +35 -15
  18. package/dist/css/components/Dot/Dot.css +41 -7
  19. package/dist/css/components/Dropdown/Dropdown.css +66 -10
  20. package/dist/css/components/Flex/Flex.css +239 -40
  21. package/dist/css/components/Flex/css/__item/flex__item_align.css +51 -8
  22. package/dist/css/components/Flex/css/__item/flex__item_direction.css +11 -4
  23. package/dist/css/components/Flex/css/__item/flex__item_grow.css +5 -4
  24. package/dist/css/components/Flex/css/__item/flex__item_justify-content.css +17 -4
  25. package/dist/css/components/Grid/Grid.css +2207 -106
  26. package/dist/css/components/Grid/css/__item/grid__item_align-self.css +53 -4
  27. package/dist/css/components/Grid/css/__item/grid__item_column.css +270 -9
  28. package/dist/css/components/Grid/css/__item/grid__item_justify-self.css +66 -8
  29. package/dist/css/components/Grid/css/__item/grid__item_row.css +270 -9
  30. package/dist/css/components/Group/Group.css +5220 -117
  31. package/dist/css/components/HeroTitle/HeroTitle.css +27 -4
  32. package/dist/css/components/Icon/Icon.css +7601 -99
  33. package/dist/css/components/Input/Input.css +42 -10
  34. package/dist/css/components/InputPassword/InputPassword.css +42 -10
  35. package/dist/css/components/Label/Label.css +34 -6
  36. package/dist/css/components/Link/Link.css +14 -4
  37. package/dist/css/components/List/List.css +425 -23
  38. package/dist/css/components/Loader/Loader.css +79 -9
  39. package/dist/css/components/Logo/Logo.css +84 -13
  40. package/dist/css/components/MenuItem/MenuItem.css +105 -15
  41. package/dist/css/components/Modal/Modal.css +103 -9
  42. package/dist/css/components/Notification/Notification.css +39 -5
  43. package/dist/css/components/Notification/css/__item/notification__item_size.css +39 -5
  44. package/dist/css/components/Pagination/Pagination.css +82 -19
  45. package/dist/css/components/Pagination/css/__item/pagination__item.css +11 -4
  46. package/dist/css/components/Pagination/css/__item/pagination__item_size.css +15 -5
  47. package/dist/css/components/Radio/Radio.css +11019 -155
  48. package/dist/css/components/RangeSlider/RangeSlider.css +2584 -64
  49. package/dist/css/components/ScrollToView/ScrollToView.css +1974 -10
  50. package/dist/css/components/Search/Search.css +34 -6
  51. package/dist/css/components/Search/css/search-input/search-input_size.css +34 -6
  52. package/dist/css/components/Segmented/Segmented.css +60 -8
  53. package/dist/css/components/Segmented/css/__item/segmaented__item.css +60 -8
  54. package/dist/css/components/Select/Select.css +456 -25
  55. package/dist/css/components/Select/css/__input-container/select__input-container.css +369 -12
  56. package/dist/css/components/Select/css/__menu/select__menu-list-item_size.css +20 -4
  57. package/dist/css/components/Switch/Switch.css +53 -7
  58. package/dist/css/components/Tab/Tab.css +79 -10
  59. package/dist/css/components/Text/Text.css +61 -12
  60. package/dist/css/components/Textarea/Textarea.css +32 -4
  61. package/dist/css/components/Tile/Tile.css +49 -6
  62. package/dist/css/components/Title/Title.css +53 -5
  63. package/dist/css/components/Tooltip/Tooltip.css +21 -5
  64. package/dist/css/components/Warning/Warning.css +6 -8
  65. package/dist/css/styles/align/align.css +20 -3
  66. package/dist/css/styles/align/align_horizontal-reverse.css +188 -4
  67. package/dist/css/styles/align/align_horizontal.css +188 -4
  68. package/dist/css/styles/align/align_vertical-reverse.css +176 -4
  69. package/dist/css/styles/align/align_vertical.css +176 -4
  70. package/dist/css/styles/align-items/align-items.css +16 -3
  71. package/dist/css/styles/align-self/align-self.css +17 -4
  72. package/dist/css/styles/blur/blur.css +78 -5
  73. package/dist/css/styles/border/border.css +224 -10
  74. package/dist/css/styles/border-color/border-color.css +24322 -53
  75. package/dist/css/styles/border-width/border-width.css +52 -4
  76. package/dist/css/styles/bundle.css +96767 -7865
  77. package/dist/css/styles/caret-color/caret-color.css +276 -8
  78. package/dist/css/styles/cursor/cursor.css +21 -5
  79. package/dist/css/styles/elevation/elevation.css +23 -4
  80. package/dist/css/styles/elevation/elevation_hover.css +37 -4
  81. package/dist/css/styles/fill/fill.css +7646 -70
  82. package/dist/css/styles/fill/fill_gradient.css +519 -12
  83. package/dist/css/styles/flex/flex-grow.css +5 -4
  84. package/dist/css/styles/hover/hover-fill-color.css +836 -9
  85. package/dist/css/styles/hover/hover-item-color.css +1074 -9
  86. package/dist/css/styles/hover/hover-text-color.css +1074 -9
  87. package/dist/css/styles/justify-content/justify-content.css +32 -4
  88. package/dist/css/styles/opacity/opacity.css +70 -5
  89. package/dist/css/styles/placeholder-text-color/placeholder-text-color.css +354 -8
  90. package/dist/css/styles/svg-color/svg_fill.css +1018 -9
  91. package/dist/css/styles/svg-color/svg_fill_hover.css +471 -8
  92. package/dist/css/styles/svg-color/svg_path_fill.css +354 -8
  93. package/dist/css/styles/text-align/text-align.css +8 -4
  94. package/dist/css/styles/text-color/text-color.css +3570 -45
  95. package/dist/css/styles/text-decoration/text-decoration.css +5 -4
  96. package/dist/css/styles/text-gradient/text-gradient.css +1182 -12
  97. package/dist/css/styles/text-style/text-style.css +5 -4
  98. package/dist/css/styles/text-weight/text-weight.css +147 -7
  99. package/package.json +7 -7
@@ -311,107 +311,2627 @@
311
311
  }
312
312
  }
313
313
  .range-slider-rail-fill {
314
- @each $type in accent, primary, secondary, tertiary, surface, success, error {
315
- &_$(type) {
316
- @each $color in primary, secondary, tertiary, quaternary, quinary, senary,
317
- accent, disabled, hover {
318
- &-$(color) {
314
+ &_accent {
315
+ &-primary {
319
316
  & .rc-slider-rail {
320
- background: var(--color-$(type)-fill-$(color));
317
+ background: var(--color-accent-fill-primary);
318
+ }
319
+ }
320
+ &-secondary {
321
+ & .rc-slider-rail {
322
+ background: var(--color-accent-fill-secondary);
323
+ }
324
+ }
325
+ &-tertiary {
326
+ & .rc-slider-rail {
327
+ background: var(--color-accent-fill-tertiary);
328
+ }
329
+ }
330
+ &-quaternary {
331
+ & .rc-slider-rail {
332
+ background: var(--color-accent-fill-quaternary);
333
+ }
334
+ }
335
+ &-quinary {
336
+ & .rc-slider-rail {
337
+ background: var(--color-accent-fill-quinary);
338
+ }
339
+ }
340
+ &-senary {
341
+ & .rc-slider-rail {
342
+ background: var(--color-accent-fill-senary);
343
+ }
344
+ }
345
+ &-accent {
346
+ & .rc-slider-rail {
347
+ background: var(--color-accent-fill-accent);
348
+ }
349
+ }
350
+ &-disabled {
351
+ & .rc-slider-rail {
352
+ background: var(--color-accent-fill-disabled);
353
+ }
354
+ }
355
+ &-hover {
356
+ & .rc-slider-rail {
357
+ background: var(--color-accent-fill-hover);
358
+ }
359
+ }
360
+ }
361
+ &_primary {
362
+ &-primary {
363
+ & .rc-slider-rail {
364
+ background: var(--color-primary-fill-primary);
365
+ }
366
+ }
367
+ &-secondary {
368
+ & .rc-slider-rail {
369
+ background: var(--color-primary-fill-secondary);
370
+ }
371
+ }
372
+ &-tertiary {
373
+ & .rc-slider-rail {
374
+ background: var(--color-primary-fill-tertiary);
375
+ }
376
+ }
377
+ &-quaternary {
378
+ & .rc-slider-rail {
379
+ background: var(--color-primary-fill-quaternary);
380
+ }
381
+ }
382
+ &-quinary {
383
+ & .rc-slider-rail {
384
+ background: var(--color-primary-fill-quinary);
385
+ }
386
+ }
387
+ &-senary {
388
+ & .rc-slider-rail {
389
+ background: var(--color-primary-fill-senary);
390
+ }
391
+ }
392
+ &-accent {
393
+ & .rc-slider-rail {
394
+ background: var(--color-primary-fill-accent);
395
+ }
396
+ }
397
+ &-disabled {
398
+ & .rc-slider-rail {
399
+ background: var(--color-primary-fill-disabled);
400
+ }
401
+ }
402
+ &-hover {
403
+ & .rc-slider-rail {
404
+ background: var(--color-primary-fill-hover);
405
+ }
406
+ }
407
+ }
408
+ &_secondary {
409
+ &-primary {
410
+ & .rc-slider-rail {
411
+ background: var(--color-secondary-fill-primary);
412
+ }
413
+ }
414
+ &-secondary {
415
+ & .rc-slider-rail {
416
+ background: var(--color-secondary-fill-secondary);
417
+ }
418
+ }
419
+ &-tertiary {
420
+ & .rc-slider-rail {
421
+ background: var(--color-secondary-fill-tertiary);
422
+ }
423
+ }
424
+ &-quaternary {
425
+ & .rc-slider-rail {
426
+ background: var(--color-secondary-fill-quaternary);
427
+ }
428
+ }
429
+ &-quinary {
430
+ & .rc-slider-rail {
431
+ background: var(--color-secondary-fill-quinary);
432
+ }
433
+ }
434
+ &-senary {
435
+ & .rc-slider-rail {
436
+ background: var(--color-secondary-fill-senary);
437
+ }
438
+ }
439
+ &-accent {
440
+ & .rc-slider-rail {
441
+ background: var(--color-secondary-fill-accent);
442
+ }
443
+ }
444
+ &-disabled {
445
+ & .rc-slider-rail {
446
+ background: var(--color-secondary-fill-disabled);
447
+ }
448
+ }
449
+ &-hover {
450
+ & .rc-slider-rail {
451
+ background: var(--color-secondary-fill-hover);
452
+ }
453
+ }
454
+ }
455
+ &_tertiary {
456
+ &-primary {
457
+ & .rc-slider-rail {
458
+ background: var(--color-tertiary-fill-primary);
459
+ }
460
+ }
461
+ &-secondary {
462
+ & .rc-slider-rail {
463
+ background: var(--color-tertiary-fill-secondary);
464
+ }
465
+ }
466
+ &-tertiary {
467
+ & .rc-slider-rail {
468
+ background: var(--color-tertiary-fill-tertiary);
469
+ }
470
+ }
471
+ &-quaternary {
472
+ & .rc-slider-rail {
473
+ background: var(--color-tertiary-fill-quaternary);
474
+ }
475
+ }
476
+ &-quinary {
477
+ & .rc-slider-rail {
478
+ background: var(--color-tertiary-fill-quinary);
479
+ }
480
+ }
481
+ &-senary {
482
+ & .rc-slider-rail {
483
+ background: var(--color-tertiary-fill-senary);
484
+ }
485
+ }
486
+ &-accent {
487
+ & .rc-slider-rail {
488
+ background: var(--color-tertiary-fill-accent);
489
+ }
490
+ }
491
+ &-disabled {
492
+ & .rc-slider-rail {
493
+ background: var(--color-tertiary-fill-disabled);
494
+ }
495
+ }
496
+ &-hover {
497
+ & .rc-slider-rail {
498
+ background: var(--color-tertiary-fill-hover);
499
+ }
500
+ }
501
+ }
502
+ &_surface {
503
+ &-primary {
504
+ & .rc-slider-rail {
505
+ background: var(--color-surface-fill-primary);
506
+ }
507
+ }
508
+ &-secondary {
509
+ & .rc-slider-rail {
510
+ background: var(--color-surface-fill-secondary);
511
+ }
512
+ }
513
+ &-tertiary {
514
+ & .rc-slider-rail {
515
+ background: var(--color-surface-fill-tertiary);
516
+ }
517
+ }
518
+ &-quaternary {
519
+ & .rc-slider-rail {
520
+ background: var(--color-surface-fill-quaternary);
521
+ }
522
+ }
523
+ &-quinary {
524
+ & .rc-slider-rail {
525
+ background: var(--color-surface-fill-quinary);
526
+ }
527
+ }
528
+ &-senary {
529
+ & .rc-slider-rail {
530
+ background: var(--color-surface-fill-senary);
531
+ }
532
+ }
533
+ &-accent {
534
+ & .rc-slider-rail {
535
+ background: var(--color-surface-fill-accent);
536
+ }
537
+ }
538
+ &-disabled {
539
+ & .rc-slider-rail {
540
+ background: var(--color-surface-fill-disabled);
541
+ }
542
+ }
543
+ &-hover {
544
+ & .rc-slider-rail {
545
+ background: var(--color-surface-fill-hover);
546
+ }
547
+ }
548
+ }
549
+ &_success {
550
+ &-primary {
551
+ & .rc-slider-rail {
552
+ background: var(--color-success-fill-primary);
553
+ }
554
+ }
555
+ &-secondary {
556
+ & .rc-slider-rail {
557
+ background: var(--color-success-fill-secondary);
558
+ }
559
+ }
560
+ &-tertiary {
561
+ & .rc-slider-rail {
562
+ background: var(--color-success-fill-tertiary);
563
+ }
564
+ }
565
+ &-quaternary {
566
+ & .rc-slider-rail {
567
+ background: var(--color-success-fill-quaternary);
568
+ }
569
+ }
570
+ &-quinary {
571
+ & .rc-slider-rail {
572
+ background: var(--color-success-fill-quinary);
573
+ }
574
+ }
575
+ &-senary {
576
+ & .rc-slider-rail {
577
+ background: var(--color-success-fill-senary);
578
+ }
579
+ }
580
+ &-accent {
581
+ & .rc-slider-rail {
582
+ background: var(--color-success-fill-accent);
583
+ }
584
+ }
585
+ &-disabled {
586
+ & .rc-slider-rail {
587
+ background: var(--color-success-fill-disabled);
588
+ }
589
+ }
590
+ &-hover {
591
+ & .rc-slider-rail {
592
+ background: var(--color-success-fill-hover);
593
+ }
594
+ }
595
+ }
596
+ &_error {
597
+ &-primary {
598
+ & .rc-slider-rail {
599
+ background: var(--color-error-fill-primary);
600
+ }
601
+ }
602
+ &-secondary {
603
+ & .rc-slider-rail {
604
+ background: var(--color-error-fill-secondary);
605
+ }
606
+ }
607
+ &-tertiary {
608
+ & .rc-slider-rail {
609
+ background: var(--color-error-fill-tertiary);
610
+ }
611
+ }
612
+ &-quaternary {
613
+ & .rc-slider-rail {
614
+ background: var(--color-error-fill-quaternary);
615
+ }
616
+ }
617
+ &-quinary {
618
+ & .rc-slider-rail {
619
+ background: var(--color-error-fill-quinary);
620
+ }
621
+ }
622
+ &-senary {
623
+ & .rc-slider-rail {
624
+ background: var(--color-error-fill-senary);
625
+ }
626
+ }
627
+ &-accent {
628
+ & .rc-slider-rail {
629
+ background: var(--color-error-fill-accent);
630
+ }
631
+ }
632
+ &-disabled {
633
+ & .rc-slider-rail {
634
+ background: var(--color-error-fill-disabled);
635
+ }
636
+ }
637
+ &-hover {
638
+ & .rc-slider-rail {
639
+ background: var(--color-error-fill-hover);
321
640
  }
322
641
  }
323
- }
324
642
  }
325
- }
326
643
  }
327
644
  .range-slider-track-fill {
328
- @each $type in accent, primary, secondary, tertiary, surface, success, error {
329
- &_$(type) {
645
+ &_accent {
646
+ &-item {
647
+ &-primary {
648
+ & .rc-slider-track {
649
+ background: var(--color-accent-item-primary);
650
+ }
651
+ }
652
+ &-secondary {
653
+ & .rc-slider-track {
654
+ background: var(--color-accent-item-secondary);
655
+ }
656
+ }
657
+ &-tertiary {
658
+ & .rc-slider-track {
659
+ background: var(--color-accent-item-tertiary);
660
+ }
661
+ }
662
+ &-quaternary {
663
+ & .rc-slider-track {
664
+ background: var(--color-accent-item-quaternary);
665
+ }
666
+ }
667
+ &-quinary {
668
+ & .rc-slider-track {
669
+ background: var(--color-accent-item-quinary);
670
+ }
671
+ }
672
+ &-senary {
673
+ & .rc-slider-track {
674
+ background: var(--color-accent-item-senary);
675
+ }
676
+ }
677
+ &-accent {
678
+ & .rc-slider-track {
679
+ background: var(--color-accent-item-accent);
680
+ }
681
+ }
682
+ &-disabled {
683
+ & .rc-slider-track {
684
+ background: var(--color-accent-item-disabled);
685
+ }
686
+ }
687
+ &-hover {
688
+ & .rc-slider-track {
689
+ background: var(--color-accent-item-hover);
690
+ }
691
+ }
692
+ }
693
+ }
694
+ &_primary {
330
695
  &-item {
331
- @each $color in primary, secondary, tertiary, quaternary, quinary,
332
- senary, accent, disabled, hover {
333
- &-$(color) {
696
+ &-primary {
334
697
  & .rc-slider-track {
335
- background: var(--color-$(type)-item-$(color));
698
+ background: var(--color-primary-item-primary);
699
+ }
700
+ }
701
+ &-secondary {
702
+ & .rc-slider-track {
703
+ background: var(--color-primary-item-secondary);
704
+ }
705
+ }
706
+ &-tertiary {
707
+ & .rc-slider-track {
708
+ background: var(--color-primary-item-tertiary);
709
+ }
710
+ }
711
+ &-quaternary {
712
+ & .rc-slider-track {
713
+ background: var(--color-primary-item-quaternary);
714
+ }
715
+ }
716
+ &-quinary {
717
+ & .rc-slider-track {
718
+ background: var(--color-primary-item-quinary);
719
+ }
720
+ }
721
+ &-senary {
722
+ & .rc-slider-track {
723
+ background: var(--color-primary-item-senary);
724
+ }
725
+ }
726
+ &-accent {
727
+ & .rc-slider-track {
728
+ background: var(--color-primary-item-accent);
729
+ }
730
+ }
731
+ &-disabled {
732
+ & .rc-slider-track {
733
+ background: var(--color-primary-item-disabled);
734
+ }
735
+ }
736
+ &-hover {
737
+ & .rc-slider-track {
738
+ background: var(--color-primary-item-hover);
739
+ }
740
+ }
741
+ }
742
+ }
743
+ &_secondary {
744
+ &-item {
745
+ &-primary {
746
+ & .rc-slider-track {
747
+ background: var(--color-secondary-item-primary);
748
+ }
749
+ }
750
+ &-secondary {
751
+ & .rc-slider-track {
752
+ background: var(--color-secondary-item-secondary);
753
+ }
754
+ }
755
+ &-tertiary {
756
+ & .rc-slider-track {
757
+ background: var(--color-secondary-item-tertiary);
758
+ }
759
+ }
760
+ &-quaternary {
761
+ & .rc-slider-track {
762
+ background: var(--color-secondary-item-quaternary);
763
+ }
764
+ }
765
+ &-quinary {
766
+ & .rc-slider-track {
767
+ background: var(--color-secondary-item-quinary);
768
+ }
769
+ }
770
+ &-senary {
771
+ & .rc-slider-track {
772
+ background: var(--color-secondary-item-senary);
773
+ }
774
+ }
775
+ &-accent {
776
+ & .rc-slider-track {
777
+ background: var(--color-secondary-item-accent);
778
+ }
779
+ }
780
+ &-disabled {
781
+ & .rc-slider-track {
782
+ background: var(--color-secondary-item-disabled);
783
+ }
784
+ }
785
+ &-hover {
786
+ & .rc-slider-track {
787
+ background: var(--color-secondary-item-hover);
788
+ }
789
+ }
790
+ }
791
+ }
792
+ &_tertiary {
793
+ &-item {
794
+ &-primary {
795
+ & .rc-slider-track {
796
+ background: var(--color-tertiary-item-primary);
797
+ }
798
+ }
799
+ &-secondary {
800
+ & .rc-slider-track {
801
+ background: var(--color-tertiary-item-secondary);
802
+ }
803
+ }
804
+ &-tertiary {
805
+ & .rc-slider-track {
806
+ background: var(--color-tertiary-item-tertiary);
807
+ }
808
+ }
809
+ &-quaternary {
810
+ & .rc-slider-track {
811
+ background: var(--color-tertiary-item-quaternary);
812
+ }
813
+ }
814
+ &-quinary {
815
+ & .rc-slider-track {
816
+ background: var(--color-tertiary-item-quinary);
817
+ }
818
+ }
819
+ &-senary {
820
+ & .rc-slider-track {
821
+ background: var(--color-tertiary-item-senary);
822
+ }
823
+ }
824
+ &-accent {
825
+ & .rc-slider-track {
826
+ background: var(--color-tertiary-item-accent);
827
+ }
828
+ }
829
+ &-disabled {
830
+ & .rc-slider-track {
831
+ background: var(--color-tertiary-item-disabled);
832
+ }
833
+ }
834
+ &-hover {
835
+ & .rc-slider-track {
836
+ background: var(--color-tertiary-item-hover);
837
+ }
838
+ }
839
+ }
840
+ }
841
+ &_surface {
842
+ &-item {
843
+ &-primary {
844
+ & .rc-slider-track {
845
+ background: var(--color-surface-item-primary);
846
+ }
847
+ }
848
+ &-secondary {
849
+ & .rc-slider-track {
850
+ background: var(--color-surface-item-secondary);
851
+ }
852
+ }
853
+ &-tertiary {
854
+ & .rc-slider-track {
855
+ background: var(--color-surface-item-tertiary);
856
+ }
857
+ }
858
+ &-quaternary {
859
+ & .rc-slider-track {
860
+ background: var(--color-surface-item-quaternary);
861
+ }
862
+ }
863
+ &-quinary {
864
+ & .rc-slider-track {
865
+ background: var(--color-surface-item-quinary);
866
+ }
867
+ }
868
+ &-senary {
869
+ & .rc-slider-track {
870
+ background: var(--color-surface-item-senary);
871
+ }
872
+ }
873
+ &-accent {
874
+ & .rc-slider-track {
875
+ background: var(--color-surface-item-accent);
876
+ }
877
+ }
878
+ &-disabled {
879
+ & .rc-slider-track {
880
+ background: var(--color-surface-item-disabled);
881
+ }
882
+ }
883
+ &-hover {
884
+ & .rc-slider-track {
885
+ background: var(--color-surface-item-hover);
886
+ }
887
+ }
888
+ }
889
+ }
890
+ &_success {
891
+ &-item {
892
+ &-primary {
893
+ & .rc-slider-track {
894
+ background: var(--color-success-item-primary);
895
+ }
896
+ }
897
+ &-secondary {
898
+ & .rc-slider-track {
899
+ background: var(--color-success-item-secondary);
900
+ }
901
+ }
902
+ &-tertiary {
903
+ & .rc-slider-track {
904
+ background: var(--color-success-item-tertiary);
905
+ }
906
+ }
907
+ &-quaternary {
908
+ & .rc-slider-track {
909
+ background: var(--color-success-item-quaternary);
910
+ }
911
+ }
912
+ &-quinary {
913
+ & .rc-slider-track {
914
+ background: var(--color-success-item-quinary);
915
+ }
916
+ }
917
+ &-senary {
918
+ & .rc-slider-track {
919
+ background: var(--color-success-item-senary);
920
+ }
921
+ }
922
+ &-accent {
923
+ & .rc-slider-track {
924
+ background: var(--color-success-item-accent);
925
+ }
926
+ }
927
+ &-disabled {
928
+ & .rc-slider-track {
929
+ background: var(--color-success-item-disabled);
930
+ }
931
+ }
932
+ &-hover {
933
+ & .rc-slider-track {
934
+ background: var(--color-success-item-hover);
935
+ }
936
+ }
937
+ }
938
+ }
939
+ &_error {
940
+ &-item {
941
+ &-primary {
942
+ & .rc-slider-track {
943
+ background: var(--color-error-item-primary);
944
+ }
945
+ }
946
+ &-secondary {
947
+ & .rc-slider-track {
948
+ background: var(--color-error-item-secondary);
949
+ }
950
+ }
951
+ &-tertiary {
952
+ & .rc-slider-track {
953
+ background: var(--color-error-item-tertiary);
954
+ }
955
+ }
956
+ &-quaternary {
957
+ & .rc-slider-track {
958
+ background: var(--color-error-item-quaternary);
959
+ }
960
+ }
961
+ &-quinary {
962
+ & .rc-slider-track {
963
+ background: var(--color-error-item-quinary);
964
+ }
965
+ }
966
+ &-senary {
967
+ & .rc-slider-track {
968
+ background: var(--color-error-item-senary);
969
+ }
970
+ }
971
+ &-accent {
972
+ & .rc-slider-track {
973
+ background: var(--color-error-item-accent);
974
+ }
975
+ }
976
+ &-disabled {
977
+ & .rc-slider-track {
978
+ background: var(--color-error-item-disabled);
979
+ }
980
+ }
981
+ &-hover {
982
+ & .rc-slider-track {
983
+ background: var(--color-error-item-hover);
984
+ }
985
+ }
986
+ }
987
+ }
988
+ }
989
+ .range-slider-handle-fill {
990
+ &_accent {
991
+ &-item {
992
+ &-primary {
993
+ & .rc-slider-handle {
994
+ background: var(--color-accent-item-primary);
995
+ }
996
+ }
997
+ &-secondary {
998
+ & .rc-slider-handle {
999
+ background: var(--color-accent-item-secondary);
1000
+ }
1001
+ }
1002
+ &-tertiary {
1003
+ & .rc-slider-handle {
1004
+ background: var(--color-accent-item-tertiary);
1005
+ }
1006
+ }
1007
+ &-quaternary {
1008
+ & .rc-slider-handle {
1009
+ background: var(--color-accent-item-quaternary);
1010
+ }
1011
+ }
1012
+ &-quinary {
1013
+ & .rc-slider-handle {
1014
+ background: var(--color-accent-item-quinary);
1015
+ }
1016
+ }
1017
+ &-senary {
1018
+ & .rc-slider-handle {
1019
+ background: var(--color-accent-item-senary);
1020
+ }
1021
+ }
1022
+ &-accent {
1023
+ & .rc-slider-handle {
1024
+ background: var(--color-accent-item-accent);
1025
+ }
1026
+ }
1027
+ &-disabled {
1028
+ & .rc-slider-handle {
1029
+ background: var(--color-accent-item-disabled);
1030
+ }
1031
+ }
1032
+ &-hover {
1033
+ & .rc-slider-handle {
1034
+ background: var(--color-accent-item-hover);
1035
+ }
1036
+ }
1037
+ }
1038
+ }
1039
+ &_primary {
1040
+ &-item {
1041
+ &-primary {
1042
+ & .rc-slider-handle {
1043
+ background: var(--color-primary-item-primary);
1044
+ }
1045
+ }
1046
+ &-secondary {
1047
+ & .rc-slider-handle {
1048
+ background: var(--color-primary-item-secondary);
1049
+ }
1050
+ }
1051
+ &-tertiary {
1052
+ & .rc-slider-handle {
1053
+ background: var(--color-primary-item-tertiary);
1054
+ }
1055
+ }
1056
+ &-quaternary {
1057
+ & .rc-slider-handle {
1058
+ background: var(--color-primary-item-quaternary);
1059
+ }
1060
+ }
1061
+ &-quinary {
1062
+ & .rc-slider-handle {
1063
+ background: var(--color-primary-item-quinary);
1064
+ }
1065
+ }
1066
+ &-senary {
1067
+ & .rc-slider-handle {
1068
+ background: var(--color-primary-item-senary);
1069
+ }
1070
+ }
1071
+ &-accent {
1072
+ & .rc-slider-handle {
1073
+ background: var(--color-primary-item-accent);
1074
+ }
1075
+ }
1076
+ &-disabled {
1077
+ & .rc-slider-handle {
1078
+ background: var(--color-primary-item-disabled);
1079
+ }
1080
+ }
1081
+ &-hover {
1082
+ & .rc-slider-handle {
1083
+ background: var(--color-primary-item-hover);
1084
+ }
1085
+ }
1086
+ }
1087
+ }
1088
+ &_secondary {
1089
+ &-item {
1090
+ &-primary {
1091
+ & .rc-slider-handle {
1092
+ background: var(--color-secondary-item-primary);
1093
+ }
1094
+ }
1095
+ &-secondary {
1096
+ & .rc-slider-handle {
1097
+ background: var(--color-secondary-item-secondary);
1098
+ }
1099
+ }
1100
+ &-tertiary {
1101
+ & .rc-slider-handle {
1102
+ background: var(--color-secondary-item-tertiary);
1103
+ }
1104
+ }
1105
+ &-quaternary {
1106
+ & .rc-slider-handle {
1107
+ background: var(--color-secondary-item-quaternary);
1108
+ }
1109
+ }
1110
+ &-quinary {
1111
+ & .rc-slider-handle {
1112
+ background: var(--color-secondary-item-quinary);
1113
+ }
1114
+ }
1115
+ &-senary {
1116
+ & .rc-slider-handle {
1117
+ background: var(--color-secondary-item-senary);
1118
+ }
1119
+ }
1120
+ &-accent {
1121
+ & .rc-slider-handle {
1122
+ background: var(--color-secondary-item-accent);
1123
+ }
1124
+ }
1125
+ &-disabled {
1126
+ & .rc-slider-handle {
1127
+ background: var(--color-secondary-item-disabled);
1128
+ }
1129
+ }
1130
+ &-hover {
1131
+ & .rc-slider-handle {
1132
+ background: var(--color-secondary-item-hover);
1133
+ }
1134
+ }
1135
+ }
1136
+ }
1137
+ &_tertiary {
1138
+ &-item {
1139
+ &-primary {
1140
+ & .rc-slider-handle {
1141
+ background: var(--color-tertiary-item-primary);
1142
+ }
1143
+ }
1144
+ &-secondary {
1145
+ & .rc-slider-handle {
1146
+ background: var(--color-tertiary-item-secondary);
1147
+ }
1148
+ }
1149
+ &-tertiary {
1150
+ & .rc-slider-handle {
1151
+ background: var(--color-tertiary-item-tertiary);
1152
+ }
1153
+ }
1154
+ &-quaternary {
1155
+ & .rc-slider-handle {
1156
+ background: var(--color-tertiary-item-quaternary);
1157
+ }
1158
+ }
1159
+ &-quinary {
1160
+ & .rc-slider-handle {
1161
+ background: var(--color-tertiary-item-quinary);
1162
+ }
1163
+ }
1164
+ &-senary {
1165
+ & .rc-slider-handle {
1166
+ background: var(--color-tertiary-item-senary);
1167
+ }
1168
+ }
1169
+ &-accent {
1170
+ & .rc-slider-handle {
1171
+ background: var(--color-tertiary-item-accent);
1172
+ }
1173
+ }
1174
+ &-disabled {
1175
+ & .rc-slider-handle {
1176
+ background: var(--color-tertiary-item-disabled);
1177
+ }
1178
+ }
1179
+ &-hover {
1180
+ & .rc-slider-handle {
1181
+ background: var(--color-tertiary-item-hover);
1182
+ }
1183
+ }
1184
+ }
1185
+ }
1186
+ &_surface {
1187
+ &-item {
1188
+ &-primary {
1189
+ & .rc-slider-handle {
1190
+ background: var(--color-surface-item-primary);
1191
+ }
1192
+ }
1193
+ &-secondary {
1194
+ & .rc-slider-handle {
1195
+ background: var(--color-surface-item-secondary);
1196
+ }
1197
+ }
1198
+ &-tertiary {
1199
+ & .rc-slider-handle {
1200
+ background: var(--color-surface-item-tertiary);
1201
+ }
1202
+ }
1203
+ &-quaternary {
1204
+ & .rc-slider-handle {
1205
+ background: var(--color-surface-item-quaternary);
1206
+ }
1207
+ }
1208
+ &-quinary {
1209
+ & .rc-slider-handle {
1210
+ background: var(--color-surface-item-quinary);
1211
+ }
1212
+ }
1213
+ &-senary {
1214
+ & .rc-slider-handle {
1215
+ background: var(--color-surface-item-senary);
1216
+ }
1217
+ }
1218
+ &-accent {
1219
+ & .rc-slider-handle {
1220
+ background: var(--color-surface-item-accent);
1221
+ }
1222
+ }
1223
+ &-disabled {
1224
+ & .rc-slider-handle {
1225
+ background: var(--color-surface-item-disabled);
1226
+ }
1227
+ }
1228
+ &-hover {
1229
+ & .rc-slider-handle {
1230
+ background: var(--color-surface-item-hover);
1231
+ }
1232
+ }
1233
+ }
1234
+ }
1235
+ &_success {
1236
+ &-item {
1237
+ &-primary {
1238
+ & .rc-slider-handle {
1239
+ background: var(--color-success-item-primary);
1240
+ }
1241
+ }
1242
+ &-secondary {
1243
+ & .rc-slider-handle {
1244
+ background: var(--color-success-item-secondary);
1245
+ }
1246
+ }
1247
+ &-tertiary {
1248
+ & .rc-slider-handle {
1249
+ background: var(--color-success-item-tertiary);
1250
+ }
1251
+ }
1252
+ &-quaternary {
1253
+ & .rc-slider-handle {
1254
+ background: var(--color-success-item-quaternary);
1255
+ }
1256
+ }
1257
+ &-quinary {
1258
+ & .rc-slider-handle {
1259
+ background: var(--color-success-item-quinary);
1260
+ }
1261
+ }
1262
+ &-senary {
1263
+ & .rc-slider-handle {
1264
+ background: var(--color-success-item-senary);
1265
+ }
1266
+ }
1267
+ &-accent {
1268
+ & .rc-slider-handle {
1269
+ background: var(--color-success-item-accent);
1270
+ }
1271
+ }
1272
+ &-disabled {
1273
+ & .rc-slider-handle {
1274
+ background: var(--color-success-item-disabled);
1275
+ }
1276
+ }
1277
+ &-hover {
1278
+ & .rc-slider-handle {
1279
+ background: var(--color-success-item-hover);
1280
+ }
1281
+ }
1282
+ }
1283
+ }
1284
+ &_error {
1285
+ &-item {
1286
+ &-primary {
1287
+ & .rc-slider-handle {
1288
+ background: var(--color-error-item-primary);
1289
+ }
1290
+ }
1291
+ &-secondary {
1292
+ & .rc-slider-handle {
1293
+ background: var(--color-error-item-secondary);
1294
+ }
1295
+ }
1296
+ &-tertiary {
1297
+ & .rc-slider-handle {
1298
+ background: var(--color-error-item-tertiary);
1299
+ }
1300
+ }
1301
+ &-quaternary {
1302
+ & .rc-slider-handle {
1303
+ background: var(--color-error-item-quaternary);
1304
+ }
1305
+ }
1306
+ &-quinary {
1307
+ & .rc-slider-handle {
1308
+ background: var(--color-error-item-quinary);
1309
+ }
1310
+ }
1311
+ &-senary {
1312
+ & .rc-slider-handle {
1313
+ background: var(--color-error-item-senary);
1314
+ }
1315
+ }
1316
+ &-accent {
1317
+ & .rc-slider-handle {
1318
+ background: var(--color-error-item-accent);
1319
+ }
1320
+ }
1321
+ &-disabled {
1322
+ & .rc-slider-handle {
1323
+ background: var(--color-error-item-disabled);
1324
+ }
1325
+ }
1326
+ &-hover {
1327
+ & .rc-slider-handle {
1328
+ background: var(--color-error-item-hover);
1329
+ }
1330
+ }
1331
+ }
1332
+ }
1333
+ }
1334
+ .range-slider-handle-fill-hover {
1335
+ &_accent {
1336
+ &-item {
1337
+ &-primary {
1338
+ &-hover {
1339
+ & .rc-slider-handle {
1340
+ &:hover {
1341
+ background: var(--color-accent-item-primary-hover);
1342
+ }
1343
+ }
1344
+ }
1345
+ }
1346
+ &-secondary {
1347
+ &-hover {
1348
+ & .rc-slider-handle {
1349
+ &:hover {
1350
+ background: var(--color-accent-item-secondary-hover);
1351
+ }
1352
+ }
1353
+ }
1354
+ }
1355
+ &-tertiary {
1356
+ &-hover {
1357
+ & .rc-slider-handle {
1358
+ &:hover {
1359
+ background: var(--color-accent-item-tertiary-hover);
1360
+ }
1361
+ }
1362
+ }
1363
+ }
1364
+ &-quaternary {
1365
+ &-hover {
1366
+ & .rc-slider-handle {
1367
+ &:hover {
1368
+ background: var(--color-accent-item-quaternary-hover);
1369
+ }
1370
+ }
1371
+ }
1372
+ }
1373
+ &-quinary {
1374
+ &-hover {
1375
+ & .rc-slider-handle {
1376
+ &:hover {
1377
+ background: var(--color-accent-item-quinary-hover);
1378
+ }
1379
+ }
1380
+ }
1381
+ }
1382
+ &-senary {
1383
+ &-hover {
1384
+ & .rc-slider-handle {
1385
+ &:hover {
1386
+ background: var(--color-accent-item-senary-hover);
1387
+ }
1388
+ }
1389
+ }
1390
+ }
1391
+ &-accent {
1392
+ &-hover {
1393
+ & .rc-slider-handle {
1394
+ &:hover {
1395
+ background: var(--color-accent-item-accent-hover);
1396
+ }
1397
+ }
1398
+ }
1399
+ }
1400
+ &-disabled {
1401
+ &-hover {
1402
+ & .rc-slider-handle {
1403
+ &:hover {
1404
+ background: var(--color-accent-item-disabled-hover);
1405
+ }
1406
+ }
1407
+ }
1408
+ }
1409
+ &-hover {
1410
+ &-hover {
1411
+ & .rc-slider-handle {
1412
+ &:hover {
1413
+ background: var(--color-accent-item-hover-hover);
1414
+ }
1415
+ }
1416
+ }
1417
+ }
1418
+ }
1419
+ }
1420
+ &_primary {
1421
+ &-item {
1422
+ &-primary {
1423
+ &-hover {
1424
+ & .rc-slider-handle {
1425
+ &:hover {
1426
+ background: var(--color-primary-item-primary-hover);
1427
+ }
1428
+ }
1429
+ }
1430
+ }
1431
+ &-secondary {
1432
+ &-hover {
1433
+ & .rc-slider-handle {
1434
+ &:hover {
1435
+ background: var(--color-primary-item-secondary-hover);
1436
+ }
1437
+ }
1438
+ }
1439
+ }
1440
+ &-tertiary {
1441
+ &-hover {
1442
+ & .rc-slider-handle {
1443
+ &:hover {
1444
+ background: var(--color-primary-item-tertiary-hover);
1445
+ }
1446
+ }
1447
+ }
1448
+ }
1449
+ &-quaternary {
1450
+ &-hover {
1451
+ & .rc-slider-handle {
1452
+ &:hover {
1453
+ background: var(--color-primary-item-quaternary-hover);
1454
+ }
1455
+ }
1456
+ }
1457
+ }
1458
+ &-quinary {
1459
+ &-hover {
1460
+ & .rc-slider-handle {
1461
+ &:hover {
1462
+ background: var(--color-primary-item-quinary-hover);
1463
+ }
1464
+ }
1465
+ }
1466
+ }
1467
+ &-senary {
1468
+ &-hover {
1469
+ & .rc-slider-handle {
1470
+ &:hover {
1471
+ background: var(--color-primary-item-senary-hover);
1472
+ }
1473
+ }
1474
+ }
1475
+ }
1476
+ &-accent {
1477
+ &-hover {
1478
+ & .rc-slider-handle {
1479
+ &:hover {
1480
+ background: var(--color-primary-item-accent-hover);
1481
+ }
1482
+ }
1483
+ }
1484
+ }
1485
+ &-disabled {
1486
+ &-hover {
1487
+ & .rc-slider-handle {
1488
+ &:hover {
1489
+ background: var(--color-primary-item-disabled-hover);
1490
+ }
1491
+ }
1492
+ }
1493
+ }
1494
+ &-hover {
1495
+ &-hover {
1496
+ & .rc-slider-handle {
1497
+ &:hover {
1498
+ background: var(--color-primary-item-hover-hover);
1499
+ }
1500
+ }
1501
+ }
1502
+ }
1503
+ }
1504
+ }
1505
+ &_secondary {
1506
+ &-item {
1507
+ &-primary {
1508
+ &-hover {
1509
+ & .rc-slider-handle {
1510
+ &:hover {
1511
+ background: var(--color-secondary-item-primary-hover);
1512
+ }
1513
+ }
1514
+ }
1515
+ }
1516
+ &-secondary {
1517
+ &-hover {
1518
+ & .rc-slider-handle {
1519
+ &:hover {
1520
+ background: var(--color-secondary-item-secondary-hover);
1521
+ }
1522
+ }
1523
+ }
1524
+ }
1525
+ &-tertiary {
1526
+ &-hover {
1527
+ & .rc-slider-handle {
1528
+ &:hover {
1529
+ background: var(--color-secondary-item-tertiary-hover);
1530
+ }
1531
+ }
1532
+ }
1533
+ }
1534
+ &-quaternary {
1535
+ &-hover {
1536
+ & .rc-slider-handle {
1537
+ &:hover {
1538
+ background: var(--color-secondary-item-quaternary-hover);
1539
+ }
1540
+ }
1541
+ }
1542
+ }
1543
+ &-quinary {
1544
+ &-hover {
1545
+ & .rc-slider-handle {
1546
+ &:hover {
1547
+ background: var(--color-secondary-item-quinary-hover);
1548
+ }
1549
+ }
1550
+ }
1551
+ }
1552
+ &-senary {
1553
+ &-hover {
1554
+ & .rc-slider-handle {
1555
+ &:hover {
1556
+ background: var(--color-secondary-item-senary-hover);
1557
+ }
1558
+ }
1559
+ }
1560
+ }
1561
+ &-accent {
1562
+ &-hover {
1563
+ & .rc-slider-handle {
1564
+ &:hover {
1565
+ background: var(--color-secondary-item-accent-hover);
1566
+ }
1567
+ }
1568
+ }
1569
+ }
1570
+ &-disabled {
1571
+ &-hover {
1572
+ & .rc-slider-handle {
1573
+ &:hover {
1574
+ background: var(--color-secondary-item-disabled-hover);
1575
+ }
1576
+ }
1577
+ }
1578
+ }
1579
+ &-hover {
1580
+ &-hover {
1581
+ & .rc-slider-handle {
1582
+ &:hover {
1583
+ background: var(--color-secondary-item-hover-hover);
1584
+ }
1585
+ }
1586
+ }
1587
+ }
1588
+ }
1589
+ }
1590
+ &_tertiary {
1591
+ &-item {
1592
+ &-primary {
1593
+ &-hover {
1594
+ & .rc-slider-handle {
1595
+ &:hover {
1596
+ background: var(--color-tertiary-item-primary-hover);
1597
+ }
1598
+ }
1599
+ }
1600
+ }
1601
+ &-secondary {
1602
+ &-hover {
1603
+ & .rc-slider-handle {
1604
+ &:hover {
1605
+ background: var(--color-tertiary-item-secondary-hover);
1606
+ }
1607
+ }
1608
+ }
1609
+ }
1610
+ &-tertiary {
1611
+ &-hover {
1612
+ & .rc-slider-handle {
1613
+ &:hover {
1614
+ background: var(--color-tertiary-item-tertiary-hover);
1615
+ }
1616
+ }
1617
+ }
1618
+ }
1619
+ &-quaternary {
1620
+ &-hover {
1621
+ & .rc-slider-handle {
1622
+ &:hover {
1623
+ background: var(--color-tertiary-item-quaternary-hover);
1624
+ }
1625
+ }
1626
+ }
1627
+ }
1628
+ &-quinary {
1629
+ &-hover {
1630
+ & .rc-slider-handle {
1631
+ &:hover {
1632
+ background: var(--color-tertiary-item-quinary-hover);
1633
+ }
1634
+ }
1635
+ }
1636
+ }
1637
+ &-senary {
1638
+ &-hover {
1639
+ & .rc-slider-handle {
1640
+ &:hover {
1641
+ background: var(--color-tertiary-item-senary-hover);
1642
+ }
1643
+ }
1644
+ }
1645
+ }
1646
+ &-accent {
1647
+ &-hover {
1648
+ & .rc-slider-handle {
1649
+ &:hover {
1650
+ background: var(--color-tertiary-item-accent-hover);
1651
+ }
1652
+ }
1653
+ }
1654
+ }
1655
+ &-disabled {
1656
+ &-hover {
1657
+ & .rc-slider-handle {
1658
+ &:hover {
1659
+ background: var(--color-tertiary-item-disabled-hover);
1660
+ }
1661
+ }
1662
+ }
1663
+ }
1664
+ &-hover {
1665
+ &-hover {
1666
+ & .rc-slider-handle {
1667
+ &:hover {
1668
+ background: var(--color-tertiary-item-hover-hover);
1669
+ }
1670
+ }
1671
+ }
1672
+ }
1673
+ }
1674
+ }
1675
+ &_surface {
1676
+ &-item {
1677
+ &-primary {
1678
+ &-hover {
1679
+ & .rc-slider-handle {
1680
+ &:hover {
1681
+ background: var(--color-surface-item-primary-hover);
1682
+ }
1683
+ }
1684
+ }
1685
+ }
1686
+ &-secondary {
1687
+ &-hover {
1688
+ & .rc-slider-handle {
1689
+ &:hover {
1690
+ background: var(--color-surface-item-secondary-hover);
1691
+ }
1692
+ }
1693
+ }
1694
+ }
1695
+ &-tertiary {
1696
+ &-hover {
1697
+ & .rc-slider-handle {
1698
+ &:hover {
1699
+ background: var(--color-surface-item-tertiary-hover);
1700
+ }
1701
+ }
1702
+ }
1703
+ }
1704
+ &-quaternary {
1705
+ &-hover {
1706
+ & .rc-slider-handle {
1707
+ &:hover {
1708
+ background: var(--color-surface-item-quaternary-hover);
1709
+ }
1710
+ }
1711
+ }
1712
+ }
1713
+ &-quinary {
1714
+ &-hover {
1715
+ & .rc-slider-handle {
1716
+ &:hover {
1717
+ background: var(--color-surface-item-quinary-hover);
1718
+ }
1719
+ }
1720
+ }
1721
+ }
1722
+ &-senary {
1723
+ &-hover {
1724
+ & .rc-slider-handle {
1725
+ &:hover {
1726
+ background: var(--color-surface-item-senary-hover);
1727
+ }
1728
+ }
1729
+ }
1730
+ }
1731
+ &-accent {
1732
+ &-hover {
1733
+ & .rc-slider-handle {
1734
+ &:hover {
1735
+ background: var(--color-surface-item-accent-hover);
1736
+ }
1737
+ }
1738
+ }
1739
+ }
1740
+ &-disabled {
1741
+ &-hover {
1742
+ & .rc-slider-handle {
1743
+ &:hover {
1744
+ background: var(--color-surface-item-disabled-hover);
1745
+ }
1746
+ }
1747
+ }
1748
+ }
1749
+ &-hover {
1750
+ &-hover {
1751
+ & .rc-slider-handle {
1752
+ &:hover {
1753
+ background: var(--color-surface-item-hover-hover);
1754
+ }
1755
+ }
1756
+ }
1757
+ }
1758
+ }
1759
+ }
1760
+ &_success {
1761
+ &-item {
1762
+ &-primary {
1763
+ &-hover {
1764
+ & .rc-slider-handle {
1765
+ &:hover {
1766
+ background: var(--color-success-item-primary-hover);
1767
+ }
1768
+ }
1769
+ }
1770
+ }
1771
+ &-secondary {
1772
+ &-hover {
1773
+ & .rc-slider-handle {
1774
+ &:hover {
1775
+ background: var(--color-success-item-secondary-hover);
1776
+ }
1777
+ }
1778
+ }
1779
+ }
1780
+ &-tertiary {
1781
+ &-hover {
1782
+ & .rc-slider-handle {
1783
+ &:hover {
1784
+ background: var(--color-success-item-tertiary-hover);
1785
+ }
1786
+ }
1787
+ }
1788
+ }
1789
+ &-quaternary {
1790
+ &-hover {
1791
+ & .rc-slider-handle {
1792
+ &:hover {
1793
+ background: var(--color-success-item-quaternary-hover);
1794
+ }
1795
+ }
1796
+ }
1797
+ }
1798
+ &-quinary {
1799
+ &-hover {
1800
+ & .rc-slider-handle {
1801
+ &:hover {
1802
+ background: var(--color-success-item-quinary-hover);
1803
+ }
1804
+ }
1805
+ }
1806
+ }
1807
+ &-senary {
1808
+ &-hover {
1809
+ & .rc-slider-handle {
1810
+ &:hover {
1811
+ background: var(--color-success-item-senary-hover);
1812
+ }
1813
+ }
1814
+ }
1815
+ }
1816
+ &-accent {
1817
+ &-hover {
1818
+ & .rc-slider-handle {
1819
+ &:hover {
1820
+ background: var(--color-success-item-accent-hover);
1821
+ }
1822
+ }
1823
+ }
1824
+ }
1825
+ &-disabled {
1826
+ &-hover {
1827
+ & .rc-slider-handle {
1828
+ &:hover {
1829
+ background: var(--color-success-item-disabled-hover);
1830
+ }
1831
+ }
1832
+ }
1833
+ }
1834
+ &-hover {
1835
+ &-hover {
1836
+ & .rc-slider-handle {
1837
+ &:hover {
1838
+ background: var(--color-success-item-hover-hover);
1839
+ }
1840
+ }
1841
+ }
1842
+ }
1843
+ }
1844
+ }
1845
+ &_error {
1846
+ &-item {
1847
+ &-primary {
1848
+ &-hover {
1849
+ & .rc-slider-handle {
1850
+ &:hover {
1851
+ background: var(--color-error-item-primary-hover);
1852
+ }
1853
+ }
1854
+ }
1855
+ }
1856
+ &-secondary {
1857
+ &-hover {
1858
+ & .rc-slider-handle {
1859
+ &:hover {
1860
+ background: var(--color-error-item-secondary-hover);
1861
+ }
1862
+ }
1863
+ }
1864
+ }
1865
+ &-tertiary {
1866
+ &-hover {
1867
+ & .rc-slider-handle {
1868
+ &:hover {
1869
+ background: var(--color-error-item-tertiary-hover);
1870
+ }
1871
+ }
1872
+ }
1873
+ }
1874
+ &-quaternary {
1875
+ &-hover {
1876
+ & .rc-slider-handle {
1877
+ &:hover {
1878
+ background: var(--color-error-item-quaternary-hover);
1879
+ }
1880
+ }
1881
+ }
1882
+ }
1883
+ &-quinary {
1884
+ &-hover {
1885
+ & .rc-slider-handle {
1886
+ &:hover {
1887
+ background: var(--color-error-item-quinary-hover);
1888
+ }
1889
+ }
1890
+ }
1891
+ }
1892
+ &-senary {
1893
+ &-hover {
1894
+ & .rc-slider-handle {
1895
+ &:hover {
1896
+ background: var(--color-error-item-senary-hover);
1897
+ }
1898
+ }
1899
+ }
1900
+ }
1901
+ &-accent {
1902
+ &-hover {
1903
+ & .rc-slider-handle {
1904
+ &:hover {
1905
+ background: var(--color-error-item-accent-hover);
1906
+ }
1907
+ }
1908
+ }
1909
+ }
1910
+ &-disabled {
1911
+ &-hover {
1912
+ & .rc-slider-handle {
1913
+ &:hover {
1914
+ background: var(--color-error-item-disabled-hover);
1915
+ }
1916
+ }
1917
+ }
1918
+ }
1919
+ &-hover {
1920
+ &-hover {
1921
+ & .rc-slider-handle {
1922
+ &:hover {
1923
+ background: var(--color-error-item-hover-hover);
1924
+ }
1925
+ }
1926
+ }
1927
+ }
1928
+ }
1929
+ }
1930
+ }
1931
+ .range-slider-handle-dragging-fill {
1932
+ &_accent {
1933
+ &-item {
1934
+ &-primary {
1935
+ & .rc-slider-handle-dragging {
1936
+ background: var(--color-accent-item-primary);
1937
+ }
1938
+ }
1939
+ &-secondary {
1940
+ & .rc-slider-handle-dragging {
1941
+ background: var(--color-accent-item-secondary);
1942
+ }
1943
+ }
1944
+ &-tertiary {
1945
+ & .rc-slider-handle-dragging {
1946
+ background: var(--color-accent-item-tertiary);
1947
+ }
1948
+ }
1949
+ &-quaternary {
1950
+ & .rc-slider-handle-dragging {
1951
+ background: var(--color-accent-item-quaternary);
1952
+ }
1953
+ }
1954
+ &-quinary {
1955
+ & .rc-slider-handle-dragging {
1956
+ background: var(--color-accent-item-quinary);
1957
+ }
1958
+ }
1959
+ &-senary {
1960
+ & .rc-slider-handle-dragging {
1961
+ background: var(--color-accent-item-senary);
1962
+ }
1963
+ }
1964
+ &-accent {
1965
+ & .rc-slider-handle-dragging {
1966
+ background: var(--color-accent-item-accent);
1967
+ }
1968
+ }
1969
+ &-disabled {
1970
+ & .rc-slider-handle-dragging {
1971
+ background: var(--color-accent-item-disabled);
1972
+ }
1973
+ }
1974
+ &-hover {
1975
+ & .rc-slider-handle-dragging {
1976
+ background: var(--color-accent-item-hover);
1977
+ }
1978
+ }
1979
+ }
1980
+ }
1981
+ &_primary {
1982
+ &-item {
1983
+ &-primary {
1984
+ & .rc-slider-handle-dragging {
1985
+ background: var(--color-primary-item-primary);
1986
+ }
1987
+ }
1988
+ &-secondary {
1989
+ & .rc-slider-handle-dragging {
1990
+ background: var(--color-primary-item-secondary);
1991
+ }
1992
+ }
1993
+ &-tertiary {
1994
+ & .rc-slider-handle-dragging {
1995
+ background: var(--color-primary-item-tertiary);
1996
+ }
1997
+ }
1998
+ &-quaternary {
1999
+ & .rc-slider-handle-dragging {
2000
+ background: var(--color-primary-item-quaternary);
2001
+ }
2002
+ }
2003
+ &-quinary {
2004
+ & .rc-slider-handle-dragging {
2005
+ background: var(--color-primary-item-quinary);
2006
+ }
2007
+ }
2008
+ &-senary {
2009
+ & .rc-slider-handle-dragging {
2010
+ background: var(--color-primary-item-senary);
2011
+ }
2012
+ }
2013
+ &-accent {
2014
+ & .rc-slider-handle-dragging {
2015
+ background: var(--color-primary-item-accent);
2016
+ }
2017
+ }
2018
+ &-disabled {
2019
+ & .rc-slider-handle-dragging {
2020
+ background: var(--color-primary-item-disabled);
2021
+ }
2022
+ }
2023
+ &-hover {
2024
+ & .rc-slider-handle-dragging {
2025
+ background: var(--color-primary-item-hover);
2026
+ }
2027
+ }
2028
+ }
2029
+ }
2030
+ &_secondary {
2031
+ &-item {
2032
+ &-primary {
2033
+ & .rc-slider-handle-dragging {
2034
+ background: var(--color-secondary-item-primary);
2035
+ }
2036
+ }
2037
+ &-secondary {
2038
+ & .rc-slider-handle-dragging {
2039
+ background: var(--color-secondary-item-secondary);
2040
+ }
2041
+ }
2042
+ &-tertiary {
2043
+ & .rc-slider-handle-dragging {
2044
+ background: var(--color-secondary-item-tertiary);
2045
+ }
2046
+ }
2047
+ &-quaternary {
2048
+ & .rc-slider-handle-dragging {
2049
+ background: var(--color-secondary-item-quaternary);
2050
+ }
2051
+ }
2052
+ &-quinary {
2053
+ & .rc-slider-handle-dragging {
2054
+ background: var(--color-secondary-item-quinary);
2055
+ }
2056
+ }
2057
+ &-senary {
2058
+ & .rc-slider-handle-dragging {
2059
+ background: var(--color-secondary-item-senary);
2060
+ }
2061
+ }
2062
+ &-accent {
2063
+ & .rc-slider-handle-dragging {
2064
+ background: var(--color-secondary-item-accent);
2065
+ }
2066
+ }
2067
+ &-disabled {
2068
+ & .rc-slider-handle-dragging {
2069
+ background: var(--color-secondary-item-disabled);
2070
+ }
2071
+ }
2072
+ &-hover {
2073
+ & .rc-slider-handle-dragging {
2074
+ background: var(--color-secondary-item-hover);
2075
+ }
2076
+ }
2077
+ }
2078
+ }
2079
+ &_tertiary {
2080
+ &-item {
2081
+ &-primary {
2082
+ & .rc-slider-handle-dragging {
2083
+ background: var(--color-tertiary-item-primary);
2084
+ }
2085
+ }
2086
+ &-secondary {
2087
+ & .rc-slider-handle-dragging {
2088
+ background: var(--color-tertiary-item-secondary);
2089
+ }
2090
+ }
2091
+ &-tertiary {
2092
+ & .rc-slider-handle-dragging {
2093
+ background: var(--color-tertiary-item-tertiary);
2094
+ }
2095
+ }
2096
+ &-quaternary {
2097
+ & .rc-slider-handle-dragging {
2098
+ background: var(--color-tertiary-item-quaternary);
2099
+ }
2100
+ }
2101
+ &-quinary {
2102
+ & .rc-slider-handle-dragging {
2103
+ background: var(--color-tertiary-item-quinary);
2104
+ }
2105
+ }
2106
+ &-senary {
2107
+ & .rc-slider-handle-dragging {
2108
+ background: var(--color-tertiary-item-senary);
2109
+ }
2110
+ }
2111
+ &-accent {
2112
+ & .rc-slider-handle-dragging {
2113
+ background: var(--color-tertiary-item-accent);
2114
+ }
2115
+ }
2116
+ &-disabled {
2117
+ & .rc-slider-handle-dragging {
2118
+ background: var(--color-tertiary-item-disabled);
2119
+ }
2120
+ }
2121
+ &-hover {
2122
+ & .rc-slider-handle-dragging {
2123
+ background: var(--color-tertiary-item-hover);
2124
+ }
2125
+ }
2126
+ }
2127
+ }
2128
+ &_surface {
2129
+ &-item {
2130
+ &-primary {
2131
+ & .rc-slider-handle-dragging {
2132
+ background: var(--color-surface-item-primary);
2133
+ }
2134
+ }
2135
+ &-secondary {
2136
+ & .rc-slider-handle-dragging {
2137
+ background: var(--color-surface-item-secondary);
2138
+ }
2139
+ }
2140
+ &-tertiary {
2141
+ & .rc-slider-handle-dragging {
2142
+ background: var(--color-surface-item-tertiary);
2143
+ }
2144
+ }
2145
+ &-quaternary {
2146
+ & .rc-slider-handle-dragging {
2147
+ background: var(--color-surface-item-quaternary);
2148
+ }
2149
+ }
2150
+ &-quinary {
2151
+ & .rc-slider-handle-dragging {
2152
+ background: var(--color-surface-item-quinary);
2153
+ }
2154
+ }
2155
+ &-senary {
2156
+ & .rc-slider-handle-dragging {
2157
+ background: var(--color-surface-item-senary);
2158
+ }
2159
+ }
2160
+ &-accent {
2161
+ & .rc-slider-handle-dragging {
2162
+ background: var(--color-surface-item-accent);
2163
+ }
2164
+ }
2165
+ &-disabled {
2166
+ & .rc-slider-handle-dragging {
2167
+ background: var(--color-surface-item-disabled);
2168
+ }
2169
+ }
2170
+ &-hover {
2171
+ & .rc-slider-handle-dragging {
2172
+ background: var(--color-surface-item-hover);
2173
+ }
2174
+ }
2175
+ }
2176
+ }
2177
+ &_success {
2178
+ &-item {
2179
+ &-primary {
2180
+ & .rc-slider-handle-dragging {
2181
+ background: var(--color-success-item-primary);
2182
+ }
2183
+ }
2184
+ &-secondary {
2185
+ & .rc-slider-handle-dragging {
2186
+ background: var(--color-success-item-secondary);
2187
+ }
2188
+ }
2189
+ &-tertiary {
2190
+ & .rc-slider-handle-dragging {
2191
+ background: var(--color-success-item-tertiary);
2192
+ }
2193
+ }
2194
+ &-quaternary {
2195
+ & .rc-slider-handle-dragging {
2196
+ background: var(--color-success-item-quaternary);
2197
+ }
2198
+ }
2199
+ &-quinary {
2200
+ & .rc-slider-handle-dragging {
2201
+ background: var(--color-success-item-quinary);
2202
+ }
2203
+ }
2204
+ &-senary {
2205
+ & .rc-slider-handle-dragging {
2206
+ background: var(--color-success-item-senary);
2207
+ }
2208
+ }
2209
+ &-accent {
2210
+ & .rc-slider-handle-dragging {
2211
+ background: var(--color-success-item-accent);
2212
+ }
2213
+ }
2214
+ &-disabled {
2215
+ & .rc-slider-handle-dragging {
2216
+ background: var(--color-success-item-disabled);
2217
+ }
2218
+ }
2219
+ &-hover {
2220
+ & .rc-slider-handle-dragging {
2221
+ background: var(--color-success-item-hover);
2222
+ }
2223
+ }
2224
+ }
2225
+ }
2226
+ &_error {
2227
+ &-item {
2228
+ &-primary {
2229
+ & .rc-slider-handle-dragging {
2230
+ background: var(--color-error-item-primary);
2231
+ }
2232
+ }
2233
+ &-secondary {
2234
+ & .rc-slider-handle-dragging {
2235
+ background: var(--color-error-item-secondary);
2236
+ }
2237
+ }
2238
+ &-tertiary {
2239
+ & .rc-slider-handle-dragging {
2240
+ background: var(--color-error-item-tertiary);
2241
+ }
2242
+ }
2243
+ &-quaternary {
2244
+ & .rc-slider-handle-dragging {
2245
+ background: var(--color-error-item-quaternary);
2246
+ }
2247
+ }
2248
+ &-quinary {
2249
+ & .rc-slider-handle-dragging {
2250
+ background: var(--color-error-item-quinary);
2251
+ }
2252
+ }
2253
+ &-senary {
2254
+ & .rc-slider-handle-dragging {
2255
+ background: var(--color-error-item-senary);
2256
+ }
2257
+ }
2258
+ &-accent {
2259
+ & .rc-slider-handle-dragging {
2260
+ background: var(--color-error-item-accent);
2261
+ }
2262
+ }
2263
+ &-disabled {
2264
+ & .rc-slider-handle-dragging {
2265
+ background: var(--color-error-item-disabled);
2266
+ }
2267
+ }
2268
+ &-hover {
2269
+ & .rc-slider-handle-dragging {
2270
+ background: var(--color-error-item-hover);
2271
+ }
2272
+ }
2273
+ }
2274
+ }
2275
+ }
2276
+ .range-slider-handle-dragging-fill-hover {
2277
+ &_accent {
2278
+ &-item {
2279
+ &-primary {
2280
+ &-hover {
2281
+ & .rc-slider-handle-dragging {
2282
+ background: var(--color-accent-item-primary-hover);
2283
+ }
2284
+ }
2285
+ & .rc-slider-handle-dragging {
2286
+ background: var(--color-accent-item-primary);
2287
+ }
2288
+ }
2289
+ &-secondary {
2290
+ &-hover {
2291
+ & .rc-slider-handle-dragging {
2292
+ background: var(--color-accent-item-secondary-hover);
2293
+ }
2294
+ }
2295
+ & .rc-slider-handle-dragging {
2296
+ background: var(--color-accent-item-secondary);
2297
+ }
2298
+ }
2299
+ &-tertiary {
2300
+ &-hover {
2301
+ & .rc-slider-handle-dragging {
2302
+ background: var(--color-accent-item-tertiary-hover);
2303
+ }
2304
+ }
2305
+ & .rc-slider-handle-dragging {
2306
+ background: var(--color-accent-item-tertiary);
2307
+ }
2308
+ }
2309
+ &-quaternary {
2310
+ &-hover {
2311
+ & .rc-slider-handle-dragging {
2312
+ background: var(--color-accent-item-quaternary-hover);
2313
+ }
2314
+ }
2315
+ & .rc-slider-handle-dragging {
2316
+ background: var(--color-accent-item-quaternary);
2317
+ }
2318
+ }
2319
+ &-quinary {
2320
+ &-hover {
2321
+ & .rc-slider-handle-dragging {
2322
+ background: var(--color-accent-item-quinary-hover);
2323
+ }
2324
+ }
2325
+ & .rc-slider-handle-dragging {
2326
+ background: var(--color-accent-item-quinary);
2327
+ }
2328
+ }
2329
+ &-senary {
2330
+ &-hover {
2331
+ & .rc-slider-handle-dragging {
2332
+ background: var(--color-accent-item-senary-hover);
2333
+ }
2334
+ }
2335
+ & .rc-slider-handle-dragging {
2336
+ background: var(--color-accent-item-senary);
2337
+ }
2338
+ }
2339
+ &-accent {
2340
+ &-hover {
2341
+ & .rc-slider-handle-dragging {
2342
+ background: var(--color-accent-item-accent-hover);
2343
+ }
2344
+ }
2345
+ & .rc-slider-handle-dragging {
2346
+ background: var(--color-accent-item-accent);
2347
+ }
2348
+ }
2349
+ &-disabled {
2350
+ &-hover {
2351
+ & .rc-slider-handle-dragging {
2352
+ background: var(--color-accent-item-disabled-hover);
2353
+ }
2354
+ }
2355
+ & .rc-slider-handle-dragging {
2356
+ background: var(--color-accent-item-disabled);
2357
+ }
2358
+ }
2359
+ &-hover {
2360
+ &-hover {
2361
+ & .rc-slider-handle-dragging {
2362
+ background: var(--color-accent-item-hover-hover);
2363
+ }
2364
+ }
2365
+ & .rc-slider-handle-dragging {
2366
+ background: var(--color-accent-item-hover);
2367
+ }
2368
+ }
2369
+ }
2370
+ }
2371
+ &_primary {
2372
+ &-item {
2373
+ &-primary {
2374
+ &-hover {
2375
+ & .rc-slider-handle-dragging {
2376
+ background: var(--color-primary-item-primary-hover);
2377
+ }
2378
+ }
2379
+ & .rc-slider-handle-dragging {
2380
+ background: var(--color-primary-item-primary);
2381
+ }
2382
+ }
2383
+ &-secondary {
2384
+ &-hover {
2385
+ & .rc-slider-handle-dragging {
2386
+ background: var(--color-primary-item-secondary-hover);
2387
+ }
2388
+ }
2389
+ & .rc-slider-handle-dragging {
2390
+ background: var(--color-primary-item-secondary);
2391
+ }
2392
+ }
2393
+ &-tertiary {
2394
+ &-hover {
2395
+ & .rc-slider-handle-dragging {
2396
+ background: var(--color-primary-item-tertiary-hover);
2397
+ }
2398
+ }
2399
+ & .rc-slider-handle-dragging {
2400
+ background: var(--color-primary-item-tertiary);
2401
+ }
2402
+ }
2403
+ &-quaternary {
2404
+ &-hover {
2405
+ & .rc-slider-handle-dragging {
2406
+ background: var(--color-primary-item-quaternary-hover);
2407
+ }
2408
+ }
2409
+ & .rc-slider-handle-dragging {
2410
+ background: var(--color-primary-item-quaternary);
2411
+ }
2412
+ }
2413
+ &-quinary {
2414
+ &-hover {
2415
+ & .rc-slider-handle-dragging {
2416
+ background: var(--color-primary-item-quinary-hover);
2417
+ }
2418
+ }
2419
+ & .rc-slider-handle-dragging {
2420
+ background: var(--color-primary-item-quinary);
2421
+ }
2422
+ }
2423
+ &-senary {
2424
+ &-hover {
2425
+ & .rc-slider-handle-dragging {
2426
+ background: var(--color-primary-item-senary-hover);
2427
+ }
2428
+ }
2429
+ & .rc-slider-handle-dragging {
2430
+ background: var(--color-primary-item-senary);
2431
+ }
2432
+ }
2433
+ &-accent {
2434
+ &-hover {
2435
+ & .rc-slider-handle-dragging {
2436
+ background: var(--color-primary-item-accent-hover);
2437
+ }
2438
+ }
2439
+ & .rc-slider-handle-dragging {
2440
+ background: var(--color-primary-item-accent);
2441
+ }
2442
+ }
2443
+ &-disabled {
2444
+ &-hover {
2445
+ & .rc-slider-handle-dragging {
2446
+ background: var(--color-primary-item-disabled-hover);
2447
+ }
2448
+ }
2449
+ & .rc-slider-handle-dragging {
2450
+ background: var(--color-primary-item-disabled);
2451
+ }
2452
+ }
2453
+ &-hover {
2454
+ &-hover {
2455
+ & .rc-slider-handle-dragging {
2456
+ background: var(--color-primary-item-hover-hover);
2457
+ }
2458
+ }
2459
+ & .rc-slider-handle-dragging {
2460
+ background: var(--color-primary-item-hover);
2461
+ }
2462
+ }
2463
+ }
2464
+ }
2465
+ &_secondary {
2466
+ &-item {
2467
+ &-primary {
2468
+ &-hover {
2469
+ & .rc-slider-handle-dragging {
2470
+ background: var(--color-secondary-item-primary-hover);
2471
+ }
2472
+ }
2473
+ & .rc-slider-handle-dragging {
2474
+ background: var(--color-secondary-item-primary);
2475
+ }
2476
+ }
2477
+ &-secondary {
2478
+ &-hover {
2479
+ & .rc-slider-handle-dragging {
2480
+ background: var(--color-secondary-item-secondary-hover);
2481
+ }
2482
+ }
2483
+ & .rc-slider-handle-dragging {
2484
+ background: var(--color-secondary-item-secondary);
2485
+ }
2486
+ }
2487
+ &-tertiary {
2488
+ &-hover {
2489
+ & .rc-slider-handle-dragging {
2490
+ background: var(--color-secondary-item-tertiary-hover);
2491
+ }
2492
+ }
2493
+ & .rc-slider-handle-dragging {
2494
+ background: var(--color-secondary-item-tertiary);
2495
+ }
2496
+ }
2497
+ &-quaternary {
2498
+ &-hover {
2499
+ & .rc-slider-handle-dragging {
2500
+ background: var(--color-secondary-item-quaternary-hover);
2501
+ }
2502
+ }
2503
+ & .rc-slider-handle-dragging {
2504
+ background: var(--color-secondary-item-quaternary);
2505
+ }
2506
+ }
2507
+ &-quinary {
2508
+ &-hover {
2509
+ & .rc-slider-handle-dragging {
2510
+ background: var(--color-secondary-item-quinary-hover);
2511
+ }
2512
+ }
2513
+ & .rc-slider-handle-dragging {
2514
+ background: var(--color-secondary-item-quinary);
2515
+ }
2516
+ }
2517
+ &-senary {
2518
+ &-hover {
2519
+ & .rc-slider-handle-dragging {
2520
+ background: var(--color-secondary-item-senary-hover);
2521
+ }
2522
+ }
2523
+ & .rc-slider-handle-dragging {
2524
+ background: var(--color-secondary-item-senary);
2525
+ }
2526
+ }
2527
+ &-accent {
2528
+ &-hover {
2529
+ & .rc-slider-handle-dragging {
2530
+ background: var(--color-secondary-item-accent-hover);
2531
+ }
2532
+ }
2533
+ & .rc-slider-handle-dragging {
2534
+ background: var(--color-secondary-item-accent);
2535
+ }
2536
+ }
2537
+ &-disabled {
2538
+ &-hover {
2539
+ & .rc-slider-handle-dragging {
2540
+ background: var(--color-secondary-item-disabled-hover);
2541
+ }
2542
+ }
2543
+ & .rc-slider-handle-dragging {
2544
+ background: var(--color-secondary-item-disabled);
2545
+ }
2546
+ }
2547
+ &-hover {
2548
+ &-hover {
2549
+ & .rc-slider-handle-dragging {
2550
+ background: var(--color-secondary-item-hover-hover);
2551
+ }
2552
+ }
2553
+ & .rc-slider-handle-dragging {
2554
+ background: var(--color-secondary-item-hover);
2555
+ }
2556
+ }
2557
+ }
2558
+ }
2559
+ &_tertiary {
2560
+ &-item {
2561
+ &-primary {
2562
+ &-hover {
2563
+ & .rc-slider-handle-dragging {
2564
+ background: var(--color-tertiary-item-primary-hover);
2565
+ }
2566
+ }
2567
+ & .rc-slider-handle-dragging {
2568
+ background: var(--color-tertiary-item-primary);
336
2569
  }
337
2570
  }
338
- }
339
- }
340
- }
341
- }
342
- }
343
- .range-slider-handle-fill {
344
- @each $type in accent, primary, secondary, tertiary, surface, success, error {
345
- &_$(type) {
346
- &-item {
347
- @each $color in primary, secondary, tertiary, quaternary, quinary,
348
- senary, accent, disabled, hover {
349
- &-$(color) {
350
- & .rc-slider-handle {
351
- background: var(--color-$(type)-item-$(color));
2571
+ &-secondary {
2572
+ &-hover {
2573
+ & .rc-slider-handle-dragging {
2574
+ background: var(--color-tertiary-item-secondary-hover);
2575
+ }
2576
+ }
2577
+ & .rc-slider-handle-dragging {
2578
+ background: var(--color-tertiary-item-secondary);
2579
+ }
2580
+ }
2581
+ &-tertiary {
2582
+ &-hover {
2583
+ & .rc-slider-handle-dragging {
2584
+ background: var(--color-tertiary-item-tertiary-hover);
2585
+ }
2586
+ }
2587
+ & .rc-slider-handle-dragging {
2588
+ background: var(--color-tertiary-item-tertiary);
2589
+ }
2590
+ }
2591
+ &-quaternary {
2592
+ &-hover {
2593
+ & .rc-slider-handle-dragging {
2594
+ background: var(--color-tertiary-item-quaternary-hover);
2595
+ }
2596
+ }
2597
+ & .rc-slider-handle-dragging {
2598
+ background: var(--color-tertiary-item-quaternary);
2599
+ }
2600
+ }
2601
+ &-quinary {
2602
+ &-hover {
2603
+ & .rc-slider-handle-dragging {
2604
+ background: var(--color-tertiary-item-quinary-hover);
2605
+ }
2606
+ }
2607
+ & .rc-slider-handle-dragging {
2608
+ background: var(--color-tertiary-item-quinary);
2609
+ }
2610
+ }
2611
+ &-senary {
2612
+ &-hover {
2613
+ & .rc-slider-handle-dragging {
2614
+ background: var(--color-tertiary-item-senary-hover);
2615
+ }
2616
+ }
2617
+ & .rc-slider-handle-dragging {
2618
+ background: var(--color-tertiary-item-senary);
2619
+ }
2620
+ }
2621
+ &-accent {
2622
+ &-hover {
2623
+ & .rc-slider-handle-dragging {
2624
+ background: var(--color-tertiary-item-accent-hover);
2625
+ }
2626
+ }
2627
+ & .rc-slider-handle-dragging {
2628
+ background: var(--color-tertiary-item-accent);
2629
+ }
2630
+ }
2631
+ &-disabled {
2632
+ &-hover {
2633
+ & .rc-slider-handle-dragging {
2634
+ background: var(--color-tertiary-item-disabled-hover);
2635
+ }
2636
+ }
2637
+ & .rc-slider-handle-dragging {
2638
+ background: var(--color-tertiary-item-disabled);
2639
+ }
2640
+ }
2641
+ &-hover {
2642
+ &-hover {
2643
+ & .rc-slider-handle-dragging {
2644
+ background: var(--color-tertiary-item-hover-hover);
2645
+ }
2646
+ }
2647
+ & .rc-slider-handle-dragging {
2648
+ background: var(--color-tertiary-item-hover);
352
2649
  }
353
2650
  }
354
- }
355
2651
  }
356
2652
  }
357
- }
358
- }
359
- .range-slider-handle-fill-hover {
360
- @each $type in accent, primary, secondary, tertiary, surface, success, error {
361
- &_$(type) {
2653
+ &_surface {
362
2654
  &-item {
363
- @each $color in primary, secondary, tertiary, quaternary, quinary,
364
- senary, accent, disabled, hover {
365
- &-$(color) {
2655
+ &-primary {
366
2656
  &-hover {
367
- & .rc-slider-handle {
368
- &:hover {
369
- background: var(--color-$(type)-item-$(color)-hover);
370
- }
2657
+ & .rc-slider-handle-dragging {
2658
+ background: var(--color-surface-item-primary-hover);
371
2659
  }
372
2660
  }
2661
+ & .rc-slider-handle-dragging {
2662
+ background: var(--color-surface-item-primary);
2663
+ }
2664
+ }
2665
+ &-secondary {
2666
+ &-hover {
2667
+ & .rc-slider-handle-dragging {
2668
+ background: var(--color-surface-item-secondary-hover);
2669
+ }
2670
+ }
2671
+ & .rc-slider-handle-dragging {
2672
+ background: var(--color-surface-item-secondary);
2673
+ }
2674
+ }
2675
+ &-tertiary {
2676
+ &-hover {
2677
+ & .rc-slider-handle-dragging {
2678
+ background: var(--color-surface-item-tertiary-hover);
2679
+ }
2680
+ }
2681
+ & .rc-slider-handle-dragging {
2682
+ background: var(--color-surface-item-tertiary);
2683
+ }
2684
+ }
2685
+ &-quaternary {
2686
+ &-hover {
2687
+ & .rc-slider-handle-dragging {
2688
+ background: var(--color-surface-item-quaternary-hover);
2689
+ }
2690
+ }
2691
+ & .rc-slider-handle-dragging {
2692
+ background: var(--color-surface-item-quaternary);
2693
+ }
2694
+ }
2695
+ &-quinary {
2696
+ &-hover {
2697
+ & .rc-slider-handle-dragging {
2698
+ background: var(--color-surface-item-quinary-hover);
2699
+ }
2700
+ }
2701
+ & .rc-slider-handle-dragging {
2702
+ background: var(--color-surface-item-quinary);
2703
+ }
2704
+ }
2705
+ &-senary {
2706
+ &-hover {
2707
+ & .rc-slider-handle-dragging {
2708
+ background: var(--color-surface-item-senary-hover);
2709
+ }
2710
+ }
2711
+ & .rc-slider-handle-dragging {
2712
+ background: var(--color-surface-item-senary);
2713
+ }
2714
+ }
2715
+ &-accent {
2716
+ &-hover {
2717
+ & .rc-slider-handle-dragging {
2718
+ background: var(--color-surface-item-accent-hover);
2719
+ }
2720
+ }
2721
+ & .rc-slider-handle-dragging {
2722
+ background: var(--color-surface-item-accent);
2723
+ }
2724
+ }
2725
+ &-disabled {
2726
+ &-hover {
2727
+ & .rc-slider-handle-dragging {
2728
+ background: var(--color-surface-item-disabled-hover);
2729
+ }
2730
+ }
2731
+ & .rc-slider-handle-dragging {
2732
+ background: var(--color-surface-item-disabled);
2733
+ }
2734
+ }
2735
+ &-hover {
2736
+ &-hover {
2737
+ & .rc-slider-handle-dragging {
2738
+ background: var(--color-surface-item-hover-hover);
2739
+ }
2740
+ }
2741
+ & .rc-slider-handle-dragging {
2742
+ background: var(--color-surface-item-hover);
2743
+ }
373
2744
  }
374
- }
375
2745
  }
376
2746
  }
377
- }
378
- }
379
- .range-slider-handle-dragging-fill {
380
- @each $type in accent, primary, secondary, tertiary, surface, success, error {
381
- &_$(type) {
2747
+ &_success {
382
2748
  &-item {
383
- @each $color in primary, secondary, tertiary, quaternary, quinary,
384
- senary, accent, disabled, hover {
385
- &-$(color) {
2749
+ &-primary {
2750
+ &-hover {
2751
+ & .rc-slider-handle-dragging {
2752
+ background: var(--color-success-item-primary-hover);
2753
+ }
2754
+ }
386
2755
  & .rc-slider-handle-dragging {
387
- background: var(--color-$(type)-item-$(color));
2756
+ background: var(--color-success-item-primary);
2757
+ }
2758
+ }
2759
+ &-secondary {
2760
+ &-hover {
2761
+ & .rc-slider-handle-dragging {
2762
+ background: var(--color-success-item-secondary-hover);
2763
+ }
2764
+ }
2765
+ & .rc-slider-handle-dragging {
2766
+ background: var(--color-success-item-secondary);
2767
+ }
2768
+ }
2769
+ &-tertiary {
2770
+ &-hover {
2771
+ & .rc-slider-handle-dragging {
2772
+ background: var(--color-success-item-tertiary-hover);
2773
+ }
2774
+ }
2775
+ & .rc-slider-handle-dragging {
2776
+ background: var(--color-success-item-tertiary);
2777
+ }
2778
+ }
2779
+ &-quaternary {
2780
+ &-hover {
2781
+ & .rc-slider-handle-dragging {
2782
+ background: var(--color-success-item-quaternary-hover);
2783
+ }
2784
+ }
2785
+ & .rc-slider-handle-dragging {
2786
+ background: var(--color-success-item-quaternary);
2787
+ }
2788
+ }
2789
+ &-quinary {
2790
+ &-hover {
2791
+ & .rc-slider-handle-dragging {
2792
+ background: var(--color-success-item-quinary-hover);
2793
+ }
2794
+ }
2795
+ & .rc-slider-handle-dragging {
2796
+ background: var(--color-success-item-quinary);
2797
+ }
2798
+ }
2799
+ &-senary {
2800
+ &-hover {
2801
+ & .rc-slider-handle-dragging {
2802
+ background: var(--color-success-item-senary-hover);
2803
+ }
2804
+ }
2805
+ & .rc-slider-handle-dragging {
2806
+ background: var(--color-success-item-senary);
2807
+ }
2808
+ }
2809
+ &-accent {
2810
+ &-hover {
2811
+ & .rc-slider-handle-dragging {
2812
+ background: var(--color-success-item-accent-hover);
2813
+ }
2814
+ }
2815
+ & .rc-slider-handle-dragging {
2816
+ background: var(--color-success-item-accent);
2817
+ }
2818
+ }
2819
+ &-disabled {
2820
+ &-hover {
2821
+ & .rc-slider-handle-dragging {
2822
+ background: var(--color-success-item-disabled-hover);
2823
+ }
2824
+ }
2825
+ & .rc-slider-handle-dragging {
2826
+ background: var(--color-success-item-disabled);
2827
+ }
2828
+ }
2829
+ &-hover {
2830
+ &-hover {
2831
+ & .rc-slider-handle-dragging {
2832
+ background: var(--color-success-item-hover-hover);
2833
+ }
2834
+ }
2835
+ & .rc-slider-handle-dragging {
2836
+ background: var(--color-success-item-hover);
388
2837
  }
389
2838
  }
390
- }
391
2839
  }
392
2840
  }
393
- }
394
- }
395
- .range-slider-handle-dragging-fill-hover {
396
- @each $type in accent, primary, secondary, tertiary, surface, success, error {
397
- &_$(type) {
2841
+ &_error {
398
2842
  &-item {
399
- @each $color in primary, secondary, tertiary, quaternary, quinary,
400
- senary, accent, disabled, hover {
401
- &-$(color) {
2843
+ &-primary {
402
2844
  &-hover {
403
2845
  & .rc-slider-handle-dragging {
404
- background: var(--color-$(type)-item-$(color)-hover);
2846
+ background: var(--color-error-item-primary-hover);
405
2847
  }
406
2848
  }
407
2849
  & .rc-slider-handle-dragging {
408
- background: var(--color-$(type)-item-$(color));
2850
+ background: var(--color-error-item-primary);
2851
+ }
2852
+ }
2853
+ &-secondary {
2854
+ &-hover {
2855
+ & .rc-slider-handle-dragging {
2856
+ background: var(--color-error-item-secondary-hover);
2857
+ }
2858
+ }
2859
+ & .rc-slider-handle-dragging {
2860
+ background: var(--color-error-item-secondary);
2861
+ }
2862
+ }
2863
+ &-tertiary {
2864
+ &-hover {
2865
+ & .rc-slider-handle-dragging {
2866
+ background: var(--color-error-item-tertiary-hover);
2867
+ }
2868
+ }
2869
+ & .rc-slider-handle-dragging {
2870
+ background: var(--color-error-item-tertiary);
2871
+ }
2872
+ }
2873
+ &-quaternary {
2874
+ &-hover {
2875
+ & .rc-slider-handle-dragging {
2876
+ background: var(--color-error-item-quaternary-hover);
2877
+ }
2878
+ }
2879
+ & .rc-slider-handle-dragging {
2880
+ background: var(--color-error-item-quaternary);
2881
+ }
2882
+ }
2883
+ &-quinary {
2884
+ &-hover {
2885
+ & .rc-slider-handle-dragging {
2886
+ background: var(--color-error-item-quinary-hover);
2887
+ }
2888
+ }
2889
+ & .rc-slider-handle-dragging {
2890
+ background: var(--color-error-item-quinary);
2891
+ }
2892
+ }
2893
+ &-senary {
2894
+ &-hover {
2895
+ & .rc-slider-handle-dragging {
2896
+ background: var(--color-error-item-senary-hover);
2897
+ }
2898
+ }
2899
+ & .rc-slider-handle-dragging {
2900
+ background: var(--color-error-item-senary);
2901
+ }
2902
+ }
2903
+ &-accent {
2904
+ &-hover {
2905
+ & .rc-slider-handle-dragging {
2906
+ background: var(--color-error-item-accent-hover);
2907
+ }
2908
+ }
2909
+ & .rc-slider-handle-dragging {
2910
+ background: var(--color-error-item-accent);
2911
+ }
2912
+ }
2913
+ &-disabled {
2914
+ &-hover {
2915
+ & .rc-slider-handle-dragging {
2916
+ background: var(--color-error-item-disabled-hover);
2917
+ }
2918
+ }
2919
+ & .rc-slider-handle-dragging {
2920
+ background: var(--color-error-item-disabled);
2921
+ }
2922
+ }
2923
+ &-hover {
2924
+ &-hover {
2925
+ & .rc-slider-handle-dragging {
2926
+ background: var(--color-error-item-hover-hover);
2927
+ }
2928
+ }
2929
+ & .rc-slider-handle-dragging {
2930
+ background: var(--color-error-item-hover);
409
2931
  }
410
2932
  }
411
- }
412
2933
  }
413
2934
  }
414
- }
415
2935
  }
416
2936
  .range-slider {
417
2937
  &_set {