@empathyco/x-components 6.0.0-alpha.31 → 6.0.0-alpha.32

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.
@@ -1,4 +1,5 @@
1
1
 
2
+
2
3
  .x-uppercase {
3
4
  text-transform: uppercase;
4
5
  }
@@ -493,7 +494,6 @@
493
494
  [dir="rtl"] .x-padding--left-20 {
494
495
  padding-right: var(--x-size-base-20) !important;
495
496
  }
496
-
497
497
  .x-margin--auto {
498
498
  margin: auto !important;
499
499
  }
@@ -3378,6 +3378,9 @@
3378
3378
  :root {
3379
3379
  --x-color-text-secondary: var(--x-color-base-neutral-35);
3380
3380
  }
3381
+ .x-text--secondary {
3382
+ --x-color-text-default: var(--x-color-text-secondary);
3383
+ }
3381
3384
  .x-text--light.x-text {
3382
3385
  --x-number-font-weight-text: var(--x-number-font-weight-base-light);
3383
3386
  }
@@ -3393,9 +3396,6 @@
3393
3396
  .x-text--light.x-small {
3394
3397
  --x-number-font-weight-small: var(--x-number-font-weight-base-light);
3395
3398
  }
3396
- .x-text--secondary {
3397
- --x-color-text-default: var(--x-color-text-secondary);
3398
- }
3399
3399
  :root {
3400
3400
  --x-font-family-base: "Montserrat", sans-serif;
3401
3401
  --x-size-font-base-xs: 12px;
@@ -3538,9 +3538,6 @@
3538
3538
  overflow: hidden;
3539
3539
  white-space: nowrap;
3540
3540
  }
3541
- :root {
3542
- --x-color-text-accent: var(--x-color-base-accent);
3543
- }
3544
3541
  .x-text--bold.x-text {
3545
3542
  --x-number-font-weight-text: var(--x-number-font-weight-base-bold);
3546
3543
  }
@@ -3556,6 +3553,9 @@
3556
3553
  .x-text--bold.x-small {
3557
3554
  --x-number-font-weight-small: var(--x-number-font-weight-base-bold);
3558
3555
  }
3556
+ :root {
3557
+ --x-color-text-accent: var(--x-color-base-accent);
3558
+ }
3559
3559
  .x-text--accent {
3560
3560
  --x-color-text-default: var(--x-color-text-accent);
3561
3561
  }
@@ -3566,6 +3566,18 @@
3566
3566
  --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3567
3567
  --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3568
3568
  }
3569
+ :root {
3570
+ --x-color-background-tag-ghost: transparent;
3571
+ --x-color-border-tag-ghost: transparent;
3572
+ --x-color-background-tag-selected-ghost: transparent;
3573
+ --x-color-border-tag-selected-ghost: transparent;
3574
+ --x-color-background-tag-curated-ghost: transparent;
3575
+ --x-color-border-tag-curated-ghost: transparent;
3576
+ --x-color-background-tag-curated-selected-ghost: transparent;
3577
+ --x-color-border-tag-curated-selected-ghost: transparent;
3578
+ --x-number-font-weight-tag-selected-ghost: var(--x-number-font-weight-base-bold);
3579
+ --x-number-font-weight-tag-curated-selected-ghost: var(--x-number-font-weight-base-bold);
3580
+ }
3569
3581
  :root {
3570
3582
  --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
3571
3583
  --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
@@ -3596,6 +3608,24 @@
3596
3608
  --x-number-font-weight-tag-selected-ghost: var(--x-number-font-weight-base-bold);
3597
3609
  --x-number-font-weight-tag-curated-selected-ghost: var(--x-number-font-weight-base-bold);
3598
3610
  }
3611
+
3612
+ .x-tag--ghost.x-tag,
3613
+ .x-tag--ghost .x-tag {
3614
+ --x-color-background-tag-default: var(--x-color-background-tag-ghost);
3615
+ --x-color-border-tag-default: var(--x-color-border-tag-ghost);
3616
+ --x-color-background-tag-default-curated: var(--x-color-background-tag-curated-ghost);
3617
+ --x-color-border-tag-default-curated: var(--x-color-border-tag-curated-ghost);
3618
+ --x-color-background-tag-default-selected: var(--x-color-background-tag-selected-ghost);
3619
+ --x-color-border-tag-default-selected: var(--x-color-border-tag-selected-ghost);
3620
+ --x-color-background-tag-default-curated-selected: var(
3621
+ --x-color-background-tag-curated-selected-ghost
3622
+ );
3623
+ --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-curated-selected-ghost);
3624
+ --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-selected-ghost);
3625
+ --x-number-font-weight-tag-default-curated-selected: var(
3626
+ --x-number-font-weight-tag-curated-selected-ghost
3627
+ );
3628
+ }
3599
3629
  :root {
3600
3630
  --x-color-background-tag-default: var(--x-color-base-neutral-100);
3601
3631
  --x-color-border-tag-default: var(--x-color-text-tag-default);
@@ -3642,36 +3672,6 @@
3642
3672
  --x-number-font-weight-tag-default-selected
3643
3673
  );
3644
3674
  }
3645
- :root {
3646
- --x-color-background-tag-ghost: transparent;
3647
- --x-color-border-tag-ghost: transparent;
3648
- --x-color-background-tag-selected-ghost: transparent;
3649
- --x-color-border-tag-selected-ghost: transparent;
3650
- --x-color-background-tag-curated-ghost: transparent;
3651
- --x-color-border-tag-curated-ghost: transparent;
3652
- --x-color-background-tag-curated-selected-ghost: transparent;
3653
- --x-color-border-tag-curated-selected-ghost: transparent;
3654
- --x-number-font-weight-tag-selected-ghost: var(--x-number-font-weight-base-bold);
3655
- --x-number-font-weight-tag-curated-selected-ghost: var(--x-number-font-weight-base-bold);
3656
- }
3657
-
3658
- .x-tag--ghost.x-tag,
3659
- .x-tag--ghost .x-tag {
3660
- --x-color-background-tag-default: var(--x-color-background-tag-ghost);
3661
- --x-color-border-tag-default: var(--x-color-border-tag-ghost);
3662
- --x-color-background-tag-default-curated: var(--x-color-background-tag-curated-ghost);
3663
- --x-color-border-tag-default-curated: var(--x-color-border-tag-curated-ghost);
3664
- --x-color-background-tag-default-selected: var(--x-color-background-tag-selected-ghost);
3665
- --x-color-border-tag-default-selected: var(--x-color-border-tag-selected-ghost);
3666
- --x-color-background-tag-default-curated-selected: var(
3667
- --x-color-background-tag-curated-selected-ghost
3668
- );
3669
- --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-curated-selected-ghost);
3670
- --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-selected-ghost);
3671
- --x-number-font-weight-tag-default-curated-selected: var(
3672
- --x-number-font-weight-tag-curated-selected-ghost
3673
- );
3674
- }
3675
3675
  :root {
3676
3676
  --x-color-background-tag-default: var(--x-color-base-neutral-100);
3677
3677
  --x-color-border-tag-default: var(--x-color-text-tag-default);
@@ -3900,6 +3900,24 @@
3900
3900
  --x-size-border-radius-bottom-right-tag-card: var(--x-size-border-radius-tag-card);
3901
3901
  --x-size-border-radius-bottom-left-tag-card: var(--x-size-border-radius-tag-card);
3902
3902
  }
3903
+ :root {
3904
+ --x-size-border-radius-tag-card: var(--x-size-border-radius-base-s);
3905
+ --x-size-border-radius-top-left-tag-card: var(--x-size-border-radius-tag-card);
3906
+ --x-size-border-radius-top-right-tag-card: var(--x-size-border-radius-tag-card);
3907
+ --x-size-border-radius-bottom-right-tag-card: var(--x-size-border-radius-tag-card);
3908
+ --x-size-border-radius-bottom-left-tag-card: var(--x-size-border-radius-tag-card);
3909
+ }
3910
+
3911
+ .x-tag--card.x-tag,
3912
+ .x-tag--card .x-tag {
3913
+ --x-size-border-radius-tag-default: var(--x-size-border-radius-tag-card);
3914
+ --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-top-left-tag-card);
3915
+ --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-top-right-tag-card);
3916
+ --x-size-border-radius-bottom-right-tag-default: var(
3917
+ --x-size-border-radius-bottom-right-tag-card
3918
+ );
3919
+ --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-card);
3920
+ }
3903
3921
  :root {
3904
3922
  --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
3905
3923
  --x-color-text-suggestion-group-matching-part-default: var(
@@ -3941,24 +3959,6 @@
3941
3959
  --x-size-line-height-suggestion-group-default: var(--x-size-line-height-suggestion-default);
3942
3960
  --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-suggestion-default);
3943
3961
  }
