@empathyco/x-components 3.0.0-alpha.301 → 3.0.0-alpha.302

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/design-system/default-theme.css +21 -36
  3. package/design-system/deprecated-full-theme.css +8 -2
  4. package/design-system/full-theme.css +617 -633
  5. package/docs/API-reference/components/common/result/x-components.base-result-image.md +2 -2
  6. package/js/components/result/base-result-fallback-image.vue.js +6 -5
  7. package/js/components/result/base-result-fallback-image.vue.js.map +1 -1
  8. package/js/components/result/base-result-fallback-image.vue_rollup-plugin-vue_script.vue.js.map +1 -1
  9. package/js/components/result/base-result-image.vue.js +3 -2
  10. package/js/components/result/base-result-image.vue.js.map +1 -1
  11. package/js/components/result/base-result-image.vue_rollup-plugin-vue_script.vue.js.map +1 -1
  12. package/js/components/result/base-result-image.vue_rollup-plugin-vue_styles.0.vue.js +1 -1
  13. package/js/components/result/base-result-placeholder-image.vue.js +6 -5
  14. package/js/components/result/base-result-placeholder-image.vue.js.map +1 -1
  15. package/js/components/result/base-result-placeholder-image.vue_rollup-plugin-vue_script.vue.js.map +1 -1
  16. package/package.json +3 -3
  17. package/types/components/result/base-result-fallback-image.vue.d.ts.map +1 -1
  18. package/types/components/result/base-result-image.vue.d.ts.map +1 -1
  19. package/types/components/result/base-result-placeholder-image.vue.d.ts.map +1 -1
  20. package/design-system/picture-default.css +0 -15
package/design-system/full-theme.css CHANGED
@@ -2749,21 +2749,6 @@
2749
2749
  --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
2750
2750
  --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
2751
2751
  }
2752
- .x-picture__image {
2753
- width: 100%;
2754
- height: 100%;
2755
- }
2756
- .x-picture__image--fallback, .x-picture__image--placeholder {
2757
- object-fit: contain;
2758
- background-color: var(--x-color-base-neutral-95);
2759
- mix-blend-mode: normal;
2760
- }
2761
- .x-picture__image--fallback > rect, .x-picture__image--placeholder > rect {
2762
- fill: var(--x-color-base-neutral-95);
2763
- }
2764
- .x-picture__image--fallback > path, .x-picture__image--placeholder > path {
2765
- fill: var(--x-color-base-neutral-70);
2766
- }
2767
2752
  .x-progress-bar {
2768
2753
  display: inline-block;
2769
2754
  overflow: hidden;
@@ -5612,926 +5597,925 @@
5612
5597
  -webkit-box-orient: vertical !important;
5613
5598
  -webkit-line-clamp: 6 !important;
5614
5599
  }