3944
- :root {
3945
- --x-size-border-radius-tag-card: var(--x-size-border-radius-base-s);
3946
- --x-size-border-radius-top-left-tag-card: var(--x-size-border-radius-tag-card);
3947
- --x-size-border-radius-top-right-tag-card: var(--x-size-border-radius-tag-card);
3948
- --x-size-border-radius-bottom-right-tag-card: var(--x-size-border-radius-tag-card);
3949
- --x-size-border-radius-bottom-left-tag-card: var(--x-size-border-radius-tag-card);
3950
- }
3951
-
3952
- .x-tag--card.x-tag,
3953
- .x-tag--card .x-tag {
3954
- --x-size-border-radius-tag-default: var(--x-size-border-radius-tag-card);
3955
- --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-top-left-tag-card);
3956
- --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-top-right-tag-card);
3957
- --x-size-border-radius-bottom-right-tag-default: var(
3958
- --x-size-border-radius-bottom-right-tag-card
3959
- );
3960
- --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-card);
3961
- }
3962
3962
  :root {
3963
3963
  --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
3964
3964
  --x-color-text-suggestion-group-matching-part-default: var(
@@ -4500,14 +4500,6 @@
4500
4500
  --x-size-padding-row-05: var(--x-size-base-05);
4501
4501
  --x-size-padding-row-06: var(--x-size-base-06);
4502
4502
  }
4503
- /* @deprecated */
4504
- :root {
4505
- --x-size-padding-row-02: var(--x-size-base-02);
4506
- --x-size-padding-row-03: var(--x-size-base-03);
4507
- --x-size-padding-row-04: var(--x-size-base-04);
4508
- --x-size-padding-row-05: var(--x-size-base-05);
4509
- --x-size-padding-row-06: var(--x-size-base-06);
4510
- }
4511
4503
 
4512
4504
  /* @deprecated */
4513
4505
  .x-row--padding-02 {
@@ -4529,6 +4521,14 @@
4529
4521
  .x-row--padding-06 {
4530
4522
  --x-size-padding-row: var(--x-size-padding-row-06);
4531
4523
  }
4524
+ /* @deprecated */
4525
+ :root {
4526
+ --x-size-padding-row-02: var(--x-size-base-02);
4527
+ --x-size-padding-row-03: var(--x-size-base-03);
4528
+ --x-size-padding-row-04: var(--x-size-base-04);
4529
+ --x-size-padding-row-05: var(--x-size-base-05);
4530
+ --x-size-padding-row-06: var(--x-size-base-06);
4531
+ }
4532
4532
  :root {
4533
4533
  --x-size-gap-row-01: var(--x-size-base-01);
4534
4534
  --x-size-gap-row-02: var(--x-size-base-02);
@@ -4806,9 +4806,6 @@
4806
4806
  --x-size-border-width-result-description-default: 0;
4807
4807
  --x-size-border-width-result-picture-default: 0;
4808
4808
  }
4809
- :root {
4810
- --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4811
- }
4812
4809
  :root {
4813
4810
  --x-color-border-result-default: var(--x-color-base-lead);
4814
4811
  --x-color-border-result-overlay-default: var(--x-color-border-result-default);
@@ -4879,6 +4876,17 @@
4879
4876
  opacity: 1;
4880
4877
  }
4881
4878
  }
4879
+ :root {
4880
+ --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4881
+ }
4882
+ :root {
4883
+ --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4884
+ }
4885
+
4886
+ .x-result.x-result--card {
4887
+ overflow: hidden;
4888
+ --x-size-border-radius-result-default: var(--x-size-border-radius-result-card);
4889
+ }
4882
4890
  :root {
4883
4891
  --x-size-height-progress-bar-line-default: var(--x-size-base-02);
4884
4892
  --x-size-width-progress-bar-line-default: var(--x-size-base-20);
@@ -4889,12 +4897,8 @@
4889
4897
  --x-size-border-width-progress-bar-default: 0;
4890
4898
  }
4891
4899
  :root {
4892
- --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4893
- }
4894
-
4895
- .x-result.x-result--card {
4896
- overflow: hidden;
4897
- --x-size-border-radius-result-default: var(--x-size-border-radius-result-card);
4900
+ --x-number-zoom-scale-picture: 1.1;
4901
+ --x-number-zoom-duration-picture: 0.3s;
4898
4902
  }
4899
4903
  :root {
4900
4904
  --x-size-height-progress-bar-line-default: var(--x-size-base-02);
@@ -4925,10 +4929,6 @@
4925
4929
  --x-number-zoom-scale-picture: 1.1;
4926
4930
  --x-number-zoom-duration-picture: 0.3s;
4927
4931
  }
4928
- :root {
4929
- --x-number-zoom-scale-picture: 1.1;
4930
- --x-number-zoom-duration-picture: 0.3s;
4931
- }
4932
4932
 
4933
4933
  .x-picture--zoom .x-picture-image {
4934
4934
  transition: transform var(--x-number-zoom-duration-picture) ease-out;
@@ -4939,14 +4939,14 @@
4939
4939
  :root {
4940
4940
  --x-number-aspect-ratio-picture: 1;
4941
4941
  }
4942
- :root {
4943
- --x-number-aspect-ratio-picture: 1;
4944
- }
4945
4942
 
4946
4943
  .x-picture--fixed-ratio.x-picture {
4947
4944
  aspect-ratio: var(--x-number-aspect-ratio-picture);
4948
4945
  width: 100%;
4949
4946
  }
4947
+ :root {
4948
+ --x-number-aspect-ratio-picture: 1;
4949
+ }
4950
4950
  :root {
4951
4951
  --x-size-border-radius-picture-default: 0;
4952
4952
  --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
@@ -5025,6 +5025,12 @@
5025
5025
  --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
5026
5026
  --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
5027
5027
  }
5028
+ :root {
5029
+ --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5030
+ --x-mix-blend-mode-picture-colored: multiply;
5031
+ --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5032
+ --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5033
+ }
5028
5034
  :root {
5029
5035
  --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
5030
5036
  --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
@@ -5051,19 +5057,6 @@
5051
5057
  --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5052
5058
  --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5053
5059
  }
5054
- :root {
5055
- --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5056
- --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5057
- --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5058
- --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5059
- --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5060
- }
5061
- :root {
5062
- --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5063
- --x-mix-blend-mode-picture-colored: multiply;
5064
- --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5065
- --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5066
- }
5067
5060
 
5068
5061
  .x-picture--colored.x-picture {
5069
5062
  --x-color-background-picture-default: var(--x-color-background-picture-colored);
@@ -5084,6 +5077,13 @@
5084
5077
  --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5085
5078
  --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5086
5079
  }
5080
+ :root {
5081
+ --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5082
+ --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5083
+ --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5084
+ --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5085
+ --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5086
+ }
5087
5087
 
5088
5088
  .x-picture--card.x-picture {
5089
5089
  --x-size-border-radius-picture-default: var(--x-size-border-radius-picture-card);
@@ -5092,6 +5092,51 @@
5092
5092
  --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-bottom-picture-card);
5093
5093
  --x-size-border-radius-left-picture-default: var(--x-size-border-radius-left-picture-card);
5094
5094
  }
5095
+ :root {
5096
+ --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5097
+ --x-color-text-option-list-button-bottom-selected-hover: var(
5098
+ --x-color-text-option-list-button-bottom-selected
5099
+ );
5100
+ --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
5101
+ --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
5102
+ --x-color-border-option-list-item-bottom: transparent;
5103
+ --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5104
+ --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5105
+ --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5106
+ --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5107
+ --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
5108
+ --x-color-border-top-option-list-item-bottom-selected: var(
5109
+ --x-color-border-option-list-item-bottom
5110
+ );
5111
+ --x-color-border-right-option-list-item-bottom-selected: var(
5112
+ --x-color-border-option-list-item-bottom
5113
+ );
5114
+ --x-color-border-bottom-option-list-item-bottom-selected: var(
5115
+ --x-color-border-option-list-item-bottom-selected
5116
+ );
5117
+ --x-color-border-left-option-list-item-bottom-selected: var(
5118
+ --x-color-border-option-list-item-bottom
5119
+ );
5120
+ --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
5121
+ --x-size-border-width-top-option-list-item-bottom: 0;
5122
+ --x-size-border-width-right-option-list-item-bottom: 0;
5123
+ --x-size-border-width-bottom-option-list-item-bottom: var(
5124
+ --x-size-border-width-option-list-item-bottom
5125
+ );
5126
+ --x-size-border-width-left-option-list-item-bottom: 0;
5127
+ --x-size-border-width-top-option-list-item-bottom-selected: 0;
5128
+ --x-size-border-width-right-option-list-item-bottom-selected: 0;
5129
+ --x-size-border-width-bottom-option-list-item-bottom-selected: var(
5130
+ --x-size-border-width-option-list-item-bottom
5131
+ );
5132
+ --x-size-border-width-left-option-list-item-bottom-selected: 0;
5133
+ --x-size-font-option-list-button-bottom: var(--x-size-font-text);
5134
+ --x-font-decoration-option-list-button-bottom-hover: none;
5135
+ --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
5136
+ --x-number-font-weight-option-list-button-bottom-selected: var(
5137
+ --x-number-font-weight-base-regular
5138
+ );
5139
+ }
5095
5140
  :root {
5096
5141
  --x-color-background-option-list-button-default: transparent;
5097
5142
  --x-color-border-option-list-button-default: transparent;
@@ -5173,21 +5218,186 @@
5173
5218
  --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
5174
5219
  }
5175
5220
  :root {
5176
- --x-color-background-option-list-button-default: transparent;
5177
- --x-color-border-option-list-button-default: transparent;
5178
- --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
5179
- --x-color-background-option-list-button-default-hover: var(
5180
- --x-color-background-option-list-button-default
5221
+ --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5222
+ --x-color-text-option-list-button-bottom-selected-hover: var(
5223
+ --x-color-text-option-list-button-bottom-selected
5181
5224
  );
5182
- --x-color-border-option-list-button-default-hover: var(
5183
- --x-color-border-option-list-button-default
5225
+ --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
5226
+ --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
5227
+ --x-color-border-option-list-item-bottom: transparent;
5228
+ --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5229
+ --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5230
+ --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5231
+ --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5232
+ --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
5233
+ --x-color-border-top-option-list-item-bottom-selected: var(
5234
+ --x-color-border-option-list-item-bottom
5184
5235
  );
5185
- --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
5186
- --x-color-background-option-list-button-default-selected: var(
5187
- --x-color-background-option-list-button-default
5236
+ --x-color-border-right-option-list-item-bottom-selected: var(
5237
+ --x-color-border-option-list-item-bottom
5188
5238
  );
5189
- --x-color-border-option-list-button-default-selected: var(
5190
- --x-color-border-option-list-button-default
5239
+ --x-color-border-bottom-option-list-item-bottom-selected: var(
5240
+ --x-color-border-option-list-item-bottom-selected
5241
+ );
5242
+ --x-color-border-left-option-list-item-bottom-selected: var(
5243
+ --x-color-border-option-list-item-bottom
5244
+ );
5245
+ --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
5246
+ --x-size-border-width-top-option-list-item-bottom: 0;
5247
+ --x-size-border-width-right-option-list-item-bottom: 0;
5248
+ --x-size-border-width-bottom-option-list-item-bottom: var(
5249
+ --x-size-border-width-option-list-item-bottom
5250
+ );
5251
+ --x-size-border-width-left-option-list-item-bottom: 0;
5252
+ --x-size-border-width-top-option-list-item-bottom-selected: 0;
5253
+ --x-size-border-width-right-option-list-item-bottom-selected: 0;
5254
+ --x-size-border-width-bottom-option-list-item-bottom-selected: var(
5255
+ --x-size-border-width-option-list-item-bottom
5256
+ );
5257
+ --x-size-border-width-left-option-list-item-bottom-selected: 0;
5258
+ --x-size-font-option-list-button-bottom: var(--x-size-font-text);
5259
+ --x-font-decoration-option-list-button-bottom-hover: none;
5260
+ --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
5261
+ --x-number-font-weight-option-list-button-bottom-selected: var(
5262
+ --x-number-font-weight-base-regular
5263
+ );
5264
+ }
5265
+
5266
+ .x-option-list--bottom.x-option-list,
5267
+ .x-option-list--bottom .x-option-list {
5268
+ --x-color-text-option-list-button-default: var(--x-color-text-option-list-button-bottom);
5269
+ --x-color-text-option-list-button-default-hover: var(
5270
+ --x-color-text-option-list-button-bottom-hover
5271
+ );
5272
+ --x-color-border-option-list-item-default: var(--x-color-border-option-list-item-bottom);
5273
+ --x-color-border-top-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
5274
+ --x-color-border-right-option-list-item-default: var(
5275
+ --x-color-border-top-option-list-item-bottom
5276
+ );
5277
+ --x-color-border-bottom-option-list-item-default: var(
5278
+ --x-color-border-top-option-list-item-bottom
5279
+ );
5280
+ --x-color-border-left-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
5281
+ --x-size-border-width-option-list-item-default: var(
5282
+ --x-size-border-width-option-list-item-bottom
5283
+ );
5284
+ --x-size-border-width-top-option-list-item-default: var(
5285
+ --x-size-border-width-top-option-list-item-bottom
5286
+ );
5287
+ --x-size-border-width-right-option-list-item-default: var(
5288
+ --x-size-border-width-right-option-list-item-bottom
5289
+ );
5290
+ --x-size-border-width-bottom-option-list-item-default: var(
5291
+ --x-size-border-width-bottom-option-list-item-bottom
5292
+ );
5293
+ --x-size-border-width-left-option-list-item-default: var(
5294
+ --x-size-border-width-left-option-list-item-bottom
5295
+ );
5296
+ --x-font-decoration-option-list-button-default-hover: var(
5297
+ --x-font-decoration-option-list-button-bottom-hover
5298
+ );
5299
+ --x-size-font-option-list-button-default: var(--x-size-font-option-list-button-bottom);
5300
+ --x-number-font-weight-option-list-button-default: var(
5301
+ --x-number-font-weight-option-list-button-bottom
5302
+ );
5303
+ }
5304
+ .x-option-list--bottom.x-option-list .x-option-list__item.x-option-list__item--is-selected,
5305
+ .x-option-list--bottom .x-option-list .x-option-list__item.x-option-list__item--is-selected {
5306
+ --x-color-text-option-list-button-default-selected: var(
5307
+ --x-color-text-option-list-button-bottom-selected
5308
+ );
5309
+ --x-color-text-option-list-button-default-selected-hover: var(
5310
+ --x-color-text-option-list-button-bottom-selected-hover
5311
+ );
5312
+ --x-color-border-option-list-item-default-selected: var(
5313
+ --x-color-border-option-list-item-bottom-selected
5314
+ );
5315
+ --x-color-border-top-option-list-item-default-selected: var(
5316
+ --x-color-border-top-option-list-item-bottom-selected
5317
+ );
5318
+ --x-color-border-right-option-list-item-default-selected: var(
5319
+ --x-color-border-top-option-list-item-bottom-selected
5320
+ );
5321
+ --x-color-border-bottom-option-list-item-default-selected: var(
5322
+ --x-color-border-bottom-option-list-item-bottom-selected
5323
+ );
5324
+ --x-color-border-left-option-list-item-default-selected: var(
5325
+ --x-color-border-top-option-list-item-bottom-selected
5326
+ );
5327
+ --x-size-border-width-top-option-list-item-default: var(
5328
+ --x-size-border-width-top-option-list-item-bottom-selected
5329
+ );
5330
+ --x-size-border-width-right-option-list-item-default: var(
5331
+ --x-size-border-width-right-option-list-item-bottom-selected
5332
+ );
5333
+ --x-size-border-width-bottom-option-list-item-default: var(
5334
+ --x-size-border-width-bottom-option-list-item-bottom-selected
5335
+ );
5336
+ --x-size-border-width-left-option-list-item-default: var(
5337
+ --x-size-border-width-left-option-list-item-bottom-selected
5338
+ );
5339
+ --x-number-font-weight-option-list-button-default-selected: var(
5340
+ --x-number-font-weight-option-list-button-bottom-selected
5341
+ );
5342
+ }
5343
+ .x-option-list--bottom.x-option-list .x-option-list__item:last-child,
5344
+ .x-option-list--bottom .x-option-list .x-option-list__item:last-child {
5345
+ --x-size-border-width-option-list-item-default: inherit;
5346
+ --x-size-border-width-top-option-list-item-default: inherit;
5347
+ --x-size-border-width-right-option-list-item-default: inherit;
5348
+ --x-size-border-width-bottom-option-list-item-default: inherit;
5349
+ --x-size-border-width-left-option-list-item-default: inherit;
5350
+ }
5351
+ :root {
5352
+ --x-modal-overlay-color: rgb(0, 0, 0);
5353
+ --x-modal-overlay-opacity: 0.7;
5354
+ }
5355
+ :root {
5356
+ --x-modal-overlay-color: rgb(0, 0, 0);
5357
+ --x-modal-overlay-opacity: 0.7;
5358
+ }
5359
+
5360
+ .x-modal__overlay {
5361
+ background-color: var(--x-modal-overlay-color) !important;
5362
+ opacity: var(--x-modal-overlay-opacity) !important;
5363
+ }
5364
+ :root {
5365
+ --x-string-justify-message-default: center;
5366
+ --x-size-gap-message-default: var(--x-size-base-03);
5367
+ --x-size-padding-message-default: var(--x-size-base-06);
5368
+ --x-color-background-message-default: var(--x-color-base-neutral-95);
5369
+ --x-color-border-message-default: var(--x-color-background-message-default);
5370
+ --x-color-text-message-default: var(--x-color-text-default);
5371
+ --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
5372
+ --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
5373
+ --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
5374
+ --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
5375
+ --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
5376
+ --x-size-border-width-message-default: var(--x-size-border-width-base);
5377
+ --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
5378
+ --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
5379
+ --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
5380
+ --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
5381
+ --x-font-family-message-default: var(--x-font-family-title3);
5382
+ --x-size-font-message-default: var(--x-size-font-title3);
5383
+ --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5384
+ }
5385
+ :root {
5386
+ --x-color-background-option-list-button-default: transparent;
5387
+ --x-color-border-option-list-button-default: transparent;
5388
+ --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
5389
+ --x-color-background-option-list-button-default-hover: var(
5390
+ --x-color-background-option-list-button-default
5391
+ );
5392
+ --x-color-border-option-list-button-default-hover: var(
5393
+ --x-color-border-option-list-button-default
5394
+ );
5395
+ --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
5396
+ --x-color-background-option-list-button-default-selected: var(
5397
+ --x-color-background-option-list-button-default
5398
+ );
5399
+ --x-color-border-option-list-button-default-selected: var(
5400
+ --x-color-border-option-list-button-default
5191
5401
  );
5192
5402
  --x-color-text-option-list-button-default-selected: var(--x-color-text-default);
5193
5403
  --x-color-background-option-list-button-default-selected-hover: var(
@@ -5364,216 +5574,6 @@
5364
5574
  -webkit-text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5365
5575
  text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5366
5576
  }
5367
- :root {
5368
- --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5369
- --x-color-text-option-list-button-bottom-selected-hover: var(
5370
- --x-color-text-option-list-button-bottom-selected
5371
- );
5372
- --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
5373
- --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
5374
- --x-color-border-option-list-item-bottom: transparent;
5375
- --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5376
- --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5377
- --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5378
- --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5379
- --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
5380
- --x-color-border-top-option-list-item-bottom-selected: var(
5381
- --x-color-border-option-list-item-bottom
5382
- );
5383
- --x-color-border-right-option-list-item-bottom-selected: var(
5384
- --x-color-border-option-list-item-bottom
5385
- );
5386
- --x-color-border-bottom-option-list-item-bottom-selected: var(
5387
- --x-color-border-option-list-item-bottom-selected
5388
- );
5389
- --x-color-border-left-option-list-item-bottom-selected: var(
5390
- --x-color-border-option-list-item-bottom
5391
- );
5392
- --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
5393
- --x-size-border-width-top-option-list-item-bottom: 0;
5394
- --x-size-border-width-right-option-list-item-bottom: 0;
5395
- --x-size-border-width-bottom-option-list-item-bottom: var(
5396
- --x-size-border-width-option-list-item-bottom
5397
- );
5398
- --x-size-border-width-left-option-list-item-bottom: 0;
5399
- --x-size-border-width-top-option-list-item-bottom-selected: 0;
5400
- --x-size-border-width-right-option-list-item-bottom-selected: 0;
5401
- --x-size-border-width-bottom-option-list-item-bottom-selected: var(
5402
- --x-size-border-width-option-list-item-bottom
5403
- );
5404
- --x-size-border-width-left-option-list-item-bottom-selected: 0;
5405
- --x-size-font-option-list-button-bottom: var(--x-size-font-text);
5406
- --x-font-decoration-option-list-button-bottom-hover: none;
5407
- --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
5408
- --x-number-font-weight-option-list-button-bottom-selected: var(
5409
- --x-number-font-weight-base-regular
5410
- );
5411
- }
5412
- :root {
5413
- --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5414
- --x-color-text-option-list-button-bottom-selected-hover: var(
5415
- --x-color-text-option-list-button-bottom-selected
5416
- );
5417
- --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
5418
- --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
5419
- --x-color-border-option-list-item-bottom: transparent;
5420
- --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5421
- --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5422
- --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5423
- --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5424
- --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
5425
- --x-color-border-top-option-list-item-bottom-selected: var(
5426
- --x-color-border-option-list-item-bottom
5427
- );
5428
- --x-color-border-right-option-list-item-bottom-selected: var(
5429
- --x-color-border-option-list-item-bottom
5430
- );
5431
- --x-color-border-bottom-option-list-item-bottom-selected: var(
5432
- --x-color-border-option-list-item-bottom-selected
5433
- );
5434
- --x-color-border-left-option-list-item-bottom-selected: var(
5435
- --x-color-border-option-list-item-bottom
5436
- );
5437
- --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
5438
- --x-size-border-width-top-option-list-item-bottom: 0;
5439
- --x-size-border-width-right-option-list-item-bottom: 0;
5440
- --x-size-border-width-bottom-option-list-item-bottom: var(
5441
- --x-size-border-width-option-list-item-bottom
5442
- );
5443
- --x-size-border-width-left-option-list-item-bottom: 0;
5444
- --x-size-border-width-top-option-list-item-bottom-selected: 0;
5445
- --x-size-border-width-right-option-list-item-bottom-selected: 0;
5446
- --x-size-border-width-bottom-option-list-item-bottom-selected: var(
5447
- --x-size-border-width-option-list-item-bottom
5448
- );
5449
- --x-size-border-width-left-option-list-item-bottom-selected: 0;
5450
- --x-size-font-option-list-button-bottom: var(--x-size-font-text);
5451
- --x-font-decoration-option-list-button-bottom-hover: none;
5452
- --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
5453
- --x-number-font-weight-option-list-button-bottom-selected: var(
5454
- --x-number-font-weight-base-regular
5455
- );
5456
- }
5457
-
5458
- .x-option-list--bottom.x-option-list,
5459
- .x-option-list--bottom .x-option-list {
5460
- --x-color-text-option-list-button-default: var(--x-color-text-option-list-button-bottom);
5461
- --x-color-text-option-list-button-default-hover: var(
5462
- --x-color-text-option-list-button-bottom-hover
5463
- );
5464
- --x-color-border-option-list-item-default: var(--x-color-border-option-list-item-bottom);
5465
- --x-color-border-top-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
5466
- --x-color-border-right-option-list-item-default: var(
5467
- --x-color-border-top-option-list-item-bottom
5468
- );
5469
- --x-color-border-bottom-option-list-item-default: var(
5470
- --x-color-border-top-option-list-item-bottom
5471
- );
5472
- --x-color-border-left-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
5473
- --x-size-border-width-option-list-item-default: var(
5474
- --x-size-border-width-option-list-item-bottom
5475
- );
5476
- --x-size-border-width-top-option-list-item-default: var(
5477
- --x-size-border-width-top-option-list-item-bottom
5478
- );
5479
- --x-size-border-width-right-option-list-item-default: var(
5480
- --x-size-border-width-right-option-list-item-bottom
5481
- );
5482
- --x-size-border-width-bottom-option-list-item-default: var(
5483
- --x-size-border-width-bottom-option-list-item-bottom
5484
- );
5485
- --x-size-border-width-left-option-list-item-default: var(
5486
- --x-size-border-width-left-option-list-item-bottom
5487
- );
5488
- --x-font-decoration-option-list-button-default-hover: var(
5489
- --x-font-decoration-option-list-button-bottom-hover
5490
- );
5491
- --x-size-font-option-list-button-default: var(--x-size-font-option-list-button-bottom);
5492
- --x-number-font-weight-option-list-button-default: var(
5493
- --x-number-font-weight-option-list-button-bottom
5494
- );
5495
- }
5496
- .x-option-list--bottom.x-option-list .x-option-list__item.x-option-list__item--is-selected,
5497
- .x-option-list--bottom .x-option-list .x-option-list__item.x-option-list__item--is-selected {
5498
- --x-color-text-option-list-button-default-selected: var(
5499
- --x-color-text-option-list-button-bottom-selected
5500
- );
5501
- --x-color-text-option-list-button-default-selected-hover: var(
5502
- --x-color-text-option-list-button-bottom-selected-hover
5503
- );
5504
- --x-color-border-option-list-item-default-selected: var(
5505
- --x-color-border-option-list-item-bottom-selected
5506
- );
5507
- --x-color-border-top-option-list-item-default-selected: var(
5508
- --x-color-border-top-option-list-item-bottom-selected
5509
- );
5510
- --x-color-border-right-option-list-item-default-selected: var(
5511
- --x-color-border-top-option-list-item-bottom-selected
5512
- );
5513
- --x-color-border-bottom-option-list-item-default-selected: var(
5514
- --x-color-border-bottom-option-list-item-bottom-selected
5515
- );
5516
- --x-color-border-left-option-list-item-default-selected: var(
5517
- --x-color-border-top-option-list-item-bottom-selected
5518
- );
5519
- --x-size-border-width-top-option-list-item-default: var(
5520
- --x-size-border-width-top-option-list-item-bottom-selected
5521
- );
5522
- --x-size-border-width-right-option-list-item-default: var(
5523
- --x-size-border-width-right-option-list-item-bottom-selected
5524
- );
5525
- --x-size-border-width-bottom-option-list-item-default: var(
5526
- --x-size-border-width-bottom-option-list-item-bottom-selected
5527
- );
5528
- --x-size-border-width-left-option-list-item-default: var(
5529
- --x-size-border-width-left-option-list-item-bottom-selected
5530
- );
5531
- --x-number-font-weight-option-list-button-default-selected: var(
5532
- --x-number-font-weight-option-list-button-bottom-selected
5533
- );
5534
- }
5535
- .x-option-list--bottom.x-option-list .x-option-list__item:last-child,
5536
- .x-option-list--bottom .x-option-list .x-option-list__item:last-child {
5537
- --x-size-border-width-option-list-item-default: inherit;
5538
- --x-size-border-width-top-option-list-item-default: inherit;
5539
- --x-size-border-width-right-option-list-item-default: inherit;
5540
- --x-size-border-width-bottom-option-list-item-default: inherit;
5541
- --x-size-border-width-left-option-list-item-default: inherit;
5542
- }
5543
- :root {
5544
- --x-modal-overlay-color: rgb(0, 0, 0);
5545
- --x-modal-overlay-opacity: 0.7;
5546
- }
5547
- :root {
5548
- --x-modal-overlay-color: rgb(0, 0, 0);
5549
- --x-modal-overlay-opacity: 0.7;
5550
- }
5551
-
5552
- .x-modal__overlay {
5553
- background-color: var(--x-modal-overlay-color) !important;
5554
- opacity: var(--x-modal-overlay-opacity) !important;
5555
- }
5556
- :root {
5557
- --x-string-justify-message-default: center;
5558
- --x-size-gap-message-default: var(--x-size-base-03);
5559
- --x-size-padding-message-default: var(--x-size-base-06);
5560
- --x-color-background-message-default: var(--x-color-base-neutral-95);
5561
- --x-color-border-message-default: var(--x-color-background-message-default);
5562
- --x-color-text-message-default: var(--x-color-text-default);
5563
- --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
5564
- --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
5565
- --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
5566
- --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
5567
- --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
5568
- --x-size-border-width-message-default: var(--x-size-border-width-base);
5569
- --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
5570
- --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
5571
- --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
5572
- --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
5573
- --x-font-family-message-default: var(--x-font-family-title3);
5574
- --x-size-font-message-default: var(--x-size-font-title3);
5575
- --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5576
- }
5577
5577
  :root {
5578
5578
  --x-string-justify-message-default: center;
5579
5579
  --x-size-gap-message-default: var(--x-size-base-03);
@@ -5998,30 +5998,8 @@
5998
5998
  gap: 0;
5999
5999
  }
6000
6000
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6001
- margin-right: var(--x-size-gap-list-13);
6002
- }
6003
- }
6004
- :root {
6005
- --x-size-gap-list-01: var(--x-size-base-01);
6006
- --x-size-gap-list-02: var(--x-size-base-02);
6007
- --x-size-gap-list-03: var(--x-size-base-03);
6008
- --x-size-gap-list-04: var(--x-size-base-04);
6009
- --x-size-gap-list-05: var(--x-size-base-05);
6010
- --x-size-gap-list-06: var(--x-size-base-06);
6011
- --x-size-gap-list-07: var(--x-size-base-07);
6012
- --x-size-gap-list-08: var(--x-size-base-08);
6013
- --x-size-gap-list-09: var(--x-size-base-09);
6014
- --x-size-gap-list-10: var(--x-size-base-10);
6015
- --x-size-gap-list-11: var(--x-size-base-11);
6016
- --x-size-gap-list-12: var(--x-size-base-12);
6017
- --x-size-gap-list-13: var(--x-size-base-13);
6018
- --x-size-gap-list-14: var(--x-size-base-14);
6019
- --x-size-gap-list-15: var(--x-size-base-15);
6020
- --x-size-gap-list-16: var(--x-size-base-16);
6021
- --x-size-gap-list-17: var(--x-size-base-17);
6022
- --x-size-gap-list-18: var(--x-size-base-18);
6023
- --x-size-gap-list-19: var(--x-size-base-19);
6024
- --x-size-gap-list-20: var(--x-size-base-20);
6001
+ margin-right: var(--x-size-gap-list-13);
6002
+ }
6025
6003
  }
6026
6004
  :root {
6027
6005
  --x-size-gap-list-01: var(--x-size-base-01);
@@ -6545,6 +6523,28 @@
6545
6523
  margin-bottom: var(--x-size-gap-list-20);
6546
6524
  }
6547
6525
  }
6526
+ :root {
6527
+ --x-size-gap-list-01: var(--x-size-base-01);
6528
+ --x-size-gap-list-02: var(--x-size-base-02);
6529
+ --x-size-gap-list-03: var(--x-size-base-03);
6530
+ --x-size-gap-list-04: var(--x-size-base-04);
6531
+ --x-size-gap-list-05: var(--x-size-base-05);
6532
+ --x-size-gap-list-06: var(--x-size-base-06);
6533
+ --x-size-gap-list-07: var(--x-size-base-07);
6534
+ --x-size-gap-list-08: var(--x-size-base-08);
6535
+ --x-size-gap-list-09: var(--x-size-base-09);
6536
+ --x-size-gap-list-10: var(--x-size-base-10);
6537
+ --x-size-gap-list-11: var(--x-size-base-11);
6538
+ --x-size-gap-list-12: var(--x-size-base-12);
6539
+ --x-size-gap-list-13: var(--x-size-base-13);
6540
+ --x-size-gap-list-14: var(--x-size-base-14);
6541
+ --x-size-gap-list-15: var(--x-size-base-15);
6542
+ --x-size-gap-list-16: var(--x-size-base-16);
6543
+ --x-size-gap-list-17: var(--x-size-base-17);
6544
+ --x-size-gap-list-18: var(--x-size-base-18);
6545
+ --x-size-gap-list-19: var(--x-size-base-19);
6546
+ --x-size-gap-list-20: var(--x-size-base-20);
6547
+ }
6548
6548
  :root {
6549
6549
  --x-string-flow-list: column nowrap;
6550
6550
  --x-size-padding-list: 0;
@@ -6745,6 +6745,49 @@
6745
6745
  --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6746
6746
  --x-size-border-width-left-input-group-line: 0;
6747
6747
  }
6748
+ :root {
6749
+ --x-color-background-input-group-default: var(--x-color-background-input-default);
6750
+ --x-color-border-input-group-default: var(--x-color-border-input-default);
6751
+ --x-color-border-input-group-default-focus: var(--x-color-border-input-default-focus);
6752
+ --x-color-text-input-group-default: var(--x-color-text-input-default);
6753
+ --x-color-text-input-group-placeholder-default: var(--x-color-text-input-placeholder-default);
6754
+ --x-size-height-input-group-default: var(--x-size-height-input-default);
6755
+ --x-size-gap-input-group-default: var(--x-size-base-03);
6756
+ --x-size-padding-left-input-group-default: var(--x-size-base-06);
6757
+ --x-size-padding-right-input-group-default: var(--x-size-padding-left-input-group-default);
6758
+ --x-size-padding-input-group-default-action: var(--x-size-base-03);
6759
+ --x-size-border-width-input-group-default: var(--x-size-border-width-input-default);
6760
+ --x-size-border-width-top-input-group-default: var(--x-size-border-width-input-group-default);
6761
+ --x-size-border-width-right-input-group-default: var(--x-size-border-width-input-group-default);
6762
+ --x-size-border-width-bottom-input-group-default: var(--x-size-border-width-input-group-default);
6763
+ --x-size-border-width-left-input-group-default: var(--x-size-border-width-input-group-default);
6764
+ --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-default);
6765
+ --x-size-border-radius-top-left-input-group-default: var(
6766
+ --x-size-border-radius-input-group-default
6767
+ );
6768
+ --x-size-border-radius-top-right-input-group-default: var(
6769
+ --x-size-border-radius-input-group-default
6770
+ );
6771
+ --x-size-border-radius-bottom-right-input-group-default: var(
6772
+ --x-size-border-radius-input-group-default
6773
+ );
6774
+ --x-size-border-radius-bottom-left-input-group-default: var(
6775
+ --x-size-border-radius-input-group-default
6776
+ );
6777
+ --x-font-family-input-group-default: var(--x-font-family-input-default);
6778
+ --x-size-font-input-group-default: var(--x-size-font-input-default);
6779
+ --x-size-line-height-input-group-default: var(--x-size-line-height-input-default);
6780
+ --x-number-font-weight-input-group-default: var(--x-number-font-weight-input-default);
6781
+ --x-font-family-input-group-placeholder-default: var(--x-font-family-input-group-default);
6782
+ --x-size-font-input-group-placeholder-default: var(--x-size-font-input-group-default);
6783
+ --x-size-line-height-input-group-placeholder-default: var(
6784
+ --x-size-line-height-input-group-default
6785
+ );
6786
+ --x-number-font-weight-input-group-placeholder-default: var(
6787
+ --x-number-font-weight-input-group-default
6788
+ );
6789
+ --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6790
+ }
6748
6791
  :root {
6749
6792
  --x-size-padding-left-input-group-line: 0;
6750
6793
  --x-size-padding-right-input-group-line: 0;
@@ -6835,49 +6878,6 @@
6835
6878
  );
6836
6879
  --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6837
6880
  }
6838
- :root {
6839
- --x-color-background-input-group-default: var(--x-color-background-input-default);
6840
- --x-color-border-input-group-default: var(--x-color-border-input-default);
6841
- --x-color-border-input-group-default-focus: var(--x-color-border-input-default-focus);
6842
- --x-color-text-input-group-default: var(--x-color-text-input-default);
6843
- --x-color-text-input-group-placeholder-default: var(--x-color-text-input-placeholder-default);
6844
- --x-size-height-input-group-default: var(--x-size-height-input-default);
6845
- --x-size-gap-input-group-default: var(--x-size-base-03);
6846
- --x-size-padding-left-input-group-default: var(--x-size-base-06);
6847
- --x-size-padding-right-input-group-default: var(--x-size-padding-left-input-group-default);
6848
- --x-size-padding-input-group-default-action: var(--x-size-base-03);
6849
- --x-size-border-width-input-group-default: var(--x-size-border-width-input-default);
6850
- --x-size-border-width-top-input-group-default: var(--x-size-border-width-input-group-default);
6851
- --x-size-border-width-right-input-group-default: var(--x-size-border-width-input-group-default);
6852
- --x-size-border-width-bottom-input-group-default: var(--x-size-border-width-input-group-default);
6853
- --x-size-border-width-left-input-group-default: var(--x-size-border-width-input-group-default);
6854
- --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-default);
6855
- --x-size-border-radius-top-left-input-group-default: var(
6856
- --x-size-border-radius-input-group-default
6857
- );
6858
- --x-size-border-radius-top-right-input-group-default: var(
6859
- --x-size-border-radius-input-group-default
6860
- );
6861
- --x-size-border-radius-bottom-right-input-group-default: var(
6862
- --x-size-border-radius-input-group-default
6863
- );
6864
- --x-size-border-radius-bottom-left-input-group-default: var(
6865
- --x-size-border-radius-input-group-default
6866
- );
6867
- --x-font-family-input-group-default: var(--x-font-family-input-default);
6868
- --x-size-font-input-group-default: var(--x-size-font-input-default);
6869
- --x-size-line-height-input-group-default: var(--x-size-line-height-input-default);
6870
- --x-number-font-weight-input-group-default: var(--x-number-font-weight-input-default);
6871
- --x-font-family-input-group-placeholder-default: var(--x-font-family-input-group-default);
6872
- --x-size-font-input-group-placeholder-default: var(--x-size-font-input-group-default);
6873
- --x-size-line-height-input-group-placeholder-default: var(
6874
- --x-size-line-height-input-group-default
6875
- );
6876
- --x-number-font-weight-input-group-placeholder-default: var(
6877
- --x-number-font-weight-input-group-default
6878
- );
6879
- --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6880
- }
6881
6881
 