5615
- .x-padding--00 {
5616
- padding: 0 !important;
5600
+ .x-margin--auto {
5601
+ margin: auto !important;
5617
5602
  }
5618
- .x-padding--01 {
5619
- padding: var(--x-size-base-01) !important;
5603
+ .x-margin--00 {
5604
+ margin: 0 !important;
5620
5605
  }
5621
- .x-padding--02 {
5622
- padding: var(--x-size-base-02) !important;
5606
+ .x-margin--01 {
5607
+ margin: var(--x-size-base-01) !important;
5623
5608
  }
5624
- .x-padding--03 {
5625
- padding: var(--x-size-base-03) !important;
5609
+ .x-margin--02 {
5610
+ margin: var(--x-size-base-02) !important;
5626
5611
  }
5627
- .x-padding--04 {
5628
- padding: var(--x-size-base-04) !important;
5612
+ .x-margin--03 {
5613
+ margin: var(--x-size-base-03) !important;
5629
5614
  }
5630
- .x-padding--05 {
5631
- padding: var(--x-size-base-05) !important;
5615
+ .x-margin--04 {
5616
+ margin: var(--x-size-base-04) !important;
5632
5617
  }
5633
- .x-padding--06 {
5634
- padding: var(--x-size-base-06) !important;
5618
+ .x-margin--05 {
5619
+ margin: var(--x-size-base-05) !important;
5635
5620
  }
5636
- .x-padding--07 {
5637
- padding: var(--x-size-base-07) !important;
5621
+ .x-margin--06 {
5622
+ margin: var(--x-size-base-06) !important;
5638
5623
  }
5639
- .x-padding--08 {
5640
- padding: var(--x-size-base-08) !important;
5624
+ .x-margin--07 {
5625
+ margin: var(--x-size-base-07) !important;
5641
5626
  }
5642
- .x-padding--09 {
5643
- padding: var(--x-size-base-09) !important;
5627
+ .x-margin--08 {
5628
+ margin: var(--x-size-base-08) !important;
5644
5629
  }
5645
- .x-padding--10 {
5646
- padding: var(--x-size-base-10) !important;
5630
+ .x-margin--09 {
5631
+ margin: var(--x-size-base-09) !important;
5647
5632
  }
5648
- .x-padding--11 {
5649
- padding: var(--x-size-base-11) !important;
5633
+ .x-margin--10 {
5634
+ margin: var(--x-size-base-10) !important;
5650
5635
  }
5651
- .x-padding--12 {
5652
- padding: var(--x-size-base-12) !important;
5636
+ .x-margin--11 {
5637
+ margin: var(--x-size-base-11) !important;
5653
5638
  }
5654
- .x-padding--13 {
5655
- padding: var(--x-size-base-13) !important;
5639
+ .x-margin--12 {
5640
+ margin: var(--x-size-base-12) !important;
5656
5641
  }
5657
- .x-padding--14 {
5658
- padding: var(--x-size-base-14) !important;
5642
+ .x-margin--13 {
5643
+ margin: var(--x-size-base-13) !important;
5659
5644
  }
5660
- .x-padding--15 {
5661
- padding: var(--x-size-base-15) !important;
5645
+ .x-margin--14 {
5646
+ margin: var(--x-size-base-14) !important;
5662
5647
  }
5663
- .x-padding--16 {
5664
- padding: var(--x-size-base-16) !important;
5648
+ .x-margin--15 {
5649
+ margin: var(--x-size-base-15) !important;
5665
5650
  }
5666
- .x-padding--17 {
5667
- padding: var(--x-size-base-17) !important;
5651
+ .x-margin--16 {
5652
+ margin: var(--x-size-base-16) !important;
5668
5653
  }
5669
- .x-padding--18 {
5670
- padding: var(--x-size-base-18) !important;
5654
+ .x-margin--17 {
5655
+ margin: var(--x-size-base-17) !important;
5671
5656
  }
5672
- .x-padding--19 {
5673
- padding: var(--x-size-base-19) !important;
5657
+ .x-margin--18 {
5658
+ margin: var(--x-size-base-18) !important;
5674
5659
  }
5675
- .x-padding--20 {
5676
- padding: var(--x-size-base-20) !important;
5660
+ .x-margin--19 {
5661
+ margin: var(--x-size-base-19) !important;
5677
5662
  }
5678
- .x-padding--top-00 {
5679
- padding-top: 0 !important;
5663
+ .x-margin--20 {
5664
+ margin: var(--x-size-base-20) !important;
5680
5665
  }
5681
- .x-padding--bottom-00 {
5682
- padding-bottom: 0 !important;
5666
+ .x-margin--top-auto {
5667
+ margin-top: auto !important;
5683
5668
  }
5684
- [dir="ltr"] .x-padding--right-00 {
5685
- padding-right: 0 !important;
5669
+ .x-margin--bottom-auto {
5670
+ margin-bottom: auto !important;
5686
5671
  }
5687
- [dir="rtl"] .x-padding--right-00 {
5688
- padding-left: 0 !important;
5672
+ [dir="ltr"] .x-margin--right-auto {
5673
+ margin-right: auto !important;
5689
5674
  }
5690
- [dir="ltr"] .x-padding--left-00 {
5691
- padding-left: 0 !important;
5675
+ [dir="rtl"] .x-margin--right-auto {
5676
+ margin-left: auto !important;
5692
5677
  }
5693
- [dir="rtl"] .x-padding--left-00 {
5694
- padding-right: 0 !important;
5678
+ [dir="ltr"] .x-margin--left-auto {
5679
+ margin-left: auto !important;
5695
5680
  }
5696
- .x-padding--top-01 {
5697
- padding-top: var(--x-size-base-01) !important;
5681
+ [dir="rtl"] .x-margin--left-auto {
5682
+ margin-right: auto !important;
5698
5683
  }
5699
- .x-padding--bottom-01 {
5700
- padding-bottom: var(--x-size-base-01) !important;
5684
+ .x-margin--top-00 {
5685
+ margin-top: 0 !important;
5701
5686
  }
5702
- [dir="ltr"] .x-padding--right-01 {
5703
- padding-right: var(--x-size-base-01) !important;
5687
+ .x-margin--bottom-00 {
5688
+ margin-bottom: 0 !important;
5704
5689
  }
5705
- [dir="rtl"] .x-padding--right-01 {
5706
- padding-left: var(--x-size-base-01) !important;
5690
+ [dir="ltr"] .x-margin--right-00 {
5691
+ margin-right: 0 !important;
5707
5692
  }
5708
- [dir="ltr"] .x-padding--left-01 {
5709
- padding-left: var(--x-size-base-01) !important;
5693
+ [dir="rtl"] .x-margin--right-00 {
5694
+ margin-left: 0 !important;
5710
5695
  }
5711
- [dir="rtl"] .x-padding--left-01 {
5712
- padding-right: var(--x-size-base-01) !important;
5696
+ [dir="ltr"] .x-margin--left-00 {
5697
+ margin-left: 0 !important;
5713
5698
  }
5714
- .x-padding--top-02 {
5715
- padding-top: var(--x-size-base-02) !important;
5699
+ [dir="rtl"] .x-margin--left-00 {
5700
+ margin-right: 0 !important;
5716
5701
  }
5717
- .x-padding--bottom-02 {
5718
- padding-bottom: var(--x-size-base-02) !important;
5702
+ .x-margin--top-01 {
5703
+ margin-top: var(--x-size-base-01) !important;
5719
5704
  }
5720
- [dir="ltr"] .x-padding--right-02 {
5721
- padding-right: var(--x-size-base-02) !important;
5705
+ .x-margin--bottom-01 {
5706
+ margin-bottom: var(--x-size-base-01) !important;
5722
5707
  }
5723
- [dir="rtl"] .x-padding--right-02 {
5724
- padding-left: var(--x-size-base-02) !important;
5708
+ [dir="ltr"] .x-margin--right-01 {
5709
+ margin-right: var(--x-size-base-01) !important;
5725
5710
  }
5726
- [dir="ltr"] .x-padding--left-02 {
5727
- padding-left: var(--x-size-base-02) !important;
5711
+ [dir="rtl"] .x-margin--right-01 {
5712
+ margin-left: var(--x-size-base-01) !important;
5728
5713
  }
5729
- [dir="rtl"] .x-padding--left-02 {
5730
- padding-right: var(--x-size-base-02) !important;
5714
+ [dir="ltr"] .x-margin--left-01 {
5715
+ margin-left: var(--x-size-base-01) !important;
5731
5716
  }
5732
- .x-padding--top-03 {
5733
- padding-top: var(--x-size-base-03) !important;
5717
+ [dir="rtl"] .x-margin--left-01 {
5718
+ margin-right: var(--x-size-base-01) !important;
5734
5719
  }
5735
- .x-padding--bottom-03 {
5736
- padding-bottom: var(--x-size-base-03) !important;
5720
+ .x-margin--top-02 {
5721
+ margin-top: var(--x-size-base-02) !important;
5737
5722
  }
5738
- [dir="ltr"] .x-padding--right-03 {
5739
- padding-right: var(--x-size-base-03) !important;
5723
+ .x-margin--bottom-02 {
5724
+ margin-bottom: var(--x-size-base-02) !important;
5740
5725
  }
5741
- [dir="rtl"] .x-padding--right-03 {
5742
- padding-left: var(--x-size-base-03) !important;
5726
+ [dir="ltr"] .x-margin--right-02 {
5727
+ margin-right: var(--x-size-base-02) !important;
5743
5728
  }
5744
- [dir="ltr"] .x-padding--left-03 {
5745
- padding-left: var(--x-size-base-03) !important;
5729
+ [dir="rtl"] .x-margin--right-02 {
5730
+ margin-left: var(--x-size-base-02) !important;
5746
5731
  }
5747
- [dir="rtl"] .x-padding--left-03 {
5748
- padding-right: var(--x-size-base-03) !important;
5732
+ [dir="ltr"] .x-margin--left-02 {
5733
+ margin-left: var(--x-size-base-02) !important;
5749
5734
  }
5750
- .x-padding--top-04 {
5751
- padding-top: var(--x-size-base-04) !important;
5735
+ [dir="rtl"] .x-margin--left-02 {
5736
+ margin-right: var(--x-size-base-02) !important;
5752
5737
  }
5753
- .x-padding--bottom-04 {
5754
- padding-bottom: var(--x-size-base-04) !important;
5738
+ .x-margin--top-03 {
5739
+ margin-top: var(--x-size-base-03) !important;
5755
5740
  }
5756
- [dir="ltr"] .x-padding--right-04 {
5757
- padding-right: var(--x-size-base-04) !important;
5741
+ .x-margin--bottom-03 {
5742
+ margin-bottom: var(--x-size-base-03) !important;
5758
5743
  }
5759
- [dir="rtl"] .x-padding--right-04 {
5760
- padding-left: var(--x-size-base-04) !important;
5744
+ [dir="ltr"] .x-margin--right-03 {
5745
+ margin-right: var(--x-size-base-03) !important;
5761
5746
  }
5762
- [dir="ltr"] .x-padding--left-04 {
5763
- padding-left: var(--x-size-base-04) !important;
5747
+ [dir="rtl"] .x-margin--right-03 {
5748
+ margin-left: var(--x-size-base-03) !important;
5764
5749
  }
5765
- [dir="rtl"] .x-padding--left-04 {
5766
- padding-right: var(--x-size-base-04) !important;
5750
+ [dir="ltr"] .x-margin--left-03 {
5751
+ margin-left: var(--x-size-base-03) !important;
5767
5752
  }
5768
- .x-padding--top-05 {
5769
- padding-top: var(--x-size-base-05) !important;
5753
+ [dir="rtl"] .x-margin--left-03 {
5754
+ margin-right: var(--x-size-base-03) !important;
5770
5755
  }
5771
- .x-padding--bottom-05 {
5772
- padding-bottom: var(--x-size-base-05) !important;
5756
+ .x-margin--top-04 {
5757
+ margin-top: var(--x-size-base-04) !important;
5773
5758
  }
5774
- [dir="ltr"] .x-padding--right-05 {
5775
- padding-right: var(--x-size-base-05) !important;
5759
+ .x-margin--bottom-04 {
5760
+ margin-bottom: var(--x-size-base-04) !important;
5776
5761
  }
5777
- [dir="rtl"] .x-padding--right-05 {
5778
- padding-left: var(--x-size-base-05) !important;
5762
+ [dir="ltr"] .x-margin--right-04 {
5763
+ margin-right: var(--x-size-base-04) !important;
5779
5764
  }
5780
- [dir="ltr"] .x-padding--left-05 {
5781
- padding-left: var(--x-size-base-05) !important;
5765
+ [dir="rtl"] .x-margin--right-04 {
5766
+ margin-left: var(--x-size-base-04) !important;
5782
5767
  }
5783
- [dir="rtl"] .x-padding--left-05 {
5784
- padding-right: var(--x-size-base-05) !important;
5768
+ [dir="ltr"] .x-margin--left-04 {
5769
+ margin-left: var(--x-size-base-04) !important;
5785
5770
  }
5786
- .x-padding--top-06 {
5787
- padding-top: var(--x-size-base-06) !important;
5771
+ [dir="rtl"] .x-margin--left-04 {
5772
+ margin-right: var(--x-size-base-04) !important;
5788
5773
  }
5789
- .x-padding--bottom-06 {
5790
- padding-bottom: var(--x-size-base-06) !important;
5774
+ .x-margin--top-05 {
5775
+ margin-top: var(--x-size-base-05) !important;
5791
5776
  }
5792
- [dir="ltr"] .x-padding--right-06 {
5793
- padding-right: var(--x-size-base-06) !important;
5777
+ .x-margin--bottom-05 {
5778
+ margin-bottom: var(--x-size-base-05) !important;
5794
5779
  }
5795
- [dir="rtl"] .x-padding--right-06 {
5796
- padding-left: var(--x-size-base-06) !important;
5780
+ [dir="ltr"] .x-margin--right-05 {
5781
+ margin-right: var(--x-size-base-05) !important;
5797
5782
  }
5798
- [dir="ltr"] .x-padding--left-06 {
5799
- padding-left: var(--x-size-base-06) !important;
5783
+ [dir="rtl"] .x-margin--right-05 {
5784
+ margin-left: var(--x-size-base-05) !important;
5800
5785
  }
5801
- [dir="rtl"] .x-padding--left-06 {
5802
- padding-right: var(--x-size-base-06) !important;
5786
+ [dir="ltr"] .x-margin--left-05 {
5787
+ margin-left: var(--x-size-base-05) !important;
5803
5788
  }
5804
- .x-padding--top-07 {
5805
- padding-top: var(--x-size-base-07) !important;
5789
+ [dir="rtl"] .x-margin--left-05 {
5790
+ margin-right: var(--x-size-base-05) !important;
5806
5791
  }
5807
- .x-padding--bottom-07 {
5808
- padding-bottom: var(--x-size-base-07) !important;
5792
+ .x-margin--top-06 {
5793
+ margin-top: var(--x-size-base-06) !important;
5809
5794
  }
5810
- [dir="ltr"] .x-padding--right-07 {
5811
- padding-right: var(--x-size-base-07) !important;
5795
+ .x-margin--bottom-06 {
5796
+ margin-bottom: var(--x-size-base-06) !important;
5812
5797
  }
5813
- [dir="rtl"] .x-padding--right-07 {
5814
- padding-left: var(--x-size-base-07) !important;
5798
+ [dir="ltr"] .x-margin--right-06 {
5799
+ margin-right: var(--x-size-base-06) !important;
5815
5800
  }
5816
- [dir="ltr"] .x-padding--left-07 {
5817
- padding-left: var(--x-size-base-07) !important;
5801
+ [dir="rtl"] .x-margin--right-06 {
5802
+ margin-left: var(--x-size-base-06) !important;
5818
5803
  }
5819
- [dir="rtl"] .x-padding--left-07 {
5820
- padding-right: var(--x-size-base-07) !important;
5804
+ [dir="ltr"] .x-margin--left-06 {
5805
+ margin-left: var(--x-size-base-06) !important;
5821
5806
  }
5822
- .x-padding--top-08 {
5823
- padding-top: var(--x-size-base-08) !important;
5807
+ [dir="rtl"] .x-margin--left-06 {
5808
+ margin-right: var(--x-size-base-06) !important;
5824
5809
  }
5825
- .x-padding--bottom-08 {
5826
- padding-bottom: var(--x-size-base-08) !important;
5810
+ .x-margin--top-07 {
5811
+ margin-top: var(--x-size-base-07) !important;
5827
5812
  }
5828
- [dir="ltr"] .x-padding--right-08 {
5829
- padding-right: var(--x-size-base-08) !important;
5813
+ .x-margin--bottom-07 {
5814
+ margin-bottom: var(--x-size-base-07) !important;
5830
5815
  }
5831
- [dir="rtl"] .x-padding--right-08 {
5832
- padding-left: var(--x-size-base-08) !important;
5816
+ [dir="ltr"] .x-margin--right-07 {
5817
+ margin-right: var(--x-size-base-07) !important;
5833
5818
  }
5834
- [dir="ltr"] .x-padding--left-08 {
5835
- padding-left: var(--x-size-base-08) !important;
5819
+ [dir="rtl"] .x-margin--right-07 {
5820
+ margin-left: var(--x-size-base-07) !important;
5836
5821
  }
5837
- [dir="rtl"] .x-padding--left-08 {
5838
- padding-right: var(--x-size-base-08) !important;
5822
+ [dir="ltr"] .x-margin--left-07 {
5823
+ margin-left: var(--x-size-base-07) !important;
5839
5824
  }
5840
- .x-padding--top-09 {
5841
- padding-top: var(--x-size-base-09) !important;
5825
+ [dir="rtl"] .x-margin--left-07 {
5826
+ margin-right: var(--x-size-base-07) !important;
5842
5827
  }
5843
- .x-padding--bottom-09 {
5844
- padding-bottom: var(--x-size-base-09) !important;
5828
+ .x-margin--top-08 {
5829
+ margin-top: var(--x-size-base-08) !important;
5845
5830
  }
5846
- [dir="ltr"] .x-padding--right-09 {
5847
- padding-right: var(--x-size-base-09) !important;
5831
+ .x-margin--bottom-08 {
5832
+ margin-bottom: var(--x-size-base-08) !important;
5848
5833
  }
5849
- [dir="rtl"] .x-padding--right-09 {
5850
- padding-left: var(--x-size-base-09) !important;
5834
+ [dir="ltr"] .x-margin--right-08 {
5835
+ margin-right: var(--x-size-base-08) !important;
5851
5836
  }
5852
- [dir="ltr"] .x-padding--left-09 {
5853
- padding-left: var(--x-size-base-09) !important;
5837
+ [dir="rtl"] .x-margin--right-08 {
5838
+ margin-left: var(--x-size-base-08) !important;
5854
5839
  }
5855
- [dir="rtl"] .x-padding--left-09 {
5856
- padding-right: var(--x-size-base-09) !important;
5840
+ [dir="ltr"] .x-margin--left-08 {
5841
+ margin-left: var(--x-size-base-08) !important;
5857
5842
  }
5858
- .x-padding--top-10 {
5859
- padding-top: var(--x-size-base-10) !important;
5843
+ [dir="rtl"] .x-margin--left-08 {
5844
+ margin-right: var(--x-size-base-08) !important;
5860
5845
  }
5861
- .x-padding--bottom-10 {
5862
- padding-bottom: var(--x-size-base-10) !important;
5846
+ .x-margin--top-09 {
5847
+ margin-top: var(--x-size-base-09) !important;
5863
5848
  }
5864
- [dir="ltr"] .x-padding--right-10 {
5865
- padding-right: var(--x-size-base-10) !important;
5849
+ .x-margin--bottom-09 {
5850
+ margin-bottom: var(--x-size-base-09) !important;
5866
5851
  }
5867
- [dir="rtl"] .x-padding--right-10 {
5868
- padding-left: var(--x-size-base-10) !important;
5852
+ [dir="ltr"] .x-margin--right-09 {
5853
+ margin-right: var(--x-size-base-09) !important;
5869
5854
  }
5870
- [dir="ltr"] .x-padding--left-10 {
5871
- padding-left: var(--x-size-base-10) !important;
5855
+ [dir="rtl"] .x-margin--right-09 {
5856
+ margin-left: var(--x-size-base-09) !important;
5872
5857
  }
5873
- [dir="rtl"] .x-padding--left-10 {
5874
- padding-right: var(--x-size-base-10) !important;
5858
+ [dir="ltr"] .x-margin--left-09 {
5859
+ margin-left: var(--x-size-base-09) !important;
5875
5860
  }
5876
- .x-padding--top-11 {
5877
- padding-top: var(--x-size-base-11) !important;
5861
+ [dir="rtl"] .x-margin--left-09 {
5862
+ margin-right: var(--x-size-base-09) !important;
5878
5863
  }
5879
- .x-padding--bottom-11 {
5880
- padding-bottom: var(--x-size-base-11) !important;
5864
+ .x-margin--top-10 {
5865
+ margin-top: var(--x-size-base-10) !important;
5881
5866
  }
5882
- [dir="ltr"] .x-padding--right-11 {
5883
- padding-right: var(--x-size-base-11) !important;
5867
+ .x-margin--bottom-10 {
5868
+ margin-bottom: var(--x-size-base-10) !important;
5884
5869
  }
5885
- [dir="rtl"] .x-padding--right-11 {
5886
- padding-left: var(--x-size-base-11) !important;
5870
+ [dir="ltr"] .x-margin--right-10 {
5871
+ margin-right: var(--x-size-base-10) !important;
5887
5872
  }
5888
- [dir="ltr"] .x-padding--left-11 {
5889
- padding-left: var(--x-size-base-11) !important;
5873
+ [dir="rtl"] .x-margin--right-10 {
5874
+ margin-left: var(--x-size-base-10) !important;
5890
5875
  }
5891
- [dir="rtl"] .x-padding--left-11 {
5892
- padding-right: var(--x-size-base-11) !important;
5876
+ [dir="ltr"] .x-margin--left-10 {
5877
+ margin-left: var(--x-size-base-10) !important;
5893
5878
  }
5894
- .x-padding--top-12 {
5895
- padding-top: var(--x-size-base-12) !important;
5879
+ [dir="rtl"] .x-margin--left-10 {
5880
+ margin-right: var(--x-size-base-10) !important;
5896
5881
  }
5897
- .x-padding--bottom-12 {
5898
- padding-bottom: var(--x-size-base-12) !important;
5882
+ .x-margin--top-11 {
5883
+ margin-top: var(--x-size-base-11) !important;
5899
5884
  }
5900
- [dir="ltr"] .x-padding--right-12 {
5901
- padding-right: var(--x-size-base-12) !important;
5885
+ .x-margin--bottom-11 {
5886
+ margin-bottom: var(--x-size-base-11) !important;
5902
5887
  }
5903
- [dir="rtl"] .x-padding--right-12 {
5904
- padding-left: var(--x-size-base-12) !important;
5888
+ [dir="ltr"] .x-margin--right-11 {
5889
+ margin-right: var(--x-size-base-11) !important;
5905
5890
  }
5906
- [dir="ltr"] .x-padding--left-12 {
5907
- padding-left: var(--x-size-base-12) !important;
5891
+ [dir="rtl"] .x-margin--right-11 {
5892
+ margin-left: var(--x-size-base-11) !important;
5908
5893
  }
5909
- [dir="rtl"] .x-padding--left-12 {
5910
- padding-right: var(--x-size-base-12) !important;
5894
+ [dir="ltr"] .x-margin--left-11 {
5895
+ margin-left: var(--x-size-base-11) !important;
5911
5896
  }
5912
- .x-padding--top-13 {
5913
- padding-top: var(--x-size-base-13) !important;
5897
+ [dir="rtl"] .x-margin--left-11 {
5898
+ margin-right: var(--x-size-base-11) !important;
5914
5899
  }
5915
- .x-padding--bottom-13 {
5916
- padding-bottom: var(--x-size-base-13) !important;
5900
+ .x-margin--top-12 {
5901
+ margin-top: var(--x-size-base-12) !important;
5917
5902
  }
5918
- [dir="ltr"] .x-padding--right-13 {
5919
- padding-right: var(--x-size-base-13) !important;
5903
+ .x-margin--bottom-12 {
5904
+ margin-bottom: var(--x-size-base-12) !important;
5920
5905
  }
5921
- [dir="rtl"] .x-padding--right-13 {
5922
- padding-left: var(--x-size-base-13) !important;
5906
+ [dir="ltr"] .x-margin--right-12 {
5907
+ margin-right: var(--x-size-base-12) !important;
5923
5908
  }
5924
- [dir="ltr"] .x-padding--left-13 {
5925
- padding-left: var(--x-size-base-13) !important;
5909
+ [dir="rtl"] .x-margin--right-12 {
5910
+ margin-left: var(--x-size-base-12) !important;
5926
5911
  }
5927
- [dir="rtl"] .x-padding--left-13 {
5928
- padding-right: var(--x-size-base-13) !important;
5912
+ [dir="ltr"] .x-margin--left-12 {
5913
+ margin-left: var(--x-size-base-12) !important;
5929
5914
  }
5930
- .x-padding--top-14 {
5931
- padding-top: var(--x-size-base-14) !important;
5915
+ [dir="rtl"] .x-margin--left-12 {
5916
+ margin-right: var(--x-size-base-12) !important;
5932
5917
  }
5933
- .x-padding--bottom-14 {
5934
- padding-bottom: var(--x-size-base-14) !important;
5918
+ .x-margin--top-13 {
5919
+ margin-top: var(--x-size-base-13) !important;
5935
5920
  }
5936
- [dir="ltr"] .x-padding--right-14 {
5937
- padding-right: var(--x-size-base-14) !important;
5921
+ .x-margin--bottom-13 {
5922
+ margin-bottom: var(--x-size-base-13) !important;
5938
5923
  }
5939
- [dir="rtl"] .x-padding--right-14 {
5940
- padding-left: var(--x-size-base-14) !important;
5924
+ [dir="ltr"] .x-margin--right-13 {
5925
+ margin-right: var(--x-size-base-13) !important;
5941
5926
  }
5942
- [dir="ltr"] .x-padding--left-14 {
5943
- padding-left: var(--x-size-base-14) !important;
5927
+ [dir="rtl"] .x-margin--right-13 {
5928
+ margin-left: var(--x-size-base-13) !important;
5944
5929
  }
5945
- [dir="rtl"] .x-padding--left-14 {
5946
- padding-right: var(--x-size-base-14) !important;
5930
+ [dir="ltr"] .x-margin--left-13 {
5931
+ margin-left: var(--x-size-base-13) !important;
5947
5932
  }
5948
- .x-padding--top-15 {
5949
- padding-top: var(--x-size-base-15) !important;
5933
+ [dir="rtl"] .x-margin--left-13 {
5934
+ margin-right: var(--x-size-base-13) !important;
5950
5935
  }
5951
- .x-padding--bottom-15 {
5952
- padding-bottom: var(--x-size-base-15) !important;
5936
+ .x-margin--top-14 {
5937
+ margin-top: var(--x-size-base-14) !important;
5953
5938
  }
5954
- [dir="ltr"] .x-padding--right-15 {
5955
- padding-right: var(--x-size-base-15) !important;
5939
+ .x-margin--bottom-14 {
5940
+ margin-bottom: var(--x-size-base-14) !important;
5956
5941
  }
5957
- [dir="rtl"] .x-padding--right-15 {
5958
- padding-left: var(--x-size-base-15) !important;
5942
+ [dir="ltr"] .x-margin--right-14 {
5943
+ margin-right: var(--x-size-base-14) !important;
5959
5944
  }
5960
- [dir="ltr"] .x-padding--left-15 {
5961
- padding-left: var(--x-size-base-15) !important;
5945
+ [dir="rtl"] .x-margin--right-14 {
5946
+ margin-left: var(--x-size-base-14) !important;
5962
5947
  }
5963
- [dir="rtl"] .x-padding--left-15 {
5964
- padding-right: var(--x-size-base-15) !important;
5948
+ [dir="ltr"] .x-margin--left-14 {
5949
+ margin-left: var(--x-size-base-14) !important;
5965
5950
  }
5966
- .x-padding--top-16 {
5967
- padding-top: var(--x-size-base-16) !important;
5951
+ [dir="rtl"] .x-margin--left-14 {
5952
+ margin-right: var(--x-size-base-14) !important;
5968
5953
  }
5969
- .x-padding--bottom-16 {
5970
- padding-bottom: var(--x-size-base-16) !important;
5954
+ .x-margin--top-15 {
5955
+ margin-top: var(--x-size-base-15) !important;
5971
5956
  }
5972
- [dir="ltr"] .x-padding--right-16 {
5973
- padding-right: var(--x-size-base-16) !important;
5957
+ .x-margin--bottom-15 {
5958
+ margin-bottom: var(--x-size-base-15) !important;
5974
5959
  }
5975
- [dir="rtl"] .x-padding--right-16 {
5976
- padding-left: var(--x-size-base-16) !important;
5960
+ [dir="ltr"] .x-margin--right-15 {
5961
+ margin-right: var(--x-size-base-15) !important;
5977
5962
  }
5978
- [dir="ltr"] .x-padding--left-16 {
5979
- padding-left: var(--x-size-base-16) !important;
5963
+ [dir="rtl"] .x-margin--right-15 {
5964
+ margin-left: var(--x-size-base-15) !important;
5980
5965
  }
5981
- [dir="rtl"] .x-padding--left-16 {
5982
- padding-right: var(--x-size-base-16) !important;
5966
+ [dir="ltr"] .x-margin--left-15 {
5967
+ margin-left: var(--x-size-base-15) !important;
5983
5968
  }
5984
- .x-padding--top-17 {
5985
- padding-top: var(--x-size-base-17) !important;
5969
+ [dir="rtl"] .x-margin--left-15 {
5970
+ margin-right: var(--x-size-base-15) !important;
5986
5971
  }
5987
- .x-padding--bottom-17 {
5988
- padding-bottom: var(--x-size-base-17) !important;
5972
+ .x-margin--top-16 {
5973
+ margin-top: var(--x-size-base-16) !important;
5989
5974
  }
5990
- [dir="ltr"] .x-padding--right-17 {
5991
- padding-right: var(--x-size-base-17) !important;
5975
+ .x-margin--bottom-16 {
5976
+ margin-bottom: var(--x-size-base-16) !important;
5992
5977
  }
5993
- [dir="rtl"] .x-padding--right-17 {
5994
- padding-left: var(--x-size-base-17) !important;
5978
+ [dir="ltr"] .x-margin--right-16 {
5979
+ margin-right: var(--x-size-base-16) !important;
5995
5980
  }
5996
- [dir="ltr"] .x-padding--left-17 {
5997
- padding-left: var(--x-size-base-17) !important;
5981
+ [dir="rtl"] .x-margin--right-16 {
5982
+ margin-left: var(--x-size-base-16) !important;
5998
5983
  }
5999
- [dir="rtl"] .x-padding--left-17 {
6000
- padding-right: var(--x-size-base-17) !important;
5984
+ [dir="ltr"] .x-margin--left-16 {
5985
+ margin-left: var(--x-size-base-16) !important;
6001
5986
  }
6002
- .x-padding--top-18 {
6003
- padding-top: var(--x-size-base-18) !important;
5987
+ [dir="rtl"] .x-margin--left-16 {
5988
+ margin-right: var(--x-size-base-16) !important;
6004
5989
  }
6005
- .x-padding--bottom-18 {
6006
- padding-bottom: var(--x-size-base-18) !important;
5990
+ .x-margin--top-17 {
5991
+ margin-top: var(--x-size-base-17) !important;
6007
5992
  }
6008
- [dir="ltr"] .x-padding--right-18 {
6009
- padding-right: var(--x-size-base-18) !important;
5993
+ .x-margin--bottom-17 {
5994
+ margin-bottom: var(--x-size-base-17) !important;
6010
5995
  }
6011
- [dir="rtl"] .x-padding--right-18 {
6012
- padding-left: var(--x-size-base-18) !important;
5996
+ [dir="ltr"] .x-margin--right-17 {
5997
+ margin-right: var(--x-size-base-17) !important;
6013
5998
  }
6014
- [dir="ltr"] .x-padding--left-18 {
6015
- padding-left: var(--x-size-base-18) !important;
5999
+ [dir="rtl"] .x-margin--right-17 {
6000
+ margin-left: var(--x-size-base-17) !important;
6016
6001
  }
6017
- [dir="rtl"] .x-padding--left-18 {
6018
- padding-right: var(--x-size-base-18) !important;
6002
+ [dir="ltr"] .x-margin--left-17 {
6003
+ margin-left: var(--x-size-base-17) !important;
6019
6004
  }
6020
- .x-padding--top-19 {
6021
- padding-top: var(--x-size-base-19) !important;
6005
+ [dir="rtl"] .x-margin--left-17 {
6006
+ margin-right: var(--x-size-base-17) !important;
6022
6007
  }
6023
- .x-padding--bottom-19 {
6024
- padding-bottom: var(--x-size-base-19) !important;
6008
+ .x-margin--top-18 {
6009
+ margin-top: var(--x-size-base-18) !important;
6025
6010
  }
6026
- [dir="ltr"] .x-padding--right-19 {
6027
- padding-right: var(--x-size-base-19) !important;
6011
+ .x-margin--bottom-18 {
6012
+ margin-bottom: var(--x-size-base-18) !important;
6028
6013
  }
6029
- [dir="rtl"] .x-padding--right-19 {
6030
- padding-left: var(--x-size-base-19) !important;
6014
+ [dir="ltr"] .x-margin--right-18 {
6015
+ margin-right: var(--x-size-base-18) !important;
6031
6016
  }
6032
- [dir="ltr"] .x-padding--left-19 {
6033
- padding-left: var(--x-size-base-19) !important;
6017
+ [dir="rtl"] .x-margin--right-18 {
6018
+ margin-left: var(--x-size-base-18) !important;
6034
6019
  }
6035
- [dir="rtl"] .x-padding--left-19 {
6036
- padding-right: var(--x-size-base-19) !important;
6020
+ [dir="ltr"] .x-margin--left-18 {
6021
+ margin-left: var(--x-size-base-18) !important;
6037
6022
  }
6038
- .x-padding--top-20 {
6039
- padding-top: var(--x-size-base-20) !important;
6023
+ [dir="rtl"] .x-margin--left-18 {
6024
+ margin-right: var(--x-size-base-18) !important;
6040
6025
  }
6041
- .x-padding--bottom-20 {
6042
- padding-bottom: var(--x-size-base-20) !important;
6026
+ .x-margin--top-19 {
6027
+ margin-top: var(--x-size-base-19) !important;
6043
6028
  }
6044
- [dir="ltr"] .x-padding--right-20 {
6045
- padding-right: var(--x-size-base-20) !important;
6029
+ .x-margin--bottom-19 {
6030
+ margin-bottom: var(--x-size-base-19) !important;
6046
6031
  }
6047
- [dir="rtl"] .x-padding--right-20 {
6048
- padding-left: var(--x-size-base-20) !important;
6032
+ [dir="ltr"] .x-margin--right-19 {
6033
+ margin-right: var(--x-size-base-19) !important;
6049
6034
  }
6050
- [dir="ltr"] .x-padding--left-20 {
6051
- padding-left: var(--x-size-base-20) !important;
6035
+ [dir="rtl"] .x-margin--right-19 {
6036
+ margin-left: var(--x-size-base-19) !important;
6052
6037
  }
6053
- [dir="rtl"] .x-padding--left-20 {
6054
- padding-right: var(--x-size-base-20) !important;
6038
+ [dir="ltr"] .x-margin--left-19 {
6039
+ margin-left: var(--x-size-base-19) !important;
6055
6040
  }
6056
- .x-static {
6057
- position: static !important;
6041
+ [dir="rtl"] .x-margin--left-19 {
6042
+ margin-right: var(--x-size-base-19) !important;
6058
6043
  }
6059
-
6060
- .x-fixed {
6061
- position: fixed !important;
6044
+ .x-margin--top-20 {
6045
+ margin-top: var(--x-size-base-20) !important;
6062
6046
  }
6063
-
6064
- .x-absolute {
6065
- position: absolute !important;
6047
+ .x-margin--bottom-20 {
6048
+ margin-bottom: var(--x-size-base-20) !important;
6066
6049
  }
6067
-
6068
- .x-relative {
6069
- position: relative !important;
6050
+ [dir="ltr"] .x-margin--right-20 {
6051
+ margin-right: var(--x-size-base-20) !important;
6070
6052
  }
6071
-
6072
- .x-sticky {
6073
- position: sticky !important;
6053
+ [dir="rtl"] .x-margin--right-20 {
6054
+ margin-left: var(--x-size-base-20) !important;
6074
6055
  }
6075
-
6076
- .x-margin--auto {
6077
- margin: auto !important;
6056
+ [dir="ltr"] .x-margin--left-20 {
6057
+ margin-left: var(--x-size-base-20) !important;
6078
6058
  }
6079
- .x-margin--00 {
6080
- margin: 0 !important;
6059
+ [dir="rtl"] .x-margin--left-20 {
6060
+ margin-right: var(--x-size-base-20) !important;
6081
6061
  }
6082
- .x-margin--01 {
6083
- margin: var(--x-size-base-01) !important;
6062
+ .x-padding--00 {
6063
+ padding: 0 !important;
6084
6064
  }
6085
- .x-margin--02 {
6086
- margin: var(--x-size-base-02) !important;
6065
+ .x-padding--01 {
6066
+ padding: var(--x-size-base-01) !important;
6087
6067
  }
6088
- .x-margin--03 {
6089
- margin: var(--x-size-base-03) !important;
6068
+ .x-padding--02 {
6069
+ padding: var(--x-size-base-02) !important;
6090
6070
  }
6091
- .x-margin--04 {
6092
- margin: var(--x-size-base-04) !important;
6071
+ .x-padding--03 {
6072
+ padding: var(--x-size-base-03) !important;
6093
6073
  }
6094
- .x-margin--05 {
6095
- margin: var(--x-size-base-05) !important;
6074
+ .x-padding--04 {
6075
+ padding: var(--x-size-base-04) !important;
6096
6076
  }
6097
- .x-margin--06 {
6098
- margin: var(--x-size-base-06) !important;
6077
+ .x-padding--05 {
6078
+ padding: var(--x-size-base-05) !important;
6099
6079
  }
6100
- .x-margin--07 {
6101
- margin: var(--x-size-base-07) !important;
6080
+ .x-padding--06 {
6081
+ padding: var(--x-size-base-06) !important;
6102
6082
  }
6103
- .x-margin--08 {
6104
- margin: var(--x-size-base-08) !important;
6083
+ .x-padding--07 {
6084
+ padding: var(--x-size-base-07) !important;
6105
6085
  }
6106
- .x-margin--09 {
6107
- margin: var(--x-size-base-09) !important;
6086
+ .x-padding--08 {
6087
+ padding: var(--x-size-base-08) !important;
6108
6088
  }
6109
- .x-margin--10 {
6110
- margin: var(--x-size-base-10) !important;
6089
+ .x-padding--09 {
6090
+ padding: var(--x-size-base-09) !important;
6111
6091
  }
6112
- .x-margin--11 {
6113
- margin: var(--x-size-base-11) !important;
6092
+ .x-padding--10 {
6093
+ padding: var(--x-size-base-10) !important;
6114
6094
  }
6115
- .x-margin--12 {
6116
- margin: var(--x-size-base-12) !important;
6095
+ .x-padding--11 {
6096
+ padding: var(--x-size-base-11) !important;
6117
6097
  }
6118
- .x-margin--13 {
6119
- margin: var(--x-size-base-13) !important;
6098
+ .x-padding--12 {
6099
+ padding: var(--x-size-base-12) !important;
6120
6100
  }
6121
- .x-margin--14 {
6122
- margin: var(--x-size-base-14) !important;
6101
+ .x-padding--13 {
6102
+ padding: var(--x-size-base-13) !important;
6123
6103
  }
6124
- .x-margin--15 {
6125
- margin: var(--x-size-base-15) !important;
6104
+ .x-padding--14 {
6105
+ padding: var(--x-size-base-14) !important;
6126
6106
  }
6127
- .x-margin--16 {
6128
- margin: var(--x-size-base-16) !important;
6107
+ .x-padding--15 {
6108
+ padding: var(--x-size-base-15) !important;
6129
6109
  }
6130
- .x-margin--17 {
6131
- margin: var(--x-size-base-17) !important;
6110
+ .x-padding--16 {
6111
+ padding: var(--x-size-base-16) !important;
6132
6112
  }
6133
- .x-margin--18 {
6134
- margin: var(--x-size-base-18) !important;
6113
+ .x-padding--17 {
6114
+ padding: var(--x-size-base-17) !important;
6135
6115
  }
6136
- .x-margin--19 {
6137
- margin: var(--x-size-base-19) !important;
6116
+ .x-padding--18 {
6117
+ padding: var(--x-size-base-18) !important;
6138
6118
  }
6139
- .x-margin--20 {
6140
- margin: var(--x-size-base-20) !important;
6119
+ .x-padding--19 {
6120
+ padding: var(--x-size-base-19) !important;
6141
6121
  }
6142
- .x-margin--top-auto {
6143
- margin-top: auto !important;
6122
+ .x-padding--20 {
6123
+ padding: var(--x-size-base-20) !important;
6144
6124
  }
6145
- .x-margin--bottom-auto {
6146
- margin-bottom: auto !important;
6125
+ .x-padding--top-00 {
6126
+ padding-top: 0 !important;
6147
6127
  }
6148
- [dir="ltr"] .x-margin--right-auto {
6149
- margin-right: auto !important;
6128
+ .x-padding--bottom-00 {
6129
+ padding-bottom: 0 !important;
6150
6130
  }
6151
- [dir="rtl"] .x-margin--right-auto {
6152
- margin-left: auto !important;
6131
+ [dir="ltr"] .x-padding--right-00 {
6132
+ padding-right: 0 !important;
6153
6133
  }
6154
- [dir="ltr"] .x-margin--left-auto {
6155
- margin-left: auto !important;
6134
+ [dir="rtl"] .x-padding--right-00 {
6135
+ padding-left: 0 !important;
6156
6136
  }
6157
- [dir="rtl"] .x-margin--left-auto {
6158
- margin-right: auto !important;
6137
+ [dir="ltr"] .x-padding--left-00 {
6138
+ padding-left: 0 !important;
6159
6139
  }
6160
- .x-margin--top-00 {
6161
- margin-top: 0 !important;
6140
+ [dir="rtl"] .x-padding--left-00 {
6141
+ padding-right: 0 !important;
6162
6142
  }
6163
- .x-margin--bottom-00 {
6164
- margin-bottom: 0 !important;
6143
+ .x-padding--top-01 {
6144
+ padding-top: var(--x-size-base-01) !important;
6165
6145
  }
6166
- [dir="ltr"] .x-margin--right-00 {
6167
- margin-right: 0 !important;
6146
+ .x-padding--bottom-01 {
6147
+ padding-bottom: var(--x-size-base-01) !important;
6168
6148
  }
6169
- [dir="rtl"] .x-margin--right-00 {
6170
- margin-left: 0 !important;
6149
+ [dir="ltr"] .x-padding--right-01 {
6150
+ padding-right: var(--x-size-base-01) !important;
6171
6151
  }
6172
- [dir="ltr"] .x-margin--left-00 {
6173
- margin-left: 0 !important;
6152
+ [dir="rtl"] .x-padding--right-01 {
6153
+ padding-left: var(--x-size-base-01) !important;
6174
6154
  }
6175
- [dir="rtl"] .x-margin--left-00 {
6176
- margin-right: 0 !important;
6155
+ [dir="ltr"] .x-padding--left-01 {
6156
+ padding-left: var(--x-size-base-01) !important;
6177
6157
  }
6178
- .x-margin--top-01 {
6179
- margin-top: var(--x-size-base-01) !important;
6158
+ [dir="rtl"] .x-padding--left-01 {
6159
+ padding-right: var(--x-size-base-01) !important;
6180
6160
  }
6181
- .x-margin--bottom-01 {
6182
- margin-bottom: var(--x-size-base-01) !important;
6161
+ .x-padding--top-02 {
6162
+ padding-top: var(--x-size-base-02) !important;
6183
6163
  }
6184
- [dir="ltr"] .x-margin--right-01 {
6185
- margin-right: var(--x-size-base-01) !important;
6164
+ .x-padding--bottom-02 {
6165
+ padding-bottom: var(--x-size-base-02) !important;
6186
6166
  }
6187
- [dir="rtl"] .x-margin--right-01 {
6188
- margin-left: var(--x-size-base-01) !important;
6167
+ [dir="ltr"] .x-padding--right-02 {
6168
+ padding-right: var(--x-size-base-02) !important;
6189
6169
  }
6190
- [dir="ltr"] .x-margin--left-01 {
6191
- margin-left: var(--x-size-base-01) !important;
6170
+ [dir="rtl"] .x-padding--right-02 {
6171
+ padding-left: var(--x-size-base-02) !important;
6192
6172
  }
6193
- [dir="rtl"] .x-margin--left-01 {
6194
- margin-right: var(--x-size-base-01) !important;
6173
+ [dir="ltr"] .x-padding--left-02 {
6174
+ padding-left: var(--x-size-base-02) !important;
6195
6175
  }
6196
- .x-margin--top-02 {
6197
- margin-top: var(--x-size-base-02) !important;
6176
+ [dir="rtl"] .x-padding--left-02 {
6177
+ padding-right: var(--x-size-base-02) !important;
6198
6178
  }
6199
- .x-margin--bottom-02 {
6200
- margin-bottom: var(--x-size-base-02) !important;
6179
+ .x-padding--top-03 {
6180
+ padding-top: var(--x-size-base-03) !important;
6201
6181
  }
6202
- [dir="ltr"] .x-margin--right-02 {
6203
- margin-right: var(--x-size-base-02) !important;
6182
+ .x-padding--bottom-03 {
6183
+ padding-bottom: var(--x-size-base-03) !important;
6204
6184
  }
6205
- [dir="rtl"] .x-margin--right-02 {
6206
- margin-left: var(--x-size-base-02) !important;
6185
+ [dir="ltr"] .x-padding--right-03 {
6186
+ padding-right: var(--x-size-base-03) !important;
6207
6187
  }
6208
- [dir="ltr"] .x-margin--left-02 {
6209
- margin-left: var(--x-size-base-02) !important;
6188
+ [dir="rtl"] .x-padding--right-03 {
6189
+ padding-left: var(--x-size-base-03) !important;
6210
6190
  }
6211
- [dir="rtl"] .x-margin--left-02 {
6212
- margin-right: var(--x-size-base-02) !important;
6191
+ [dir="ltr"] .x-padding--left-03 {
6192
+ padding-left: var(--x-size-base-03) !important;
6213
6193
  }
6214
- .x-margin--top-03 {
6215
- margin-top: var(--x-size-base-03) !important;
6194
+ [dir="rtl"] .x-padding--left-03 {
6195
+ padding-right: var(--x-size-base-03) !important;
6216
6196
  }
6217
- .x-margin--bottom-03 {
6218
- margin-bottom: var(--x-size-base-03) !important;
6197
+ .x-padding--top-04 {
6198
+ padding-top: var(--x-size-base-04) !important;
6219
6199
  }
6220
- [dir="ltr"] .x-margin--right-03 {
6221
- margin-right: var(--x-size-base-03) !important;
6200
+ .x-padding--bottom-04 {
6201
+ padding-bottom: var(--x-size-base-04) !important;
6222
6202
  }
6223
- [dir="rtl"] .x-margin--right-03 {
6224
- margin-left: var(--x-size-base-03) !important;
6203
+ [dir="ltr"] .x-padding--right-04 {
6204
+ padding-right: var(--x-size-base-04) !important;
6225
6205
  }
6226
- [dir="ltr"] .x-margin--left-03 {
6227
- margin-left: var(--x-size-base-03) !important;
6206
+ [dir="rtl"] .x-padding--right-04 {
6207
+ padding-left: var(--x-size-base-04) !important;
6228
6208
  }
6229
- [dir="rtl"] .x-margin--left-03 {
6230
- margin-right: var(--x-size-base-03) !important;
6209
+ [dir="ltr"] .x-padding--left-04 {
6210
+ padding-left: var(--x-size-base-04) !important;
6231
6211
  }
6232
- .x-margin--top-04 {
6233
- margin-top: var(--x-size-base-04) !important;
6212
+ [dir="rtl"] .x-padding--left-04 {
6213
+ padding-right: var(--x-size-base-04) !important;
6234
6214
  }
6235
- .x-margin--bottom-04 {
6236
- margin-bottom: var(--x-size-base-04) !important;
6215
+ .x-padding--top-05 {
6216
+ padding-top: var(--x-size-base-05) !important;
6237
6217
  }
6238
- [dir="ltr"] .x-margin--right-04 {
6239
- margin-right: var(--x-size-base-04) !important;
6218
+ .x-padding--bottom-05 {
6219
+ padding-bottom: var(--x-size-base-05) !important;
6240
6220
  }
6241
- [dir="rtl"] .x-margin--right-04 {
6242
- margin-left: var(--x-size-base-04) !important;
6221
+ [dir="ltr"] .x-padding--right-05 {
6222
+ padding-right: var(--x-size-base-05) !important;
6243
6223
  }
6244
- [dir="ltr"] .x-margin--left-04 {
6245
- margin-left: var(--x-size-base-04) !important;
6224
+ [dir="rtl"] .x-padding--right-05 {
6225
+ padding-left: var(--x-size-base-05) !important;
6246
6226
  }
6247
- [dir="rtl"] .x-margin--left-04 {
6248
- margin-right: var(--x-size-base-04) !important;
6227
+ [dir="ltr"] .x-padding--left-05 {
6228
+ padding-left: var(--x-size-base-05) !important;
6249
6229
  }
6250
- .x-margin--top-05 {
6251
- margin-top: var(--x-size-base-05) !important;
6230
+ [dir="rtl"] .x-padding--left-05 {
6231
+ padding-right: var(--x-size-base-05) !important;
6252
6232
  }
6253
- .x-margin--bottom-05 {
6254
- margin-bottom: var(--x-size-base-05) !important;
6233
+ .x-padding--top-06 {
6234
+ padding-top: var(--x-size-base-06) !important;
6255
6235
  }
6256
- [dir="ltr"] .x-margin--right-05 {
6257
- margin-right: var(--x-size-base-05) !important;
6236
+ .x-padding--bottom-06 {
6237
+ padding-bottom: var(--x-size-base-06) !important;
6258
6238
  }
6259
- [dir="rtl"] .x-margin--right-05 {
6260
- margin-left: var(--x-size-base-05) !important;
6239
+ [dir="ltr"] .x-padding--right-06 {
6240
+ padding-right: var(--x-size-base-06) !important;
6261
6241
  }
6262
- [dir="ltr"] .x-margin--left-05 {
6263
- margin-left: var(--x-size-base-05) !important;
6242
+ [dir="rtl"] .x-padding--right-06 {
6243
+ padding-left: var(--x-size-base-06) !important;
6264
6244
  }
6265
- [dir="rtl"] .x-margin--left-05 {
6266
- margin-right: var(--x-size-base-05) !important;
6245
+ [dir="ltr"] .x-padding--left-06 {
6246
+ padding-left: var(--x-size-base-06) !important;
6267
6247
  }
6268
- .x-margin--top-06 {
6269
- margin-top: var(--x-size-base-06) !important;
6248
+ [dir="rtl"] .x-padding--left-06 {
6249
+ padding-right: var(--x-size-base-06) !important;
6270
6250
  }
6271
- .x-margin--bottom-06 {
6272
- margin-bottom: var(--x-size-base-06) !important;
6251
+ .x-padding--top-07 {
6252
+ padding-top: var(--x-size-base-07) !important;
6273
6253
  }
6274
- [dir="ltr"] .x-margin--right-06 {
6275
- margin-right: var(--x-size-base-06) !important;
6254
+ .x-padding--bottom-07 {
6255
+ padding-bottom: var(--x-size-base-07) !important;
6276
6256
  }
6277
- [dir="rtl"] .x-margin--right-06 {
6278
- margin-left: var(--x-size-base-06) !important;
6257
+ [dir="ltr"] .x-padding--right-07 {
6258
+ padding-right: var(--x-size-base-07) !important;
6279
6259
  }
6280
- [dir="ltr"] .x-margin--left-06 {
6281
- margin-left: var(--x-size-base-06) !important;
6260
+ [dir="rtl"] .x-padding--right-07 {
6261
+ padding-left: var(--x-size-base-07) !important;
6282
6262
  }
6283
- [dir="rtl"] .x-margin--left-06 {
6284
- margin-right: var(--x-size-base-06) !important;
6263
+ [dir="ltr"] .x-padding--left-07 {
6264
+ padding-left: var(--x-size-base-07) !important;
6285
6265
  }
6286
- .x-margin--top-07 {
6287
- margin-top: var(--x-size-base-07) !important;
6266
+ [dir="rtl"] .x-padding--left-07 {
6267
+ padding-right: var(--x-size-base-07) !important;
6288
6268
  }
6289
- .x-margin--bottom-07 {
6290
- margin-bottom: var(--x-size-base-07) !important;
6269
+ .x-padding--top-08 {
6270
+ padding-top: var(--x-size-base-08) !important;
6291
6271
  }
6292
- [dir="ltr"] .x-margin--right-07 {
6293
- margin-right: var(--x-size-base-07) !important;
6272
+ .x-padding--bottom-08 {
6273
+ padding-bottom: var(--x-size-base-08) !important;
6294
6274
  }
6295
- [dir="rtl"] .x-margin--right-07 {
6296
- margin-left: var(--x-size-base-07) !important;
6275
+ [dir="ltr"] .x-padding--right-08 {
6276
+ padding-right: var(--x-size-base-08) !important;
6297
6277
  }
6298
- [dir="ltr"] .x-margin--left-07 {
6299
- margin-left: var(--x-size-base-07) !important;
6278
+ [dir="rtl"] .x-padding--right-08 {
6279
+ padding-left: var(--x-size-base-08) !important;
6300
6280
  }
6301
- [dir="rtl"] .x-margin--left-07 {
6302
- margin-right: var(--x-size-base-07) !important;
6281
+ [dir="ltr"] .x-padding--left-08 {
6282
+ padding-left: var(--x-size-base-08) !important;
6303
6283
  }
6304
- .x-margin--top-08 {
6305
- margin-top: var(--x-size-base-08) !important;
6284
+ [dir="rtl"] .x-padding--left-08 {
6285
+ padding-right: var(--x-size-base-08) !important;
6306
6286
  }
6307
- .x-margin--bottom-08 {
6308
- margin-bottom: var(--x-size-base-08) !important;
6287
+ .x-padding--top-09 {
6288
+ padding-top: var(--x-size-base-09) !important;
6309
6289
  }
6310
- [dir="ltr"] .x-margin--right-08 {
6311
- margin-right: var(--x-size-base-08) !important;
6290
+ .x-padding--bottom-09 {
6291
+ padding-bottom: var(--x-size-base-09) !important;
6312
6292
  }
6313
- [dir="rtl"] .x-margin--right-08 {
6314
- margin-left: var(--x-size-base-08) !important;
6293
+ [dir="ltr"] .x-padding--right-09 {
6294
+ padding-right: var(--x-size-base-09) !important;
6315
6295
  }
6316
- [dir="ltr"] .x-margin--left-08 {
6317
- margin-left: var(--x-size-base-08) !important;
6296
+ [dir="rtl"] .x-padding--right-09 {
6297
+ padding-left: var(--x-size-base-09) !important;
6318
6298
  }
6319
- [dir="rtl"] .x-margin--left-08 {
6320
- margin-right: var(--x-size-base-08) !important;
6299
+ [dir="ltr"] .x-padding--left-09 {
6300
+ padding-left: var(--x-size-base-09) !important;
6321
6301
  }
6322
- .x-margin--top-09 {
6323
- margin-top: var(--x-size-base-09) !important;
6302
+ [dir="rtl"] .x-padding--left-09 {
6303
+ padding-right: var(--x-size-base-09) !important;
6324
6304
  }
6325
- .x-margin--bottom-09 {
6326
- margin-bottom: var(--x-size-base-09) !important;
6305
+ .x-padding--top-10 {
6306
+ padding-top: var(--x-size-base-10) !important;
6327
6307
  }
6328
- [dir="ltr"] .x-margin--right-09 {
6329
- margin-right: var(--x-size-base-09) !important;
6308
+ .x-padding--bottom-10 {
6309
+ padding-bottom: var(--x-size-base-10) !important;
6330
6310
  }
6331
- [dir="rtl"] .x-margin--right-09 {
6332
- margin-left: var(--x-size-base-09) !important;
6311
+ [dir="ltr"] .x-padding--right-10 {
6312
+ padding-right: var(--x-size-base-10) !important;
6333
6313
  }
6334
- [dir="ltr"] .x-margin--left-09 {
6335
- margin-left: var(--x-size-base-09) !important;
6314
+ [dir="rtl"] .x-padding--right-10 {
6315
+ padding-left: var(--x-size-base-10) !important;
6336
6316
  }
6337
- [dir="rtl"] .x-margin--left-09 {
6338
- margin-right: var(--x-size-base-09) !important;
6317
+ [dir="ltr"] .x-padding--left-10 {
6318
+ padding-left: var(--x-size-base-10) !important;
6339
6319
  }
6340
- .x-margin--top-10 {
6341
- margin-top: var(--x-size-base-10) !important;
6320
+ [dir="rtl"] .x-padding--left-10 {
6321
+ padding-right: var(--x-size-base-10) !important;
6342
6322
  }
6343
- .x-margin--bottom-10 {
6344
- margin-bottom: var(--x-size-base-10) !important;
6323
+ .x-padding--top-11 {
6324
+ padding-top: var(--x-size-base-11) !important;
6345
6325
  }
6346
- [dir="ltr"] .x-margin--right-10 {
6347
- margin-right: var(--x-size-base-10) !important;
6326
+ .x-padding--bottom-11 {
6327
+ padding-bottom: var(--x-size-base-11) !important;
6328
+ }
6329
+ [dir="ltr"] .x-padding--right-11 {
6330
+ padding-right: var(--x-size-base-11) !important;
6348
6331
  }
6349
- [dir="rtl"] .x-margin--right-10 {
6350
- margin-left: var(--x-size-base-10) !important;
6332
+ [dir="rtl"] .x-padding--right-11 {
6333
+ padding-left: var(--x-size-base-11) !important;
6351
6334
  }
6352
- [dir="ltr"] .x-margin--left-10 {
6353
- margin-left: var(--x-size-base-10) !important;
6335
+ [dir="ltr"] .x-padding--left-11 {
6336
+ padding-left: var(--x-size-base-11) !important;
6354
6337
  }
6355
- [dir="rtl"] .x-margin--left-10 {
6356
- margin-right: var(--x-size-base-10) !important;
6338
+ [dir="rtl"] .x-padding--left-11 {
6339
+ padding-right: var(--x-size-base-11) !important;
6357
6340
  }
6358
- .x-margin--top-11 {
6359
- margin-top: var(--x-size-base-11) !important;
6341
+ .x-padding--top-12 {
6342
+ padding-top: var(--x-size-base-12) !important;
6360
6343
  }
6361
- .x-margin--bottom-11 {
6362
- margin-bottom: var(--x-size-base-11) !important;
6344
+ .x-padding--bottom-12 {
6345
+ padding-bottom: var(--x-size-base-12) !important;
6363
6346
  }
6364
- [dir="ltr"] .x-margin--right-11 {
6365
- margin-right: var(--x-size-base-11) !important;
6347
+ [dir="ltr"] .x-padding--right-12 {
6348
+ padding-right: var(--x-size-base-12) !important;
6366
6349
  }
6367
- [dir="rtl"] .x-margin--right-11 {
6368
- margin-left: var(--x-size-base-11) !important;
6350
+ [dir="rtl"] .x-padding--right-12 {
6351
+ padding-left: var(--x-size-base-12) !important;
6369
6352
  }
6370
- [dir="ltr"] .x-margin--left-11 {
6371
- margin-left: var(--x-size-base-11) !important;
6353
+ [dir="ltr"] .x-padding--left-12 {
6354
+ padding-left: var(--x-size-base-12) !important;
6372
6355
  }
6373
- [dir="rtl"] .x-margin--left-11 {
6374
- margin-right: var(--x-size-base-11) !important;
6356
+ [dir="rtl"] .x-padding--left-12 {
6357
+ padding-right: var(--x-size-base-12) !important;
6375
6358
  }
6376
- .x-margin--top-12 {
6377
- margin-top: var(--x-size-base-12) !important;
6359
+ .x-padding--top-13 {
6360
+ padding-top: var(--x-size-base-13) !important;
6378
6361
  }
6379
- .x-margin--bottom-12 {
6380
- margin-bottom: var(--x-size-base-12) !important;
6362
+ .x-padding--bottom-13 {
6363
+ padding-bottom: var(--x-size-base-13) !important;
6381
6364
  }
6382
- [dir="ltr"] .x-margin--right-12 {
6383
- margin-right: var(--x-size-base-12) !important;
6365
+ [dir="ltr"] .x-padding--right-13 {
6366
+ padding-right: var(--x-size-base-13) !important;
6384
6367
  }
6385
- [dir="rtl"] .x-margin--right-12 {
6386
- margin-left: var(--x-size-base-12) !important;
6368
+ [dir="rtl"] .x-padding--right-13 {
6369
+ padding-left: var(--x-size-base-13) !important;
6387
6370
  }
6388
- [dir="ltr"] .x-margin--left-12 {
6389
- margin-left: var(--x-size-base-12) !important;
6371
+ [dir="ltr"] .x-padding--left-13 {
6372
+ padding-left: var(--x-size-base-13) !important;
6390
6373
  }
6391
- [dir="rtl"] .x-margin--left-12 {
6392
- margin-right: var(--x-size-base-12) !important;
6374
+ [dir="rtl"] .x-padding--left-13 {
6375
+ padding-right: var(--x-size-base-13) !important;
6393
6376
  }
6394
- .x-margin--top-13 {
6395
- margin-top: var(--x-size-base-13) !important;
6377
+ .x-padding--top-14 {
6378
+ padding-top: var(--x-size-base-14) !important;
6396
6379
  }
6397
- .x-margin--bottom-13 {
6398
- margin-bottom: var(--x-size-base-13) !important;
6380
+ .x-padding--bottom-14 {
6381
+ padding-bottom: var(--x-size-base-14) !important;
6399
6382
  }
6400
- [dir="ltr"] .x-margin--right-13 {
6401
- margin-right: var(--x-size-base-13) !important;
6383
+ [dir="ltr"] .x-padding--right-14 {
6384
+ padding-right: var(--x-size-base-14) !important;
6402
6385
  }
6403
- [dir="rtl"] .x-margin--right-13 {
6404
- margin-left: var(--x-size-base-13) !important;
6386
+ [dir="rtl"] .x-padding--right-14 {
6387
+ padding-left: var(--x-size-base-14) !important;
6405
6388
  }
6406
- [dir="ltr"] .x-margin--left-13 {
6407
- margin-left: var(--x-size-base-13) !important;
6389
+ [dir="ltr"] .x-padding--left-14 {
6390
+ padding-left: var(--x-size-base-14) !important;
6408
6391
  }
6409
- [dir="rtl"] .x-margin--left-13 {
6410
- margin-right: var(--x-size-base-13) !important;
6392
+ [dir="rtl"] .x-padding--left-14 {
6393
+ padding-right: var(--x-size-base-14) !important;
6411
6394
  }
6412
- .x-margin--top-14 {
6413
- margin-top: var(--x-size-base-14) !important;
6395
+ .x-padding--top-15 {
6396
+ padding-top: var(--x-size-base-15) !important;
6414
6397
  }
6415
- .x-margin--bottom-14 {
6416
- margin-bottom: var(--x-size-base-14) !important;
6398
+ .x-padding--bottom-15 {
6399
+ padding-bottom: var(--x-size-base-15) !important;
6417
6400
  }
6418
- [dir="ltr"] .x-margin--right-14 {
6419
- margin-right: var(--x-size-base-14) !important;
6401
+ [dir="ltr"] .x-padding--right-15 {
6402
+ padding-right: var(--x-size-base-15) !important;
6420
6403
  }
6421
- [dir="rtl"] .x-margin--right-14 {
6422
- margin-left: var(--x-size-base-14) !important;
6404
+ [dir="rtl"] .x-padding--right-15 {
6405
+ padding-left: var(--x-size-base-15) !important;
6423
6406
  }
6424
- [dir="ltr"] .x-margin--left-14 {
6425
- margin-left: var(--x-size-base-14) !important;
6407
+ [dir="ltr"] .x-padding--left-15 {
6408
+ padding-left: var(--x-size-base-15) !important;
6426
6409
  }
6427
- [dir="rtl"] .x-margin--left-14 {
6428
- margin-right: var(--x-size-base-14) !important;
6410
+ [dir="rtl"] .x-padding--left-15 {
6411
+ padding-right: var(--x-size-base-15) !important;
6429
6412
  }
6430
- .x-margin--top-15 {
6431
- margin-top: var(--x-size-base-15) !important;
6413
+ .x-padding--top-16 {
6414
+ padding-top: var(--x-size-base-16) !important;
6432
6415
  }
6433
- .x-margin--bottom-15 {
6434
- margin-bottom: var(--x-size-base-15) !important;
6416
+ .x-padding--bottom-16 {
6417
+ padding-bottom: var(--x-size-base-16) !important;
6435
6418
  }
6436
- [dir="ltr"] .x-margin--right-15 {
6437
- margin-right: var(--x-size-base-15) !important;
6419
+ [dir="ltr"] .x-padding--right-16 {
6420
+ padding-right: var(--x-size-base-16) !important;
6438
6421
  }
6439
- [dir="rtl"] .x-margin--right-15 {
6440
- margin-left: var(--x-size-base-15) !important;
6422
+ [dir="rtl"] .x-padding--right-16 {
6423
+ padding-left: var(--x-size-base-16) !important;
6441
6424
  }
6442
- [dir="ltr"] .x-margin--left-15 {
6443
- margin-left: var(--x-size-base-15) !important;
6425
+ [dir="ltr"] .x-padding--left-16 {
6426
+ padding-left: var(--x-size-base-16) !important;
6444
6427
  }
6445
- [dir="rtl"] .x-margin--left-15 {
6446
- margin-right: var(--x-size-base-15) !important;
6428
+ [dir="rtl"] .x-padding--left-16 {
6429
+ padding-right: var(--x-size-base-16) !important;
6447
6430
  }
6448
- .x-margin--top-16 {
6449
- margin-top: var(--x-size-base-16) !important;
6431
+ .x-padding--top-17 {
6432
+ padding-top: var(--x-size-base-17) !important;
6450
6433
  }
6451
- .x-margin--bottom-16 {
6452
- margin-bottom: var(--x-size-base-16) !important;
6434
+ .x-padding--bottom-17 {
6435
+ padding-bottom: var(--x-size-base-17) !important;
6453
6436
  }
6454
- [dir="ltr"] .x-margin--right-16 {
6455
- margin-right: var(--x-size-base-16) !important;
6437
+ [dir="ltr"] .x-padding--right-17 {
6438
+ padding-right: var(--x-size-base-17) !important;
6456
6439
  }
6457
- [dir="rtl"] .x-margin--right-16 {
6458
- margin-left: var(--x-size-base-16) !important;
6440
+ [dir="rtl"] .x-padding--right-17 {
6441
+ padding-left: var(--x-size-base-17) !important;
6459
6442
  }
6460
- [dir="ltr"] .x-margin--left-16 {
6461
- margin-left: var(--x-size-base-16) !important;
6443
+ [dir="ltr"] .x-padding--left-17 {
6444
+ padding-left: var(--x-size-base-17) !important;
6462
6445
  }
6463
- [dir="rtl"] .x-margin--left-16 {
6464
- margin-right: var(--x-size-base-16) !important;
6446
+ [dir="rtl"] .x-padding--left-17 {
6447
+ padding-right: var(--x-size-base-17) !important;
6465
6448
  }
6466
- .x-margin--top-17 {
6467
- margin-top: var(--x-size-base-17) !important;
6449
+ .x-padding--top-18 {
6450
+ padding-top: var(--x-size-base-18) !important;
6468
6451
  }
6469
- .x-margin--bottom-17 {
6470
- margin-bottom: var(--x-size-base-17) !important;
6452
+ .x-padding--bottom-18 {
6453
+ padding-bottom: var(--x-size-base-18) !important;
6471
6454
  }
6472
- [dir="ltr"] .x-margin--right-17 {
6473
- margin-right: var(--x-size-base-17) !important;
6455
+ [dir="ltr"] .x-padding--right-18 {
6456
+ padding-right: var(--x-size-base-18) !important;
6474
6457
  }
6475
- [dir="rtl"] .x-margin--right-17 {
6476
- margin-left: var(--x-size-base-17) !important;
6458
+ [dir="rtl"] .x-padding--right-18 {
6459
+ padding-left: var(--x-size-base-18) !important;
6477
6460
  }
6478
- [dir="ltr"] .x-margin--left-17 {
6479
- margin-left: var(--x-size-base-17) !important;
6461
+ [dir="ltr"] .x-padding--left-18 {
6462
+ padding-left: var(--x-size-base-18) !important;
6480
6463
  }
6481
- [dir="rtl"] .x-margin--left-17 {
6482
- margin-right: var(--x-size-base-17) !important;
6464
+ [dir="rtl"] .x-padding--left-18 {
6465
+ padding-right: var(--x-size-base-18) !important;
6483
6466
  }
6484
- .x-margin--top-18 {
6485
- margin-top: var(--x-size-base-18) !important;
6467
+ .x-padding--top-19 {
6468
+ padding-top: var(--x-size-base-19) !important;
6486
6469
  }
6487
- .x-margin--bottom-18 {
6488
- margin-bottom: var(--x-size-base-18) !important;
6470
+ .x-padding--bottom-19 {
6471
+ padding-bottom: var(--x-size-base-19) !important;
6489
6472
  }
6490
- [dir="ltr"] .x-margin--right-18 {
6491
- margin-right: var(--x-size-base-18) !important;
6473
+ [dir="ltr"] .x-padding--right-19 {
6474
+ padding-right: var(--x-size-base-19) !important;
6492
6475
  }
6493
- [dir="rtl"] .x-margin--right-18 {
6494
- margin-left: var(--x-size-base-18) !important;
6476
+ [dir="rtl"] .x-padding--right-19 {
6477
+ padding-left: var(--x-size-base-19) !important;
6495
6478
  }
6496
- [dir="ltr"] .x-margin--left-18 {
6497
- margin-left: var(--x-size-base-18) !important;
6479
+ [dir="ltr"] .x-padding--left-19 {
6480
+ padding-left: var(--x-size-base-19) !important;
6498
6481
  }
6499
- [dir="rtl"] .x-margin--left-18 {
6500
- margin-right: var(--x-size-base-18) !important;
6482
+ [dir="rtl"] .x-padding--left-19 {
6483
+ padding-right: var(--x-size-base-19) !important;
6501
6484
  }
6502
- .x-margin--top-19 {
6503
- margin-top: var(--x-size-base-19) !important;
6485
+ .x-padding--top-20 {
6486
+ padding-top: var(--x-size-base-20) !important;
6504
6487
  }
6505
- .x-margin--bottom-19 {
6506
- margin-bottom: var(--x-size-base-19) !important;
6488
+ .x-padding--bottom-20 {
6489
+ padding-bottom: var(--x-size-base-20) !important;
6507
6490
  }
6508
- [dir="ltr"] .x-margin--right-19 {
6509
- margin-right: var(--x-size-base-19) !important;
6491
+ [dir="ltr"] .x-padding--right-20 {
6492
+ padding-right: var(--x-size-base-20) !important;
6510
6493
  }
6511
- [dir="rtl"] .x-margin--right-19 {
6512
- margin-left: var(--x-size-base-19) !important;
6494
+ [dir="rtl"] .x-padding--right-20 {
6495
+ padding-left: var(--x-size-base-20) !important;
6513
6496
  }
6514
- [dir="ltr"] .x-margin--left-19 {
6515
- margin-left: var(--x-size-base-19) !important;
6497
+ [dir="ltr"] .x-padding--left-20 {
6498
+ padding-left: var(--x-size-base-20) !important;
6516
6499
  }
6517
- [dir="rtl"] .x-margin--left-19 {
6518
- margin-right: var(--x-size-base-19) !important;
6500
+ [dir="rtl"] .x-padding--left-20 {
6501
+ padding-right: var(--x-size-base-20) !important;
6519
6502
  }
6520
- .x-margin--top-20 {
6521
- margin-top: var(--x-size-base-20) !important;
6503
+ .x-static {
6504
+ position: static !important;
6522
6505
  }
6523
- .x-margin--bottom-20 {
6524
- margin-bottom: var(--x-size-base-20) !important;
6506
+
6507
+ .x-fixed {
6508
+ position: fixed !important;
6525
6509
  }
6526
- [dir="ltr"] .x-margin--right-20 {
6527
- margin-right: var(--x-size-base-20) !important;
6510
+
6511
+ .x-absolute {
6512
+ position: absolute !important;
6528
6513
  }
6529
- [dir="rtl"] .x-margin--right-20 {
6530
- margin-left: var(--x-size-base-20) !important;
6514
+
6515
+ .x-relative {
6516
+ position: relative !important;
6531
6517
  }
6532
- [dir="ltr"] .x-margin--left-20 {
6533
- margin-left: var(--x-size-base-20) !important;
6518
+
6519
+ .x-sticky {
6520
+ position: sticky !important;
6534
6521
  }
6535
- [dir="rtl"] .x-margin--left-20 {
6536
- margin-right: var(--x-size-base-20) !important;
6537
- }