6882
6882
  [dir="ltr"] .x-input-group {
6883
6883
  border-right-width: var(--x-size-border-width-right-input-group-default);
@@ -7064,13 +7064,6 @@
7064
7064
  --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7065
7065
  --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7066
7066
  }
7067
- :root {
7068
- --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7069
- --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7070
- --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7071
- --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7072
- --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7073
- }
7074
7067
 
7075
7068
  .x-input--pill.x-input,
7076
7069
  .x-input--pill .x-input {
@@ -7081,14 +7074,11 @@
7081
7074
  --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-pill);
7082
7075
  }
7083
7076
  :root {
7084
- --x-size-padding-top-input-line: var(--x-size-base-03);
7085
- --x-size-padding-right-input-line: 0;
7086
- --x-size-padding-bottom-input-line: var(--x-size-base-03);
7087
- --x-size-padding-left-input-line: 0;
7088
- --x-size-border-width-top-input-line: 0;
7089
- --x-size-border-width-right-input-line: 0;
7090
- --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7091
- --x-size-border-width-left-input-line: 0;
7077
+ --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7078
+ --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7079
+ --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7080
+ --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7081
+ --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7092
7082
  }
7093
7083
  :root {
7094
7084
  --x-size-padding-top-input-line: var(--x-size-base-03);
@@ -7100,18 +7090,6 @@
7100
7090
  --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7101
7091
  --x-size-border-width-left-input-line: 0;
7102
7092
  }
7103
-
7104
- .x-input--line .x-input,
7105
- .x-input--line.x-input {
7106
- --x-size-padding-top-input-default: var(--x-size-padding-top-input-line);
7107
- --x-size-padding-right-input-default: var(--x-size-padding-right-input-line);
7108
- --x-size-padding-bottom-input-default: var(--x-size-padding-bottom-input-line);
7109
- --x-size-padding-left-input-default: var(--x-size-padding-left-input-line);
7110
- --x-size-border-width-top-input-default: var(--x-size-border-width-top-input-line);
7111
- --x-size-border-width-right-input-default: var(--x-size-border-width-right-input-line);
7112
- --x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
7113
- --x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
7114
- }
7115
7093
  :root {
7116
7094
  --x-color-background-input-default: var(--x-color-base-neutral-100);
7117
7095
  --x-color-border-input-default: var(--x-color-base-neutral-70);
@@ -7140,6 +7118,28 @@
7140
7118
  --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
7141
7119
  --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
7142
7120
  }
7121
+ :root {
7122
+ --x-size-padding-top-input-line: var(--x-size-base-03);
7123
+ --x-size-padding-right-input-line: 0;
7124
+ --x-size-padding-bottom-input-line: var(--x-size-base-03);
7125
+ --x-size-padding-left-input-line: 0;
7126
+ --x-size-border-width-top-input-line: 0;
7127
+ --x-size-border-width-right-input-line: 0;
7128
+ --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7129
+ --x-size-border-width-left-input-line: 0;
7130
+ }
7131
+
7132
+ .x-input--line .x-input,
7133
+ .x-input--line.x-input {
7134
+ --x-size-padding-top-input-default: var(--x-size-padding-top-input-line);
7135
+ --x-size-padding-right-input-default: var(--x-size-padding-right-input-line);
7136
+ --x-size-padding-bottom-input-default: var(--x-size-padding-bottom-input-line);
7137
+ --x-size-padding-left-input-default: var(--x-size-padding-left-input-line);
7138
+ --x-size-border-width-top-input-default: var(--x-size-border-width-top-input-line);
7139
+ --x-size-border-width-right-input-default: var(--x-size-border-width-right-input-line);
7140
+ --x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
7141
+ --x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
7142
+ }
7143
7143
  :root {
7144
7144
  --x-color-background-input-default: var(--x-color-base-neutral-100);
7145
7145
  --x-color-border-input-default: var(--x-color-base-neutral-70);
@@ -7292,22 +7292,18 @@
7292
7292
  --x-size-width-icon-s: var(--x-size-base-03);
7293
7293
  --x-size-height-icon-s: var(--x-size-base-03);
7294
7294
  }
7295
- :root {
7296
- --x-size-width-icon-s: var(--x-size-base-03);
7297
- --x-size-height-icon-s: var(--x-size-base-03);
7298
- }
7299
7295
 
7300
7296
  .x-icon--s {
7301
7297
  --x-size-width-icon-default: var(--x-size-width-icon-s);
7302
7298
  --x-size-height-icon-default: var(--x-size-height-icon-s);
7303
7299
  }
7304
7300
  :root {
7305
- --x-size-width-icon-m: var(--x-size-base-05);
7306
- --x-size-height-icon-m: var(--x-size-base-05);
7301
+ --x-size-width-icon-s: var(--x-size-base-03);
7302
+ --x-size-height-icon-s: var(--x-size-base-03);
7307
7303
  }
7308
7304
  :root {
7309
- --x-size-width-icon-l: var(--x-size-base-06);
7310
- --x-size-height-icon-l: var(--x-size-base-06);
7305
+ --x-size-width-icon-m: var(--x-size-base-05);
7306
+ --x-size-height-icon-m: var(--x-size-base-05);
7311
7307
  }
7312
7308
  :root {
7313
7309
  --x-size-width-icon-m: var(--x-size-base-05);
@@ -7322,11 +7318,6 @@
7322
7318
  --x-size-width-icon-l: var(--x-size-base-06);
7323
7319
  --x-size-height-icon-l: var(--x-size-base-06);
7324
7320
  }
7325
-
7326
- .x-icon--l {
7327
- --x-size-width-icon-default: var(--x-size-width-icon-l);
7328
- --x-size-height-icon-default: var(--x-size-height-icon-l);
7329
- }
7330
7321
  :root {
7331
7322
  --x-color-stroke-icon-default: currentColor;
7332
7323
  --x-color-fill-icon-default: none;
@@ -7337,9 +7328,13 @@
7337
7328
  --x-size-stroke-width-icon-default: 1px;
7338
7329
  }
7339
7330
  :root {
7340
- --x-size-padding-grid: 0;
7341
- --x-size-gap-grid: var(--x-size-base-03);
7342
- --x-size-min-width-grid-item: 150px;
7331
+ --x-size-width-icon-l: var(--x-size-base-06);
7332
+ --x-size-height-icon-l: var(--x-size-base-06);
7333
+ }
7334
+
7335
+ .x-icon--l {
7336
+ --x-size-width-icon-default: var(--x-size-width-icon-l);
7337
+ --x-size-height-icon-default: var(--x-size-height-icon-l);
7343
7338
  }
7344
7339
  :root {
7345
7340
  --x-color-stroke-icon-default: currentColor;
@@ -7397,6 +7392,11 @@
7397
7392
  .x-grid-list--cols-auto .x-grid-list__item {
7398
7393
  min-width: var(--x-size-min-width-grid-item);
7399
7394
  }
7395
+ :root {
7396
+ --x-size-padding-grid: 0;
7397
+ --x-size-gap-grid: var(--x-size-base-03);
7398
+ --x-size-min-width-grid-item: 150px;
7399
+ }
7400
7400
  .x-filter--justified.x-filter > *:last-child:not(.x-filter__label),
7401
7401
  .x-filter--justified.x-facet-filter > *:last-child:not(.x-filter__label),
7402
7402
  .x-filter--justified .x-filter > *:last-child:not(.x-filter__label),
@@ -7413,66 +7413,34 @@
7413
7413
  :root {
7414
7414
  --x-size-margin-filter-children: 0;
7415
7415
  --x-size-padding-top-filter-children: 0;
7416
- --x-size-padding-right-filter-children: 0;
7417
- --x-size-padding-bottom-filter-children: 0;
7418
- --x-size-padding-left-filter-children: var(--x-size-base-05);
7419
- }
7420
-
7421
- .x-hierarchical-filter-container {
7422
- list-style: none;
7423
- }
7424
- [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7425
- padding-left: var(--x-size-padding-left-filter-children);
7426
- }
7427
- [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7428
- padding-right: var(--x-size-padding-left-filter-children);
7429
- }
7430
- [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7431
- padding-right: var(--x-size-padding-right-filter-children);
7432
- }
7433
- [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7434
- padding-left: var(--x-size-padding-right-filter-children);
7435
- }
7436
- .x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7437
- margin: var(--x-size-margin-filter-children);
7438
- padding-top: var(--x-size-padding-top-filter-children);
7439
- padding-bottom: var(--x-size-padding-bottom-filter-children);
7440
- }
7441
- .x-hierarchical-filter-container .x-hierarchical-filter-container,
7442
- .x-hierarchical-filter-container .x-filter, .x-hierarchical-filter-container .x-facet-filter {
7443
- width: 100%;
7444
- }
7445
- :root {
7446
- --x-color-background-filter-default: transparent;
7447
- --x-color-border-filter-default: var(--x-color-background-filter-default);
7448
- --x-color-text-filter-default: var(--x-color-text-default);
7449
- --x-color-background-filter-default-selected: var(--x-color-background-filter-default);
7450
- --x-color-border-filter-default-selected: var(--x-color-border-filter-default);
7451
- --x-color-text-filter-default-selected: var(--x-color-text-filter-default);
7452
- --x-size-border-width-filter-default: var(--x-size-border-width-base);
7453
- --x-size-border-width-top-filter-default: var(--x-size-border-width-filter-default);
7454
- --x-size-border-width-right-filter-default: var(--x-size-border-width-filter-default);
7455
- --x-size-border-width-bottom-filter-default: var(--x-size-border-width-filter-default);
7456
- --x-size-border-width-left-filter-default: var(--x-size-border-width-filter-default);
7457
- --x-size-border-radius-filter-default: var(--x-size-border-radius-base-none);
7458
- --x-size-border-radius-top-left-filter-default: var(--x-size-border-radius-filter-default);
7459
- --x-size-border-radius-top-right-filter-default: var(--x-size-border-radius-filter-default);
7460
- --x-size-border-radius-bottom-right-filter-default: var(--x-size-border-radius-filter-default);
7461
- --x-size-border-radius-bottom-left-filter-default: var(--x-size-border-radius-filter-default);
7462
- --x-size-padding-top-filter-default: var(--x-size-base-03);
7463
- --x-size-padding-right-filter-default: 0;
7464
- --x-size-padding-bottom-filter-default: var(--x-size-base-03);
7465
- --x-size-padding-left-filter-default: 0;
7466
- --x-size-gap-filter-default: var(--x-size-base-03);
7467
- --x-font-family-filter-default: var(--x-font-family-text);
7468
- --x-size-font-filter-default: var(--x-size-font-text);
7469
- --x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
7470
- --x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
7471
- --x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
7472
- --x-number-font-weight-filter-count-default-selected: var(
7473
- --x-number-font-weight-filter-count-default
7474
- );
7475
- --x-size-line-height-filter-default: var(--x-size-line-height-text);
7416
+ --x-size-padding-right-filter-children: 0;
7417
+ --x-size-padding-bottom-filter-children: 0;
7418
+ --x-size-padding-left-filter-children: var(--x-size-base-05);
7419
+ }
7420
+
7421
+ .x-hierarchical-filter-container {
7422
+ list-style: none;
7423
+ }
7424
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7425
+ padding-left: var(--x-size-padding-left-filter-children);
7426
+ }
7427
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7428
+ padding-right: var(--x-size-padding-left-filter-children);
7429
+ }
7430
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7431
+ padding-right: var(--x-size-padding-right-filter-children);
7432
+ }
7433
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7434
+ padding-left: var(--x-size-padding-right-filter-children);
7435
+ }
7436
+ .x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7437
+ margin: var(--x-size-margin-filter-children);
7438
+ padding-top: var(--x-size-padding-top-filter-children);
7439
+ padding-bottom: var(--x-size-padding-bottom-filter-children);
7440
+ }
7441
+ .x-hierarchical-filter-container .x-hierarchical-filter-container,
7442
+ .x-hierarchical-filter-container .x-filter, .x-hierarchical-filter-container .x-facet-filter {
7443
+ width: 100%;
7476
7444
  }
7477
7445
  :root {
7478
7446
  --x-color-background-filter-default: transparent;
@@ -7587,6 +7555,38 @@
7587
7555
  --x-number-font-weight-filter-count-default-selected
7588
7556
  );
7589
7557
  }
7558
+ :root {
7559
+ --x-color-background-filter-default: transparent;
7560
+ --x-color-border-filter-default: var(--x-color-background-filter-default);
7561
+ --x-color-text-filter-default: var(--x-color-text-default);
7562
+ --x-color-background-filter-default-selected: var(--x-color-background-filter-default);
7563
+ --x-color-border-filter-default-selected: var(--x-color-border-filter-default);
7564
+ --x-color-text-filter-default-selected: var(--x-color-text-filter-default);
7565
+ --x-size-border-width-filter-default: var(--x-size-border-width-base);
7566
+ --x-size-border-width-top-filter-default: var(--x-size-border-width-filter-default);
7567
+ --x-size-border-width-right-filter-default: var(--x-size-border-width-filter-default);
7568
+ --x-size-border-width-bottom-filter-default: var(--x-size-border-width-filter-default);
7569
+ --x-size-border-width-left-filter-default: var(--x-size-border-width-filter-default);
7570
+ --x-size-border-radius-filter-default: var(--x-size-border-radius-base-none);
7571
+ --x-size-border-radius-top-left-filter-default: var(--x-size-border-radius-filter-default);
7572
+ --x-size-border-radius-top-right-filter-default: var(--x-size-border-radius-filter-default);
7573
+ --x-size-border-radius-bottom-right-filter-default: var(--x-size-border-radius-filter-default);
7574
+ --x-size-border-radius-bottom-left-filter-default: var(--x-size-border-radius-filter-default);
7575
+ --x-size-padding-top-filter-default: var(--x-size-base-03);
7576
+ --x-size-padding-right-filter-default: 0;
7577
+ --x-size-padding-bottom-filter-default: var(--x-size-base-03);
7578
+ --x-size-padding-left-filter-default: 0;
7579
+ --x-size-gap-filter-default: var(--x-size-base-03);
7580
+ --x-font-family-filter-default: var(--x-font-family-text);
7581
+ --x-size-font-filter-default: var(--x-size-font-text);
7582
+ --x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
7583
+ --x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
7584
+ --x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
7585
+ --x-number-font-weight-filter-count-default-selected: var(
7586
+ --x-number-font-weight-filter-count-default
7587
+ );
7588
+ --x-size-line-height-filter-default: var(--x-size-line-height-text);
7589
+ }
7590
7590
  :root {
7591
7591
  --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
7592
7592
  --x-size-border-width-facet-outlined: var(--x-size-border-width-base);
@@ -7636,6 +7636,39 @@
7636
7636
  --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7637
7637
  --x-size-border-width-left-facet-header-line: 0;
7638
7638
  }
7639
+ :root {
7640
+ --x-color-background-facet-default: transparent;
7641
+ --x-color-border-facet-default: var(--x-color-background-facet-default);
7642
+ --x-color-text-facet-default: var(--x-color-text-default);
7643
+ --x-color-background-facet-header-default: var(--x-color-background-facet-default);
7644
+ --x-color-border-facet-header-default: var(--x-color-background-facet-default);
7645
+ --x-size-border-width-facet-default: var(--x-size-border-width-base);
7646
+ --x-size-border-width-top-facet-default: var(--x-size-border-width-facet-default);
7647
+ --x-size-border-width-right-facet-default: var(--x-size-border-width-facet-default);
7648
+ --x-size-border-width-bottom-facet-default: var(--x-size-border-width-facet-default);
7649
+ --x-size-border-width-left-facet-default: var(--x-size-border-width-facet-default);
7650
+ --x-size-border-width-facet-header-default: var(--x-size-border-width-base);
7651
+ --x-size-border-width-top-facet-header-default: var(--x-size-border-width-facet-header-default);
7652
+ --x-size-border-width-right-facet-header-default: var(--x-size-border-width-facet-header-default);
7653
+ --x-size-border-width-bottom-facet-header-default: var(
7654
+ --x-size-border-width-facet-header-default
7655
+ );
7656
+ --x-size-border-width-left-facet-header-default: var(--x-size-border-width-facet-header-default);
7657
+ --x-size-border-radius-facet-default: var(--x-size-border-radius-base-none);
7658
+ --x-size-border-radius-top-left-facet-default: var(--x-size-border-radius-facet-default);
7659
+ --x-size-border-radius-top-right-facet-default: var(--x-size-border-radius-facet-default);
7660
+ --x-size-border-radius-bottom-right-facet-default: var(--x-size-border-radius-facet-default);
7661
+ --x-size-border-radius-bottom-left-facet-default: var(--x-size-border-radius-facet-default);
7662
+ --x-size-padding-top-facet-header-default: var(--x-size-base-03);
7663
+ --x-size-padding-right-facet-header-default: 0;
7664
+ --x-size-padding-bottom-facet-header-default: var(--x-size-base-03);
7665
+ --x-size-padding-left-facet-header-default: 0;
7666
+ --x-size-gap-facet-header-default: var(--x-size-base-03);
7667
+ --x-font-family-facet-default: var(--x-font-family-title3);
7668
+ --x-size-font-facet-default: var(--x-size-font-title3);
7669
+ --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
7670
+ --x-size-line-height-facet-default: var(--x-size-line-height-title3);
7671
+ }
7639
7672
  :root {
7640
7673
  --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7641
7674
  --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
@@ -7660,6 +7693,18 @@
7660
7693
  --x-size-border-width-left-facet-header-line
7661
7694
  );
7662
7695
  }
7696
+ :root {
7697
+ --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7698
+ --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
7699
+ --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
7700
+ --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
7701
+ --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
7702
+ --x-size-padding-facet-header-card: var(--x-size-base-03);
7703
+ --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
7704
+ --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
7705
+ --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7706
+ --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7707
+ }
7663
7708
  :root {
7664
7709
  --x-color-background-facet-default: transparent;
7665
7710
  --x-color-border-facet-default: var(--x-color-background-facet-default);
@@ -7787,39 +7832,6 @@
7787
7832
  .x-facet > *:first-child .x-icon:last-child:not(:first-child), .x-facet__header .x-icon:last-child:not(:first-child) {
7788
7833
  margin-left: auto;
7789
7834
  }
7790
- :root {
7791
- --x-color-background-facet-default: transparent;
7792
- --x-color-border-facet-default: var(--x-color-background-facet-default);
7793
- --x-color-text-facet-default: var(--x-color-text-default);
7794
- --x-color-background-facet-header-default: var(--x-color-background-facet-default);
7795
- --x-color-border-facet-header-default: var(--x-color-background-facet-default);
7796
- --x-size-border-width-facet-default: var(--x-size-border-width-base);
7797
- --x-size-border-width-top-facet-default: var(--x-size-border-width-facet-default);
7798
- --x-size-border-width-right-facet-default: var(--x-size-border-width-facet-default);
7799
- --x-size-border-width-bottom-facet-default: var(--x-size-border-width-facet-default);
7800
- --x-size-border-width-left-facet-default: var(--x-size-border-width-facet-default);
7801
- --x-size-border-width-facet-header-default: var(--x-size-border-width-base);
7802
- --x-size-border-width-top-facet-header-default: var(--x-size-border-width-facet-header-default);
7803
- --x-size-border-width-right-facet-header-default: var(--x-size-border-width-facet-header-default);
7804
- --x-size-border-width-bottom-facet-header-default: var(
7805
- --x-size-border-width-facet-header-default
7806
- );
7807
- --x-size-border-width-left-facet-header-default: var(--x-size-border-width-facet-header-default);
7808
- --x-size-border-radius-facet-default: var(--x-size-border-radius-base-none);
7809
- --x-size-border-radius-top-left-facet-default: var(--x-size-border-radius-facet-default);
7810
- --x-size-border-radius-top-right-facet-default: var(--x-size-border-radius-facet-default);
7811
- --x-size-border-radius-bottom-right-facet-default: var(--x-size-border-radius-facet-default);
7812
- --x-size-border-radius-bottom-left-facet-default: var(--x-size-border-radius-facet-default);
7813
- --x-size-padding-top-facet-header-default: var(--x-size-base-03);
7814
- --x-size-padding-right-facet-header-default: 0;
7815
- --x-size-padding-bottom-facet-header-default: var(--x-size-base-03);
7816
- --x-size-padding-left-facet-header-default: 0;
7817
- --x-size-gap-facet-header-default: var(--x-size-base-03);
7818
- --x-font-family-facet-default: var(--x-font-family-title3);
7819
- --x-size-font-facet-default: var(--x-size-font-title3);
7820
- --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
7821
- --x-size-line-height-facet-default: var(--x-size-line-height-title3);
7822
- }
7823
7835
  :root {
7824
7836
  --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7825
7837
  --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
@@ -7846,18 +7858,6 @@
7846
7858
  --x-size-padding-bottom-facet-header-default: var(--x-size-padding-bottom-facet-header-card);
7847
7859
  --x-size-padding-left-facet-header-default: var(--x-size-padding-left-facet-header-card);
7848
7860
  }
7849
- :root {
7850
- --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7851
- --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
7852
- --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
7853
- --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
7854
- --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
7855
- --x-size-padding-facet-header-card: var(--x-size-base-03);
7856
- --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
7857
- --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
7858
- --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7859
- --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7860
- }
7861
7861
  :root {
7862
7862
  --x-size-width-dropdown-xl: 282px;
7863
7863
  }
@@ -7871,12 +7871,23 @@
7871
7871
  :root {
7872
7872
  --x-size-width-dropdown-s: 74px;
7873
7873
  }
7874
+ :root {
7875
+ --x-size-width-dropdown-s: 74px;
7876
+ }
7874
7877
 
7875
7878
  .x-dropdown.x-dropdown--s {
7876
7879
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-s);
7877
7880
  }
7878
7881
  :root {
7879
- --x-size-width-dropdown-s: 74px;
7882
+ --x-size-gap-dropdown-pill: var(--x-size-base-03);
7883
+ --x-size-border-width-dropdown-list-pill: var(--x-size-border-width-base);
7884
+ --x-size-border-width-top-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7885
+ --x-size-border-width-right-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7886
+ --x-size-border-width-bottom-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7887
+ --x-size-border-width-left-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7888
+ }
7889
+ :root {
7890
+ --x-size-width-dropdown-m: 130px;
7880
7891
  }
7881
7892
  :root {
7882
7893
  --x-size-gap-dropdown-pill: var(--x-size-base-03);
@@ -7922,22 +7933,28 @@
7922
7933
  );
7923
7934
  }
7924
7935
  :root {
7925
- --x-size-gap-dropdown-pill: var(--x-size-base-03);
7926
- --x-size-border-width-dropdown-list-pill: var(--x-size-border-width-base);
7927
- --x-size-border-width-top-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7928
- --x-size-border-width-right-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7929
- --x-size-border-width-bottom-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7930
- --x-size-border-width-left-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7931
- }
7932
- :root {
7933
- --x-size-width-dropdown-m: 130px;
7934
- }
7935
- :root {
7936
- --x-size-width-dropdown-m: 130px;
7937
- }
7938
-
7939
- .x-dropdown.x-dropdown--m {
7940
- --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-m);
7936
+ --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
7937
+ --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
7938
+ --x-size-padding-top-dropdown-item-line: var(--x-size-base-03);
7939
+ --x-size-padding-right-dropdown-item-line: 0;
7940
+ --x-size-padding-bottom-dropdown-item-line: var(--x-size-base-03);
7941
+ --x-size-padding-left-dropdown-item-line: 0;
7942
+ --x-size-padding-top-dropdown-toggle-line: var(--x-size-base-03);
7943
+ --x-size-padding-right-dropdown-toggle-line: 0;
7944
+ --x-size-padding-bottom-dropdown-toggle-line: var(--x-size-base-03);
7945
+ --x-size-padding-left-dropdown-toggle-line: 0;
7946
+ --x-size-border-width-dropdown-toggle-line: var(--x-size-border-width-base);
7947
+ --x-size-border-width-top-dropdown-toggle-line: 0;
7948
+ --x-size-border-width-right-dropdown-toggle-line: 0;
7949
+ --x-size-border-width-bottom-dropdown-toggle-line: var(
7950
+ --x-size-border-width-dropdown-toggle-line
7951
+ );
7952
+ --x-size-border-width-left-dropdown-toggle-line: 0;
7953
+ --x-size-border-width-dropdown-list-line: 0;
7954
+ --x-size-border-width-top-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7955
+ --x-size-border-width-right-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7956
+ --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7957
+ --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7941
7958
  }
7942
7959
  :root {
7943
7960
  --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
@@ -8001,40 +8018,109 @@
8001
8018
  --x-size-border-width-left-dropdown-list-default: var(
8002
8019
  --x-size-border-width-left-dropdown-list-line
8003
8020
  );
8004
- }
8005
- :root {
8006
- --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
8007
- --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
8008
- --x-size-padding-top-dropdown-item-line: var(--x-size-base-03);
8009
- --x-size-padding-right-dropdown-item-line: 0;
8010
- --x-size-padding-bottom-dropdown-item-line: var(--x-size-base-03);
8011
- --x-size-padding-left-dropdown-item-line: 0;
8012
- --x-size-padding-top-dropdown-toggle-line: var(--x-size-base-03);
8013
- --x-size-padding-right-dropdown-toggle-line: 0;
8014
- --x-size-padding-bottom-dropdown-toggle-line: var(--x-size-base-03);
8015
- --x-size-padding-left-dropdown-toggle-line: 0;
8016
- --x-size-border-width-dropdown-toggle-line: var(--x-size-border-width-base);
8017
- --x-size-border-width-top-dropdown-toggle-line: 0;
8018
- --x-size-border-width-right-dropdown-toggle-line: 0;
8019
- --x-size-border-width-bottom-dropdown-toggle-line: var(
8020
- --x-size-border-width-dropdown-toggle-line
8021
+ }
8022
+ :root {
8023
+ --x-size-width-dropdown-m: 130px;
8024
+ }
8025
+
8026
+ .x-dropdown.x-dropdown--m {
8027
+ --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-m);
8028
+ }
8029
+ :root {
8030
+ --x-size-width-dropdown-l: 202px;
8031
+ }
8032
+ :root {
8033
+ --x-size-width-dropdown-l: 202px;
8034
+ }
8035
+
8036
+ .x-dropdown.x-dropdown--l {
8037
+ --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-l);
8038
+ }
8039
+ :root {
8040
+ --x-size-border-radius-dropdown-default: var(--x-size-border-radius-base-none);
8041
+ --x-size-border-radius-top-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
8042
+ --x-size-border-radius-top-right-dropdown-default: var(--x-size-border-radius-dropdown-default);
8043
+ --x-size-border-radius-bottom-right-dropdown-default: var(
8044
+ --x-size-border-radius-dropdown-default
8045
+ );
8046
+ --x-size-border-radius-bottom-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
8047
+ --x-size-border-width-dropdown-toggle-default: var(--x-size-border-width-base);
8048
+ --x-size-border-width-top-dropdown-toggle-default: var(
8049
+ --x-size-border-width-dropdown-toggle-default
8050
+ );
8051
+ --x-size-border-width-right-dropdown-toggle-default: var(
8052
+ --x-size-border-width-dropdown-toggle-default
8053
+ );
8054
+ --x-size-border-width-bottom-dropdown-toggle-default: var(
8055
+ --x-size-border-width-dropdown-toggle-default
8056
+ );
8057
+ --x-size-border-width-left-dropdown-toggle-default: var(
8058
+ --x-size-border-width-dropdown-toggle-default
8059
+ );
8060
+ --x-size-border-width-dropdown-list-default: var(--x-size-border-width-base);
8061
+ --x-size-border-width-top-dropdown-list-default: 0;
8062
+ --x-size-border-width-right-dropdown-list-default: var(
8063
+ --x-size-border-width-dropdown-list-default
8064
+ );
8065
+ --x-size-border-width-bottom-dropdown-list-default: var(
8066
+ --x-size-border-width-dropdown-list-default
8067
+ );
8068
+ --x-size-border-width-left-dropdown-list-default: var(
8069
+ --x-size-border-width-dropdown-list-default
8070
+ );
8071
+ --x-color-border-dropdown-toggle-default: var(--x-color-base-neutral-95);
8072
+ --x-color-border-dropdown-list-default: var(--x-color-border-dropdown-toggle-default);
8073
+ --x-color-background-dropdown-default: var(--x-color-base-neutral-100);
8074
+ --x-color-background-dropdown-toggle-default: var(--x-color-base-neutral-100);
8075
+ --x-color-background-dropdown-toggle-open-default: var(
8076
+ --x-color-background-dropdown-toggle-default
8077
+ );
8078
+ --x-color-background-dropdown-item-default-selected: var(--x-color-base-neutral-95);
8079
+ --x-color-background-dropdown-item-default-hover: var(--x-color-base-neutral-95);
8080
+ --x-color-text-dropdown-default: var(--x-color-text-default);
8081
+ --x-color-text-dropdown-toggle-default: var(--x-color-text-dropdown-default);
8082
+ --x-color-text-dropdown-toggle-default-selected: var(--x-color-base-neutral-35);
8083
+ --x-color-text-dropdown-item-default-hover: var(--x-color-base-neutral-35);
8084
+ --x-color-text-dropdown-item-default-selected: var(--x-color-text-default);
8085
+ --x-font-family-dropdown-default: var(--x-font-family-text);
8086
+ --x-size-font-dropdown-default: var(--x-size-font-text);
8087
+ --x-size-line-height-dropdown-default: var(--x-size-line-height-text);
8088
+ --x-number-font-weight-dropdown-default: var(--x-number-font-weight-base-regular);
8089
+ --x-number-font-weight-dropdown-item-default-hover: var(--x-number-font-weight-base-bold);
8090
+ --x-number-font-weight-dropdown-item-default-selected: var(--x-number-font-weight-base-regular);
8091
+ --x-font-decoration-dropdown-item-default-hover: none;
8092
+ --x-font-decoration-dropdown-item-default-selected: none;
8093
+ --x-size-width-dropdown-toggle-default: 100%;
8094
+ --x-size-min-width-dropdown-list-default: 100%;
8095
+ --x-size-gap-dropdown-default: 0;
8096
+ --x-size-padding-top-dropdown-toggle-default: var(--x-size-padding-top-dropdown-item-default);
8097
+ --x-size-padding-right-dropdown-toggle-default: var(--x-size-padding-right-dropdown-item-default);
8098
+ --x-size-padding-bottom-dropdown-toggle-default: var(
8099
+ --x-size-padding-bottom-dropdown-item-default
8021
8100
  );
8022
- --x-size-border-width-left-dropdown-toggle-line: 0;
8023
- --x-size-border-width-dropdown-list-line: 0;
8024
- --x-size-border-width-top-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8025
- --x-size-border-width-right-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8026
- --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8027
- --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8028
- }
8029
- :root {
8030
- --x-size-width-dropdown-l: 202px;
8101
+ --x-size-padding-left-dropdown-toggle-default: var(--x-size-padding-left-dropdown-item-default);
8102
+ --x-size-padding-vertical-dropdown-list-default: 0;
8103
+ --x-size-padding-top-dropdown-item-default: var(--x-size-base-04);
8104
+ --x-size-padding-right-dropdown-item-default: var(--x-size-base-05);
8105
+ --x-size-padding-bottom-dropdown-item-default: var(--x-size-base-04);
8106
+ --x-size-padding-left-dropdown-item-default: var(--x-size-base-05);
8107
+ --x-size-gap-dropdown-item-default: var(--x-size-base-03);
8108
+ --x-string-box-shadow-dropdown-default: none;
8109
+ --x-string-overflow-dropdown-toggle-default: hidden;
8110
+ --x-string-overflow-dropdown-list-default: hidden;
8031
8111
  }
8032
8112
  :root {
8033
- --x-size-width-dropdown-l: 202px;
8034
- }
8035
-
8036
- .x-dropdown.x-dropdown--l {
8037
- --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-l);
8113
+ --x-size-gap-dropdown-card: var(--x-size-base-03);
8114
+ --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8115
+ --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8116
+ --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8117
+ --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8118
+ --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8119
+ --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8120
+ --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8121
+ --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8122
+ --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8123
+ --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8038
8124
  }
8039
8125
  :root {
8040
8126
  --x-size-border-radius-dropdown-default: var(--x-size-border-radius-base-none);
@@ -8278,79 +8364,6 @@
8278
8364
  [dir="rtl"] .x-dropdown--right .x-dropdown__items-list {
8279
8365
  left: 0;
8280
8366
  }
8281
- :root {
8282
- --x-size-border-radius-dropdown-default: var(--x-size-border-radius-base-none);
8283
- --x-size-border-radius-top-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
8284
- --x-size-border-radius-top-right-dropdown-default: var(--x-size-border-radius-dropdown-default);
8285
- --x-size-border-radius-bottom-right-dropdown-default: var(
8286
- --x-size-border-radius-dropdown-default
8287
- );
8288
- --x-size-border-radius-bottom-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
8289
- --x-size-border-width-dropdown-toggle-default: var(--x-size-border-width-base);
8290
- --x-size-border-width-top-dropdown-toggle-default: var(
8291
- --x-size-border-width-dropdown-toggle-default
8292
- );
8293
- --x-size-border-width-right-dropdown-toggle-default: var(
8294
- --x-size-border-width-dropdown-toggle-default
8295
- );
8296
- --x-size-border-width-bottom-dropdown-toggle-default: var(
8297
- --x-size-border-width-dropdown-toggle-default
8298
- );
8299
- --x-size-border-width-left-dropdown-toggle-default: var(
8300
- --x-size-border-width-dropdown-toggle-default
8301
- );
8302
- --x-size-border-width-dropdown-list-default: var(--x-size-border-width-base);
8303
- --x-size-border-width-top-dropdown-list-default: 0;
8304
- --x-size-border-width-right-dropdown-list-default: var(
8305
- --x-size-border-width-dropdown-list-default
8306
- );
8307
- --x-size-border-width-bottom-dropdown-list-default: var(
8308
- --x-size-border-width-dropdown-list-default
8309
- );
8310
- --x-size-border-width-left-dropdown-list-default: var(
8311
- --x-size-border-width-dropdown-list-default
8312
- );
8313
- --x-color-border-dropdown-toggle-default: var(--x-color-base-neutral-95);
8314
- --x-color-border-dropdown-list-default: var(--x-color-border-dropdown-toggle-default);
8315
- --x-color-background-dropdown-default: var(--x-color-base-neutral-100);
8316
- --x-color-background-dropdown-toggle-default: var(--x-color-base-neutral-100);
8317
- --x-color-background-dropdown-toggle-open-default: var(
8318
- --x-color-background-dropdown-toggle-default
8319
- );
8320
- --x-color-background-dropdown-item-default-selected: var(--x-color-base-neutral-95);
8321
- --x-color-background-dropdown-item-default-hover: var(--x-color-base-neutral-95);
8322
- --x-color-text-dropdown-default: var(--x-color-text-default);
8323
- --x-color-text-dropdown-toggle-default: var(--x-color-text-dropdown-default);
8324
- --x-color-text-dropdown-toggle-default-selected: var(--x-color-base-neutral-35);
8325
- --x-color-text-dropdown-item-default-hover: var(--x-color-base-neutral-35);
8326
- --x-color-text-dropdown-item-default-selected: var(--x-color-text-default);
8327
- --x-font-family-dropdown-default: var(--x-font-family-text);
8328
- --x-size-font-dropdown-default: var(--x-size-font-text);
8329
- --x-size-line-height-dropdown-default: var(--x-size-line-height-text);
8330
- --x-number-font-weight-dropdown-default: var(--x-number-font-weight-base-regular);
8331
- --x-number-font-weight-dropdown-item-default-hover: var(--x-number-font-weight-base-bold);
8332
- --x-number-font-weight-dropdown-item-default-selected: var(--x-number-font-weight-base-regular);
8333
- --x-font-decoration-dropdown-item-default-hover: none;
8334
- --x-font-decoration-dropdown-item-default-selected: none;
8335
- --x-size-width-dropdown-toggle-default: 100%;
8336
- --x-size-min-width-dropdown-list-default: 100%;
8337
- --x-size-gap-dropdown-default: 0;
8338
- --x-size-padding-top-dropdown-toggle-default: var(--x-size-padding-top-dropdown-item-default);
8339
- --x-size-padding-right-dropdown-toggle-default: var(--x-size-padding-right-dropdown-item-default);
8340
- --x-size-padding-bottom-dropdown-toggle-default: var(
8341
- --x-size-padding-bottom-dropdown-item-default
8342
- );
8343
- --x-size-padding-left-dropdown-toggle-default: var(--x-size-padding-left-dropdown-item-default);
8344
- --x-size-padding-vertical-dropdown-list-default: 0;
8345
- --x-size-padding-top-dropdown-item-default: var(--x-size-base-04);
8346
- --x-size-padding-right-dropdown-item-default: var(--x-size-base-05);
8347
- --x-size-padding-bottom-dropdown-item-default: var(--x-size-base-04);
8348
- --x-size-padding-left-dropdown-item-default: var(--x-size-base-05);
8349
- --x-size-gap-dropdown-item-default: var(--x-size-base-03);
8350
- --x-string-box-shadow-dropdown-default: none;
8351
- --x-string-overflow-dropdown-toggle-default: hidden;
8352
- --x-string-overflow-dropdown-list-default: hidden;
8353
- }
8354
8367
  :root {
8355
8368
  --x-size-gap-dropdown-card: var(--x-size-base-03);
8356
8369
  --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
@@ -8394,19 +8407,6 @@
8394
8407
  --x-size-border-width-left-dropdown-list-card
8395
8408
  );
8396
8409
  }
8397
- :root {
8398
- --x-size-gap-dropdown-card: var(--x-size-base-03);
8399
- --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8400
- --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8401
- --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8402
- --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8403
- --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8404
- --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8405
- --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8406
- --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8407
- --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8408
- --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8409
- }
8410
8410
  :root {
8411
8411
  --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8412
8412
  --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
@@ -8448,6 +8448,16 @@
8448
8448
  --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8449
8449
  --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8450
8450
  }
8451
+ :root {
8452
+ --x-color-background-button-secondary: transparent;
8453
+ --x-color-border-button-secondary: var(--x-color-border-button-default);
8454
+ --x-color-text-button-secondary: var(--x-color-border-button-default);
8455
+ --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8456
+ --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8457
+ --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8458
+ --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8459
+ --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8460
+ }
8451
8461
 
8452
8462
  .x-button--secondary.x-button,
8453
8463
  .x-button--secondary .x-button {
@@ -8459,16 +8469,6 @@
8459
8469
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-secondary);
8460
8470
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-secondary);
8461
8471
  }
8462
- :root {
8463
- --x-color-background-button-secondary: transparent;
8464
- --x-color-border-button-secondary: var(--x-color-border-button-default);
8465
- --x-color-text-button-secondary: var(--x-color-border-button-default);
8466
- --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8467
- --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8468
- --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8469
- --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8470
- --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8471
- }
8472
8472
  :root {
8473
8473
  --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
8474
8474
  --x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
@@ -8539,13 +8539,6 @@
8539
8539
  --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
8540
8540
  --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
8541
8541
  }
8542
- :root {
8543
- --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
8544
- --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
8545
- --x-size-border-radius-top-right-button-pill: var(--x-size-border-radius-button-pill);
8546
- --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
8547
- --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
8548
- }
8549
8542
 
8550
8543
  .x-button--pill.x-button,
8551
8544
  .x-button--pill .x-button {
@@ -8561,6 +8554,13 @@
8561
8554
  --x-size-border-radius-bottom-left-button-pill
8562
8555
  );
8563
8556
  }
8557
+ :root {
8558
+ --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
8559
+ --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
8560
+ --x-size-border-radius-top-right-button-pill: var(--x-size-border-radius-button-pill);
8561
+ --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
8562
+ --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
8563
+ }
8564
8564
  :root {
8565
8565
  --x-color-background-button-ghost: transparent;
8566
8566
  --x-color-border-button-ghost: transparent;
@@ -8611,6 +8611,36 @@
8611
8611
  --x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
8612
8612
  --x-size-line-height-button-default: var(--x-size-line-height-text);
8613
8613
  }
8614
+ :root {
8615
+ --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8616
+ --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8617
+ --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8618
+ --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8619
+ --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8620
+ }
8621
+ :root {
8622
+ --x-color-background-button-default: var(--x-color-base-lead);
8623
+ --x-color-border-button-default: var(--x-color-background-button-default);
8624
+ --x-color-text-button-default: var(--x-color-base-neutral-100);
8625
+ --x-size-border-radius-button-default: var(--x-size-border-radius-base-none);
8626
+ --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-button-default);
8627
+ --x-size-border-radius-top-right-button-default: var(--x-size-border-radius-button-default);
8628
+ --x-size-border-radius-bottom-right-button-default: var(--x-size-border-radius-button-default);
8629
+ --x-size-border-radius-bottom-left-button-default: var(--x-size-border-radius-button-default);
8630
+ --x-size-border-width-button-default: var(--x-size-border-width-base);
8631
+ --x-size-border-width-top-button-default: var(--x-size-border-width-button-default);
8632
+ --x-size-border-width-right-button-default: var(--x-size-border-width-button-default);
8633
+ --x-size-border-width-bottom-button-default: var(--x-size-border-width-button-default);
8634
+ --x-size-border-width-left-button-default: var(--x-size-border-width-button-default);
8635
+ --x-size-height-button-default: var(--x-size-base-08);
8636
+ --x-size-padding-right-button-default: var(--x-size-base-05);
8637
+ --x-size-padding-left-button-default: var(--x-size-base-05);
8638
+ --x-size-gap-button-default: var(--x-size-base-03);
8639
+ --x-font-family-button-default: var(--x-font-family-text);
8640
+ --x-size-font-button-default: var(--x-size-font-text);
8641
+ --x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
8642
+ --x-size-line-height-button-default: var(--x-size-line-height-text);
8643
+ }
8614
8644
 
8615
8645
  [dir="ltr"] .x-button {
8616
8646
  padding-right: var(--x-size-padding-right-button-default);
@@ -8673,29 +8703,6 @@
8673
8703
  margin-right: var(--x-size-gap-button-default);
8674
8704
  }
8675
8705
  }
8676
- :root {
8677
- --x-color-background-button-default: var(--x-color-base-lead);
8678
- --x-color-border-button-default: var(--x-color-background-button-default);
8679
- --x-color-text-button-default: var(--x-color-base-neutral-100);
8680
- --x-size-border-radius-button-default: var(--x-size-border-radius-base-none);
8681
- --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-button-default);
8682
- --x-size-border-radius-top-right-button-default: var(--x-size-border-radius-button-default);
8683
- --x-size-border-radius-bottom-right-button-default: var(--x-size-border-radius-button-default);
8684
- --x-size-border-radius-bottom-left-button-default: var(--x-size-border-radius-button-default);
8685
- --x-size-border-width-button-default: var(--x-size-border-width-base);
8686
- --x-size-border-width-top-button-default: var(--x-size-border-width-button-default);
8687
- --x-size-border-width-right-button-default: var(--x-size-border-width-button-default);
8688
- --x-size-border-width-bottom-button-default: var(--x-size-border-width-button-default);
8689
- --x-size-border-width-left-button-default: var(--x-size-border-width-button-default);
8690
- --x-size-height-button-default: var(--x-size-base-08);
8691
- --x-size-padding-right-button-default: var(--x-size-base-05);
8692
- --x-size-padding-left-button-default: var(--x-size-base-05);
8693
- --x-size-gap-button-default: var(--x-size-base-03);
8694
- --x-font-family-button-default: var(--x-font-family-text);
8695
- --x-size-font-button-default: var(--x-size-font-text);
8696
- --x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
8697
- --x-size-line-height-button-default: var(--x-size-line-height-text);
8698
- }
8699
8706
  :root {
8700
8707
  --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8701
8708
  --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
@@ -8718,13 +8725,6 @@
8718
8725
  --x-size-border-radius-bottom-left-button-card
8719
8726
  );
8720
8727
  }
8721
- :root {
8722
- --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8723
- --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8724
- --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8725
- --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8726
- --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8727
- }
8728
8728
  :root {
8729
8729
  --x-color-background-badge-default: var(--x-color-base-neutral-10);
8730
8730
  --x-color-text-badge-default: var(--x-color-base-neutral-100);