@empathyco/x-components 3.0.0-alpha.321 → 3.0.0-alpha.323

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 (3) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/design-system/full-theme.css +1527 -1526
  3. package/package.json +3 -3
package/design-system/full-theme.css CHANGED
@@ -18,6 +18,28 @@
18
18
  --x-color-base-disable: #e11f26;
19
19
  --x-color-base-transparent: transparent;
20
20
  }
21
+ :root {
22
+ --x-size-base-01: 2px;
23
+ --x-size-base-02: 4px;
24
+ --x-size-base-03: 8px;
25
+ --x-size-base-04: 12px;
26
+ --x-size-base-05: 16px;
27
+ --x-size-base-06: 24px;
28
+ --x-size-base-07: 32px;
29
+ --x-size-base-08: 40px;
30
+ --x-size-base-09: 48px;
31
+ --x-size-base-10: 56px;
32
+ --x-size-base-11: 64px;
33
+ --x-size-base-12: 80px;
34
+ --x-size-base-13: 80px;
35
+ --x-size-base-14: 96px;
36
+ --x-size-base-15: 128px;
37
+ --x-size-base-16: 152px;
38
+ --x-size-base-17: 184px;
39
+ --x-size-base-18: 216px;
40
+ --x-size-base-19: 280px;
41
+ --x-size-base-20: 344px;
42
+ }
21
43
  [dir="ltr"] .x-badge {
22
44
  right: calc(var(--x-size-width-badge-default) / 4);
23
45
  }
@@ -54,28 +76,6 @@
54
76
  .x-badge-container {
55
77
  position: relative;
56
78
  }
57
- :root {
58
- --x-size-base-01: 2px;
59
- --x-size-base-02: 4px;
60
- --x-size-base-03: 8px;
61
- --x-size-base-04: 12px;
62
- --x-size-base-05: 16px;
63
- --x-size-base-06: 24px;
64
- --x-size-base-07: 32px;
65
- --x-size-base-08: 40px;
66
- --x-size-base-09: 48px;
67
- --x-size-base-10: 56px;
68
- --x-size-base-11: 64px;
69
- --x-size-base-12: 80px;
70
- --x-size-base-13: 80px;
71
- --x-size-base-14: 96px;
72
- --x-size-base-15: 128px;
73
- --x-size-base-16: 152px;
74
- --x-size-base-17: 184px;
75
- --x-size-base-18: 216px;
76
- --x-size-base-19: 280px;
77
- --x-size-base-20: 344px;
78
- }
79
79
  :root {
80
80
  --x-color-background-badge-default: var(--x-color-base-neutral-10);
81
81
  --x-color-text-badge-default: var(--x-color-base-neutral-100);
@@ -2061,117 +2061,6 @@
2061
2061
  --x-number-font-weight-base-regular
2062
2062
  );
2063
2063
  }
2064
- .x-option-list {
2065
- display: inline-flex;
2066
- flex-flow: row nowrap;
2067
- align-items: center;
2068
- box-sizing: border-box;
2069
- list-style-type: none;
2070
- margin: 0;
2071
- padding: 0;
2072
- }
2073
- [dir="ltr"] .x-option-list__item {
2074
- border-right-width: var(--x-size-border-width-right-option-list-item-default);
2075
- }
2076
- [dir="rtl"] .x-option-list__item {
2077
- border-left-width: var(--x-size-border-width-right-option-list-item-default);
2078
- }
2079
- [dir="ltr"] .x-option-list__item {
2080
- border-left-width: var(--x-size-border-width-left-option-list-item-default);
2081
- }
2082
- [dir="rtl"] .x-option-list__item {
2083
- border-right-width: var(--x-size-border-width-left-option-list-item-default);
2084
- }
2085
- .x-option-list__item {
2086
- border-top-color: var(--x-color-border-top-option-list-item-default);
2087
- border-right-color: var(--x-color-border-right-option-list-item-default);
2088
- border-bottom-color: var(--x-color-border-bottom-option-list-item-default);
2089
- border-left-color: var(--x-color-border-left-option-list-item-default);
2090
- border-style: solid;
2091
- border-top-width: var(--x-size-border-width-top-option-list-item-default);
2092
- border-bottom-width: var(--x-size-border-width-bottom-option-list-item-default);
2093
- }
2094
- .x-option-list__item.x-option-list__item--is-selected {
2095
- --x-color-border-option-list-item-default: var(
2096
- --x-color-border-option-list-item-default-selected
2097
- );
2098
- --x-color-border-top-option-list-item-default: var(
2099
- --x-color-border-top-option-list-item-default-selected
2100
- );
2101
- --x-color-border-right-option-list-item-default: var(
2102
- --x-color-border-right-option-list-item-default-selected
2103
- );
2104
- --x-color-border-bottom-option-list-item-default: var(
2105
- --x-color-border-bottom-option-list-item-default-selected
2106
- );
2107
- --x-color-border-left-option-list-item-default: var(
2108
- --x-color-border-left-option-list-item-default-selected
2109
- );
2110
- --x-size-border-width-top-option-list-item-default: var(
2111
- --x-size-border-width-top-option-list-item-default-selected
2112
- );
2113
- --x-size-border-width-right-option-list-item-default: var(
2114
- --x-size-border-width-right-option-list-item-default-selected
2115
- );
2116
- --x-size-border-width-bottom-option-list-item-default: var(
2117
- --x-size-border-width-bottom-option-list-item-default-selected
2118
- );
2119
- --x-size-border-width-left-option-list-item-default: var(
2120
- --x-size-border-width-left-option-list-item-default-selected
2121
- );
2122
- }
2123
- .x-option-list__item.x-option-list__item--is-selected .x-button {
2124
- --x-color-background-button-default: var(
2125
- --x-color-background-option-list-button-default-selected
2126
- );
2127
- --x-color-border-button-default: var(--x-color-border-option-list-button-default-selected);
2128
- --x-color-text-button-default: var(--x-color-text-option-list-button-default-selected);
2129
- --x-number-font-weight-option-list-button-default: var(
2130
- --x-number-font-weight-option-list-button-default-selected
2131
- );
2132
- }
2133
- .x-option-list__item.x-option-list__item--is-selected .x-button:hover {
2134
- --x-color-background-button-default: var(
2135
- --x-color-background-option-list-button-default-selected-hover
2136
- );
2137
- --x-color-border-button-default: var(
2138
- --x-color-border-option-list-button-default-selected-hover
2139
- );
2140
- --x-color-text-button-default: var(
2141
- --x-color-text-option-list-button-default-selected-hover
2142
- );
2143
- }
2144
- .x-option-list__item:last-child {
2145
- --x-size-border-width-option-list-item-default: 0;
2146
- --x-size-border-width-top-option-list-item-default: 0;
2147
- --x-size-border-width-right-option-list-item-default: 0;
2148
- --x-size-border-width-bottom-option-list-item-default: 0;
2149
- --x-size-border-width-left-option-list-item-default: 0;
2150
- }
2151
- .x-option-list__item .x-button {
2152
- --x-color-background-button-default: var(--x-color-background-option-list-button-default);
2153
- --x-color-border-button-default: var(--x-color-border-option-list-button-default);
2154
- --x-color-text-button-default: var(--x-color-text-option-list-button-default);
2155
- min-height: auto;
2156
- --x-size-padding-button-default: var(--x-size-padding-option-list-button-default);
2157
- --x-size-padding-top-button-default: var(--x-size-padding-top-option-list-button-default);
2158
- --x-size-padding-right-button-default: var(--x-size-padding-right-option-list-button-default);
2159
- --x-size-padding-bottom-button-default: var(
2160
- --x-size-padding-bottom-option-list-button-default
2161
- );
2162
- --x-size-padding-left-button-default: var(--x-size-padding-left-option-list-button-default);
2163
- --x-number-font-weight-button-default: var(--x-number-font-weight-option-list-button-default);
2164
- --x-size-font-button-default: var(--x-size-font-option-list-button-default);
2165
- }
2166
- .x-option-list__item .x-button:hover {
2167
- --x-color-background-button-default: var(
2168
- --x-color-background-option-list-button-default-hover
2169
- );
2170
- --x-color-border-button-default: var(--x-color-border-option-list-button-default-hover);
2171
- --x-color-text-button-default: var(--x-color-text-option-list-button-default-hover);
2172
- -webkit-text-decoration: var(--x-font-decoration-option-list-button-default-hover);
2173
- text-decoration: var(--x-font-decoration-option-list-button-default-hover);
2174
- }
2175
2064
  :root {
2176
2065
  --x-color-background-option-list-button-default: transparent;
2177
2066
  --x-color-border-option-list-button-default: transparent;
@@ -2961,2034 +2850,2034 @@
2961
2850
  .x-border-color--transparent {
2962
2851
  border-color: var(--x-color-base-transparent) !important;
2963
2852
  }
2964
- .x-border-radius--00 {
2965
- border-radius: 0 !important;
2966
- }
2967
-
2968
- .x-border-radius--pill {
2969
- border-radius: 99999px !important;
2853
+ *[class*=x-border-width--] {
2854
+ border-width: 0;
2970
2855
  }
2971
2856
 
2972
- .x-border-radius--01 {
2973
- border-radius: var(--x-size-base-01) !important;
2857
+ .x-border-width--00 {
2858
+ border-width: 0px !important;
2859
+ border-style: solid !important;
2974
2860
  }
2975
- [dir="ltr"] .x-border-radius--top-01 {
2976
- border-top-left-radius: var(--x-size-base-01) !important;
2861
+ .x-border-width--top-00 {
2862
+ border-top-width: 0px !important;
2863
+ border-style: solid !important;
2977
2864
  }
2978
- [dir="rtl"] .x-border-radius--top-01 {
2979
- border-top-right-radius: var(--x-size-base-01) !important;
2865
+ .x-border-width--bottom-00 {
2866
+ border-bottom-width: 0px !important;
2867
+ border-style: solid !important;
2980
2868
  }
2981
- [dir="ltr"] .x-border-radius--top-01 {
2982
- border-top-right-radius: var(--x-size-base-01) !important;
2869
+ [dir="ltr"] .x-border-width--right-00 {
2870
+ border-right-width: 0px !important;
2983
2871
  }
2984
- [dir="rtl"] .x-border-radius--top-01 {
2985
- border-top-left-radius: var(--x-size-base-01) !important;
2872
+ [dir="rtl"] .x-border-width--right-00 {
2873
+ border-left-width: 0px !important;
2986
2874
  }
2987
- [dir="ltr"] .x-border-radius--bottom-01 {
2988
- border-bottom-left-radius: var(--x-size-base-01) !important;
2875
+ .x-border-width--right-00 {
2876
+ border-style: solid !important;
2989
2877
  }
2990
- [dir="rtl"] .x-border-radius--bottom-01 {
2991
- border-bottom-right-radius: var(--x-size-base-01) !important;
2878
+ [dir="ltr"] .x-border-width--left-00 {
2879
+ border-left-width: 0px !important;
2992
2880
  }
2993
- [dir="ltr"] .x-border-radius--bottom-01 {
2994
- border-bottom-right-radius: var(--x-size-base-01) !important;
2881
+ [dir="rtl"] .x-border-width--left-00 {
2882
+ border-right-width: 0px !important;
2995
2883
  }
2996
- [dir="rtl"] .x-border-radius--bottom-01 {
2997
- border-bottom-left-radius: var(--x-size-base-01) !important;
2884
+ .x-border-width--left-00 {
2885
+ border-style: solid !important;
2998
2886
  }
2999
- [dir="ltr"] .x-border-radius--right-01 {
3000
- border-top-right-radius: var(--x-size-base-01) !important;
2887
+ .x-border-width--01 {
2888
+ border-width: 1px !important;
2889
+ border-style: solid !important;
3001
2890
  }
3002
- [dir="rtl"] .x-border-radius--right-01 {
3003
- border-top-left-radius: var(--x-size-base-01) !important;
2891
+ .x-border-width--top-01 {
2892
+ border-top-width: 1px !important;
2893
+ border-style: solid !important;
3004
2894
  }
3005
- [dir="ltr"] .x-border-radius--right-01 {
3006
- border-bottom-right-radius: var(--x-size-base-01) !important;
2895
+ .x-border-width--bottom-01 {
2896
+ border-bottom-width: 1px !important;
2897
+ border-style: solid !important;
3007
2898
  }
3008
- [dir="rtl"] .x-border-radius--right-01 {
3009
- border-bottom-left-radius: var(--x-size-base-01) !important;
2899
+ [dir="ltr"] .x-border-width--right-01 {
2900
+ border-right-width: 1px !important;
3010
2901
  }
3011
- [dir="ltr"] .x-border-radius--left-01 {
3012
- border-top-left-radius: var(--x-size-base-01) !important;
2902
+ [dir="rtl"] .x-border-width--right-01 {
2903
+ border-left-width: 1px !important;
3013
2904
  }
3014
- [dir="rtl"] .x-border-radius--left-01 {
3015
- border-top-right-radius: var(--x-size-base-01) !important;
2905
+ .x-border-width--right-01 {
2906
+ border-style: solid !important;
3016
2907
  }
3017
- [dir="ltr"] .x-border-radius--left-01 {
3018
- border-bottom-left-radius: var(--x-size-base-01) !important;
2908
+ [dir="ltr"] .x-border-width--left-01 {
2909
+ border-left-width: 1px !important;
3019
2910
  }
3020
- [dir="rtl"] .x-border-radius--left-01 {
3021
- border-bottom-right-radius: var(--x-size-base-01) !important;
2911
+ [dir="rtl"] .x-border-width--left-01 {
2912
+ border-right-width: 1px !important;
3022
2913
  }
3023
- [dir="ltr"] .x-border-radius--top-left-01 {
3024
- border-top-left-radius: var(--x-size-base-01) !important;
2914
+ .x-border-width--left-01 {
2915
+ border-style: solid !important;
3025
2916
  }
3026
- [dir="rtl"] .x-border-radius--top-left-01 {
3027
- border-top-right-radius: var(--x-size-base-01) !important;
2917
+ .x-border-width--02 {
2918
+ border-width: 2px !important;
2919
+ border-style: solid !important;
3028
2920
  }
3029
- [dir="ltr"] .x-border-radius--top-right-01 {
3030
- border-top-right-radius: var(--x-size-base-01) !important;
2921
+ .x-border-width--top-02 {
2922
+ border-top-width: 2px !important;
2923
+ border-style: solid !important;
3031
2924
  }
3032
- [dir="rtl"] .x-border-radius--top-right-01 {
3033
- border-top-left-radius: var(--x-size-base-01) !important;
2925
+ .x-border-width--bottom-02 {
2926
+ border-bottom-width: 2px !important;
2927
+ border-style: solid !important;
3034
2928
  }
3035
- [dir="ltr"] .x-border-radius--bottom-left-01 {
3036
- border-bottom-left-radius: var(--x-size-base-01) !important;
2929
+ [dir="ltr"] .x-border-width--right-02 {
2930
+ border-right-width: 2px !important;
3037
2931
  }
3038
- [dir="rtl"] .x-border-radius--bottom-left-01 {
3039
- border-bottom-right-radius: var(--x-size-base-01) !important;
2932
+ [dir="rtl"] .x-border-width--right-02 {
2933
+ border-left-width: 2px !important;
3040
2934
  }
3041
- [dir="ltr"] .x-border-radius--bottom-right-01 {
3042
- border-bottom-right-radius: var(--x-size-base-01) !important;
2935
+ .x-border-width--right-02 {
2936
+ border-style: solid !important;
3043
2937
  }
3044
- [dir="rtl"] .x-border-radius--bottom-right-01 {
3045
- border-bottom-left-radius: var(--x-size-base-01) !important;
2938
+ [dir="ltr"] .x-border-width--left-02 {
2939
+ border-left-width: 2px !important;
3046
2940
  }
3047
- .x-border-radius--02 {
3048
- border-radius: var(--x-size-base-02) !important;
2941
+ [dir="rtl"] .x-border-width--left-02 {
2942
+ border-right-width: 2px !important;
3049
2943
  }
3050
- [dir="ltr"] .x-border-radius--top-02 {
3051
- border-top-left-radius: var(--x-size-base-02) !important;
2944
+ .x-border-width--left-02 {
2945
+ border-style: solid !important;
3052
2946
  }
3053
- [dir="rtl"] .x-border-radius--top-02 {
3054
- border-top-right-radius: var(--x-size-base-02) !important;
2947
+ .x-border-width--03 {
2948
+ border-width: 3px !important;
2949
+ border-style: solid !important;
3055
2950
  }
3056
- [dir="ltr"] .x-border-radius--top-02 {
3057
- border-top-right-radius: var(--x-size-base-02) !important;
2951
+ .x-border-width--top-03 {
2952
+ border-top-width: 3px !important;
2953
+ border-style: solid !important;
3058
2954
  }
3059
- [dir="rtl"] .x-border-radius--top-02 {
3060
- border-top-left-radius: var(--x-size-base-02) !important;
2955
+ .x-border-width--bottom-03 {
2956
+ border-bottom-width: 3px !important;
2957
+ border-style: solid !important;
3061
2958
  }
3062
- [dir="ltr"] .x-border-radius--bottom-02 {
3063
- border-bottom-left-radius: var(--x-size-base-02) !important;
2959
+ [dir="ltr"] .x-border-width--right-03 {
2960
+ border-right-width: 3px !important;
3064
2961
  }
3065
- [dir="rtl"] .x-border-radius--bottom-02 {
3066
- border-bottom-right-radius: var(--x-size-base-02) !important;
2962
+ [dir="rtl"] .x-border-width--right-03 {
2963
+ border-left-width: 3px !important;
3067
2964
  }
3068
- [dir="ltr"] .x-border-radius--bottom-02 {
3069
- border-bottom-right-radius: var(--x-size-base-02) !important;
2965
+ .x-border-width--right-03 {
2966
+ border-style: solid !important;
3070
2967
  }
3071
- [dir="rtl"] .x-border-radius--bottom-02 {
3072
- border-bottom-left-radius: var(--x-size-base-02) !important;
2968
+ [dir="ltr"] .x-border-width--left-03 {
2969
+ border-left-width: 3px !important;
3073
2970
  }
3074
- [dir="ltr"] .x-border-radius--right-02 {
3075
- border-top-right-radius: var(--x-size-base-02) !important;
2971
+ [dir="rtl"] .x-border-width--left-03 {
2972
+ border-right-width: 3px !important;
3076
2973
  }
3077
- [dir="rtl"] .x-border-radius--right-02 {
3078
- border-top-left-radius: var(--x-size-base-02) !important;
2974
+ .x-border-width--left-03 {
2975
+ border-style: solid !important;
3079
2976
  }
3080
- [dir="ltr"] .x-border-radius--right-02 {
3081
- border-bottom-right-radius: var(--x-size-base-02) !important;
2977
+ .x-border-width--04 {
2978
+ border-width: 4px !important;
2979
+ border-style: solid !important;
3082
2980
  }
3083
- [dir="rtl"] .x-border-radius--right-02 {
3084
- border-bottom-left-radius: var(--x-size-base-02) !important;
2981
+ .x-border-width--top-04 {
2982
+ border-top-width: 4px !important;
2983
+ border-style: solid !important;
3085
2984
  }
3086
- [dir="ltr"] .x-border-radius--left-02 {
3087
- border-top-left-radius: var(--x-size-base-02) !important;
2985
+ .x-border-width--bottom-04 {
2986
+ border-bottom-width: 4px !important;
2987
+ border-style: solid !important;
3088
2988
  }
3089
- [dir="rtl"] .x-border-radius--left-02 {
3090
- border-top-right-radius: var(--x-size-base-02) !important;
2989
+ [dir="ltr"] .x-border-width--right-04 {
2990
+ border-right-width: 4px !important;
3091
2991
  }
3092
- [dir="ltr"] .x-border-radius--left-02 {
3093
- border-bottom-left-radius: var(--x-size-base-02) !important;
2992
+ [dir="rtl"] .x-border-width--right-04 {
2993
+ border-left-width: 4px !important;
3094
2994
  }
3095
- [dir="rtl"] .x-border-radius--left-02 {
3096
- border-bottom-right-radius: var(--x-size-base-02) !important;
2995
+ .x-border-width--right-04 {
2996
+ border-style: solid !important;
3097
2997
  }
3098
- [dir="ltr"] .x-border-radius--top-left-02 {
3099
- border-top-left-radius: var(--x-size-base-02) !important;
2998
+ [dir="ltr"] .x-border-width--left-04 {
2999
+ border-left-width: 4px !important;
3100
3000
  }
3101
- [dir="rtl"] .x-border-radius--top-left-02 {
3102
- border-top-right-radius: var(--x-size-base-02) !important;
3001
+ [dir="rtl"] .x-border-width--left-04 {
3002
+ border-right-width: 4px !important;
3103
3003
  }
3104
- [dir="ltr"] .x-border-radius--top-right-02 {
3105
- border-top-right-radius: var(--x-size-base-02) !important;
3004
+ .x-border-width--left-04 {
3005
+ border-style: solid !important;
3106
3006
  }
3107
- [dir="rtl"] .x-border-radius--top-right-02 {
3108
- border-top-left-radius: var(--x-size-base-02) !important;
3007
+ .x-border-width--05 {
3008
+ border-width: 5px !important;
3009
+ border-style: solid !important;
3109
3010
  }
3110
- [dir="ltr"] .x-border-radius--bottom-left-02 {
3111
- border-bottom-left-radius: var(--x-size-base-02) !important;
3011
+ .x-border-width--top-05 {
3012
+ border-top-width: 5px !important;
3013
+ border-style: solid !important;
3112
3014
  }
3113
- [dir="rtl"] .x-border-radius--bottom-left-02 {
3114
- border-bottom-right-radius: var(--x-size-base-02) !important;
3015
+ .x-border-width--bottom-05 {
3016
+ border-bottom-width: 5px !important;
3017
+ border-style: solid !important;
3115
3018
  }
3116
- [dir="ltr"] .x-border-radius--bottom-right-02 {
3117
- border-bottom-right-radius: var(--x-size-base-02) !important;
3019
+ [dir="ltr"] .x-border-width--right-05 {
3020
+ border-right-width: 5px !important;
3118
3021
  }
3119
- [dir="rtl"] .x-border-radius--bottom-right-02 {
3120
- border-bottom-left-radius: var(--x-size-base-02) !important;
3022
+ [dir="rtl"] .x-border-width--right-05 {
3023
+ border-left-width: 5px !important;
3121
3024
  }
3122
- .x-border-radius--03 {
3123
- border-radius: var(--x-size-base-03) !important;
3025
+ .x-border-width--right-05 {
3026
+ border-style: solid !important;
3124
3027
  }
3125
- [dir="ltr"] .x-border-radius--top-03 {
3126
- border-top-left-radius: var(--x-size-base-03) !important;
3028
+ [dir="ltr"] .x-border-width--left-05 {
3029
+ border-left-width: 5px !important;
3127
3030
  }
3128
- [dir="rtl"] .x-border-radius--top-03 {
3129
- border-top-right-radius: var(--x-size-base-03) !important;
3031
+ [dir="rtl"] .x-border-width--left-05 {
3032
+ border-right-width: 5px !important;
3130
3033
  }
3131
- [dir="ltr"] .x-border-radius--top-03 {
3132
- border-top-right-radius: var(--x-size-base-03) !important;
3034
+ .x-border-width--left-05 {
3035
+ border-style: solid !important;
3133
3036
  }
3134
- [dir="rtl"] .x-border-radius--top-03 {
3135
- border-top-left-radius: var(--x-size-base-03) !important;
3037
+ .x-border-width--06 {
3038
+ border-width: 6px !important;
3039
+ border-style: solid !important;
3136
3040
  }
3137
- [dir="ltr"] .x-border-radius--bottom-03 {
3138
- border-bottom-left-radius: var(--x-size-base-03) !important;
3041
+ .x-border-width--top-06 {
3042
+ border-top-width: 6px !important;
3043
+ border-style: solid !important;
3139
3044
  }
3140
- [dir="rtl"] .x-border-radius--bottom-03 {
3141
- border-bottom-right-radius: var(--x-size-base-03) !important;
3045
+ .x-border-width--bottom-06 {
3046
+ border-bottom-width: 6px !important;
3047
+ border-style: solid !important;
3142
3048
  }
3143
- [dir="ltr"] .x-border-radius--bottom-03 {
3144
- border-bottom-right-radius: var(--x-size-base-03) !important;
3049
+ [dir="ltr"] .x-border-width--right-06 {
3050
+ border-right-width: 6px !important;
3145
3051
  }
3146
- [dir="rtl"] .x-border-radius--bottom-03 {
3147
- border-bottom-left-radius: var(--x-size-base-03) !important;
3052
+ [dir="rtl"] .x-border-width--right-06 {
3053
+ border-left-width: 6px !important;
3148
3054
  }
3149
- [dir="ltr"] .x-border-radius--right-03 {
3150
- border-top-right-radius: var(--x-size-base-03) !important;
3055
+ .x-border-width--right-06 {
3056
+ border-style: solid !important;
3151
3057
  }
3152
- [dir="rtl"] .x-border-radius--right-03 {
3153
- border-top-left-radius: var(--x-size-base-03) !important;
3058
+ [dir="ltr"] .x-border-width--left-06 {
3059
+ border-left-width: 6px !important;
3154
3060
  }
3155
- [dir="ltr"] .x-border-radius--right-03 {
3156
- border-bottom-right-radius: var(--x-size-base-03) !important;
3061
+ [dir="rtl"] .x-border-width--left-06 {
3062
+ border-right-width: 6px !important;
3157
3063
  }
3158
- [dir="rtl"] .x-border-radius--right-03 {
3159
- border-bottom-left-radius: var(--x-size-base-03) !important;
3064
+ .x-border-width--left-06 {
3065
+ border-style: solid !important;
3160
3066
  }
3161
- [dir="ltr"] .x-border-radius--left-03 {
3162
- border-top-left-radius: var(--x-size-base-03) !important;
3067
+ .x-border-width--07 {
3068
+ border-width: 7px !important;
3069
+ border-style: solid !important;
3163
3070
  }
3164
- [dir="rtl"] .x-border-radius--left-03 {
3165
- border-top-right-radius: var(--x-size-base-03) !important;
3071
+ .x-border-width--top-07 {
3072
+ border-top-width: 7px !important;
3073
+ border-style: solid !important;
3166
3074
  }
3167
- [dir="ltr"] .x-border-radius--left-03 {
3168
- border-bottom-left-radius: var(--x-size-base-03) !important;
3075
+ .x-border-width--bottom-07 {
3076
+ border-bottom-width: 7px !important;
3077
+ border-style: solid !important;
3169
3078
  }
3170
- [dir="rtl"] .x-border-radius--left-03 {
3171
- border-bottom-right-radius: var(--x-size-base-03) !important;
3079
+ [dir="ltr"] .x-border-width--right-07 {
3080
+ border-right-width: 7px !important;
3172
3081
  }
3173
- [dir="ltr"] .x-border-radius--top-left-03 {
3174
- border-top-left-radius: var(--x-size-base-03) !important;
3082
+ [dir="rtl"] .x-border-width--right-07 {
3083
+ border-left-width: 7px !important;
3175
3084
  }
3176
- [dir="rtl"] .x-border-radius--top-left-03 {
3177
- border-top-right-radius: var(--x-size-base-03) !important;
3085
+ .x-border-width--right-07 {
3086
+ border-style: solid !important;
3178
3087
  }
3179
- [dir="ltr"] .x-border-radius--top-right-03 {
3180
- border-top-right-radius: var(--x-size-base-03) !important;
3088
+ [dir="ltr"] .x-border-width--left-07 {
3089
+ border-left-width: 7px !important;
3181
3090
  }
3182
- [dir="rtl"] .x-border-radius--top-right-03 {
3183
- border-top-left-radius: var(--x-size-base-03) !important;
3091
+ [dir="rtl"] .x-border-width--left-07 {
3092
+ border-right-width: 7px !important;
3184
3093
  }
3185
- [dir="ltr"] .x-border-radius--bottom-left-03 {
3186
- border-bottom-left-radius: var(--x-size-base-03) !important;
3094
+ .x-border-width--left-07 {
3095
+ border-style: solid !important;
3187
3096
  }
3188
- [dir="rtl"] .x-border-radius--bottom-left-03 {
3189
- border-bottom-right-radius: var(--x-size-base-03) !important;
3097
+ .x-border-width--08 {
3098
+ border-width: 8px !important;
3099
+ border-style: solid !important;
3190
3100
  }
3191
- [dir="ltr"] .x-border-radius--bottom-right-03 {
3192
- border-bottom-right-radius: var(--x-size-base-03) !important;
3101
+ .x-border-width--top-08 {
3102
+ border-top-width: 8px !important;
3103
+ border-style: solid !important;
3193
3104
  }
3194
- [dir="rtl"] .x-border-radius--bottom-right-03 {
3195
- border-bottom-left-radius: var(--x-size-base-03) !important;
3105
+ .x-border-width--bottom-08 {
3106
+ border-bottom-width: 8px !important;
3107
+ border-style: solid !important;
3196
3108
  }
3197
- .x-border-radius--04 {
3198
- border-radius: var(--x-size-base-04) !important;
3109
+ [dir="ltr"] .x-border-width--right-08 {
3110
+ border-right-width: 8px !important;
3199
3111
  }
3200
- [dir="ltr"] .x-border-radius--top-04 {
3201
- border-top-left-radius: var(--x-size-base-04) !important;
3112
+ [dir="rtl"] .x-border-width--right-08 {
3113
+ border-left-width: 8px !important;
3202
3114
  }
3203
- [dir="rtl"] .x-border-radius--top-04 {
3204
- border-top-right-radius: var(--x-size-base-04) !important;
3115
+ .x-border-width--right-08 {
3116
+ border-style: solid !important;
3205
3117
  }
3206
- [dir="ltr"] .x-border-radius--top-04 {
3207
- border-top-right-radius: var(--x-size-base-04) !important;
3118
+ [dir="ltr"] .x-border-width--left-08 {
3119
+ border-left-width: 8px !important;
3208
3120
  }
3209
- [dir="rtl"] .x-border-radius--top-04 {
3210
- border-top-left-radius: var(--x-size-base-04) !important;
3121
+ [dir="rtl"] .x-border-width--left-08 {
3122
+ border-right-width: 8px !important;
3211
3123
  }
3212
- [dir="ltr"] .x-border-radius--bottom-04 {
3213
- border-bottom-left-radius: var(--x-size-base-04) !important;
3124
+ .x-border-width--left-08 {
3125
+ border-style: solid !important;
3214
3126
  }
3215
- [dir="rtl"] .x-border-radius--bottom-04 {
3216
- border-bottom-right-radius: var(--x-size-base-04) !important;
3127
+ .x-border-width--09 {
3128
+ border-width: 9px !important;
3129
+ border-style: solid !important;
3217
3130
  }
3218
- [dir="ltr"] .x-border-radius--bottom-04 {
3219
- border-bottom-right-radius: var(--x-size-base-04) !important;
3131
+ .x-border-width--top-09 {
3132
+ border-top-width: 9px !important;
3133
+ border-style: solid !important;
3220
3134
  }
3221
- [dir="rtl"] .x-border-radius--bottom-04 {
3222
- border-bottom-left-radius: var(--x-size-base-04) !important;
3135
+ .x-border-width--bottom-09 {
3136
+ border-bottom-width: 9px !important;
3137
+ border-style: solid !important;
3223
3138
  }
3224
- [dir="ltr"] .x-border-radius--right-04 {
3225
- border-top-right-radius: var(--x-size-base-04) !important;
3139
+ [dir="ltr"] .x-border-width--right-09 {
3140
+ border-right-width: 9px !important;
3226
3141
  }
3227
- [dir="rtl"] .x-border-radius--right-04 {
3228
- border-top-left-radius: var(--x-size-base-04) !important;
3142
+ [dir="rtl"] .x-border-width--right-09 {
3143
+ border-left-width: 9px !important;
3229
3144
  }
3230
- [dir="ltr"] .x-border-radius--right-04 {
3231
- border-bottom-right-radius: var(--x-size-base-04) !important;
3145
+ .x-border-width--right-09 {
3146
+ border-style: solid !important;
3232
3147
  }
3233
- [dir="rtl"] .x-border-radius--right-04 {
3234
- border-bottom-left-radius: var(--x-size-base-04) !important;
3148
+ [dir="ltr"] .x-border-width--left-09 {
3149
+ border-left-width: 9px !important;
3235
3150
  }
3236
- [dir="ltr"] .x-border-radius--left-04 {
3237
- border-top-left-radius: var(--x-size-base-04) !important;
3151
+ [dir="rtl"] .x-border-width--left-09 {
3152
+ border-right-width: 9px !important;
3238
3153
  }
3239
- [dir="rtl"] .x-border-radius--left-04 {
3240
- border-top-right-radius: var(--x-size-base-04) !important;
3154
+ .x-border-width--left-09 {
3155
+ border-style: solid !important;
3241
3156
  }
3242
- [dir="ltr"] .x-border-radius--left-04 {
3243
- border-bottom-left-radius: var(--x-size-base-04) !important;
3157
+ .x-border-width--10 {
3158
+ border-width: 10px !important;
3159
+ border-style: solid !important;
3244
3160
  }
3245
- [dir="rtl"] .x-border-radius--left-04 {
3246
- border-bottom-right-radius: var(--x-size-base-04) !important;
3161
+ .x-border-width--top-10 {
3162
+ border-top-width: 10px !important;
3163
+ border-style: solid !important;
3247
3164
  }
3248
- [dir="ltr"] .x-border-radius--top-left-04 {
3249
- border-top-left-radius: var(--x-size-base-04) !important;
3165
+ .x-border-width--bottom-10 {
3166
+ border-bottom-width: 10px !important;
3167
+ border-style: solid !important;
3250
3168
  }
3251
- [dir="rtl"] .x-border-radius--top-left-04 {
3252
- border-top-right-radius: var(--x-size-base-04) !important;
3169
+ [dir="ltr"] .x-border-width--right-10 {
3170
+ border-right-width: 10px !important;
3253
3171
  }
3254
- [dir="ltr"] .x-border-radius--top-right-04 {
3255
- border-top-right-radius: var(--x-size-base-04) !important;
3172
+ [dir="rtl"] .x-border-width--right-10 {
3173
+ border-left-width: 10px !important;
3256
3174
  }
3257
- [dir="rtl"] .x-border-radius--top-right-04 {
3258
- border-top-left-radius: var(--x-size-base-04) !important;
3175
+ .x-border-width--right-10 {
3176
+ border-style: solid !important;
3259
3177
  }
3260
- [dir="ltr"] .x-border-radius--bottom-left-04 {
3261
- border-bottom-left-radius: var(--x-size-base-04) !important;
3178
+ [dir="ltr"] .x-border-width--left-10 {
3179
+ border-left-width: 10px !important;
3262
3180
  }
3263
- [dir="rtl"] .x-border-radius--bottom-left-04 {
3264
- border-bottom-right-radius: var(--x-size-base-04) !important;
3181
+ [dir="rtl"] .x-border-width--left-10 {
3182
+ border-right-width: 10px !important;
3265
3183
  }
3266
- [dir="ltr"] .x-border-radius--bottom-right-04 {
3267
- border-bottom-right-radius: var(--x-size-base-04) !important;
3184
+ .x-border-width--left-10 {
3185
+ border-style: solid !important;
3268
3186
  }
3269
- [dir="rtl"] .x-border-radius--bottom-right-04 {
3270
- border-bottom-left-radius: var(--x-size-base-04) !important;
3187
+ .x-shadow--none {
3188
+ box-shadow: none !important;
3271
3189
  }
3272
- .x-border-radius--05 {
3273
- border-radius: var(--x-size-base-05) !important;
3190
+
3191
+ .x-shadow--01 {
3192
+ box-shadow: var(--x-string-box-shadow-01) !important;
3274
3193
  }
3275
- [dir="ltr"] .x-border-radius--top-05 {
3276
- border-top-left-radius: var(--x-size-base-05) !important;
3194
+ .x-shadow--bottom-01 {
3195
+ box-shadow: var(--x-string-box-shadow-bottom-01) !important;
3277
3196
  }
3278
- [dir="rtl"] .x-border-radius--top-05 {
3279
- border-top-right-radius: var(--x-size-base-05) !important;
3197
+ .x-shadow--02 {
3198
+ box-shadow: var(--x-string-box-shadow-02) !important;
3280
3199
  }
3281
- [dir="ltr"] .x-border-radius--top-05 {
3282
- border-top-right-radius: var(--x-size-base-05) !important;
3200
+ .x-shadow--bottom-02 {
3201
+ box-shadow: var(--x-string-box-shadow-bottom-02) !important;
3283
3202
  }
3284
- [dir="rtl"] .x-border-radius--top-05 {
3285
- border-top-left-radius: var(--x-size-base-05) !important;
3203
+ .x-shadow--03 {
3204
+ box-shadow: var(--x-string-box-shadow-03) !important;
3286
3205
  }
3287
- [dir="ltr"] .x-border-radius--bottom-05 {
3288
- border-bottom-left-radius: var(--x-size-base-05) !important;
3206
+ .x-shadow--bottom-03 {
3207
+ box-shadow: var(--x-string-box-shadow-bottom-03) !important;
3289
3208
  }
3290
- [dir="rtl"] .x-border-radius--bottom-05 {
3291
- border-bottom-right-radius: var(--x-size-base-05) !important;
3209
+ .x-shadow--04 {
3210
+ box-shadow: var(--x-string-box-shadow-04) !important;
3292
3211
  }
3293
- [dir="ltr"] .x-border-radius--bottom-05 {
3294
- border-bottom-right-radius: var(--x-size-base-05) !important;
3212
+ .x-shadow--bottom-04 {
3213
+ box-shadow: var(--x-string-box-shadow-bottom-04) !important;
3295
3214
  }
3296
- [dir="rtl"] .x-border-radius--bottom-05 {
3297
- border-bottom-left-radius: var(--x-size-base-05) !important;
3215
+ .x-shadow--05 {
3216
+ box-shadow: var(--x-string-box-shadow-05) !important;
3298
3217
  }
3299
- [dir="ltr"] .x-border-radius--right-05 {
3300
- border-top-right-radius: var(--x-size-base-05) !important;
3218
+ .x-shadow--bottom-05 {
3219
+ box-shadow: var(--x-string-box-shadow-bottom-05) !important;
3301
3220
  }
3302
- [dir="rtl"] .x-border-radius--right-05 {
3303
- border-top-left-radius: var(--x-size-base-05) !important;
3221
+ .x-shadow--06 {
3222
+ box-shadow: var(--x-string-box-shadow-06) !important;
3304
3223
  }
3305
- [dir="ltr"] .x-border-radius--right-05 {
3306
- border-bottom-right-radius: var(--x-size-base-05) !important;
3224
+ .x-shadow--bottom-06 {
3225
+ box-shadow: var(--x-string-box-shadow-bottom-06) !important;
3307
3226
  }
3308
- [dir="rtl"] .x-border-radius--right-05 {
3309
- border-bottom-left-radius: var(--x-size-base-05) !important;
3227
+ .x-shadow--07 {
3228
+ box-shadow: var(--x-string-box-shadow-07) !important;
3310
3229
  }
3311
- [dir="ltr"] .x-border-radius--left-05 {
3312
- border-top-left-radius: var(--x-size-base-05) !important;
3230
+ .x-shadow--bottom-07 {
3231
+ box-shadow: var(--x-string-box-shadow-bottom-07) !important;
3313
3232
  }
3314
- [dir="rtl"] .x-border-radius--left-05 {
3315
- border-top-right-radius: var(--x-size-base-05) !important;
3233
+ .x-shadow--08 {
3234
+ box-shadow: var(--x-string-box-shadow-08) !important;
3316
3235
  }
3317
- [dir="ltr"] .x-border-radius--left-05 {
3318
- border-bottom-left-radius: var(--x-size-base-05) !important;
3236
+ .x-shadow--bottom-08 {
3237
+ box-shadow: var(--x-string-box-shadow-bottom-08) !important;
3319
3238
  }
3320
- [dir="rtl"] .x-border-radius--left-05 {
3321
- border-bottom-right-radius: var(--x-size-base-05) !important;
3239
+ .x-shadow--09 {
3240
+ box-shadow: var(--x-string-box-shadow-09) !important;
3322
3241
  }
3323
- [dir="ltr"] .x-border-radius--top-left-05 {
3324
- border-top-left-radius: var(--x-size-base-05) !important;
3242
+ .x-shadow--bottom-09 {
3243
+ box-shadow: var(--x-string-box-shadow-bottom-09) !important;
3325
3244
  }
3326
- [dir="rtl"] .x-border-radius--top-left-05 {
3327
- border-top-right-radius: var(--x-size-base-05) !important;
3245
+ .x-shadow--10 {
3246
+ box-shadow: var(--x-string-box-shadow-10) !important;
3328
3247
  }
3329
- [dir="ltr"] .x-border-radius--top-right-05 {
3330
- border-top-right-radius: var(--x-size-base-05) !important;
3248
+ .x-shadow--bottom-10 {
3249
+ box-shadow: var(--x-string-box-shadow-bottom-10) !important;
3331
3250
  }
3332
- [dir="rtl"] .x-border-radius--top-right-05 {
3333
- border-top-left-radius: var(--x-size-base-05) !important;
3251
+ /* Material Elevations extracted from:
3252
+ https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
3253
+ */
3254
+ :root {
3255
+ /* Shadow none */
3256
+ --x-string-box-shadow-00: none;
3257
+ /* Shadow 1dp */
3258
+ --x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
3259
+ 0 1px 3px 0 rgba(0, 0, 0, 0.2);
3260
+ /* Shadow 2dp */
3261
+ --x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
3262
+ 0 1px 5px 0 rgba(0, 0, 0, 0.2);
3263
+ /* Shadow 3dp */
3264
+ --x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
3265
+ 0 1px 8px 0 rgba(0, 0, 0, 0.2);
3266
+ /* Shadow 4dp */
3267
+ --x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
3268
+ 0 2px 4px -1px rgba(0, 0, 0, 0.2);
3269
+ /* Shadow 6dp */
3270
+ --x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
3271
+ 0 3px 5px -1px rgba(0, 0, 0, 0.2);
3272
+ /* Shadow 8dp */
3273
+ --x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
3274
+ 0 5px 5px -3px rgba(0, 0, 0, 0.2);
3275
+ /* Shadow 9dp */
3276
+ --x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
3277
+ 0 5px 6px -3px rgba(0, 0, 0, 0.2);
3278
+ /* Shadow 12dp */
3279
+ --x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
3280
+ 0 7px 8px -4px rgba(0, 0, 0, 0.2);
3281
+ /* Shadow 16dp */
3282
+ --x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
3283
+ 0 8px 10px -5px rgba(0, 0, 0, 0.2);
3284
+ /* Shadow 24dp */
3285
+ --x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
3286
+ 0 11px 15px -7px rgba(0, 0, 0, 0.2);
3287
+ /* BOTTOM ONLY SHADOW (not overflows on top of the element) */
3288
+ /* Shadow 1dp */
3289
+ --x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
3290
+ 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
3291
+ /* Shadow 2dp */
3292
+ --x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
3293
+ 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
3294
+ /* Shadow 3dp */
3295
+ --x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
3296
+ 0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
3297
+ /* Shadow 4dp */
3298
+ --x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
3299
+ 0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
3300
+ /* Shadow 6dp */
3301
+ --x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
3302
+ 0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
3303
+ /* Shadow 8dp */
3304
+ --x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
3305
+ 0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
3306
+ /* Shadow 9dp */
3307
+ --x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
3308
+ 0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
3309
+ /* Shadow 12dp */
3310
+ --x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
3311
+ 0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
3312
+ /* Shadow 16dp */
3313
+ --x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
3314
+ 0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
3315
+ /* Shadow 24dp */
3316
+ --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
3317
+ 0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
3334
3318
  }
3335
- [dir="ltr"] .x-border-radius--bottom-left-05 {
3336
- border-bottom-left-radius: var(--x-size-base-05) !important;
3319
+ .dev-mode .slot-helper {
3320
+ font-family: inherit;
3321
+ color: grey;
3322
+ box-sizing: border-box;
3323
+ display: flex;
3324
+ height: 100%;
3325
+ width: 100%;
3326
+ justify-content: center;
3327
+ align-items: center;
3328
+ border: dashed 1px grey;
3329
+ border-radius: 10px;
3337
3330
  }
3338
- [dir="rtl"] .x-border-radius--bottom-left-05 {
3339
- border-bottom-right-radius: var(--x-size-base-05) !important;
3331
+ .x-fill--lead {
3332
+ fill: var(--x-color-base-lead) !important;
3340
3333
  }
3341
- [dir="ltr"] .x-border-radius--bottom-right-05 {
3342
- border-bottom-right-radius: var(--x-size-base-05) !important;
3334
+
3335
+ .x-fill--auxiliary {
3336
+ fill: var(--x-color-base-auxiliary) !important;
3343
3337
  }
3344
- [dir="rtl"] .x-border-radius--bottom-right-05 {
3345
- border-bottom-left-radius: var(--x-size-base-05) !important;
3338
+
3339
+ .x-fill--neutral-10 {
3340
+ fill: var(--x-color-base-neutral-10) !important;
3346
3341
  }
3347
- .x-border-radius--06 {
3348
- border-radius: var(--x-size-base-06) !important;
3342
+
3343
+ .x-fill--neutral-35 {
3344
+ fill: var(--x-color-base-neutral-35) !important;
3349
3345
  }
3350
- [dir="ltr"] .x-border-radius--top-06 {
3351
- border-top-left-radius: var(--x-size-base-06) !important;
3346
+
3347
+ .x-fill--neutral-70 {
3348
+ fill: var(--x-color-base-neutral-70) !important;
3352
3349
  }
3353
- [dir="rtl"] .x-border-radius--top-06 {
3354
- border-top-right-radius: var(--x-size-base-06) !important;
3350
+
3351
+ .x-fill--neutral-95 {
3352
+ fill: var(--x-color-base-neutral-95) !important;
3355
3353
  }
3356
- [dir="ltr"] .x-border-radius--top-06 {
3357
- border-top-right-radius: var(--x-size-base-06) !important;
3354
+
3355
+ .x-fill--neutral-100 {
3356
+ fill: var(--x-color-base-neutral-100) !important;
3358
3357
  }
3359
- [dir="rtl"] .x-border-radius--top-06 {
3360
- border-top-left-radius: var(--x-size-base-06) !important;
3358
+
3359
+ .x-fill--accent {
3360
+ fill: var(--x-color-base-accent) !important;
3361
3361
  }
3362
- [dir="ltr"] .x-border-radius--bottom-06 {
3363
- border-bottom-left-radius: var(--x-size-base-06) !important;
3362
+
3363
+ .x-fill--enable {
3364
+ fill: var(--x-color-base-enable) !important;
3364
3365
  }
3365
- [dir="rtl"] .x-border-radius--bottom-06 {
3366
- border-bottom-right-radius: var(--x-size-base-06) !important;
3366
+
3367
+ .x-fill--disable {
3368
+ fill: var(--x-color-base-disable) !important;
3367
3369
  }
3368
- [dir="ltr"] .x-border-radius--bottom-06 {
3369
- border-bottom-right-radius: var(--x-size-base-06) !important;
3370
+
3371
+ .x-fill--transparent {
3372
+ fill: var(--x-color-base-transparent) !important;
3370
3373
  }
3371
- [dir="rtl"] .x-border-radius--bottom-06 {
3372
- border-bottom-left-radius: var(--x-size-base-06) !important;
3374
+ .x-border-radius--00 {
3375
+ border-radius: 0 !important;
3373
3376
  }
3374
- [dir="ltr"] .x-border-radius--right-06 {
3375
- border-top-right-radius: var(--x-size-base-06) !important;
3377
+
3378
+ .x-border-radius--pill {
3379
+ border-radius: 99999px !important;
3376
3380
  }
3377
- [dir="rtl"] .x-border-radius--right-06 {
3378
- border-top-left-radius: var(--x-size-base-06) !important;
3381
+
3382
+ .x-border-radius--01 {
3383
+ border-radius: var(--x-size-base-01) !important;
3379
3384
  }
3380
- [dir="ltr"] .x-border-radius--right-06 {
3381
- border-bottom-right-radius: var(--x-size-base-06) !important;
3385
+ [dir="ltr"] .x-border-radius--top-01 {
3386
+ border-top-left-radius: var(--x-size-base-01) !important;
3382
3387
  }
3383
- [dir="rtl"] .x-border-radius--right-06 {
3384
- border-bottom-left-radius: var(--x-size-base-06) !important;
3388
+ [dir="rtl"] .x-border-radius--top-01 {
3389
+ border-top-right-radius: var(--x-size-base-01) !important;
3385
3390
  }
3386
- [dir="ltr"] .x-border-radius--left-06 {
3387
- border-top-left-radius: var(--x-size-base-06) !important;
3391
+ [dir="ltr"] .x-border-radius--top-01 {
3392
+ border-top-right-radius: var(--x-size-base-01) !important;
3388
3393
  }
3389
- [dir="rtl"] .x-border-radius--left-06 {
3390
- border-top-right-radius: var(--x-size-base-06) !important;
3394
+ [dir="rtl"] .x-border-radius--top-01 {
3395
+ border-top-left-radius: var(--x-size-base-01) !important;
3391
3396
  }
3392
- [dir="ltr"] .x-border-radius--left-06 {
3393
- border-bottom-left-radius: var(--x-size-base-06) !important;
3397
+ [dir="ltr"] .x-border-radius--bottom-01 {
3398
+ border-bottom-left-radius: var(--x-size-base-01) !important;
3394
3399
  }
3395
- [dir="rtl"] .x-border-radius--left-06 {
3396
- border-bottom-right-radius: var(--x-size-base-06) !important;
3400
+ [dir="rtl"] .x-border-radius--bottom-01 {
3401
+ border-bottom-right-radius: var(--x-size-base-01) !important;
3397
3402
  }
3398
- [dir="ltr"] .x-border-radius--top-left-06 {
3399
- border-top-left-radius: var(--x-size-base-06) !important;
3403
+ [dir="ltr"] .x-border-radius--bottom-01 {
3404
+ border-bottom-right-radius: var(--x-size-base-01) !important;
3400
3405
  }
3401
- [dir="rtl"] .x-border-radius--top-left-06 {
3402
- border-top-right-radius: var(--x-size-base-06) !important;
3406
+ [dir="rtl"] .x-border-radius--bottom-01 {
3407
+ border-bottom-left-radius: var(--x-size-base-01) !important;
3403
3408
  }
3404
- [dir="ltr"] .x-border-radius--top-right-06 {
3405
- border-top-right-radius: var(--x-size-base-06) !important;
3409
+ [dir="ltr"] .x-border-radius--right-01 {
3410
+ border-top-right-radius: var(--x-size-base-01) !important;
3406
3411
  }
3407
- [dir="rtl"] .x-border-radius--top-right-06 {
3408
- border-top-left-radius: var(--x-size-base-06) !important;
3412
+ [dir="rtl"] .x-border-radius--right-01 {
3413
+ border-top-left-radius: var(--x-size-base-01) !important;
3409
3414
  }
3410
- [dir="ltr"] .x-border-radius--bottom-left-06 {
3411
- border-bottom-left-radius: var(--x-size-base-06) !important;
3415
+ [dir="ltr"] .x-border-radius--right-01 {
3416
+ border-bottom-right-radius: var(--x-size-base-01) !important;
3412
3417
  }
3413
- [dir="rtl"] .x-border-radius--bottom-left-06 {
3414
- border-bottom-right-radius: var(--x-size-base-06) !important;
3418
+ [dir="rtl"] .x-border-radius--right-01 {
3419
+ border-bottom-left-radius: var(--x-size-base-01) !important;
3415
3420
  }
3416
- [dir="ltr"] .x-border-radius--bottom-right-06 {
3417
- border-bottom-right-radius: var(--x-size-base-06) !important;
3421
+ [dir="ltr"] .x-border-radius--left-01 {
3422
+ border-top-left-radius: var(--x-size-base-01) !important;
3418
3423
  }
3419
- [dir="rtl"] .x-border-radius--bottom-right-06 {
3420
- border-bottom-left-radius: var(--x-size-base-06) !important;
3424
+ [dir="rtl"] .x-border-radius--left-01 {
3425
+ border-top-right-radius: var(--x-size-base-01) !important;
3421
3426
  }
3422
- .x-border-radius--07 {
3423
- border-radius: var(--x-size-base-07) !important;
3427
+ [dir="ltr"] .x-border-radius--left-01 {
3428
+ border-bottom-left-radius: var(--x-size-base-01) !important;
3424
3429
  }
3425
- [dir="ltr"] .x-border-radius--top-07 {
3426
- border-top-left-radius: var(--x-size-base-07) !important;
3430
+ [dir="rtl"] .x-border-radius--left-01 {
3431
+ border-bottom-right-radius: var(--x-size-base-01) !important;
3427
3432
  }
3428
- [dir="rtl"] .x-border-radius--top-07 {
3429
- border-top-right-radius: var(--x-size-base-07) !important;
3433
+ [dir="ltr"] .x-border-radius--top-left-01 {
3434
+ border-top-left-radius: var(--x-size-base-01) !important;
3430
3435
  }
3431
- [dir="ltr"] .x-border-radius--top-07 {
3432
- border-top-right-radius: var(--x-size-base-07) !important;
3436
+ [dir="rtl"] .x-border-radius--top-left-01 {
3437
+ border-top-right-radius: var(--x-size-base-01) !important;
3433
3438
  }
3434
- [dir="rtl"] .x-border-radius--top-07 {
3435
- border-top-left-radius: var(--x-size-base-07) !important;
3439
+ [dir="ltr"] .x-border-radius--top-right-01 {
3440
+ border-top-right-radius: var(--x-size-base-01) !important;
3436
3441
  }
3437
- [dir="ltr"] .x-border-radius--bottom-07 {
3438
- border-bottom-left-radius: var(--x-size-base-07) !important;
3442
+ [dir="rtl"] .x-border-radius--top-right-01 {
3443
+ border-top-left-radius: var(--x-size-base-01) !important;
3439
3444
  }
3440
- [dir="rtl"] .x-border-radius--bottom-07 {
3441
- border-bottom-right-radius: var(--x-size-base-07) !important;
3445
+ [dir="ltr"] .x-border-radius--bottom-left-01 {
3446
+ border-bottom-left-radius: var(--x-size-base-01) !important;
3442
3447
  }
3443
- [dir="ltr"] .x-border-radius--bottom-07 {
3444
- border-bottom-right-radius: var(--x-size-base-07) !important;
3448
+ [dir="rtl"] .x-border-radius--bottom-left-01 {
3449
+ border-bottom-right-radius: var(--x-size-base-01) !important;
3445
3450
  }
3446
- [dir="rtl"] .x-border-radius--bottom-07 {
3447
- border-bottom-left-radius: var(--x-size-base-07) !important;
3451
+ [dir="ltr"] .x-border-radius--bottom-right-01 {
3452
+ border-bottom-right-radius: var(--x-size-base-01) !important;
3448
3453
  }
3449
- [dir="ltr"] .x-border-radius--right-07 {
3450
- border-top-right-radius: var(--x-size-base-07) !important;
3454
+ [dir="rtl"] .x-border-radius--bottom-right-01 {
3455
+ border-bottom-left-radius: var(--x-size-base-01) !important;
3451
3456
  }
3452
- [dir="rtl"] .x-border-radius--right-07 {
3453
- border-top-left-radius: var(--x-size-base-07) !important;
3457
+ .x-border-radius--02 {
3458
+ border-radius: var(--x-size-base-02) !important;
3454
3459
  }
3455
- [dir="ltr"] .x-border-radius--right-07 {
3456
- border-bottom-right-radius: var(--x-size-base-07) !important;
3460
+ [dir="ltr"] .x-border-radius--top-02 {
3461
+ border-top-left-radius: var(--x-size-base-02) !important;
3457
3462
  }
3458
- [dir="rtl"] .x-border-radius--right-07 {
3459
- border-bottom-left-radius: var(--x-size-base-07) !important;
3463
+ [dir="rtl"] .x-border-radius--top-02 {
3464
+ border-top-right-radius: var(--x-size-base-02) !important;
3460
3465
  }
3461
- [dir="ltr"] .x-border-radius--left-07 {
3462
- border-top-left-radius: var(--x-size-base-07) !important;
3466
+ [dir="ltr"] .x-border-radius--top-02 {
3467
+ border-top-right-radius: var(--x-size-base-02) !important;
3463
3468
  }
3464
- [dir="rtl"] .x-border-radius--left-07 {
3465
- border-top-right-radius: var(--x-size-base-07) !important;
3469
+ [dir="rtl"] .x-border-radius--top-02 {
3470
+ border-top-left-radius: var(--x-size-base-02) !important;
3466
3471
  }
3467
- [dir="ltr"] .x-border-radius--left-07 {
3468
- border-bottom-left-radius: var(--x-size-base-07) !important;
3472
+ [dir="ltr"] .x-border-radius--bottom-02 {
3473
+ border-bottom-left-radius: var(--x-size-base-02) !important;
3469
3474
  }
3470
- [dir="rtl"] .x-border-radius--left-07 {
3471
- border-bottom-right-radius: var(--x-size-base-07) !important;
3475
+ [dir="rtl"] .x-border-radius--bottom-02 {
3476
+ border-bottom-right-radius: var(--x-size-base-02) !important;
3472
3477
  }
3473
- [dir="ltr"] .x-border-radius--top-left-07 {
3474
- border-top-left-radius: var(--x-size-base-07) !important;
3478
+ [dir="ltr"] .x-border-radius--bottom-02 {
3479
+ border-bottom-right-radius: var(--x-size-base-02) !important;
3475
3480
  }
3476
- [dir="rtl"] .x-border-radius--top-left-07 {
3477
- border-top-right-radius: var(--x-size-base-07) !important;
3481
+ [dir="rtl"] .x-border-radius--bottom-02 {
3482
+ border-bottom-left-radius: var(--x-size-base-02) !important;
3478
3483
  }
3479
- [dir="ltr"] .x-border-radius--top-right-07 {
3480
- border-top-right-radius: var(--x-size-base-07) !important;
3484
+ [dir="ltr"] .x-border-radius--right-02 {
3485
+ border-top-right-radius: var(--x-size-base-02) !important;
3481
3486
  }
3482
- [dir="rtl"] .x-border-radius--top-right-07 {
3483
- border-top-left-radius: var(--x-size-base-07) !important;
3487
+ [dir="rtl"] .x-border-radius--right-02 {
3488
+ border-top-left-radius: var(--x-size-base-02) !important;
3484
3489
  }
3485
- [dir="ltr"] .x-border-radius--bottom-left-07 {
3486
- border-bottom-left-radius: var(--x-size-base-07) !important;
3490
+ [dir="ltr"] .x-border-radius--right-02 {
3491
+ border-bottom-right-radius: var(--x-size-base-02) !important;
3487
3492
  }
3488
- [dir="rtl"] .x-border-radius--bottom-left-07 {
3489
- border-bottom-right-radius: var(--x-size-base-07) !important;
3493
+ [dir="rtl"] .x-border-radius--right-02 {
3494
+ border-bottom-left-radius: var(--x-size-base-02) !important;
3490
3495
  }
3491
- [dir="ltr"] .x-border-radius--bottom-right-07 {
3492
- border-bottom-right-radius: var(--x-size-base-07) !important;
3496
+ [dir="ltr"] .x-border-radius--left-02 {
3497
+ border-top-left-radius: var(--x-size-base-02) !important;
3493
3498
  }
3494
- [dir="rtl"] .x-border-radius--bottom-right-07 {
3495
- border-bottom-left-radius: var(--x-size-base-07) !important;
3499
+ [dir="rtl"] .x-border-radius--left-02 {
3500
+ border-top-right-radius: var(--x-size-base-02) !important;
3496
3501
  }
3497
- .x-border-radius--08 {
3498
- border-radius: var(--x-size-base-08) !important;
3502
+ [dir="ltr"] .x-border-radius--left-02 {
3503
+ border-bottom-left-radius: var(--x-size-base-02) !important;
3499
3504
  }
3500
- [dir="ltr"] .x-border-radius--top-08 {
3501
- border-top-left-radius: var(--x-size-base-08) !important;
3505
+ [dir="rtl"] .x-border-radius--left-02 {
3506
+ border-bottom-right-radius: var(--x-size-base-02) !important;
3502
3507
  }
3503
- [dir="rtl"] .x-border-radius--top-08 {
3504
- border-top-right-radius: var(--x-size-base-08) !important;
3508
+ [dir="ltr"] .x-border-radius--top-left-02 {
3509
+ border-top-left-radius: var(--x-size-base-02) !important;
3505
3510
  }
3506
- [dir="ltr"] .x-border-radius--top-08 {
3507
- border-top-right-radius: var(--x-size-base-08) !important;
3511
+ [dir="rtl"] .x-border-radius--top-left-02 {
3512
+ border-top-right-radius: var(--x-size-base-02) !important;
3508
3513
  }
3509
- [dir="rtl"] .x-border-radius--top-08 {
3510
- border-top-left-radius: var(--x-size-base-08) !important;
3514
+ [dir="ltr"] .x-border-radius--top-right-02 {
3515
+ border-top-right-radius: var(--x-size-base-02) !important;
3516
+ }
3517
+ [dir="rtl"] .x-border-radius--top-right-02 {
3518
+ border-top-left-radius: var(--x-size-base-02) !important;
3511
3519
  }
3512
- [dir="ltr"] .x-border-radius--bottom-08 {
3513
- border-bottom-left-radius: var(--x-size-base-08) !important;
3520
+ [dir="ltr"] .x-border-radius--bottom-left-02 {
3521
+ border-bottom-left-radius: var(--x-size-base-02) !important;
3514
3522
  }
3515
- [dir="rtl"] .x-border-radius--bottom-08 {
3516
- border-bottom-right-radius: var(--x-size-base-08) !important;
3523
+ [dir="rtl"] .x-border-radius--bottom-left-02 {
3524
+ border-bottom-right-radius: var(--x-size-base-02) !important;
3517
3525
  }
3518
- [dir="ltr"] .x-border-radius--bottom-08 {
3519
- border-bottom-right-radius: var(--x-size-base-08) !important;
3526
+ [dir="ltr"] .x-border-radius--bottom-right-02 {
3527
+ border-bottom-right-radius: var(--x-size-base-02) !important;
3520
3528
  }
3521
- [dir="rtl"] .x-border-radius--bottom-08 {
3522
- border-bottom-left-radius: var(--x-size-base-08) !important;
3529
+ [dir="rtl"] .x-border-radius--bottom-right-02 {
3530
+ border-bottom-left-radius: var(--x-size-base-02) !important;
3523
3531
  }
3524
- [dir="ltr"] .x-border-radius--right-08 {
3525
- border-top-right-radius: var(--x-size-base-08) !important;
3532
+ .x-border-radius--03 {
3533
+ border-radius: var(--x-size-base-03) !important;
3526
3534
  }
3527
- [dir="rtl"] .x-border-radius--right-08 {
3528
- border-top-left-radius: var(--x-size-base-08) !important;
3535
+ [dir="ltr"] .x-border-radius--top-03 {
3536
+ border-top-left-radius: var(--x-size-base-03) !important;
3529
3537
  }
3530
- [dir="ltr"] .x-border-radius--right-08 {
3531
- border-bottom-right-radius: var(--x-size-base-08) !important;
3538
+ [dir="rtl"] .x-border-radius--top-03 {
3539
+ border-top-right-radius: var(--x-size-base-03) !important;
3532
3540
  }
3533
- [dir="rtl"] .x-border-radius--right-08 {
3534
- border-bottom-left-radius: var(--x-size-base-08) !important;
3541
+ [dir="ltr"] .x-border-radius--top-03 {
3542
+ border-top-right-radius: var(--x-size-base-03) !important;
3535
3543
  }
3536
- [dir="ltr"] .x-border-radius--left-08 {
3537
- border-top-left-radius: var(--x-size-base-08) !important;
3544
+ [dir="rtl"] .x-border-radius--top-03 {
3545
+ border-top-left-radius: var(--x-size-base-03) !important;
3538
3546
  }
3539
- [dir="rtl"] .x-border-radius--left-08 {
3540
- border-top-right-radius: var(--x-size-base-08) !important;
3547
+ [dir="ltr"] .x-border-radius--bottom-03 {
3548
+ border-bottom-left-radius: var(--x-size-base-03) !important;
3541
3549
  }
3542
- [dir="ltr"] .x-border-radius--left-08 {
3543
- border-bottom-left-radius: var(--x-size-base-08) !important;
3550
+ [dir="rtl"] .x-border-radius--bottom-03 {
3551
+ border-bottom-right-radius: var(--x-size-base-03) !important;
3544
3552
  }
3545
- [dir="rtl"] .x-border-radius--left-08 {
3546
- border-bottom-right-radius: var(--x-size-base-08) !important;
3553
+ [dir="ltr"] .x-border-radius--bottom-03 {
3554
+ border-bottom-right-radius: var(--x-size-base-03) !important;
3547
3555
  }
3548
- [dir="ltr"] .x-border-radius--top-left-08 {
3549
- border-top-left-radius: var(--x-size-base-08) !important;
3556
+ [dir="rtl"] .x-border-radius--bottom-03 {
3557
+ border-bottom-left-radius: var(--x-size-base-03) !important;
3550
3558
  }
3551
- [dir="rtl"] .x-border-radius--top-left-08 {
3552
- border-top-right-radius: var(--x-size-base-08) !important;
3559
+ [dir="ltr"] .x-border-radius--right-03 {
3560
+ border-top-right-radius: var(--x-size-base-03) !important;
3553
3561
  }
3554
- [dir="ltr"] .x-border-radius--top-right-08 {
3555
- border-top-right-radius: var(--x-size-base-08) !important;
3562
+ [dir="rtl"] .x-border-radius--right-03 {
3563
+ border-top-left-radius: var(--x-size-base-03) !important;
3556
3564
  }
3557
- [dir="rtl"] .x-border-radius--top-right-08 {
3558
- border-top-left-radius: var(--x-size-base-08) !important;
3565
+ [dir="ltr"] .x-border-radius--right-03 {
3566
+ border-bottom-right-radius: var(--x-size-base-03) !important;
3559
3567
  }
3560
- [dir="ltr"] .x-border-radius--bottom-left-08 {
3561
- border-bottom-left-radius: var(--x-size-base-08) !important;
3568
+ [dir="rtl"] .x-border-radius--right-03 {
3569
+ border-bottom-left-radius: var(--x-size-base-03) !important;
3562
3570
  }
3563
- [dir="rtl"] .x-border-radius--bottom-left-08 {
3564
- border-bottom-right-radius: var(--x-size-base-08) !important;
3571
+ [dir="ltr"] .x-border-radius--left-03 {
3572
+ border-top-left-radius: var(--x-size-base-03) !important;
3565
3573
  }
3566
- [dir="ltr"] .x-border-radius--bottom-right-08 {
3567
- border-bottom-right-radius: var(--x-size-base-08) !important;
3574
+ [dir="rtl"] .x-border-radius--left-03 {
3575
+ border-top-right-radius: var(--x-size-base-03) !important;
3568
3576
  }
3569
- [dir="rtl"] .x-border-radius--bottom-right-08 {
3570
- border-bottom-left-radius: var(--x-size-base-08) !important;
3577
+ [dir="ltr"] .x-border-radius--left-03 {
3578
+ border-bottom-left-radius: var(--x-size-base-03) !important;
3571
3579
  }
3572
- .x-border-radius--09 {
3573
- border-radius: var(--x-size-base-09) !important;
3580
+ [dir="rtl"] .x-border-radius--left-03 {
3581
+ border-bottom-right-radius: var(--x-size-base-03) !important;
3574
3582
  }
3575
- [dir="ltr"] .x-border-radius--top-09 {
3576
- border-top-left-radius: var(--x-size-base-09) !important;
3583
+ [dir="ltr"] .x-border-radius--top-left-03 {
3584
+ border-top-left-radius: var(--x-size-base-03) !important;
3577
3585
  }
3578
- [dir="rtl"] .x-border-radius--top-09 {
3579
- border-top-right-radius: var(--x-size-base-09) !important;
3586
+ [dir="rtl"] .x-border-radius--top-left-03 {
3587
+ border-top-right-radius: var(--x-size-base-03) !important;
3580
3588
  }
3581
- [dir="ltr"] .x-border-radius--top-09 {
3582
- border-top-right-radius: var(--x-size-base-09) !important;
3589
+ [dir="ltr"] .x-border-radius--top-right-03 {
3590
+ border-top-right-radius: var(--x-size-base-03) !important;
3583
3591
  }
3584
- [dir="rtl"] .x-border-radius--top-09 {
3585
- border-top-left-radius: var(--x-size-base-09) !important;
3592
+ [dir="rtl"] .x-border-radius--top-right-03 {
3593
+ border-top-left-radius: var(--x-size-base-03) !important;
3586
3594
  }
3587
- [dir="ltr"] .x-border-radius--bottom-09 {
3588
- border-bottom-left-radius: var(--x-size-base-09) !important;
3595
+ [dir="ltr"] .x-border-radius--bottom-left-03 {
3596
+ border-bottom-left-radius: var(--x-size-base-03) !important;
3589
3597
  }
3590
- [dir="rtl"] .x-border-radius--bottom-09 {
3591
- border-bottom-right-radius: var(--x-size-base-09) !important;
3598
+ [dir="rtl"] .x-border-radius--bottom-left-03 {
3599
+ border-bottom-right-radius: var(--x-size-base-03) !important;
3592
3600
  }
3593
- [dir="ltr"] .x-border-radius--bottom-09 {
3594
- border-bottom-right-radius: var(--x-size-base-09) !important;
3601
+ [dir="ltr"] .x-border-radius--bottom-right-03 {
3602
+ border-bottom-right-radius: var(--x-size-base-03) !important;
3595
3603
  }
3596
- [dir="rtl"] .x-border-radius--bottom-09 {
3597
- border-bottom-left-radius: var(--x-size-base-09) !important;
3604
+ [dir="rtl"] .x-border-radius--bottom-right-03 {
3605
+ border-bottom-left-radius: var(--x-size-base-03) !important;
3598
3606
  }
3599
- [dir="ltr"] .x-border-radius--right-09 {
3600
- border-top-right-radius: var(--x-size-base-09) !important;
3607
+ .x-border-radius--04 {
3608
+ border-radius: var(--x-size-base-04) !important;
3601
3609
  }
3602
- [dir="rtl"] .x-border-radius--right-09 {
3603
- border-top-left-radius: var(--x-size-base-09) !important;
3610
+ [dir="ltr"] .x-border-radius--top-04 {
3611
+ border-top-left-radius: var(--x-size-base-04) !important;
3604
3612
  }
3605
- [dir="ltr"] .x-border-radius--right-09 {
3606
- border-bottom-right-radius: var(--x-size-base-09) !important;
3613
+ [dir="rtl"] .x-border-radius--top-04 {
3614
+ border-top-right-radius: var(--x-size-base-04) !important;
3607
3615
  }
3608
- [dir="rtl"] .x-border-radius--right-09 {
3609
- border-bottom-left-radius: var(--x-size-base-09) !important;
3616
+ [dir="ltr"] .x-border-radius--top-04 {
3617
+ border-top-right-radius: var(--x-size-base-04) !important;
3610
3618
  }
3611
- [dir="ltr"] .x-border-radius--left-09 {
3612
- border-top-left-radius: var(--x-size-base-09) !important;
3619
+ [dir="rtl"] .x-border-radius--top-04 {
3620
+ border-top-left-radius: var(--x-size-base-04) !important;
3613
3621
  }
3614
- [dir="rtl"] .x-border-radius--left-09 {
3615
- border-top-right-radius: var(--x-size-base-09) !important;
3622
+ [dir="ltr"] .x-border-radius--bottom-04 {
3623
+ border-bottom-left-radius: var(--x-size-base-04) !important;
3616
3624
  }
3617
- [dir="ltr"] .x-border-radius--left-09 {
3618
- border-bottom-left-radius: var(--x-size-base-09) !important;
3625
+ [dir="rtl"] .x-border-radius--bottom-04 {
3626
+ border-bottom-right-radius: var(--x-size-base-04) !important;
3619
3627
  }
3620
- [dir="rtl"] .x-border-radius--left-09 {
3621
- border-bottom-right-radius: var(--x-size-base-09) !important;
3628
+ [dir="ltr"] .x-border-radius--bottom-04 {
3629
+ border-bottom-right-radius: var(--x-size-base-04) !important;
3622
3630
  }
3623
- [dir="ltr"] .x-border-radius--top-left-09 {
3624
- border-top-left-radius: var(--x-size-base-09) !important;
3631
+ [dir="rtl"] .x-border-radius--bottom-04 {
3632
+ border-bottom-left-radius: var(--x-size-base-04) !important;
3625
3633
  }
3626
- [dir="rtl"] .x-border-radius--top-left-09 {
3627
- border-top-right-radius: var(--x-size-base-09) !important;
3634
+ [dir="ltr"] .x-border-radius--right-04 {
3635
+ border-top-right-radius: var(--x-size-base-04) !important;
3628
3636
  }
3629
- [dir="ltr"] .x-border-radius--top-right-09 {
3630
- border-top-right-radius: var(--x-size-base-09) !important;
3637
+ [dir="rtl"] .x-border-radius--right-04 {
3638
+ border-top-left-radius: var(--x-size-base-04) !important;
3631
3639
  }
3632
- [dir="rtl"] .x-border-radius--top-right-09 {
3633
- border-top-left-radius: var(--x-size-base-09) !important;
3640
+ [dir="ltr"] .x-border-radius--right-04 {
3641
+ border-bottom-right-radius: var(--x-size-base-04) !important;
3634
3642
  }
3635
- [dir="ltr"] .x-border-radius--bottom-left-09 {
3636
- border-bottom-left-radius: var(--x-size-base-09) !important;
3643
+ [dir="rtl"] .x-border-radius--right-04 {
3644
+ border-bottom-left-radius: var(--x-size-base-04) !important;
3637
3645
  }
3638
- [dir="rtl"] .x-border-radius--bottom-left-09 {
3639
- border-bottom-right-radius: var(--x-size-base-09) !important;
3646
+ [dir="ltr"] .x-border-radius--left-04 {
3647
+ border-top-left-radius: var(--x-size-base-04) !important;
3640
3648
  }
3641
- [dir="ltr"] .x-border-radius--bottom-right-09 {
3642
- border-bottom-right-radius: var(--x-size-base-09) !important;
3649
+ [dir="rtl"] .x-border-radius--left-04 {
3650
+ border-top-right-radius: var(--x-size-base-04) !important;
3643
3651
  }
3644
- [dir="rtl"] .x-border-radius--bottom-right-09 {
3645
- border-bottom-left-radius: var(--x-size-base-09) !important;
3652
+ [dir="ltr"] .x-border-radius--left-04 {
3653
+ border-bottom-left-radius: var(--x-size-base-04) !important;
3646
3654
  }
3647
- .x-border-radius--10 {
3648
- border-radius: var(--x-size-base-10) !important;
3655
+ [dir="rtl"] .x-border-radius--left-04 {
3656
+ border-bottom-right-radius: var(--x-size-base-04) !important;
3649
3657
  }
3650
- [dir="ltr"] .x-border-radius--top-10 {
3651
- border-top-left-radius: var(--x-size-base-10) !important;
3658
+ [dir="ltr"] .x-border-radius--top-left-04 {
3659
+ border-top-left-radius: var(--x-size-base-04) !important;
3652
3660
  }
3653
- [dir="rtl"] .x-border-radius--top-10 {
3654
- border-top-right-radius: var(--x-size-base-10) !important;
3661
+ [dir="rtl"] .x-border-radius--top-left-04 {
3662
+ border-top-right-radius: var(--x-size-base-04) !important;
3655
3663
  }
3656
- [dir="ltr"] .x-border-radius--top-10 {
3657
- border-top-right-radius: var(--x-size-base-10) !important;
3664
+ [dir="ltr"] .x-border-radius--top-right-04 {
3665
+ border-top-right-radius: var(--x-size-base-04) !important;
3658
3666
  }
3659
- [dir="rtl"] .x-border-radius--top-10 {
3660
- border-top-left-radius: var(--x-size-base-10) !important;
3667
+ [dir="rtl"] .x-border-radius--top-right-04 {
3668
+ border-top-left-radius: var(--x-size-base-04) !important;
3661
3669
  }
3662
- [dir="ltr"] .x-border-radius--bottom-10 {
3663
- border-bottom-left-radius: var(--x-size-base-10) !important;
3670
+ [dir="ltr"] .x-border-radius--bottom-left-04 {
3671
+ border-bottom-left-radius: var(--x-size-base-04) !important;
3664
3672
  }
3665
- [dir="rtl"] .x-border-radius--bottom-10 {
3666
- border-bottom-right-radius: var(--x-size-base-10) !important;
3673
+ [dir="rtl"] .x-border-radius--bottom-left-04 {
3674
+ border-bottom-right-radius: var(--x-size-base-04) !important;
3667
3675
  }
3668
- [dir="ltr"] .x-border-radius--bottom-10 {
3669
- border-bottom-right-radius: var(--x-size-base-10) !important;
3676
+ [dir="ltr"] .x-border-radius--bottom-right-04 {
3677
+ border-bottom-right-radius: var(--x-size-base-04) !important;
3670
3678
  }
3671
- [dir="rtl"] .x-border-radius--bottom-10 {
3672
- border-bottom-left-radius: var(--x-size-base-10) !important;
3679
+ [dir="rtl"] .x-border-radius--bottom-right-04 {
3680
+ border-bottom-left-radius: var(--x-size-base-04) !important;
3673
3681
  }
3674
- [dir="ltr"] .x-border-radius--right-10 {
3675
- border-top-right-radius: var(--x-size-base-10) !important;
3682
+ .x-border-radius--05 {
3683
+ border-radius: var(--x-size-base-05) !important;
3676
3684
  }
3677
- [dir="rtl"] .x-border-radius--right-10 {
3678
- border-top-left-radius: var(--x-size-base-10) !important;
3685
+ [dir="ltr"] .x-border-radius--top-05 {
3686
+ border-top-left-radius: var(--x-size-base-05) !important;
3679
3687
  }
3680
- [dir="ltr"] .x-border-radius--right-10 {
3681
- border-bottom-right-radius: var(--x-size-base-10) !important;
3688
+ [dir="rtl"] .x-border-radius--top-05 {
3689
+ border-top-right-radius: var(--x-size-base-05) !important;
3682
3690
  }
3683
- [dir="rtl"] .x-border-radius--right-10 {
3684
- border-bottom-left-radius: var(--x-size-base-10) !important;
3691
+ [dir="ltr"] .x-border-radius--top-05 {
3692
+ border-top-right-radius: var(--x-size-base-05) !important;
3685
3693
  }
3686
- [dir="ltr"] .x-border-radius--left-10 {
3687
- border-top-left-radius: var(--x-size-base-10) !important;
3694
+ [dir="rtl"] .x-border-radius--top-05 {
3695
+ border-top-left-radius: var(--x-size-base-05) !important;
3688
3696
  }
3689
- [dir="rtl"] .x-border-radius--left-10 {
3690
- border-top-right-radius: var(--x-size-base-10) !important;
3697
+ [dir="ltr"] .x-border-radius--bottom-05 {
3698
+ border-bottom-left-radius: var(--x-size-base-05) !important;
3691
3699
  }
3692
- [dir="ltr"] .x-border-radius--left-10 {
3693
- border-bottom-left-radius: var(--x-size-base-10) !important;
3700
+ [dir="rtl"] .x-border-radius--bottom-05 {
3701
+ border-bottom-right-radius: var(--x-size-base-05) !important;
3694
3702
  }
3695
- [dir="rtl"] .x-border-radius--left-10 {
3696
- border-bottom-right-radius: var(--x-size-base-10) !important;
3703
+ [dir="ltr"] .x-border-radius--bottom-05 {
3704
+ border-bottom-right-radius: var(--x-size-base-05) !important;
3697
3705
  }
3698
- [dir="ltr"] .x-border-radius--top-left-10 {
3699
- border-top-left-radius: var(--x-size-base-10) !important;
3706
+ [dir="rtl"] .x-border-radius--bottom-05 {
3707
+ border-bottom-left-radius: var(--x-size-base-05) !important;
3700
3708
  }
3701
- [dir="rtl"] .x-border-radius--top-left-10 {
3702
- border-top-right-radius: var(--x-size-base-10) !important;
3709
+ [dir="ltr"] .x-border-radius--right-05 {
3710
+ border-top-right-radius: var(--x-size-base-05) !important;
3703
3711
  }
3704
- [dir="ltr"] .x-border-radius--top-right-10 {
3705
- border-top-right-radius: var(--x-size-base-10) !important;
3712
+ [dir="rtl"] .x-border-radius--right-05 {
3713
+ border-top-left-radius: var(--x-size-base-05) !important;
3706
3714
  }
3707
- [dir="rtl"] .x-border-radius--top-right-10 {
3708
- border-top-left-radius: var(--x-size-base-10) !important;
3715
+ [dir="ltr"] .x-border-radius--right-05 {
3716
+ border-bottom-right-radius: var(--x-size-base-05) !important;
3709
3717
  }
3710
- [dir="ltr"] .x-border-radius--bottom-left-10 {
3711
- border-bottom-left-radius: var(--x-size-base-10) !important;
3718
+ [dir="rtl"] .x-border-radius--right-05 {
3719
+ border-bottom-left-radius: var(--x-size-base-05) !important;
3712
3720
  }
3713
- [dir="rtl"] .x-border-radius--bottom-left-10 {
3714
- border-bottom-right-radius: var(--x-size-base-10) !important;
3721
+ [dir="ltr"] .x-border-radius--left-05 {
3722
+ border-top-left-radius: var(--x-size-base-05) !important;
3715
3723
  }
3716
- [dir="ltr"] .x-border-radius--bottom-right-10 {
3717
- border-bottom-right-radius: var(--x-size-base-10) !important;
3724
+ [dir="rtl"] .x-border-radius--left-05 {
3725
+ border-top-right-radius: var(--x-size-base-05) !important;
3718
3726
  }
3719
- [dir="rtl"] .x-border-radius--bottom-right-10 {
3720
- border-bottom-left-radius: var(--x-size-base-10) !important;
3727
+ [dir="ltr"] .x-border-radius--left-05 {
3728
+ border-bottom-left-radius: var(--x-size-base-05) !important;
3721
3729
  }
3722
- .x-border-radius--11 {
3723
- border-radius: var(--x-size-base-11) !important;
3730
+ [dir="rtl"] .x-border-radius--left-05 {
3731
+ border-bottom-right-radius: var(--x-size-base-05) !important;
3724
3732
  }
3725
- [dir="ltr"] .x-border-radius--top-11 {
3726
- border-top-left-radius: var(--x-size-base-11) !important;
3733
+ [dir="ltr"] .x-border-radius--top-left-05 {
3734
+ border-top-left-radius: var(--x-size-base-05) !important;
3727
3735
  }
3728
- [dir="rtl"] .x-border-radius--top-11 {
3729
- border-top-right-radius: var(--x-size-base-11) !important;
3736
+ [dir="rtl"] .x-border-radius--top-left-05 {
3737
+ border-top-right-radius: var(--x-size-base-05) !important;
3730
3738
  }
3731
- [dir="ltr"] .x-border-radius--top-11 {
3732
- border-top-right-radius: var(--x-size-base-11) !important;
3739
+ [dir="ltr"] .x-border-radius--top-right-05 {
3740
+ border-top-right-radius: var(--x-size-base-05) !important;
3733
3741
  }
3734
- [dir="rtl"] .x-border-radius--top-11 {
3735
- border-top-left-radius: var(--x-size-base-11) !important;
3742
+ [dir="rtl"] .x-border-radius--top-right-05 {
3743
+ border-top-left-radius: var(--x-size-base-05) !important;
3736
3744
  }
3737
- [dir="ltr"] .x-border-radius--bottom-11 {
3738
- border-bottom-left-radius: var(--x-size-base-11) !important;
3745
+ [dir="ltr"] .x-border-radius--bottom-left-05 {
3746
+ border-bottom-left-radius: var(--x-size-base-05) !important;
3739
3747
  }
3740
- [dir="rtl"] .x-border-radius--bottom-11 {
3741
- border-bottom-right-radius: var(--x-size-base-11) !important;
3748
+ [dir="rtl"] .x-border-radius--bottom-left-05 {
3749
+ border-bottom-right-radius: var(--x-size-base-05) !important;
3742
3750
  }
3743
- [dir="ltr"] .x-border-radius--bottom-11 {
3744
- border-bottom-right-radius: var(--x-size-base-11) !important;
3751
+ [dir="ltr"] .x-border-radius--bottom-right-05 {
3752
+ border-bottom-right-radius: var(--x-size-base-05) !important;
3745
3753
  }
3746
- [dir="rtl"] .x-border-radius--bottom-11 {
3747
- border-bottom-left-radius: var(--x-size-base-11) !important;
3754
+ [dir="rtl"] .x-border-radius--bottom-right-05 {
3755
+ border-bottom-left-radius: var(--x-size-base-05) !important;
3748
3756
  }
3749
- [dir="ltr"] .x-border-radius--right-11 {
3750
- border-top-right-radius: var(--x-size-base-11) !important;
3757
+ .x-border-radius--06 {
3758
+ border-radius: var(--x-size-base-06) !important;
3751
3759
  }
3752
- [dir="rtl"] .x-border-radius--right-11 {
3753
- border-top-left-radius: var(--x-size-base-11) !important;
3760
+ [dir="ltr"] .x-border-radius--top-06 {
3761
+ border-top-left-radius: var(--x-size-base-06) !important;
3754
3762
  }
3755
- [dir="ltr"] .x-border-radius--right-11 {
3756
- border-bottom-right-radius: var(--x-size-base-11) !important;
3763
+ [dir="rtl"] .x-border-radius--top-06 {
3764
+ border-top-right-radius: var(--x-size-base-06) !important;
3757
3765
  }
3758
- [dir="rtl"] .x-border-radius--right-11 {
3759
- border-bottom-left-radius: var(--x-size-base-11) !important;
3766
+ [dir="ltr"] .x-border-radius--top-06 {
3767
+ border-top-right-radius: var(--x-size-base-06) !important;
3760
3768
  }
3761
- [dir="ltr"] .x-border-radius--left-11 {
3762
- border-top-left-radius: var(--x-size-base-11) !important;
3769
+ [dir="rtl"] .x-border-radius--top-06 {
3770
+ border-top-left-radius: var(--x-size-base-06) !important;
3763
3771
  }
3764
- [dir="rtl"] .x-border-radius--left-11 {
3765
- border-top-right-radius: var(--x-size-base-11) !important;
3772
+ [dir="ltr"] .x-border-radius--bottom-06 {
3773
+ border-bottom-left-radius: var(--x-size-base-06) !important;
3766
3774
  }
3767
- [dir="ltr"] .x-border-radius--left-11 {
3768
- border-bottom-left-radius: var(--x-size-base-11) !important;
3775
+ [dir="rtl"] .x-border-radius--bottom-06 {
3776
+ border-bottom-right-radius: var(--x-size-base-06) !important;
3769
3777
  }
3770
- [dir="rtl"] .x-border-radius--left-11 {
3771
- border-bottom-right-radius: var(--x-size-base-11) !important;
3778
+ [dir="ltr"] .x-border-radius--bottom-06 {
3779
+ border-bottom-right-radius: var(--x-size-base-06) !important;
3772
3780
  }
3773
- [dir="ltr"] .x-border-radius--top-left-11 {
3774
- border-top-left-radius: var(--x-size-base-11) !important;
3781
+ [dir="rtl"] .x-border-radius--bottom-06 {
3782
+ border-bottom-left-radius: var(--x-size-base-06) !important;
3775
3783
  }
3776
- [dir="rtl"] .x-border-radius--top-left-11 {
3777
- border-top-right-radius: var(--x-size-base-11) !important;
3784
+ [dir="ltr"] .x-border-radius--right-06 {
3785
+ border-top-right-radius: var(--x-size-base-06) !important;
3778
3786
  }
3779
- [dir="ltr"] .x-border-radius--top-right-11 {
3780
- border-top-right-radius: var(--x-size-base-11) !important;
3787
+ [dir="rtl"] .x-border-radius--right-06 {
3788
+ border-top-left-radius: var(--x-size-base-06) !important;
3781
3789
  }
3782
- [dir="rtl"] .x-border-radius--top-right-11 {
3783
- border-top-left-radius: var(--x-size-base-11) !important;
3790
+ [dir="ltr"] .x-border-radius--right-06 {
3791
+ border-bottom-right-radius: var(--x-size-base-06) !important;
3784
3792
  }
3785
- [dir="ltr"] .x-border-radius--bottom-left-11 {
3786
- border-bottom-left-radius: var(--x-size-base-11) !important;
3793
+ [dir="rtl"] .x-border-radius--right-06 {
3794
+ border-bottom-left-radius: var(--x-size-base-06) !important;
3787
3795
  }
3788
- [dir="rtl"] .x-border-radius--bottom-left-11 {
3789
- border-bottom-right-radius: var(--x-size-base-11) !important;
3796
+ [dir="ltr"] .x-border-radius--left-06 {
3797
+ border-top-left-radius: var(--x-size-base-06) !important;
3790
3798
  }
3791
- [dir="ltr"] .x-border-radius--bottom-right-11 {
3792
- border-bottom-right-radius: var(--x-size-base-11) !important;
3799
+ [dir="rtl"] .x-border-radius--left-06 {
3800
+ border-top-right-radius: var(--x-size-base-06) !important;
3793
3801
  }
3794
- [dir="rtl"] .x-border-radius--bottom-right-11 {
3795
- border-bottom-left-radius: var(--x-size-base-11) !important;
3802
+ [dir="ltr"] .x-border-radius--left-06 {
3803
+ border-bottom-left-radius: var(--x-size-base-06) !important;
3796
3804
  }
3797
- .x-border-radius--12 {
3798
- border-radius: var(--x-size-base-12) !important;
3805
+ [dir="rtl"] .x-border-radius--left-06 {
3806
+ border-bottom-right-radius: var(--x-size-base-06) !important;
3799
3807
  }
3800
- [dir="ltr"] .x-border-radius--top-12 {
3801
- border-top-left-radius: var(--x-size-base-12) !important;
3808
+ [dir="ltr"] .x-border-radius--top-left-06 {
3809
+ border-top-left-radius: var(--x-size-base-06) !important;
3802
3810
  }
3803
- [dir="rtl"] .x-border-radius--top-12 {
3804
- border-top-right-radius: var(--x-size-base-12) !important;
3811
+ [dir="rtl"] .x-border-radius--top-left-06 {
3812
+ border-top-right-radius: var(--x-size-base-06) !important;
3805
3813
  }
3806
- [dir="ltr"] .x-border-radius--top-12 {
3807
- border-top-right-radius: var(--x-size-base-12) !important;
3814
+ [dir="ltr"] .x-border-radius--top-right-06 {
3815
+ border-top-right-radius: var(--x-size-base-06) !important;
3808
3816
  }
3809
- [dir="rtl"] .x-border-radius--top-12 {
3810
- border-top-left-radius: var(--x-size-base-12) !important;
3817
+ [dir="rtl"] .x-border-radius--top-right-06 {
3818
+ border-top-left-radius: var(--x-size-base-06) !important;
3811
3819
  }
3812
- [dir="ltr"] .x-border-radius--bottom-12 {
3813
- border-bottom-left-radius: var(--x-size-base-12) !important;
3820
+ [dir="ltr"] .x-border-radius--bottom-left-06 {
3821
+ border-bottom-left-radius: var(--x-size-base-06) !important;
3814
3822
  }
3815
- [dir="rtl"] .x-border-radius--bottom-12 {
3816
- border-bottom-right-radius: var(--x-size-base-12) !important;
3823
+ [dir="rtl"] .x-border-radius--bottom-left-06 {
3824
+ border-bottom-right-radius: var(--x-size-base-06) !important;
3817
3825
  }
3818
- [dir="ltr"] .x-border-radius--bottom-12 {
3819
- border-bottom-right-radius: var(--x-size-base-12) !important;
3826
+ [dir="ltr"] .x-border-radius--bottom-right-06 {
3827
+ border-bottom-right-radius: var(--x-size-base-06) !important;
3820
3828
  }
3821
- [dir="rtl"] .x-border-radius--bottom-12 {
3822
- border-bottom-left-radius: var(--x-size-base-12) !important;
3829
+ [dir="rtl"] .x-border-radius--bottom-right-06 {
3830
+ border-bottom-left-radius: var(--x-size-base-06) !important;
3823
3831
  }
3824
- [dir="ltr"] .x-border-radius--right-12 {
3825
- border-top-right-radius: var(--x-size-base-12) !important;
3832
+ .x-border-radius--07 {
3833
+ border-radius: var(--x-size-base-07) !important;
3826
3834
  }
3827
- [dir="rtl"] .x-border-radius--right-12 {
3828
- border-top-left-radius: var(--x-size-base-12) !important;
3835
+ [dir="ltr"] .x-border-radius--top-07 {
3836
+ border-top-left-radius: var(--x-size-base-07) !important;
3829
3837
  }
3830
- [dir="ltr"] .x-border-radius--right-12 {
3831
- border-bottom-right-radius: var(--x-size-base-12) !important;
3838
+ [dir="rtl"] .x-border-radius--top-07 {
3839
+ border-top-right-radius: var(--x-size-base-07) !important;
3832
3840
  }
3833
- [dir="rtl"] .x-border-radius--right-12 {
3834
- border-bottom-left-radius: var(--x-size-base-12) !important;
3841
+ [dir="ltr"] .x-border-radius--top-07 {
3842
+ border-top-right-radius: var(--x-size-base-07) !important;
3835
3843
  }
3836
- [dir="ltr"] .x-border-radius--left-12 {
3837
- border-top-left-radius: var(--x-size-base-12) !important;
3844
+ [dir="rtl"] .x-border-radius--top-07 {
3845
+ border-top-left-radius: var(--x-size-base-07) !important;
3838
3846
  }
3839
- [dir="rtl"] .x-border-radius--left-12 {
3840
- border-top-right-radius: var(--x-size-base-12) !important;
3847
+ [dir="ltr"] .x-border-radius--bottom-07 {
3848
+ border-bottom-left-radius: var(--x-size-base-07) !important;
3841
3849
  }
3842
- [dir="ltr"] .x-border-radius--left-12 {
3843
- border-bottom-left-radius: var(--x-size-base-12) !important;
3850
+ [dir="rtl"] .x-border-radius--bottom-07 {
3851
+ border-bottom-right-radius: var(--x-size-base-07) !important;
3844
3852
  }
3845
- [dir="rtl"] .x-border-radius--left-12 {
3846
- border-bottom-right-radius: var(--x-size-base-12) !important;
3853
+ [dir="ltr"] .x-border-radius--bottom-07 {
3854
+ border-bottom-right-radius: var(--x-size-base-07) !important;
3847
3855
  }
3848
- [dir="ltr"] .x-border-radius--top-left-12 {
3849
- border-top-left-radius: var(--x-size-base-12) !important;
3856
+ [dir="rtl"] .x-border-radius--bottom-07 {
3857
+ border-bottom-left-radius: var(--x-size-base-07) !important;
3850
3858
  }
3851
- [dir="rtl"] .x-border-radius--top-left-12 {
3852
- border-top-right-radius: var(--x-size-base-12) !important;
3859
+ [dir="ltr"] .x-border-radius--right-07 {
3860
+ border-top-right-radius: var(--x-size-base-07) !important;
3853
3861
  }
3854
- [dir="ltr"] .x-border-radius--top-right-12 {
3855
- border-top-right-radius: var(--x-size-base-12) !important;
3862
+ [dir="rtl"] .x-border-radius--right-07 {
3863
+ border-top-left-radius: var(--x-size-base-07) !important;
3856
3864
  }
3857
- [dir="rtl"] .x-border-radius--top-right-12 {
3858
- border-top-left-radius: var(--x-size-base-12) !important;
3865
+ [dir="ltr"] .x-border-radius--right-07 {
3866
+ border-bottom-right-radius: var(--x-size-base-07) !important;
3859
3867
  }
3860
- [dir="ltr"] .x-border-radius--bottom-left-12 {
3861
- border-bottom-left-radius: var(--x-size-base-12) !important;
3868
+ [dir="rtl"] .x-border-radius--right-07 {
3869
+ border-bottom-left-radius: var(--x-size-base-07) !important;
3862
3870
  }
3863
- [dir="rtl"] .x-border-radius--bottom-left-12 {
3864
- border-bottom-right-radius: var(--x-size-base-12) !important;
3871
+ [dir="ltr"] .x-border-radius--left-07 {
3872
+ border-top-left-radius: var(--x-size-base-07) !important;
3865
3873
  }
3866
- [dir="ltr"] .x-border-radius--bottom-right-12 {
3867
- border-bottom-right-radius: var(--x-size-base-12) !important;
3874
+ [dir="rtl"] .x-border-radius--left-07 {
3875
+ border-top-right-radius: var(--x-size-base-07) !important;
3868
3876
  }
3869
- [dir="rtl"] .x-border-radius--bottom-right-12 {
3870
- border-bottom-left-radius: var(--x-size-base-12) !important;
3877
+ [dir="ltr"] .x-border-radius--left-07 {
3878
+ border-bottom-left-radius: var(--x-size-base-07) !important;
3871
3879
  }
3872
- .x-border-radius--13 {
3873
- border-radius: var(--x-size-base-13) !important;
3880
+ [dir="rtl"] .x-border-radius--left-07 {
3881
+ border-bottom-right-radius: var(--x-size-base-07) !important;
3874
3882
  }
3875
- [dir="ltr"] .x-border-radius--top-13 {
3876
- border-top-left-radius: var(--x-size-base-13) !important;
3883
+ [dir="ltr"] .x-border-radius--top-left-07 {
3884
+ border-top-left-radius: var(--x-size-base-07) !important;
3877
3885
  }
3878
- [dir="rtl"] .x-border-radius--top-13 {
3879
- border-top-right-radius: var(--x-size-base-13) !important;
3886
+ [dir="rtl"] .x-border-radius--top-left-07 {
3887
+ border-top-right-radius: var(--x-size-base-07) !important;
3880
3888
  }
3881
- [dir="ltr"] .x-border-radius--top-13 {
3882
- border-top-right-radius: var(--x-size-base-13) !important;
3889
+ [dir="ltr"] .x-border-radius--top-right-07 {
3890
+ border-top-right-radius: var(--x-size-base-07) !important;
3883
3891
  }
3884
- [dir="rtl"] .x-border-radius--top-13 {
3885
- border-top-left-radius: var(--x-size-base-13) !important;
3892
+ [dir="rtl"] .x-border-radius--top-right-07 {
3893
+ border-top-left-radius: var(--x-size-base-07) !important;
3886
3894
  }
3887
- [dir="ltr"] .x-border-radius--bottom-13 {
3888
- border-bottom-left-radius: var(--x-size-base-13) !important;
3895
+ [dir="ltr"] .x-border-radius--bottom-left-07 {
3896
+ border-bottom-left-radius: var(--x-size-base-07) !important;
3889
3897
  }
3890
- [dir="rtl"] .x-border-radius--bottom-13 {
3891
- border-bottom-right-radius: var(--x-size-base-13) !important;
3898
+ [dir="rtl"] .x-border-radius--bottom-left-07 {
3899
+ border-bottom-right-radius: var(--x-size-base-07) !important;
3892
3900
  }
3893
- [dir="ltr"] .x-border-radius--bottom-13 {
3894
- border-bottom-right-radius: var(--x-size-base-13) !important;
3901
+ [dir="ltr"] .x-border-radius--bottom-right-07 {
3902
+ border-bottom-right-radius: var(--x-size-base-07) !important;
3895
3903
  }
3896
- [dir="rtl"] .x-border-radius--bottom-13 {
3897
- border-bottom-left-radius: var(--x-size-base-13) !important;
3904
+ [dir="rtl"] .x-border-radius--bottom-right-07 {
3905
+ border-bottom-left-radius: var(--x-size-base-07) !important;
3898
3906
  }
3899
- [dir="ltr"] .x-border-radius--right-13 {
3900
- border-top-right-radius: var(--x-size-base-13) !important;
3907
+ .x-border-radius--08 {
3908
+ border-radius: var(--x-size-base-08) !important;
3901
3909
  }
3902
- [dir="rtl"] .x-border-radius--right-13 {
3903
- border-top-left-radius: var(--x-size-base-13) !important;
3910
+ [dir="ltr"] .x-border-radius--top-08 {
3911
+ border-top-left-radius: var(--x-size-base-08) !important;
3904
3912
  }
3905
- [dir="ltr"] .x-border-radius--right-13 {
3906
- border-bottom-right-radius: var(--x-size-base-13) !important;
3913
+ [dir="rtl"] .x-border-radius--top-08 {
3914
+ border-top-right-radius: var(--x-size-base-08) !important;
3907
3915
  }
3908
- [dir="rtl"] .x-border-radius--right-13 {
3909
- border-bottom-left-radius: var(--x-size-base-13) !important;
3916
+ [dir="ltr"] .x-border-radius--top-08 {
3917
+ border-top-right-radius: var(--x-size-base-08) !important;
3910
3918
  }
3911
- [dir="ltr"] .x-border-radius--left-13 {
3912
- border-top-left-radius: var(--x-size-base-13) !important;
3919
+ [dir="rtl"] .x-border-radius--top-08 {
3920
+ border-top-left-radius: var(--x-size-base-08) !important;
3913
3921
  }
3914
- [dir="rtl"] .x-border-radius--left-13 {
3915
- border-top-right-radius: var(--x-size-base-13) !important;
3922
+ [dir="ltr"] .x-border-radius--bottom-08 {
3923
+ border-bottom-left-radius: var(--x-size-base-08) !important;
3916
3924
  }
3917
- [dir="ltr"] .x-border-radius--left-13 {
3918
- border-bottom-left-radius: var(--x-size-base-13) !important;
3925
+ [dir="rtl"] .x-border-radius--bottom-08 {
3926
+ border-bottom-right-radius: var(--x-size-base-08) !important;
3919
3927
  }
3920
- [dir="rtl"] .x-border-radius--left-13 {
3921
- border-bottom-right-radius: var(--x-size-base-13) !important;
3928
+ [dir="ltr"] .x-border-radius--bottom-08 {
3929
+ border-bottom-right-radius: var(--x-size-base-08) !important;
3922
3930
  }
3923
- [dir="ltr"] .x-border-radius--top-left-13 {
3924
- border-top-left-radius: var(--x-size-base-13) !important;
3931
+ [dir="rtl"] .x-border-radius--bottom-08 {
3932
+ border-bottom-left-radius: var(--x-size-base-08) !important;
3925
3933
  }
3926
- [dir="rtl"] .x-border-radius--top-left-13 {
3927
- border-top-right-radius: var(--x-size-base-13) !important;
3934
+ [dir="ltr"] .x-border-radius--right-08 {
3935
+ border-top-right-radius: var(--x-size-base-08) !important;
3928
3936
  }
3929
- [dir="ltr"] .x-border-radius--top-right-13 {
3930
- border-top-right-radius: var(--x-size-base-13) !important;
3937
+ [dir="rtl"] .x-border-radius--right-08 {
3938
+ border-top-left-radius: var(--x-size-base-08) !important;
3931
3939
  }
3932
- [dir="rtl"] .x-border-radius--top-right-13 {
3933
- border-top-left-radius: var(--x-size-base-13) !important;
3940
+ [dir="ltr"] .x-border-radius--right-08 {
3941
+ border-bottom-right-radius: var(--x-size-base-08) !important;
3934
3942
  }
3935
- [dir="ltr"] .x-border-radius--bottom-left-13 {
3936
- border-bottom-left-radius: var(--x-size-base-13) !important;
3943
+ [dir="rtl"] .x-border-radius--right-08 {
3944
+ border-bottom-left-radius: var(--x-size-base-08) !important;
3937
3945
  }
3938
- [dir="rtl"] .x-border-radius--bottom-left-13 {
3939
- border-bottom-right-radius: var(--x-size-base-13) !important;
3946
+ [dir="ltr"] .x-border-radius--left-08 {
3947
+ border-top-left-radius: var(--x-size-base-08) !important;
3940
3948
  }
3941
- [dir="ltr"] .x-border-radius--bottom-right-13 {
3942
- border-bottom-right-radius: var(--x-size-base-13) !important;
3949
+ [dir="rtl"] .x-border-radius--left-08 {
3950
+ border-top-right-radius: var(--x-size-base-08) !important;
3943
3951
  }
3944
- [dir="rtl"] .x-border-radius--bottom-right-13 {
3945
- border-bottom-left-radius: var(--x-size-base-13) !important;
3952
+ [dir="ltr"] .x-border-radius--left-08 {
3953
+ border-bottom-left-radius: var(--x-size-base-08) !important;
3946
3954
  }
3947
- .x-border-radius--14 {
3948
- border-radius: var(--x-size-base-14) !important;
3955
+ [dir="rtl"] .x-border-radius--left-08 {
3956
+ border-bottom-right-radius: var(--x-size-base-08) !important;
3949
3957
  }
3950
- [dir="ltr"] .x-border-radius--top-14 {
3951
- border-top-left-radius: var(--x-size-base-14) !important;
3958
+ [dir="ltr"] .x-border-radius--top-left-08 {
3959
+ border-top-left-radius: var(--x-size-base-08) !important;
3952
3960
  }
3953
- [dir="rtl"] .x-border-radius--top-14 {
3954
- border-top-right-radius: var(--x-size-base-14) !important;
3961
+ [dir="rtl"] .x-border-radius--top-left-08 {
3962
+ border-top-right-radius: var(--x-size-base-08) !important;
3955
3963
  }
3956
- [dir="ltr"] .x-border-radius--top-14 {
3957
- border-top-right-radius: var(--x-size-base-14) !important;
3964
+ [dir="ltr"] .x-border-radius--top-right-08 {
3965
+ border-top-right-radius: var(--x-size-base-08) !important;
3958
3966
  }
3959
- [dir="rtl"] .x-border-radius--top-14 {
3960
- border-top-left-radius: var(--x-size-base-14) !important;
3967
+ [dir="rtl"] .x-border-radius--top-right-08 {
3968
+ border-top-left-radius: var(--x-size-base-08) !important;
3961
3969
  }
3962
- [dir="ltr"] .x-border-radius--bottom-14 {
3963
- border-bottom-left-radius: var(--x-size-base-14) !important;
3970
+ [dir="ltr"] .x-border-radius--bottom-left-08 {
3971
+ border-bottom-left-radius: var(--x-size-base-08) !important;
3964
3972
  }
3965
- [dir="rtl"] .x-border-radius--bottom-14 {
3966
- border-bottom-right-radius: var(--x-size-base-14) !important;
3973
+ [dir="rtl"] .x-border-radius--bottom-left-08 {
3974
+ border-bottom-right-radius: var(--x-size-base-08) !important;
3967
3975
  }
3968
- [dir="ltr"] .x-border-radius--bottom-14 {
3969
- border-bottom-right-radius: var(--x-size-base-14) !important;
3976
+ [dir="ltr"] .x-border-radius--bottom-right-08 {
3977
+ border-bottom-right-radius: var(--x-size-base-08) !important;
3970
3978
  }
3971
- [dir="rtl"] .x-border-radius--bottom-14 {
3972
- border-bottom-left-radius: var(--x-size-base-14) !important;
3979
+ [dir="rtl"] .x-border-radius--bottom-right-08 {
3980
+ border-bottom-left-radius: var(--x-size-base-08) !important;
3973
3981
  }
3974
- [dir="ltr"] .x-border-radius--right-14 {
3975
- border-top-right-radius: var(--x-size-base-14) !important;
3982
+ .x-border-radius--09 {
3983
+ border-radius: var(--x-size-base-09) !important;
3976
3984
  }
3977
- [dir="rtl"] .x-border-radius--right-14 {
3978
- border-top-left-radius: var(--x-size-base-14) !important;
3985
+ [dir="ltr"] .x-border-radius--top-09 {
3986
+ border-top-left-radius: var(--x-size-base-09) !important;
3979
3987
  }
3980
- [dir="ltr"] .x-border-radius--right-14 {
3981
- border-bottom-right-radius: var(--x-size-base-14) !important;
3988
+ [dir="rtl"] .x-border-radius--top-09 {
3989
+ border-top-right-radius: var(--x-size-base-09) !important;
3982
3990
  }
3983
- [dir="rtl"] .x-border-radius--right-14 {
3984
- border-bottom-left-radius: var(--x-size-base-14) !important;
3991
+ [dir="ltr"] .x-border-radius--top-09 {
3992
+ border-top-right-radius: var(--x-size-base-09) !important;
3985
3993
  }
3986
- [dir="ltr"] .x-border-radius--left-14 {
3987
- border-top-left-radius: var(--x-size-base-14) !important;
3994
+ [dir="rtl"] .x-border-radius--top-09 {
3995
+ border-top-left-radius: var(--x-size-base-09) !important;
3988
3996
  }
3989
- [dir="rtl"] .x-border-radius--left-14 {
3990
- border-top-right-radius: var(--x-size-base-14) !important;
3997
+ [dir="ltr"] .x-border-radius--bottom-09 {
3998
+ border-bottom-left-radius: var(--x-size-base-09) !important;
3991
3999
  }
3992
- [dir="ltr"] .x-border-radius--left-14 {
3993
- border-bottom-left-radius: var(--x-size-base-14) !important;
4000
+ [dir="rtl"] .x-border-radius--bottom-09 {
4001
+ border-bottom-right-radius: var(--x-size-base-09) !important;
3994
4002
  }
3995
- [dir="rtl"] .x-border-radius--left-14 {
3996
- border-bottom-right-radius: var(--x-size-base-14) !important;
4003
+ [dir="ltr"] .x-border-radius--bottom-09 {
4004
+ border-bottom-right-radius: var(--x-size-base-09) !important;
3997
4005
  }
3998
- [dir="ltr"] .x-border-radius--top-left-14 {
3999
- border-top-left-radius: var(--x-size-base-14) !important;
4006
+ [dir="rtl"] .x-border-radius--bottom-09 {
4007
+ border-bottom-left-radius: var(--x-size-base-09) !important;
4000
4008
  }
4001
- [dir="rtl"] .x-border-radius--top-left-14 {
4002
- border-top-right-radius: var(--x-size-base-14) !important;
4009
+ [dir="ltr"] .x-border-radius--right-09 {
4010
+ border-top-right-radius: var(--x-size-base-09) !important;
4003
4011
  }
4004
- [dir="ltr"] .x-border-radius--top-right-14 {
4005
- border-top-right-radius: var(--x-size-base-14) !important;
4012
+ [dir="rtl"] .x-border-radius--right-09 {
4013
+ border-top-left-radius: var(--x-size-base-09) !important;
4006
4014
  }
4007
- [dir="rtl"] .x-border-radius--top-right-14 {
4008
- border-top-left-radius: var(--x-size-base-14) !important;
4015
+ [dir="ltr"] .x-border-radius--right-09 {
4016
+ border-bottom-right-radius: var(--x-size-base-09) !important;
4009
4017
  }
4010
- [dir="ltr"] .x-border-radius--bottom-left-14 {
4011
- border-bottom-left-radius: var(--x-size-base-14) !important;
4018
+ [dir="rtl"] .x-border-radius--right-09 {
4019
+ border-bottom-left-radius: var(--x-size-base-09) !important;
4012
4020
  }
4013
- [dir="rtl"] .x-border-radius--bottom-left-14 {
4014
- border-bottom-right-radius: var(--x-size-base-14) !important;
4021
+ [dir="ltr"] .x-border-radius--left-09 {
4022
+ border-top-left-radius: var(--x-size-base-09) !important;
4015
4023
  }
4016
- [dir="ltr"] .x-border-radius--bottom-right-14 {
4017
- border-bottom-right-radius: var(--x-size-base-14) !important;
4024
+ [dir="rtl"] .x-border-radius--left-09 {
4025
+ border-top-right-radius: var(--x-size-base-09) !important;
4018
4026
  }
4019
- [dir="rtl"] .x-border-radius--bottom-right-14 {
4020
- border-bottom-left-radius: var(--x-size-base-14) !important;
4027
+ [dir="ltr"] .x-border-radius--left-09 {
4028
+ border-bottom-left-radius: var(--x-size-base-09) !important;
4021
4029
  }
4022
- .x-border-radius--15 {
4023
- border-radius: var(--x-size-base-15) !important;
4030
+ [dir="rtl"] .x-border-radius--left-09 {
4031
+ border-bottom-right-radius: var(--x-size-base-09) !important;
4024
4032
  }
4025
- [dir="ltr"] .x-border-radius--top-15 {
4026
- border-top-left-radius: var(--x-size-base-15) !important;
4033
+ [dir="ltr"] .x-border-radius--top-left-09 {
4034
+ border-top-left-radius: var(--x-size-base-09) !important;
4027
4035
  }
4028
- [dir="rtl"] .x-border-radius--top-15 {
4029
- border-top-right-radius: var(--x-size-base-15) !important;
4036
+ [dir="rtl"] .x-border-radius--top-left-09 {
4037
+ border-top-right-radius: var(--x-size-base-09) !important;
4030
4038
  }
4031
- [dir="ltr"] .x-border-radius--top-15 {
4032
- border-top-right-radius: var(--x-size-base-15) !important;
4039
+ [dir="ltr"] .x-border-radius--top-right-09 {
4040
+ border-top-right-radius: var(--x-size-base-09) !important;
4033
4041
  }
4034
- [dir="rtl"] .x-border-radius--top-15 {
4035
- border-top-left-radius: var(--x-size-base-15) !important;
4042
+ [dir="rtl"] .x-border-radius--top-right-09 {
4043
+ border-top-left-radius: var(--x-size-base-09) !important;
4036
4044
  }
4037
- [dir="ltr"] .x-border-radius--bottom-15 {
4038
- border-bottom-left-radius: var(--x-size-base-15) !important;
4045
+ [dir="ltr"] .x-border-radius--bottom-left-09 {
4046
+ border-bottom-left-radius: var(--x-size-base-09) !important;
4039
4047
  }
4040
- [dir="rtl"] .x-border-radius--bottom-15 {
4041
- border-bottom-right-radius: var(--x-size-base-15) !important;
4048
+ [dir="rtl"] .x-border-radius--bottom-left-09 {
4049
+ border-bottom-right-radius: var(--x-size-base-09) !important;
4042
4050
  }
4043
- [dir="ltr"] .x-border-radius--bottom-15 {
4044
- border-bottom-right-radius: var(--x-size-base-15) !important;
4051
+ [dir="ltr"] .x-border-radius--bottom-right-09 {
4052
+ border-bottom-right-radius: var(--x-size-base-09) !important;
4045
4053
  }
4046
- [dir="rtl"] .x-border-radius--bottom-15 {
4047
- border-bottom-left-radius: var(--x-size-base-15) !important;
4054
+ [dir="rtl"] .x-border-radius--bottom-right-09 {
4055
+ border-bottom-left-radius: var(--x-size-base-09) !important;
4048
4056
  }
4049
- [dir="ltr"] .x-border-radius--right-15 {
4050
- border-top-right-radius: var(--x-size-base-15) !important;
4057
+ .x-border-radius--10 {
4058
+ border-radius: var(--x-size-base-10) !important;
4051
4059
  }
4052
- [dir="rtl"] .x-border-radius--right-15 {
4053
- border-top-left-radius: var(--x-size-base-15) !important;
4060
+ [dir="ltr"] .x-border-radius--top-10 {
4061
+ border-top-left-radius: var(--x-size-base-10) !important;
4054
4062
  }
4055
- [dir="ltr"] .x-border-radius--right-15 {
4056
- border-bottom-right-radius: var(--x-size-base-15) !important;
4063
+ [dir="rtl"] .x-border-radius--top-10 {
4064
+ border-top-right-radius: var(--x-size-base-10) !important;
4057
4065
  }
4058
- [dir="rtl"] .x-border-radius--right-15 {
4059
- border-bottom-left-radius: var(--x-size-base-15) !important;
4066
+ [dir="ltr"] .x-border-radius--top-10 {
4067
+ border-top-right-radius: var(--x-size-base-10) !important;
4060
4068
  }
4061
- [dir="ltr"] .x-border-radius--left-15 {
4062
- border-top-left-radius: var(--x-size-base-15) !important;
4069
+ [dir="rtl"] .x-border-radius--top-10 {
4070
+ border-top-left-radius: var(--x-size-base-10) !important;
4063
4071
  }
4064
- [dir="rtl"] .x-border-radius--left-15 {
4065
- border-top-right-radius: var(--x-size-base-15) !important;
4072
+ [dir="ltr"] .x-border-radius--bottom-10 {
4073
+ border-bottom-left-radius: var(--x-size-base-10) !important;
4066
4074
  }
4067
- [dir="ltr"] .x-border-radius--left-15 {
4068
- border-bottom-left-radius: var(--x-size-base-15) !important;
4075
+ [dir="rtl"] .x-border-radius--bottom-10 {
4076
+ border-bottom-right-radius: var(--x-size-base-10) !important;
4069
4077
  }
4070
- [dir="rtl"] .x-border-radius--left-15 {
4071
- border-bottom-right-radius: var(--x-size-base-15) !important;
4078
+ [dir="ltr"] .x-border-radius--bottom-10 {
4079
+ border-bottom-right-radius: var(--x-size-base-10) !important;
4072
4080
  }
4073
- [dir="ltr"] .x-border-radius--top-left-15 {
4074
- border-top-left-radius: var(--x-size-base-15) !important;
4081
+ [dir="rtl"] .x-border-radius--bottom-10 {
4082
+ border-bottom-left-radius: var(--x-size-base-10) !important;
4075
4083
  }
4076
- [dir="rtl"] .x-border-radius--top-left-15 {
4077
- border-top-right-radius: var(--x-size-base-15) !important;
4084
+ [dir="ltr"] .x-border-radius--right-10 {
4085
+ border-top-right-radius: var(--x-size-base-10) !important;
4078
4086
  }
4079
- [dir="ltr"] .x-border-radius--top-right-15 {
4080
- border-top-right-radius: var(--x-size-base-15) !important;
4087
+ [dir="rtl"] .x-border-radius--right-10 {
4088
+ border-top-left-radius: var(--x-size-base-10) !important;
4081
4089
  }
4082
- [dir="rtl"] .x-border-radius--top-right-15 {
4083
- border-top-left-radius: var(--x-size-base-15) !important;
4090
+ [dir="ltr"] .x-border-radius--right-10 {
4091
+ border-bottom-right-radius: var(--x-size-base-10) !important;
4084
4092
  }
4085
- [dir="ltr"] .x-border-radius--bottom-left-15 {
4086
- border-bottom-left-radius: var(--x-size-base-15) !important;
4093
+ [dir="rtl"] .x-border-radius--right-10 {
4094
+ border-bottom-left-radius: var(--x-size-base-10) !important;
4087
4095
  }
4088
- [dir="rtl"] .x-border-radius--bottom-left-15 {
4089
- border-bottom-right-radius: var(--x-size-base-15) !important;
4096
+ [dir="ltr"] .x-border-radius--left-10 {
4097
+ border-top-left-radius: var(--x-size-base-10) !important;
4090
4098
  }
4091
- [dir="ltr"] .x-border-radius--bottom-right-15 {
4092
- border-bottom-right-radius: var(--x-size-base-15) !important;
4099
+ [dir="rtl"] .x-border-radius--left-10 {
4100
+ border-top-right-radius: var(--x-size-base-10) !important;
4093
4101
  }
4094
- [dir="rtl"] .x-border-radius--bottom-right-15 {
4095
- border-bottom-left-radius: var(--x-size-base-15) !important;
4102
+ [dir="ltr"] .x-border-radius--left-10 {
4103
+ border-bottom-left-radius: var(--x-size-base-10) !important;
4096
4104
  }
4097
- .x-border-radius--16 {
4098
- border-radius: var(--x-size-base-16) !important;
4105
+ [dir="rtl"] .x-border-radius--left-10 {
4106
+ border-bottom-right-radius: var(--x-size-base-10) !important;
4099
4107
  }
4100
- [dir="ltr"] .x-border-radius--top-16 {
4101
- border-top-left-radius: var(--x-size-base-16) !important;
4108
+ [dir="ltr"] .x-border-radius--top-left-10 {
4109
+ border-top-left-radius: var(--x-size-base-10) !important;
4102
4110
  }
4103
- [dir="rtl"] .x-border-radius--top-16 {
4104
- border-top-right-radius: var(--x-size-base-16) !important;
4111
+ [dir="rtl"] .x-border-radius--top-left-10 {
4112
+ border-top-right-radius: var(--x-size-base-10) !important;
4105
4113
  }
4106
- [dir="ltr"] .x-border-radius--top-16 {
4107
- border-top-right-radius: var(--x-size-base-16) !important;
4114
+ [dir="ltr"] .x-border-radius--top-right-10 {
4115
+ border-top-right-radius: var(--x-size-base-10) !important;
4108
4116
  }
4109
- [dir="rtl"] .x-border-radius--top-16 {
4110
- border-top-left-radius: var(--x-size-base-16) !important;
4117
+ [dir="rtl"] .x-border-radius--top-right-10 {
4118
+ border-top-left-radius: var(--x-size-base-10) !important;
4111
4119
  }
4112
- [dir="ltr"] .x-border-radius--bottom-16 {
4113
- border-bottom-left-radius: var(--x-size-base-16) !important;
4120
+ [dir="ltr"] .x-border-radius--bottom-left-10 {
4121
+ border-bottom-left-radius: var(--x-size-base-10) !important;
4114
4122
  }
4115
- [dir="rtl"] .x-border-radius--bottom-16 {
4116
- border-bottom-right-radius: var(--x-size-base-16) !important;
4123
+ [dir="rtl"] .x-border-radius--bottom-left-10 {
4124
+ border-bottom-right-radius: var(--x-size-base-10) !important;
4117
4125
  }
4118
- [dir="ltr"] .x-border-radius--bottom-16 {
4119
- border-bottom-right-radius: var(--x-size-base-16) !important;
4126
+ [dir="ltr"] .x-border-radius--bottom-right-10 {
4127
+ border-bottom-right-radius: var(--x-size-base-10) !important;
4120
4128
  }
4121
- [dir="rtl"] .x-border-radius--bottom-16 {
4122
- border-bottom-left-radius: var(--x-size-base-16) !important;
4129
+ [dir="rtl"] .x-border-radius--bottom-right-10 {
4130
+ border-bottom-left-radius: var(--x-size-base-10) !important;
4123
4131
  }
4124
- [dir="ltr"] .x-border-radius--right-16 {
4125
- border-top-right-radius: var(--x-size-base-16) !important;
4132
+ .x-border-radius--11 {
4133
+ border-radius: var(--x-size-base-11) !important;
4126
4134
  }
4127
- [dir="rtl"] .x-border-radius--right-16 {
4128
- border-top-left-radius: var(--x-size-base-16) !important;
4135
+ [dir="ltr"] .x-border-radius--top-11 {
4136
+ border-top-left-radius: var(--x-size-base-11) !important;
4129
4137
  }
4130
- [dir="ltr"] .x-border-radius--right-16 {
4131
- border-bottom-right-radius: var(--x-size-base-16) !important;
4138
+ [dir="rtl"] .x-border-radius--top-11 {
4139
+ border-top-right-radius: var(--x-size-base-11) !important;
4132
4140
  }
4133
- [dir="rtl"] .x-border-radius--right-16 {
4134
- border-bottom-left-radius: var(--x-size-base-16) !important;
4141
+ [dir="ltr"] .x-border-radius--top-11 {
4142
+ border-top-right-radius: var(--x-size-base-11) !important;
4135
4143
  }
4136
- [dir="ltr"] .x-border-radius--left-16 {
4137
- border-top-left-radius: var(--x-size-base-16) !important;
4144
+ [dir="rtl"] .x-border-radius--top-11 {
4145
+ border-top-left-radius: var(--x-size-base-11) !important;
4138
4146
  }
4139
- [dir="rtl"] .x-border-radius--left-16 {
4140
- border-top-right-radius: var(--x-size-base-16) !important;
4147
+ [dir="ltr"] .x-border-radius--bottom-11 {
4148
+ border-bottom-left-radius: var(--x-size-base-11) !important;
4141
4149
  }
4142
- [dir="ltr"] .x-border-radius--left-16 {
4143
- border-bottom-left-radius: var(--x-size-base-16) !important;
4150
+ [dir="rtl"] .x-border-radius--bottom-11 {
4151
+ border-bottom-right-radius: var(--x-size-base-11) !important;
4144
4152
  }
4145
- [dir="rtl"] .x-border-radius--left-16 {
4146
- border-bottom-right-radius: var(--x-size-base-16) !important;
4153
+ [dir="ltr"] .x-border-radius--bottom-11 {
4154
+ border-bottom-right-radius: var(--x-size-base-11) !important;
4147
4155
  }
4148
- [dir="ltr"] .x-border-radius--top-left-16 {
4149
- border-top-left-radius: var(--x-size-base-16) !important;
4156
+ [dir="rtl"] .x-border-radius--bottom-11 {
4157
+ border-bottom-left-radius: var(--x-size-base-11) !important;
4150
4158
  }
4151
- [dir="rtl"] .x-border-radius--top-left-16 {
4152
- border-top-right-radius: var(--x-size-base-16) !important;
4159
+ [dir="ltr"] .x-border-radius--right-11 {
4160
+ border-top-right-radius: var(--x-size-base-11) !important;
4153
4161
  }
4154
- [dir="ltr"] .x-border-radius--top-right-16 {
4155
- border-top-right-radius: var(--x-size-base-16) !important;
4162
+ [dir="rtl"] .x-border-radius--right-11 {
4163
+ border-top-left-radius: var(--x-size-base-11) !important;
4156
4164
  }
4157
- [dir="rtl"] .x-border-radius--top-right-16 {
4158
- border-top-left-radius: var(--x-size-base-16) !important;
4165
+ [dir="ltr"] .x-border-radius--right-11 {
4166
+ border-bottom-right-radius: var(--x-size-base-11) !important;
4159
4167
  }
4160
- [dir="ltr"] .x-border-radius--bottom-left-16 {
4161
- border-bottom-left-radius: var(--x-size-base-16) !important;
4168
+ [dir="rtl"] .x-border-radius--right-11 {
4169
+ border-bottom-left-radius: var(--x-size-base-11) !important;
4162
4170
  }
4163
- [dir="rtl"] .x-border-radius--bottom-left-16 {
4164
- border-bottom-right-radius: var(--x-size-base-16) !important;
4171
+ [dir="ltr"] .x-border-radius--left-11 {
4172
+ border-top-left-radius: var(--x-size-base-11) !important;
4165
4173
  }
4166
- [dir="ltr"] .x-border-radius--bottom-right-16 {
4167
- border-bottom-right-radius: var(--x-size-base-16) !important;
4174
+ [dir="rtl"] .x-border-radius--left-11 {
4175
+ border-top-right-radius: var(--x-size-base-11) !important;
4168
4176
  }
4169
- [dir="rtl"] .x-border-radius--bottom-right-16 {
4170
- border-bottom-left-radius: var(--x-size-base-16) !important;
4177
+ [dir="ltr"] .x-border-radius--left-11 {
4178
+ border-bottom-left-radius: var(--x-size-base-11) !important;
4171
4179
  }
4172
- .x-border-radius--17 {
4173
- border-radius: var(--x-size-base-17) !important;
4180
+ [dir="rtl"] .x-border-radius--left-11 {
4181
+ border-bottom-right-radius: var(--x-size-base-11) !important;
4174
4182
  }
4175
- [dir="ltr"] .x-border-radius--top-17 {
4176
- border-top-left-radius: var(--x-size-base-17) !important;
4183
+ [dir="ltr"] .x-border-radius--top-left-11 {
4184
+ border-top-left-radius: var(--x-size-base-11) !important;
4177
4185
  }
4178
- [dir="rtl"] .x-border-radius--top-17 {
4179
- border-top-right-radius: var(--x-size-base-17) !important;
4186
+ [dir="rtl"] .x-border-radius--top-left-11 {
4187
+ border-top-right-radius: var(--x-size-base-11) !important;
4180
4188
  }
4181
- [dir="ltr"] .x-border-radius--top-17 {
4182
- border-top-right-radius: var(--x-size-base-17) !important;
4189
+ [dir="ltr"] .x-border-radius--top-right-11 {
4190
+ border-top-right-radius: var(--x-size-base-11) !important;
4183
4191
  }
4184
- [dir="rtl"] .x-border-radius--top-17 {
4185
- border-top-left-radius: var(--x-size-base-17) !important;
4192
+ [dir="rtl"] .x-border-radius--top-right-11 {
4193
+ border-top-left-radius: var(--x-size-base-11) !important;
4186
4194
  }
4187
- [dir="ltr"] .x-border-radius--bottom-17 {
4188
- border-bottom-left-radius: var(--x-size-base-17) !important;
4195
+ [dir="ltr"] .x-border-radius--bottom-left-11 {
4196
+ border-bottom-left-radius: var(--x-size-base-11) !important;
4189
4197
  }
4190
- [dir="rtl"] .x-border-radius--bottom-17 {
4191
- border-bottom-right-radius: var(--x-size-base-17) !important;
4198
+ [dir="rtl"] .x-border-radius--bottom-left-11 {
4199
+ border-bottom-right-radius: var(--x-size-base-11) !important;
4192
4200
  }
4193
- [dir="ltr"] .x-border-radius--bottom-17 {
4194
- border-bottom-right-radius: var(--x-size-base-17) !important;
4201
+ [dir="ltr"] .x-border-radius--bottom-right-11 {
4202
+ border-bottom-right-radius: var(--x-size-base-11) !important;
4195
4203
  }
4196
- [dir="rtl"] .x-border-radius--bottom-17 {
4197
- border-bottom-left-radius: var(--x-size-base-17) !important;
4204
+ [dir="rtl"] .x-border-radius--bottom-right-11 {
4205
+ border-bottom-left-radius: var(--x-size-base-11) !important;
4198
4206
  }
4199
- [dir="ltr"] .x-border-radius--right-17 {
4200
- border-top-right-radius: var(--x-size-base-17) !important;
4207
+ .x-border-radius--12 {
4208
+ border-radius: var(--x-size-base-12) !important;
4201
4209
  }
4202
- [dir="rtl"] .x-border-radius--right-17 {
4203
- border-top-left-radius: var(--x-size-base-17) !important;
4210
+ [dir="ltr"] .x-border-radius--top-12 {
4211
+ border-top-left-radius: var(--x-size-base-12) !important;
4204
4212
  }
4205
- [dir="ltr"] .x-border-radius--right-17 {
4206
- border-bottom-right-radius: var(--x-size-base-17) !important;
4213
+ [dir="rtl"] .x-border-radius--top-12 {
4214
+ border-top-right-radius: var(--x-size-base-12) !important;
4207
4215
  }
4208
- [dir="rtl"] .x-border-radius--right-17 {
4209
- border-bottom-left-radius: var(--x-size-base-17) !important;
4216
+ [dir="ltr"] .x-border-radius--top-12 {
4217
+ border-top-right-radius: var(--x-size-base-12) !important;
4210
4218
  }
4211
- [dir="ltr"] .x-border-radius--left-17 {
4212
- border-top-left-radius: var(--x-size-base-17) !important;
4219
+ [dir="rtl"] .x-border-radius--top-12 {
4220
+ border-top-left-radius: var(--x-size-base-12) !important;
4213
4221
  }
4214
- [dir="rtl"] .x-border-radius--left-17 {
4215
- border-top-right-radius: var(--x-size-base-17) !important;
4222
+ [dir="ltr"] .x-border-radius--bottom-12 {
4223
+ border-bottom-left-radius: var(--x-size-base-12) !important;
4216
4224
  }
4217
- [dir="ltr"] .x-border-radius--left-17 {
4218
- border-bottom-left-radius: var(--x-size-base-17) !important;
4225
+ [dir="rtl"] .x-border-radius--bottom-12 {
4226
+ border-bottom-right-radius: var(--x-size-base-12) !important;
4219
4227
  }
4220
- [dir="rtl"] .x-border-radius--left-17 {
4221
- border-bottom-right-radius: var(--x-size-base-17) !important;
4228
+ [dir="ltr"] .x-border-radius--bottom-12 {
4229
+ border-bottom-right-radius: var(--x-size-base-12) !important;
4222
4230
  }
4223
- [dir="ltr"] .x-border-radius--top-left-17 {
4224
- border-top-left-radius: var(--x-size-base-17) !important;
4231
+ [dir="rtl"] .x-border-radius--bottom-12 {
4232
+ border-bottom-left-radius: var(--x-size-base-12) !important;
4225
4233
  }
4226
- [dir="rtl"] .x-border-radius--top-left-17 {
4227
- border-top-right-radius: var(--x-size-base-17) !important;
4234
+ [dir="ltr"] .x-border-radius--right-12 {
4235
+ border-top-right-radius: var(--x-size-base-12) !important;
4228
4236
  }
4229
- [dir="ltr"] .x-border-radius--top-right-17 {
4230
- border-top-right-radius: var(--x-size-base-17) !important;
4237
+ [dir="rtl"] .x-border-radius--right-12 {
4238
+ border-top-left-radius: var(--x-size-base-12) !important;
4231
4239
  }
4232
- [dir="rtl"] .x-border-radius--top-right-17 {
4233
- border-top-left-radius: var(--x-size-base-17) !important;
4240
+ [dir="ltr"] .x-border-radius--right-12 {
4241
+ border-bottom-right-radius: var(--x-size-base-12) !important;
4234
4242
  }
4235
- [dir="ltr"] .x-border-radius--bottom-left-17 {
4236
- border-bottom-left-radius: var(--x-size-base-17) !important;
4243
+ [dir="rtl"] .x-border-radius--right-12 {
4244
+ border-bottom-left-radius: var(--x-size-base-12) !important;
4237
4245
  }
4238
- [dir="rtl"] .x-border-radius--bottom-left-17 {
4239
- border-bottom-right-radius: var(--x-size-base-17) !important;
4246
+ [dir="ltr"] .x-border-radius--left-12 {
4247
+ border-top-left-radius: var(--x-size-base-12) !important;
4240
4248
  }
4241
- [dir="ltr"] .x-border-radius--bottom-right-17 {
4242
- border-bottom-right-radius: var(--x-size-base-17) !important;
4249
+ [dir="rtl"] .x-border-radius--left-12 {
4250
+ border-top-right-radius: var(--x-size-base-12) !important;
4243
4251
  }
4244
- [dir="rtl"] .x-border-radius--bottom-right-17 {
4245
- border-bottom-left-radius: var(--x-size-base-17) !important;
4252
+ [dir="ltr"] .x-border-radius--left-12 {
4253
+ border-bottom-left-radius: var(--x-size-base-12) !important;
4246
4254
  }
4247
- .x-border-radius--18 {
4248
- border-radius: var(--x-size-base-18) !important;
4255
+ [dir="rtl"] .x-border-radius--left-12 {
4256
+ border-bottom-right-radius: var(--x-size-base-12) !important;
4249
4257
  }
4250
- [dir="ltr"] .x-border-radius--top-18 {
4251
- border-top-left-radius: var(--x-size-base-18) !important;
4258
+ [dir="ltr"] .x-border-radius--top-left-12 {
4259
+ border-top-left-radius: var(--x-size-base-12) !important;
4252
4260
  }
4253
- [dir="rtl"] .x-border-radius--top-18 {
4254
- border-top-right-radius: var(--x-size-base-18) !important;
4261
+ [dir="rtl"] .x-border-radius--top-left-12 {
4262
+ border-top-right-radius: var(--x-size-base-12) !important;
4255
4263
  }
4256
- [dir="ltr"] .x-border-radius--top-18 {
4257
- border-top-right-radius: var(--x-size-base-18) !important;
4264
+ [dir="ltr"] .x-border-radius--top-right-12 {
4265
+ border-top-right-radius: var(--x-size-base-12) !important;
4258
4266
  }
4259
- [dir="rtl"] .x-border-radius--top-18 {
4260
- border-top-left-radius: var(--x-size-base-18) !important;
4267
+ [dir="rtl"] .x-border-radius--top-right-12 {
4268
+ border-top-left-radius: var(--x-size-base-12) !important;
4261
4269
  }
4262
- [dir="ltr"] .x-border-radius--bottom-18 {
4263
- border-bottom-left-radius: var(--x-size-base-18) !important;
4270
+ [dir="ltr"] .x-border-radius--bottom-left-12 {
4271
+ border-bottom-left-radius: var(--x-size-base-12) !important;
4264
4272
  }
4265
- [dir="rtl"] .x-border-radius--bottom-18 {
4266
- border-bottom-right-radius: var(--x-size-base-18) !important;
4273
+ [dir="rtl"] .x-border-radius--bottom-left-12 {
4274
+ border-bottom-right-radius: var(--x-size-base-12) !important;
4267
4275
  }
4268
- [dir="ltr"] .x-border-radius--bottom-18 {
4269
- border-bottom-right-radius: var(--x-size-base-18) !important;
4276
+ [dir="ltr"] .x-border-radius--bottom-right-12 {
4277
+ border-bottom-right-radius: var(--x-size-base-12) !important;
4270
4278
  }
4271
- [dir="rtl"] .x-border-radius--bottom-18 {
4272
- border-bottom-left-radius: var(--x-size-base-18) !important;
4279
+ [dir="rtl"] .x-border-radius--bottom-right-12 {
4280
+ border-bottom-left-radius: var(--x-size-base-12) !important;
4273
4281
  }
4274
- [dir="ltr"] .x-border-radius--right-18 {
4275
- border-top-right-radius: var(--x-size-base-18) !important;
4282
+ .x-border-radius--13 {
4283
+ border-radius: var(--x-size-base-13) !important;
4276
4284
  }
4277
- [dir="rtl"] .x-border-radius--right-18 {
4278
- border-top-left-radius: var(--x-size-base-18) !important;
4285
+ [dir="ltr"] .x-border-radius--top-13 {
4286
+ border-top-left-radius: var(--x-size-base-13) !important;
4279
4287
  }
4280
- [dir="ltr"] .x-border-radius--right-18 {
4281
- border-bottom-right-radius: var(--x-size-base-18) !important;
4288
+ [dir="rtl"] .x-border-radius--top-13 {
4289
+ border-top-right-radius: var(--x-size-base-13) !important;
4282
4290
  }
4283
- [dir="rtl"] .x-border-radius--right-18 {
4284
- border-bottom-left-radius: var(--x-size-base-18) !important;
4291
+ [dir="ltr"] .x-border-radius--top-13 {
4292
+ border-top-right-radius: var(--x-size-base-13) !important;
4285
4293
  }
4286
- [dir="ltr"] .x-border-radius--left-18 {
4287
- border-top-left-radius: var(--x-size-base-18) !important;
4294
+ [dir="rtl"] .x-border-radius--top-13 {
4295
+ border-top-left-radius: var(--x-size-base-13) !important;
4288
4296
  }
4289
- [dir="rtl"] .x-border-radius--left-18 {
4290
- border-top-right-radius: var(--x-size-base-18) !important;
4297
+ [dir="ltr"] .x-border-radius--bottom-13 {
4298
+ border-bottom-left-radius: var(--x-size-base-13) !important;
4291
4299
  }
4292
- [dir="ltr"] .x-border-radius--left-18 {
4293
- border-bottom-left-radius: var(--x-size-base-18) !important;
4300
+ [dir="rtl"] .x-border-radius--bottom-13 {
4301
+ border-bottom-right-radius: var(--x-size-base-13) !important;
4294
4302
  }
4295
- [dir="rtl"] .x-border-radius--left-18 {
4296
- border-bottom-right-radius: var(--x-size-base-18) !important;
4303
+ [dir="ltr"] .x-border-radius--bottom-13 {
4304
+ border-bottom-right-radius: var(--x-size-base-13) !important;
4297
4305
  }
4298
- [dir="ltr"] .x-border-radius--top-left-18 {
4299
- border-top-left-radius: var(--x-size-base-18) !important;
4306
+ [dir="rtl"] .x-border-radius--bottom-13 {
4307
+ border-bottom-left-radius: var(--x-size-base-13) !important;
4300
4308
  }
4301
- [dir="rtl"] .x-border-radius--top-left-18 {
4302
- border-top-right-radius: var(--x-size-base-18) !important;
4309
+ [dir="ltr"] .x-border-radius--right-13 {
4310
+ border-top-right-radius: var(--x-size-base-13) !important;
4303
4311
  }
4304
- [dir="ltr"] .x-border-radius--top-right-18 {
4305
- border-top-right-radius: var(--x-size-base-18) !important;
4312
+ [dir="rtl"] .x-border-radius--right-13 {
4313
+ border-top-left-radius: var(--x-size-base-13) !important;
4306
4314
  }
4307
- [dir="rtl"] .x-border-radius--top-right-18 {
4308
- border-top-left-radius: var(--x-size-base-18) !important;
4315
+ [dir="ltr"] .x-border-radius--right-13 {
4316
+ border-bottom-right-radius: var(--x-size-base-13) !important;
4309
4317
  }
4310
- [dir="ltr"] .x-border-radius--bottom-left-18 {
4311
- border-bottom-left-radius: var(--x-size-base-18) !important;
4318
+ [dir="rtl"] .x-border-radius--right-13 {
4319
+ border-bottom-left-radius: var(--x-size-base-13) !important;
4312
4320
  }
4313
- [dir="rtl"] .x-border-radius--bottom-left-18 {
4314
- border-bottom-right-radius: var(--x-size-base-18) !important;
4321
+ [dir="ltr"] .x-border-radius--left-13 {
4322
+ border-top-left-radius: var(--x-size-base-13) !important;
4315
4323
  }
4316
- [dir="ltr"] .x-border-radius--bottom-right-18 {
4317
- border-bottom-right-radius: var(--x-size-base-18) !important;
4324
+ [dir="rtl"] .x-border-radius--left-13 {
4325
+ border-top-right-radius: var(--x-size-base-13) !important;
4318
4326
  }
4319
- [dir="rtl"] .x-border-radius--bottom-right-18 {
4320
- border-bottom-left-radius: var(--x-size-base-18) !important;
4327
+ [dir="ltr"] .x-border-radius--left-13 {
4328
+ border-bottom-left-radius: var(--x-size-base-13) !important;
4321
4329
  }
4322
- .x-border-radius--19 {
4323
- border-radius: var(--x-size-base-19) !important;
4330
+ [dir="rtl"] .x-border-radius--left-13 {
4331
+ border-bottom-right-radius: var(--x-size-base-13) !important;
4324
4332
  }
4325
- [dir="ltr"] .x-border-radius--top-19 {
4326
- border-top-left-radius: var(--x-size-base-19) !important;
4333
+ [dir="ltr"] .x-border-radius--top-left-13 {
4334
+ border-top-left-radius: var(--x-size-base-13) !important;
4327
4335
  }
4328
- [dir="rtl"] .x-border-radius--top-19 {
4329
- border-top-right-radius: var(--x-size-base-19) !important;
4336
+ [dir="rtl"] .x-border-radius--top-left-13 {
4337
+ border-top-right-radius: var(--x-size-base-13) !important;
4330
4338
  }
4331
- [dir="ltr"] .x-border-radius--top-19 {
4332
- border-top-right-radius: var(--x-size-base-19) !important;
4339
+ [dir="ltr"] .x-border-radius--top-right-13 {
4340
+ border-top-right-radius: var(--x-size-base-13) !important;
4333
4341
  }
4334
- [dir="rtl"] .x-border-radius--top-19 {
4335
- border-top-left-radius: var(--x-size-base-19) !important;
4342
+ [dir="rtl"] .x-border-radius--top-right-13 {
4343
+ border-top-left-radius: var(--x-size-base-13) !important;
4336
4344
  }
4337
- [dir="ltr"] .x-border-radius--bottom-19 {
4338
- border-bottom-left-radius: var(--x-size-base-19) !important;
4345
+ [dir="ltr"] .x-border-radius--bottom-left-13 {
4346
+ border-bottom-left-radius: var(--x-size-base-13) !important;
4339
4347
  }
4340
- [dir="rtl"] .x-border-radius--bottom-19 {
4341
- border-bottom-right-radius: var(--x-size-base-19) !important;
4348
+ [dir="rtl"] .x-border-radius--bottom-left-13 {
4349
+ border-bottom-right-radius: var(--x-size-base-13) !important;
4342
4350
  }
4343
- [dir="ltr"] .x-border-radius--bottom-19 {
4344
- border-bottom-right-radius: var(--x-size-base-19) !important;
4351
+ [dir="ltr"] .x-border-radius--bottom-right-13 {
4352
+ border-bottom-right-radius: var(--x-size-base-13) !important;
4345
4353
  }
4346
- [dir="rtl"] .x-border-radius--bottom-19 {
4347
- border-bottom-left-radius: var(--x-size-base-19) !important;
4354
+ [dir="rtl"] .x-border-radius--bottom-right-13 {
4355
+ border-bottom-left-radius: var(--x-size-base-13) !important;
4348
4356
  }
4349
- [dir="ltr"] .x-border-radius--right-19 {
4350
- border-top-right-radius: var(--x-size-base-19) !important;
4357
+ .x-border-radius--14 {
4358
+ border-radius: var(--x-size-base-14) !important;
4351
4359
  }
4352
- [dir="rtl"] .x-border-radius--right-19 {
4353
- border-top-left-radius: var(--x-size-base-19) !important;
4360
+ [dir="ltr"] .x-border-radius--top-14 {
4361
+ border-top-left-radius: var(--x-size-base-14) !important;
4354
4362
  }
4355
- [dir="ltr"] .x-border-radius--right-19 {
4356
- border-bottom-right-radius: var(--x-size-base-19) !important;
4363
+ [dir="rtl"] .x-border-radius--top-14 {
4364
+ border-top-right-radius: var(--x-size-base-14) !important;
4357
4365
  }
4358
- [dir="rtl"] .x-border-radius--right-19 {
4359
- border-bottom-left-radius: var(--x-size-base-19) !important;
4366
+ [dir="ltr"] .x-border-radius--top-14 {
4367
+ border-top-right-radius: var(--x-size-base-14) !important;
4360
4368
  }
4361
- [dir="ltr"] .x-border-radius--left-19 {
4362
- border-top-left-radius: var(--x-size-base-19) !important;
4369
+ [dir="rtl"] .x-border-radius--top-14 {
4370
+ border-top-left-radius: var(--x-size-base-14) !important;
4363
4371
  }
4364
- [dir="rtl"] .x-border-radius--left-19 {
4365
- border-top-right-radius: var(--x-size-base-19) !important;
4372
+ [dir="ltr"] .x-border-radius--bottom-14 {
4373
+ border-bottom-left-radius: var(--x-size-base-14) !important;
4366
4374
  }
4367
- [dir="ltr"] .x-border-radius--left-19 {
4368
- border-bottom-left-radius: var(--x-size-base-19) !important;
4375
+ [dir="rtl"] .x-border-radius--bottom-14 {
4376
+ border-bottom-right-radius: var(--x-size-base-14) !important;
4369
4377
  }
4370
- [dir="rtl"] .x-border-radius--left-19 {
4371
- border-bottom-right-radius: var(--x-size-base-19) !important;
4378
+ [dir="ltr"] .x-border-radius--bottom-14 {
4379
+ border-bottom-right-radius: var(--x-size-base-14) !important;
4372
4380
  }
4373
- [dir="ltr"] .x-border-radius--top-left-19 {
4374
- border-top-left-radius: var(--x-size-base-19) !important;
4381
+ [dir="rtl"] .x-border-radius--bottom-14 {
4382
+ border-bottom-left-radius: var(--x-size-base-14) !important;
4375
4383
  }
4376
- [dir="rtl"] .x-border-radius--top-left-19 {
4377
- border-top-right-radius: var(--x-size-base-19) !important;
4384
+ [dir="ltr"] .x-border-radius--right-14 {
4385
+ border-top-right-radius: var(--x-size-base-14) !important;
4378
4386
  }
4379
- [dir="ltr"] .x-border-radius--top-right-19 {
4380
- border-top-right-radius: var(--x-size-base-19) !important;
4387
+ [dir="rtl"] .x-border-radius--right-14 {
4388
+ border-top-left-radius: var(--x-size-base-14) !important;
4381
4389
  }
4382
- [dir="rtl"] .x-border-radius--top-right-19 {
4383
- border-top-left-radius: var(--x-size-base-19) !important;
4390
+ [dir="ltr"] .x-border-radius--right-14 {
4391
+ border-bottom-right-radius: var(--x-size-base-14) !important;
4384
4392
  }
4385
- [dir="ltr"] .x-border-radius--bottom-left-19 {
4386
- border-bottom-left-radius: var(--x-size-base-19) !important;
4393
+ [dir="rtl"] .x-border-radius--right-14 {
4394
+ border-bottom-left-radius: var(--x-size-base-14) !important;
4387
4395
  }
4388
- [dir="rtl"] .x-border-radius--bottom-left-19 {
4389
- border-bottom-right-radius: var(--x-size-base-19) !important;
4396
+ [dir="ltr"] .x-border-radius--left-14 {
4397
+ border-top-left-radius: var(--x-size-base-14) !important;
4390
4398
  }
4391
- [dir="ltr"] .x-border-radius--bottom-right-19 {
4392
- border-bottom-right-radius: var(--x-size-base-19) !important;
4399
+ [dir="rtl"] .x-border-radius--left-14 {
4400
+ border-top-right-radius: var(--x-size-base-14) !important;
4393
4401
  }
4394
- [dir="rtl"] .x-border-radius--bottom-right-19 {
4395
- border-bottom-left-radius: var(--x-size-base-19) !important;
4402
+ [dir="ltr"] .x-border-radius--left-14 {
4403
+ border-bottom-left-radius: var(--x-size-base-14) !important;
4396
4404
  }
4397
- .x-border-radius--20 {
4398
- border-radius: var(--x-size-base-20) !important;
4405
+ [dir="rtl"] .x-border-radius--left-14 {
4406
+ border-bottom-right-radius: var(--x-size-base-14) !important;
4399
4407
  }
4400
- [dir="ltr"] .x-border-radius--top-20 {
4401
- border-top-left-radius: var(--x-size-base-20) !important;
4408
+ [dir="ltr"] .x-border-radius--top-left-14 {
4409
+ border-top-left-radius: var(--x-size-base-14) !important;
4402
4410
  }
4403
- [dir="rtl"] .x-border-radius--top-20 {
4404
- border-top-right-radius: var(--x-size-base-20) !important;
4411
+ [dir="rtl"] .x-border-radius--top-left-14 {
4412
+ border-top-right-radius: var(--x-size-base-14) !important;
4405
4413
  }
4406
- [dir="ltr"] .x-border-radius--top-20 {
4407
- border-top-right-radius: var(--x-size-base-20) !important;
4414
+ [dir="ltr"] .x-border-radius--top-right-14 {
4415
+ border-top-right-radius: var(--x-size-base-14) !important;
4408
4416
  }
4409
- [dir="rtl"] .x-border-radius--top-20 {
4410
- border-top-left-radius: var(--x-size-base-20) !important;
4417
+ [dir="rtl"] .x-border-radius--top-right-14 {
4418
+ border-top-left-radius: var(--x-size-base-14) !important;
4411
4419
  }
4412
- [dir="ltr"] .x-border-radius--bottom-20 {
4413
- border-bottom-left-radius: var(--x-size-base-20) !important;
4420
+ [dir="ltr"] .x-border-radius--bottom-left-14 {
4421
+ border-bottom-left-radius: var(--x-size-base-14) !important;
4414
4422
  }
4415
- [dir="rtl"] .x-border-radius--bottom-20 {
4416
- border-bottom-right-radius: var(--x-size-base-20) !important;
4423
+ [dir="rtl"] .x-border-radius--bottom-left-14 {
4424
+ border-bottom-right-radius: var(--x-size-base-14) !important;
4417
4425
  }
4418
- [dir="ltr"] .x-border-radius--bottom-20 {
4419
- border-bottom-right-radius: var(--x-size-base-20) !important;
4426
+ [dir="ltr"] .x-border-radius--bottom-right-14 {
4427
+ border-bottom-right-radius: var(--x-size-base-14) !important;
4420
4428
  }
4421
- [dir="rtl"] .x-border-radius--bottom-20 {
4422
- border-bottom-left-radius: var(--x-size-base-20) !important;
4429
+ [dir="rtl"] .x-border-radius--bottom-right-14 {
4430
+ border-bottom-left-radius: var(--x-size-base-14) !important;
4423
4431
  }
4424
- [dir="ltr"] .x-border-radius--right-20 {
4425
- border-top-right-radius: var(--x-size-base-20) !important;
4432
+ .x-border-radius--15 {
4433
+ border-radius: var(--x-size-base-15) !important;
4426
4434
  }
4427
- [dir="rtl"] .x-border-radius--right-20 {
4428
- border-top-left-radius: var(--x-size-base-20) !important;
4435
+ [dir="ltr"] .x-border-radius--top-15 {
4436
+ border-top-left-radius: var(--x-size-base-15) !important;
4429
4437
  }
4430
- [dir="ltr"] .x-border-radius--right-20 {
4431
- border-bottom-right-radius: var(--x-size-base-20) !important;
4438
+ [dir="rtl"] .x-border-radius--top-15 {
4439
+ border-top-right-radius: var(--x-size-base-15) !important;
4432
4440
  }
4433
- [dir="rtl"] .x-border-radius--right-20 {
4434
- border-bottom-left-radius: var(--x-size-base-20) !important;
4441
+ [dir="ltr"] .x-border-radius--top-15 {
4442
+ border-top-right-radius: var(--x-size-base-15) !important;
4435
4443
  }
4436
- [dir="ltr"] .x-border-radius--left-20 {
4437
- border-top-left-radius: var(--x-size-base-20) !important;
4444
+ [dir="rtl"] .x-border-radius--top-15 {
4445
+ border-top-left-radius: var(--x-size-base-15) !important;
4438
4446
  }
4439
- [dir="rtl"] .x-border-radius--left-20 {
4440
- border-top-right-radius: var(--x-size-base-20) !important;
4447
+ [dir="ltr"] .x-border-radius--bottom-15 {
4448
+ border-bottom-left-radius: var(--x-size-base-15) !important;
4441
4449
  }
4442
- [dir="ltr"] .x-border-radius--left-20 {
4443
- border-bottom-left-radius: var(--x-size-base-20) !important;
4450
+ [dir="rtl"] .x-border-radius--bottom-15 {
4451
+ border-bottom-right-radius: var(--x-size-base-15) !important;
4444
4452
  }
4445
- [dir="rtl"] .x-border-radius--left-20 {
4446
- border-bottom-right-radius: var(--x-size-base-20) !important;
4453
+ [dir="ltr"] .x-border-radius--bottom-15 {
4454
+ border-bottom-right-radius: var(--x-size-base-15) !important;
4447
4455
  }
4448
- [dir="ltr"] .x-border-radius--top-left-20 {
4449
- border-top-left-radius: var(--x-size-base-20) !important;
4456
+ [dir="rtl"] .x-border-radius--bottom-15 {
4457
+ border-bottom-left-radius: var(--x-size-base-15) !important;
4450
4458
  }
4451
- [dir="rtl"] .x-border-radius--top-left-20 {
4452
- border-top-right-radius: var(--x-size-base-20) !important;
4459
+ [dir="ltr"] .x-border-radius--right-15 {
4460
+ border-top-right-radius: var(--x-size-base-15) !important;
4453
4461
  }
4454
- [dir="ltr"] .x-border-radius--top-right-20 {
4455
- border-top-right-radius: var(--x-size-base-20) !important;
4462
+ [dir="rtl"] .x-border-radius--right-15 {
4463
+ border-top-left-radius: var(--x-size-base-15) !important;
4456
4464
  }
4457
- [dir="rtl"] .x-border-radius--top-right-20 {
4458
- border-top-left-radius: var(--x-size-base-20) !important;
4465
+ [dir="ltr"] .x-border-radius--right-15 {
4466
+ border-bottom-right-radius: var(--x-size-base-15) !important;
4459
4467
  }
4460
- [dir="ltr"] .x-border-radius--bottom-left-20 {
4461
- border-bottom-left-radius: var(--x-size-base-20) !important;
4468
+ [dir="rtl"] .x-border-radius--right-15 {
4469
+ border-bottom-left-radius: var(--x-size-base-15) !important;
4462
4470
  }
4463
- [dir="rtl"] .x-border-radius--bottom-left-20 {
4464
- border-bottom-right-radius: var(--x-size-base-20) !important;
4471
+ [dir="ltr"] .x-border-radius--left-15 {
4472
+ border-top-left-radius: var(--x-size-base-15) !important;
4465
4473
  }
4466
- [dir="ltr"] .x-border-radius--bottom-right-20 {
4467
- border-bottom-right-radius: var(--x-size-base-20) !important;
4474
+ [dir="rtl"] .x-border-radius--left-15 {
4475
+ border-top-right-radius: var(--x-size-base-15) !important;
4468
4476
  }
4469
- [dir="rtl"] .x-border-radius--bottom-right-20 {
4470
- border-bottom-left-radius: var(--x-size-base-20) !important;
4477
+ [dir="ltr"] .x-border-radius--left-15 {
4478
+ border-bottom-left-radius: var(--x-size-base-15) !important;
4471
4479
  }
4472
- *[class*=x-border-width--] {
4473
- border-width: 0;
4480
+ [dir="rtl"] .x-border-radius--left-15 {
4481
+ border-bottom-right-radius: var(--x-size-base-15) !important;
4474
4482
  }
4475
-
4476
- .x-border-width--00 {
4477
- border-width: 0px !important;
4478
- border-style: solid !important;
4483
+ [dir="ltr"] .x-border-radius--top-left-15 {
4484
+ border-top-left-radius: var(--x-size-base-15) !important;
4479
4485
  }
4480
- .x-border-width--top-00 {
4481
- border-top-width: 0px !important;
4482
- border-style: solid !important;
4486
+ [dir="rtl"] .x-border-radius--top-left-15 {
4487
+ border-top-right-radius: var(--x-size-base-15) !important;
4483
4488
  }
4484
- .x-border-width--bottom-00 {
4485
- border-bottom-width: 0px !important;
4486
- border-style: solid !important;
4489
+ [dir="ltr"] .x-border-radius--top-right-15 {
4490
+ border-top-right-radius: var(--x-size-base-15) !important;
4487
4491
  }
4488
- [dir="ltr"] .x-border-width--right-00 {
4489
- border-right-width: 0px !important;
4492
+ [dir="rtl"] .x-border-radius--top-right-15 {
4493
+ border-top-left-radius: var(--x-size-base-15) !important;
4490
4494
  }
4491
- [dir="rtl"] .x-border-width--right-00 {
4492
- border-left-width: 0px !important;
4495
+ [dir="ltr"] .x-border-radius--bottom-left-15 {
4496
+ border-bottom-left-radius: var(--x-size-base-15) !important;
4493
4497
  }
4494
- .x-border-width--right-00 {
4495
- border-style: solid !important;
4498
+ [dir="rtl"] .x-border-radius--bottom-left-15 {
4499
+ border-bottom-right-radius: var(--x-size-base-15) !important;
4496
4500
  }
4497
- [dir="ltr"] .x-border-width--left-00 {
4498
- border-left-width: 0px !important;
4501
+ [dir="ltr"] .x-border-radius--bottom-right-15 {
4502
+ border-bottom-right-radius: var(--x-size-base-15) !important;
4499
4503
  }
4500
- [dir="rtl"] .x-border-width--left-00 {
4501
- border-right-width: 0px !important;
4504
+ [dir="rtl"] .x-border-radius--bottom-right-15 {
4505
+ border-bottom-left-radius: var(--x-size-base-15) !important;
4502
4506
  }
4503
- .x-border-width--left-00 {
4504
- border-style: solid !important;
4507
+ .x-border-radius--16 {
4508
+ border-radius: var(--x-size-base-16) !important;
4505
4509
  }
4506
- .x-border-width--01 {
4507
- border-width: 1px !important;
4508
- border-style: solid !important;
4510
+ [dir="ltr"] .x-border-radius--top-16 {
4511
+ border-top-left-radius: var(--x-size-base-16) !important;
4509
4512
  }
4510
- .x-border-width--top-01 {
4511
- border-top-width: 1px !important;
4512
- border-style: solid !important;
4513
+ [dir="rtl"] .x-border-radius--top-16 {
4514
+ border-top-right-radius: var(--x-size-base-16) !important;
4513
4515
  }
4514
- .x-border-width--bottom-01 {
4515
- border-bottom-width: 1px !important;
4516
- border-style: solid !important;
4516
+ [dir="ltr"] .x-border-radius--top-16 {
4517
+ border-top-right-radius: var(--x-size-base-16) !important;
4517
4518
  }
4518
- [dir="ltr"] .x-border-width--right-01 {
4519
- border-right-width: 1px !important;
4519
+ [dir="rtl"] .x-border-radius--top-16 {
4520
+ border-top-left-radius: var(--x-size-base-16) !important;
4520
4521
  }
4521
- [dir="rtl"] .x-border-width--right-01 {
4522
- border-left-width: 1px !important;
4522
+ [dir="ltr"] .x-border-radius--bottom-16 {
4523
+ border-bottom-left-radius: var(--x-size-base-16) !important;
4523
4524
  }
4524
- .x-border-width--right-01 {
4525
- border-style: solid !important;
4525
+ [dir="rtl"] .x-border-radius--bottom-16 {
4526
+ border-bottom-right-radius: var(--x-size-base-16) !important;
4526
4527
  }
4527
- [dir="ltr"] .x-border-width--left-01 {
4528
- border-left-width: 1px !important;
4528
+ [dir="ltr"] .x-border-radius--bottom-16 {
4529
+ border-bottom-right-radius: var(--x-size-base-16) !important;
4529
4530
  }
4530
- [dir="rtl"] .x-border-width--left-01 {
4531
- border-right-width: 1px !important;
4531
+ [dir="rtl"] .x-border-radius--bottom-16 {
4532
+ border-bottom-left-radius: var(--x-size-base-16) !important;
4532
4533
  }
4533
- .x-border-width--left-01 {
4534
- border-style: solid !important;
4534
+ [dir="ltr"] .x-border-radius--right-16 {
4535
+ border-top-right-radius: var(--x-size-base-16) !important;
4535
4536
  }
4536
- .x-border-width--02 {
4537
- border-width: 2px !important;
4538
- border-style: solid !important;
4537
+ [dir="rtl"] .x-border-radius--right-16 {
4538
+ border-top-left-radius: var(--x-size-base-16) !important;
4539
4539
  }
4540
- .x-border-width--top-02 {
4541
- border-top-width: 2px !important;
4542
- border-style: solid !important;
4540
+ [dir="ltr"] .x-border-radius--right-16 {
4541
+ border-bottom-right-radius: var(--x-size-base-16) !important;
4543
4542
  }
4544
- .x-border-width--bottom-02 {
4545
- border-bottom-width: 2px !important;
4546
- border-style: solid !important;
4543
+ [dir="rtl"] .x-border-radius--right-16 {
4544
+ border-bottom-left-radius: var(--x-size-base-16) !important;
4547
4545
  }
4548
- [dir="ltr"] .x-border-width--right-02 {
4549
- border-right-width: 2px !important;
4546
+ [dir="ltr"] .x-border-radius--left-16 {
4547
+ border-top-left-radius: var(--x-size-base-16) !important;
4550
4548
  }
4551
- [dir="rtl"] .x-border-width--right-02 {
4552
- border-left-width: 2px !important;
4549
+ [dir="rtl"] .x-border-radius--left-16 {
4550
+ border-top-right-radius: var(--x-size-base-16) !important;
4553
4551
  }
4554
- .x-border-width--right-02 {
4555
- border-style: solid !important;
4552
+ [dir="ltr"] .x-border-radius--left-16 {
4553
+ border-bottom-left-radius: var(--x-size-base-16) !important;
4556
4554
  }
4557
- [dir="ltr"] .x-border-width--left-02 {
4558
- border-left-width: 2px !important;
4555
+ [dir="rtl"] .x-border-radius--left-16 {
4556
+ border-bottom-right-radius: var(--x-size-base-16) !important;
4559
4557
  }
4560
- [dir="rtl"] .x-border-width--left-02 {
4561
- border-right-width: 2px !important;
4558
+ [dir="ltr"] .x-border-radius--top-left-16 {
4559
+ border-top-left-radius: var(--x-size-base-16) !important;
4562
4560
  }
4563
- .x-border-width--left-02 {
4564
- border-style: solid !important;
4561
+ [dir="rtl"] .x-border-radius--top-left-16 {
4562
+ border-top-right-radius: var(--x-size-base-16) !important;
4565
4563
  }
4566
- .x-border-width--03 {
4567
- border-width: 3px !important;
4568
- border-style: solid !important;
4564
+ [dir="ltr"] .x-border-radius--top-right-16 {
4565
+ border-top-right-radius: var(--x-size-base-16) !important;
4569
4566
  }
4570
- .x-border-width--top-03 {
4571
- border-top-width: 3px !important;
4572
- border-style: solid !important;
4567
+ [dir="rtl"] .x-border-radius--top-right-16 {
4568
+ border-top-left-radius: var(--x-size-base-16) !important;
4573
4569
  }
4574
- .x-border-width--bottom-03 {
4575
- border-bottom-width: 3px !important;
4576
- border-style: solid !important;
4570
+ [dir="ltr"] .x-border-radius--bottom-left-16 {
4571
+ border-bottom-left-radius: var(--x-size-base-16) !important;
4577
4572
  }
4578
- [dir="ltr"] .x-border-width--right-03 {
4579
- border-right-width: 3px !important;
4573
+ [dir="rtl"] .x-border-radius--bottom-left-16 {
4574
+ border-bottom-right-radius: var(--x-size-base-16) !important;
4580
4575
  }
4581
- [dir="rtl"] .x-border-width--right-03 {
4582
- border-left-width: 3px !important;
4576
+ [dir="ltr"] .x-border-radius--bottom-right-16 {
4577
+ border-bottom-right-radius: var(--x-size-base-16) !important;
4583
4578
  }
4584
- .x-border-width--right-03 {
4585
- border-style: solid !important;
4579
+ [dir="rtl"] .x-border-radius--bottom-right-16 {
4580
+ border-bottom-left-radius: var(--x-size-base-16) !important;
4586
4581
  }
4587
- [dir="ltr"] .x-border-width--left-03 {
4588
- border-left-width: 3px !important;
4582
+ .x-border-radius--17 {
4583
+ border-radius: var(--x-size-base-17) !important;
4589
4584
  }
4590
- [dir="rtl"] .x-border-width--left-03 {
4591
- border-right-width: 3px !important;
4585
+ [dir="ltr"] .x-border-radius--top-17 {
4586
+ border-top-left-radius: var(--x-size-base-17) !important;
4592
4587
  }
4593
- .x-border-width--left-03 {
4594
- border-style: solid !important;
4588
+ [dir="rtl"] .x-border-radius--top-17 {
4589
+ border-top-right-radius: var(--x-size-base-17) !important;
4595
4590
  }
4596
- .x-border-width--04 {
4597
- border-width: 4px !important;
4598
- border-style: solid !important;
4591
+ [dir="ltr"] .x-border-radius--top-17 {
4592
+ border-top-right-radius: var(--x-size-base-17) !important;
4599
4593
  }
4600
- .x-border-width--top-04 {
4601
- border-top-width: 4px !important;
4602
- border-style: solid !important;
4594
+ [dir="rtl"] .x-border-radius--top-17 {
4595
+ border-top-left-radius: var(--x-size-base-17) !important;
4603
4596
  }
4604
- .x-border-width--bottom-04 {
4605
- border-bottom-width: 4px !important;
4606
- border-style: solid !important;
4597
+ [dir="ltr"] .x-border-radius--bottom-17 {
4598
+ border-bottom-left-radius: var(--x-size-base-17) !important;
4607
4599
  }
4608
- [dir="ltr"] .x-border-width--right-04 {
4609
- border-right-width: 4px !important;
4600
+ [dir="rtl"] .x-border-radius--bottom-17 {
4601
+ border-bottom-right-radius: var(--x-size-base-17) !important;
4610
4602
  }
4611
- [dir="rtl"] .x-border-width--right-04 {
4612
- border-left-width: 4px !important;
4603
+ [dir="ltr"] .x-border-radius--bottom-17 {
4604
+ border-bottom-right-radius: var(--x-size-base-17) !important;
4613
4605
  }
4614
- .x-border-width--right-04 {
4615
- border-style: solid !important;
4606
+ [dir="rtl"] .x-border-radius--bottom-17 {
4607
+ border-bottom-left-radius: var(--x-size-base-17) !important;
4616
4608
  }
4617
- [dir="ltr"] .x-border-width--left-04 {
4618
- border-left-width: 4px !important;
4609
+ [dir="ltr"] .x-border-radius--right-17 {
4610
+ border-top-right-radius: var(--x-size-base-17) !important;
4619
4611
  }
4620
- [dir="rtl"] .x-border-width--left-04 {
4621
- border-right-width: 4px !important;
4612
+ [dir="rtl"] .x-border-radius--right-17 {
4613
+ border-top-left-radius: var(--x-size-base-17) !important;
4622
4614
  }
4623
- .x-border-width--left-04 {
4624
- border-style: solid !important;
4615
+ [dir="ltr"] .x-border-radius--right-17 {
4616
+ border-bottom-right-radius: var(--x-size-base-17) !important;
4625
4617
  }
4626
- .x-border-width--05 {
4627
- border-width: 5px !important;
4628
- border-style: solid !important;
4618
+ [dir="rtl"] .x-border-radius--right-17 {
4619
+ border-bottom-left-radius: var(--x-size-base-17) !important;
4629
4620
  }
4630
- .x-border-width--top-05 {
4631
- border-top-width: 5px !important;
4632
- border-style: solid !important;
4621
+ [dir="ltr"] .x-border-radius--left-17 {
4622
+ border-top-left-radius: var(--x-size-base-17) !important;
4633
4623
  }
4634
- .x-border-width--bottom-05 {
4635
- border-bottom-width: 5px !important;
4636
- border-style: solid !important;
4624
+ [dir="rtl"] .x-border-radius--left-17 {
4625
+ border-top-right-radius: var(--x-size-base-17) !important;
4637
4626
  }
4638
- [dir="ltr"] .x-border-width--right-05 {
4639
- border-right-width: 5px !important;
4627
+ [dir="ltr"] .x-border-radius--left-17 {
4628
+ border-bottom-left-radius: var(--x-size-base-17) !important;
4640
4629
  }
4641
- [dir="rtl"] .x-border-width--right-05 {
4642
- border-left-width: 5px !important;
4630
+ [dir="rtl"] .x-border-radius--left-17 {
4631
+ border-bottom-right-radius: var(--x-size-base-17) !important;
4643
4632
  }
4644
- .x-border-width--right-05 {
4645
- border-style: solid !important;
4633
+ [dir="ltr"] .x-border-radius--top-left-17 {
4634
+ border-top-left-radius: var(--x-size-base-17) !important;
4646
4635
  }
4647
- [dir="ltr"] .x-border-width--left-05 {
4648
- border-left-width: 5px !important;
4636
+ [dir="rtl"] .x-border-radius--top-left-17 {
4637
+ border-top-right-radius: var(--x-size-base-17) !important;
4649
4638
  }
4650
- [dir="rtl"] .x-border-width--left-05 {
4651
- border-right-width: 5px !important;
4639
+ [dir="ltr"] .x-border-radius--top-right-17 {
4640
+ border-top-right-radius: var(--x-size-base-17) !important;
4652
4641
  }
4653
- .x-border-width--left-05 {
4654
- border-style: solid !important;
4642
+ [dir="rtl"] .x-border-radius--top-right-17 {
4643
+ border-top-left-radius: var(--x-size-base-17) !important;
4655
4644
  }
4656
- .x-border-width--06 {
4657
- border-width: 6px !important;
4658
- border-style: solid !important;
4645
+ [dir="ltr"] .x-border-radius--bottom-left-17 {
4646
+ border-bottom-left-radius: var(--x-size-base-17) !important;
4659
4647
  }
4660
- .x-border-width--top-06 {
4661
- border-top-width: 6px !important;
4662
- border-style: solid !important;
4648
+ [dir="rtl"] .x-border-radius--bottom-left-17 {
4649
+ border-bottom-right-radius: var(--x-size-base-17) !important;
4663
4650
  }
4664
- .x-border-width--bottom-06 {
4665
- border-bottom-width: 6px !important;
4666
- border-style: solid !important;
4651
+ [dir="ltr"] .x-border-radius--bottom-right-17 {
4652
+ border-bottom-right-radius: var(--x-size-base-17) !important;
4667
4653
  }
4668
- [dir="ltr"] .x-border-width--right-06 {
4669
- border-right-width: 6px !important;
4654
+ [dir="rtl"] .x-border-radius--bottom-right-17 {
4655
+ border-bottom-left-radius: var(--x-size-base-17) !important;
4670
4656
  }
4671
- [dir="rtl"] .x-border-width--right-06 {
4672
- border-left-width: 6px !important;
4657
+ .x-border-radius--18 {
4658
+ border-radius: var(--x-size-base-18) !important;
4673
4659
  }
4674
- .x-border-width--right-06 {
4675
- border-style: solid !important;
4660
+ [dir="ltr"] .x-border-radius--top-18 {
4661
+ border-top-left-radius: var(--x-size-base-18) !important;
4676
4662
  }
4677
- [dir="ltr"] .x-border-width--left-06 {
4678
- border-left-width: 6px !important;
4663
+ [dir="rtl"] .x-border-radius--top-18 {
4664
+ border-top-right-radius: var(--x-size-base-18) !important;
4679
4665
  }
4680
- [dir="rtl"] .x-border-width--left-06 {
4681
- border-right-width: 6px !important;
4666
+ [dir="ltr"] .x-border-radius--top-18 {
4667
+ border-top-right-radius: var(--x-size-base-18) !important;
4682
4668
  }
4683
- .x-border-width--left-06 {
4684
- border-style: solid !important;
4669
+ [dir="rtl"] .x-border-radius--top-18 {
4670
+ border-top-left-radius: var(--x-size-base-18) !important;
4685
4671
  }
4686
- .x-border-width--07 {
4687
- border-width: 7px !important;
4688
- border-style: solid !important;
4672
+ [dir="ltr"] .x-border-radius--bottom-18 {
4673
+ border-bottom-left-radius: var(--x-size-base-18) !important;
4689
4674
  }
4690
- .x-border-width--top-07 {
4691
- border-top-width: 7px !important;
4692
- border-style: solid !important;
4675
+ [dir="rtl"] .x-border-radius--bottom-18 {
4676
+ border-bottom-right-radius: var(--x-size-base-18) !important;
4693
4677
  }
4694
- .x-border-width--bottom-07 {
4695
- border-bottom-width: 7px !important;
4696
- border-style: solid !important;
4678
+ [dir="ltr"] .x-border-radius--bottom-18 {
4679
+ border-bottom-right-radius: var(--x-size-base-18) !important;
4697
4680
  }
4698
- [dir="ltr"] .x-border-width--right-07 {
4699
- border-right-width: 7px !important;
4681
+ [dir="rtl"] .x-border-radius--bottom-18 {
4682
+ border-bottom-left-radius: var(--x-size-base-18) !important;
4700
4683
  }
4701
- [dir="rtl"] .x-border-width--right-07 {
4702
- border-left-width: 7px !important;
4684
+ [dir="ltr"] .x-border-radius--right-18 {
4685
+ border-top-right-radius: var(--x-size-base-18) !important;
4703
4686
  }
4704
- .x-border-width--right-07 {
4705
- border-style: solid !important;
4687
+ [dir="rtl"] .x-border-radius--right-18 {
4688
+ border-top-left-radius: var(--x-size-base-18) !important;
4706
4689
  }
4707
- [dir="ltr"] .x-border-width--left-07 {
4708
- border-left-width: 7px !important;
4690
+ [dir="ltr"] .x-border-radius--right-18 {
4691
+ border-bottom-right-radius: var(--x-size-base-18) !important;
4709
4692
  }
4710
- [dir="rtl"] .x-border-width--left-07 {
4711
- border-right-width: 7px !important;
4693
+ [dir="rtl"] .x-border-radius--right-18 {
4694
+ border-bottom-left-radius: var(--x-size-base-18) !important;
4712
4695
  }
4713
- .x-border-width--left-07 {
4714
- border-style: solid !important;
4696
+ [dir="ltr"] .x-border-radius--left-18 {
4697
+ border-top-left-radius: var(--x-size-base-18) !important;
4715
4698
  }
4716
- .x-border-width--08 {
4717
- border-width: 8px !important;
4718
- border-style: solid !important;
4699
+ [dir="rtl"] .x-border-radius--left-18 {
4700
+ border-top-right-radius: var(--x-size-base-18) !important;
4719
4701
  }
4720
- .x-border-width--top-08 {
4721
- border-top-width: 8px !important;
4722
- border-style: solid !important;
4702
+ [dir="ltr"] .x-border-radius--left-18 {
4703
+ border-bottom-left-radius: var(--x-size-base-18) !important;
4723
4704
  }
4724
- .x-border-width--bottom-08 {
4725
- border-bottom-width: 8px !important;
4726
- border-style: solid !important;
4705
+ [dir="rtl"] .x-border-radius--left-18 {
4706
+ border-bottom-right-radius: var(--x-size-base-18) !important;
4727
4707
  }
4728
- [dir="ltr"] .x-border-width--right-08 {
4729
- border-right-width: 8px !important;
4708
+ [dir="ltr"] .x-border-radius--top-left-18 {
4709
+ border-top-left-radius: var(--x-size-base-18) !important;
4730
4710
  }
4731
- [dir="rtl"] .x-border-width--right-08 {
4732
- border-left-width: 8px !important;
4711
+ [dir="rtl"] .x-border-radius--top-left-18 {
4712
+ border-top-right-radius: var(--x-size-base-18) !important;
4733
4713
  }
4734
- .x-border-width--right-08 {
4735
- border-style: solid !important;
4714
+ [dir="ltr"] .x-border-radius--top-right-18 {
4715
+ border-top-right-radius: var(--x-size-base-18) !important;
4736
4716
  }
4737
- [dir="ltr"] .x-border-width--left-08 {
4738
- border-left-width: 8px !important;
4717
+ [dir="rtl"] .x-border-radius--top-right-18 {
4718
+ border-top-left-radius: var(--x-size-base-18) !important;
4739
4719
  }
4740
- [dir="rtl"] .x-border-width--left-08 {
4741
- border-right-width: 8px !important;
4720
+ [dir="ltr"] .x-border-radius--bottom-left-18 {
4721
+ border-bottom-left-radius: var(--x-size-base-18) !important;
4742
4722
  }
4743
- .x-border-width--left-08 {
4744
- border-style: solid !important;
4723
+ [dir="rtl"] .x-border-radius--bottom-left-18 {
4724
+ border-bottom-right-radius: var(--x-size-base-18) !important;
4745
4725
  }
4746
- .x-border-width--09 {
4747
- border-width: 9px !important;
4748
- border-style: solid !important;
4726
+ [dir="ltr"] .x-border-radius--bottom-right-18 {
4727
+ border-bottom-right-radius: var(--x-size-base-18) !important;
4749
4728
  }
4750
- .x-border-width--top-09 {
4751
- border-top-width: 9px !important;
4752
- border-style: solid !important;
4729
+ [dir="rtl"] .x-border-radius--bottom-right-18 {
4730
+ border-bottom-left-radius: var(--x-size-base-18) !important;
4753
4731
  }
4754
- .x-border-width--bottom-09 {
4755
- border-bottom-width: 9px !important;
4756
- border-style: solid !important;
4732
+ .x-border-radius--19 {
4733
+ border-radius: var(--x-size-base-19) !important;
4757
4734
  }
4758
- [dir="ltr"] .x-border-width--right-09 {
4759
- border-right-width: 9px !important;
4735
+ [dir="ltr"] .x-border-radius--top-19 {
4736
+ border-top-left-radius: var(--x-size-base-19) !important;
4760
4737
  }
4761
- [dir="rtl"] .x-border-width--right-09 {
4762
- border-left-width: 9px !important;
4738
+ [dir="rtl"] .x-border-radius--top-19 {
4739
+ border-top-right-radius: var(--x-size-base-19) !important;
4763
4740
  }
4764
- .x-border-width--right-09 {
4765
- border-style: solid !important;
4741
+ [dir="ltr"] .x-border-radius--top-19 {
4742
+ border-top-right-radius: var(--x-size-base-19) !important;
4766
4743
  }
4767
- [dir="ltr"] .x-border-width--left-09 {
4768
- border-left-width: 9px !important;
4744
+ [dir="rtl"] .x-border-radius--top-19 {
4745
+ border-top-left-radius: var(--x-size-base-19) !important;
4769
4746
  }
4770
- [dir="rtl"] .x-border-width--left-09 {
4771
- border-right-width: 9px !important;
4747
+ [dir="ltr"] .x-border-radius--bottom-19 {
4748
+ border-bottom-left-radius: var(--x-size-base-19) !important;
4772
4749
  }
4773
- .x-border-width--left-09 {
4774
- border-style: solid !important;
4750
+ [dir="rtl"] .x-border-radius--bottom-19 {
4751
+ border-bottom-right-radius: var(--x-size-base-19) !important;
4775
4752
  }
4776
- .x-border-width--10 {
4777
- border-width: 10px !important;
4778
- border-style: solid !important;
4753
+ [dir="ltr"] .x-border-radius--bottom-19 {
4754
+ border-bottom-right-radius: var(--x-size-base-19) !important;
4779
4755
  }
4780
- .x-border-width--top-10 {
4781
- border-top-width: 10px !important;
4782
- border-style: solid !important;
4756
+ [dir="rtl"] .x-border-radius--bottom-19 {
4757
+ border-bottom-left-radius: var(--x-size-base-19) !important;
4783
4758
  }
4784
- .x-border-width--bottom-10 {
4785
- border-bottom-width: 10px !important;
4786
- border-style: solid !important;
4759
+ [dir="ltr"] .x-border-radius--right-19 {
4760
+ border-top-right-radius: var(--x-size-base-19) !important;
4787
4761
  }
4788
- [dir="ltr"] .x-border-width--right-10 {
4789
- border-right-width: 10px !important;
4762
+ [dir="rtl"] .x-border-radius--right-19 {
4763
+ border-top-left-radius: var(--x-size-base-19) !important;
4790
4764
  }
4791
- [dir="rtl"] .x-border-width--right-10 {
4792
- border-left-width: 10px !important;
4765
+ [dir="ltr"] .x-border-radius--right-19 {
4766
+ border-bottom-right-radius: var(--x-size-base-19) !important;
4793
4767
  }
4794
- .x-border-width--right-10 {
4795
- border-style: solid !important;
4768
+ [dir="rtl"] .x-border-radius--right-19 {
4769
+ border-bottom-left-radius: var(--x-size-base-19) !important;
4796
4770
  }
4797
- [dir="ltr"] .x-border-width--left-10 {
4798
- border-left-width: 10px !important;
4771
+ [dir="ltr"] .x-border-radius--left-19 {
4772
+ border-top-left-radius: var(--x-size-base-19) !important;
4799
4773
  }
4800
- [dir="rtl"] .x-border-width--left-10 {
4801
- border-right-width: 10px !important;
4774
+ [dir="rtl"] .x-border-radius--left-19 {
4775
+ border-top-right-radius: var(--x-size-base-19) !important;
4802
4776
  }
4803
- .x-border-width--left-10 {
4804
- border-style: solid !important;
4777
+ [dir="ltr"] .x-border-radius--left-19 {
4778
+ border-bottom-left-radius: var(--x-size-base-19) !important;
4805
4779
  }
4806
- .x-shadow--none {
4807
- box-shadow: none !important;
4780
+ [dir="rtl"] .x-border-radius--left-19 {
4781
+ border-bottom-right-radius: var(--x-size-base-19) !important;
4808
4782
  }
4809
-
4810
- .x-shadow--01 {
4811
- box-shadow: var(--x-string-box-shadow-01) !important;
4783
+ [dir="ltr"] .x-border-radius--top-left-19 {
4784
+ border-top-left-radius: var(--x-size-base-19) !important;
4812
4785
  }
4813
- .x-shadow--bottom-01 {
4814
- box-shadow: var(--x-string-box-shadow-bottom-01) !important;
4786
+ [dir="rtl"] .x-border-radius--top-left-19 {
4787
+ border-top-right-radius: var(--x-size-base-19) !important;
4815
4788
  }
4816
- .x-shadow--02 {
4817
- box-shadow: var(--x-string-box-shadow-02) !important;
4789
+ [dir="ltr"] .x-border-radius--top-right-19 {
4790
+ border-top-right-radius: var(--x-size-base-19) !important;
4818
4791
  }
4819
- .x-shadow--bottom-02 {
4820
- box-shadow: var(--x-string-box-shadow-bottom-02) !important;
4792
+ [dir="rtl"] .x-border-radius--top-right-19 {
4793
+ border-top-left-radius: var(--x-size-base-19) !important;
4821
4794
  }
4822
- .x-shadow--03 {
4823
- box-shadow: var(--x-string-box-shadow-03) !important;
4795
+ [dir="ltr"] .x-border-radius--bottom-left-19 {
4796
+ border-bottom-left-radius: var(--x-size-base-19) !important;
4824
4797
  }
4825
- .x-shadow--bottom-03 {
4826
- box-shadow: var(--x-string-box-shadow-bottom-03) !important;
4798
+ [dir="rtl"] .x-border-radius--bottom-left-19 {
4799
+ border-bottom-right-radius: var(--x-size-base-19) !important;
4827
4800
  }
4828
- .x-shadow--04 {
4829
- box-shadow: var(--x-string-box-shadow-04) !important;
4801
+ [dir="ltr"] .x-border-radius--bottom-right-19 {
4802
+ border-bottom-right-radius: var(--x-size-base-19) !important;
4830
4803
  }
4831
- .x-shadow--bottom-04 {
4832
- box-shadow: var(--x-string-box-shadow-bottom-04) !important;
4804
+ [dir="rtl"] .x-border-radius--bottom-right-19 {
4805
+ border-bottom-left-radius: var(--x-size-base-19) !important;
4833
4806
  }
4834
- .x-shadow--05 {
4835
- box-shadow: var(--x-string-box-shadow-05) !important;
4807
+ .x-border-radius--20 {
4808
+ border-radius: var(--x-size-base-20) !important;
4836
4809
  }
4837
- .x-shadow--bottom-05 {
4838
- box-shadow: var(--x-string-box-shadow-bottom-05) !important;
4810
+ [dir="ltr"] .x-border-radius--top-20 {
4811
+ border-top-left-radius: var(--x-size-base-20) !important;
4839
4812
  }
4840
- .x-shadow--06 {
4841
- box-shadow: var(--x-string-box-shadow-06) !important;
4813
+ [dir="rtl"] .x-border-radius--top-20 {
4814
+ border-top-right-radius: var(--x-size-base-20) !important;
4842
4815
  }
4843
- .x-shadow--bottom-06 {
4844
- box-shadow: var(--x-string-box-shadow-bottom-06) !important;
4816
+ [dir="ltr"] .x-border-radius--top-20 {
4817
+ border-top-right-radius: var(--x-size-base-20) !important;
4845
4818
  }
4846
- .x-shadow--07 {
4847
- box-shadow: var(--x-string-box-shadow-07) !important;
4819
+ [dir="rtl"] .x-border-radius--top-20 {
4820
+ border-top-left-radius: var(--x-size-base-20) !important;
4848
4821
  }
4849
- .x-shadow--bottom-07 {
4850
- box-shadow: var(--x-string-box-shadow-bottom-07) !important;
4822
+ [dir="ltr"] .x-border-radius--bottom-20 {
4823
+ border-bottom-left-radius: var(--x-size-base-20) !important;
4851
4824
  }
4852
- .x-shadow--08 {
4853
- box-shadow: var(--x-string-box-shadow-08) !important;
4825
+ [dir="rtl"] .x-border-radius--bottom-20 {
4826
+ border-bottom-right-radius: var(--x-size-base-20) !important;
4854
4827
  }
4855
- .x-shadow--bottom-08 {
4856
- box-shadow: var(--x-string-box-shadow-bottom-08) !important;
4828
+ [dir="ltr"] .x-border-radius--bottom-20 {
4829
+ border-bottom-right-radius: var(--x-size-base-20) !important;
4857
4830
  }
4858
- .x-shadow--09 {
4859
- box-shadow: var(--x-string-box-shadow-09) !important;
4831
+ [dir="rtl"] .x-border-radius--bottom-20 {
4832
+ border-bottom-left-radius: var(--x-size-base-20) !important;
4860
4833
  }
4861
- .x-shadow--bottom-09 {
4862
- box-shadow: var(--x-string-box-shadow-bottom-09) !important;
4834
+ [dir="ltr"] .x-border-radius--right-20 {
4835
+ border-top-right-radius: var(--x-size-base-20) !important;
4863
4836
  }
4864
- .x-shadow--10 {
4865
- box-shadow: var(--x-string-box-shadow-10) !important;
4837
+ [dir="rtl"] .x-border-radius--right-20 {
4838
+ border-top-left-radius: var(--x-size-base-20) !important;
4866
4839
  }
4867
- .x-shadow--bottom-10 {
4868
- box-shadow: var(--x-string-box-shadow-bottom-10) !important;
4840
+ [dir="ltr"] .x-border-radius--right-20 {
4841
+ border-bottom-right-radius: var(--x-size-base-20) !important;
4869
4842
  }
4870
- /* Material Elevations extracted from:
4871
- https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
4872
- */
4873
- :root {
4874
- /* Shadow none */
4875
- --x-string-box-shadow-00: none;
4876
- /* Shadow 1dp */
4877
- --x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
4878
- 0 1px 3px 0 rgba(0, 0, 0, 0.2);
4879
- /* Shadow 2dp */
4880
- --x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
4881
- 0 1px 5px 0 rgba(0, 0, 0, 0.2);
4882
- /* Shadow 3dp */
4883
- --x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
4884
- 0 1px 8px 0 rgba(0, 0, 0, 0.2);
4885
- /* Shadow 4dp */
4886
- --x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
4887
- 0 2px 4px -1px rgba(0, 0, 0, 0.2);
4888
- /* Shadow 6dp */
4889
- --x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
4890
- 0 3px 5px -1px rgba(0, 0, 0, 0.2);
4891
- /* Shadow 8dp */
4892
- --x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
4893
- 0 5px 5px -3px rgba(0, 0, 0, 0.2);
4894
- /* Shadow 9dp */
4895
- --x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
4896
- 0 5px 6px -3px rgba(0, 0, 0, 0.2);
4897
- /* Shadow 12dp */
4898
- --x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
4899
- 0 7px 8px -4px rgba(0, 0, 0, 0.2);
4900
- /* Shadow 16dp */
4901
- --x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
4902
- 0 8px 10px -5px rgba(0, 0, 0, 0.2);
4903
- /* Shadow 24dp */
4904
- --x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
4905
- 0 11px 15px -7px rgba(0, 0, 0, 0.2);
4906
- /* BOTTOM ONLY SHADOW (not overflows on top of the element) */
4907
- /* Shadow 1dp */
4908
- --x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
4909
- 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
4910
- /* Shadow 2dp */
4911
- --x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
4912
- 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
4913
- /* Shadow 3dp */
4914
- --x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
4915
- 0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
4916
- /* Shadow 4dp */
4917
- --x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
4918
- 0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
4919
- /* Shadow 6dp */
4920
- --x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
4921
- 0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
4922
- /* Shadow 8dp */
4923
- --x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
4924
- 0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
4925
- /* Shadow 9dp */
4926
- --x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
4927
- 0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
4928
- /* Shadow 12dp */
4929
- --x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
4930
- 0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
4931
- /* Shadow 16dp */
4932
- --x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
4933
- 0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
4934
- /* Shadow 24dp */
4935
- --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
4936
- 0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
4843
+ [dir="rtl"] .x-border-radius--right-20 {
4844
+ border-bottom-left-radius: var(--x-size-base-20) !important;
4937
4845
  }
4938
- .dev-mode .slot-helper {
4939
- font-family: inherit;
4940
- color: grey;
4941
- box-sizing: border-box;
4942
- display: flex;
4943
- height: 100%;
4944
- width: 100%;
4945
- justify-content: center;
4946
- align-items: center;
4947
- border: dashed 1px grey;
4948
- border-radius: 10px;
4846
+ [dir="ltr"] .x-border-radius--left-20 {
4847
+ border-top-left-radius: var(--x-size-base-20) !important;
4949
4848
  }
4950
- .x-fill--lead {
4951
- fill: var(--x-color-base-lead) !important;
4849
+ [dir="rtl"] .x-border-radius--left-20 {
4850
+ border-top-right-radius: var(--x-size-base-20) !important;
4952
4851
  }
4953
-
4954
- .x-fill--auxiliary {
4955
- fill: var(--x-color-base-auxiliary) !important;
4852
+ [dir="ltr"] .x-border-radius--left-20 {
4853
+ border-bottom-left-radius: var(--x-size-base-20) !important;
4956
4854
  }
4957
-
4958
- .x-fill--neutral-10 {
4959
- fill: var(--x-color-base-neutral-10) !important;
4855
+ [dir="rtl"] .x-border-radius--left-20 {
4856
+ border-bottom-right-radius: var(--x-size-base-20) !important;
4960
4857
  }
4961
-
4962
- .x-fill--neutral-35 {
4963
- fill: var(--x-color-base-neutral-35) !important;
4858
+ [dir="ltr"] .x-border-radius--top-left-20 {
4859
+ border-top-left-radius: var(--x-size-base-20) !important;
4964
4860
  }
4965
-
4966
- .x-fill--neutral-70 {
4967
- fill: var(--x-color-base-neutral-70) !important;
4861
+ [dir="rtl"] .x-border-radius--top-left-20 {
4862
+ border-top-right-radius: var(--x-size-base-20) !important;
4968
4863
  }
4969
-
4970
- .x-fill--neutral-95 {
4971
- fill: var(--x-color-base-neutral-95) !important;
4864
+ [dir="ltr"] .x-border-radius--top-right-20 {
4865
+ border-top-right-radius: var(--x-size-base-20) !important;
4972
4866
  }
4973
-
4974
- .x-fill--neutral-100 {
4975
- fill: var(--x-color-base-neutral-100) !important;
4867
+ [dir="rtl"] .x-border-radius--top-right-20 {
4868
+ border-top-left-radius: var(--x-size-base-20) !important;
4976
4869
  }
4977
-
4978
- .x-fill--accent {
4979
- fill: var(--x-color-base-accent) !important;
4870
+ [dir="ltr"] .x-border-radius--bottom-left-20 {
4871
+ border-bottom-left-radius: var(--x-size-base-20) !important;
4980
4872
  }
4981
-
4982
- .x-fill--enable {
4983
- fill: var(--x-color-base-enable) !important;
4873
+ [dir="rtl"] .x-border-radius--bottom-left-20 {
4874
+ border-bottom-right-radius: var(--x-size-base-20) !important;
4984
4875
  }
4985
-
4986
- .x-fill--disable {
4987
- fill: var(--x-color-base-disable) !important;
4876
+ [dir="ltr"] .x-border-radius--bottom-right-20 {
4877
+ border-bottom-right-radius: var(--x-size-base-20) !important;
4988
4878
  }
4989
-
4990
- .x-fill--transparent {
4991
- fill: var(--x-color-base-transparent) !important;
4879
+ [dir="rtl"] .x-border-radius--bottom-right-20 {
4880
+ border-bottom-left-radius: var(--x-size-base-20) !important;
4992
4881
  }
4993
4882
  .x-flex-1 {
4994
4883
  flex: 1 1 0% !important;
@@ -5989,3 +5878,115 @@
5989
5878
  .x-sticky {
5990
5879
  position: sticky !important;
5991
5880
  }
5881
+
5882
+ .x-option-list {
5883
+ display: inline-flex;
5884
+ flex-flow: row nowrap;
5885
+ align-items: center;
5886
+ box-sizing: border-box;
5887
+ list-style-type: none;
5888
+ margin: 0;
5889
+ padding: 0;
5890
+ }
5891
+ [dir="ltr"] .x-option-list__item {
5892
+ border-right-width: var(--x-size-border-width-right-option-list-item-default);
5893
+ }
5894
+ [dir="rtl"] .x-option-list__item {
5895
+ border-left-width: var(--x-size-border-width-right-option-list-item-default);
5896
+ }
5897
+ [dir="ltr"] .x-option-list__item {
5898
+ border-left-width: var(--x-size-border-width-left-option-list-item-default);
5899
+ }
5900
+ [dir="rtl"] .x-option-list__item {
5901
+ border-right-width: var(--x-size-border-width-left-option-list-item-default);
5902
+ }
5903
+ .x-option-list__item {
5904
+ border-top-color: var(--x-color-border-top-option-list-item-default);
5905
+ border-right-color: var(--x-color-border-right-option-list-item-default);
5906
+ border-bottom-color: var(--x-color-border-bottom-option-list-item-default);
5907
+ border-left-color: var(--x-color-border-left-option-list-item-default);
5908
+ border-style: solid;
5909
+ border-top-width: var(--x-size-border-width-top-option-list-item-default);
5910
+ border-bottom-width: var(--x-size-border-width-bottom-option-list-item-default);
5911
+ }
5912
+ .x-option-list__item.x-option-list__item--is-selected {
5913
+ --x-color-border-option-list-item-default: var(
5914
+ --x-color-border-option-list-item-default-selected
5915
+ );
5916
+ --x-color-border-top-option-list-item-default: var(
5917
+ --x-color-border-top-option-list-item-default-selected
5918
+ );
5919
+ --x-color-border-right-option-list-item-default: var(
5920
+ --x-color-border-right-option-list-item-default-selected
5921
+ );
5922
+ --x-color-border-bottom-option-list-item-default: var(
5923
+ --x-color-border-bottom-option-list-item-default-selected
5924
+ );
5925
+ --x-color-border-left-option-list-item-default: var(
5926
+ --x-color-border-left-option-list-item-default-selected
5927
+ );
5928
+ --x-size-border-width-top-option-list-item-default: var(
5929
+ --x-size-border-width-top-option-list-item-default-selected
5930
+ );
5931
+ --x-size-border-width-right-option-list-item-default: var(
5932
+ --x-size-border-width-right-option-list-item-default-selected
5933
+ );
5934
+ --x-size-border-width-bottom-option-list-item-default: var(
5935
+ --x-size-border-width-bottom-option-list-item-default-selected
5936
+ );
5937
+ --x-size-border-width-left-option-list-item-default: var(
5938
+ --x-size-border-width-left-option-list-item-default-selected
5939
+ );
5940
+ }
5941
+ .x-option-list__item.x-option-list__item--is-selected .x-button {
5942
+ --x-color-background-button-default: var(
5943
+ --x-color-background-option-list-button-default-selected
5944
+ );
5945
+ --x-color-border-button-default: var(--x-color-border-option-list-button-default-selected);
5946
+ --x-color-text-button-default: var(--x-color-text-option-list-button-default-selected);
5947
+ --x-number-font-weight-option-list-button-default: var(
5948
+ --x-number-font-weight-option-list-button-default-selected
5949
+ );
5950
+ }
5951
+ .x-option-list__item.x-option-list__item--is-selected .x-button:hover {
5952
+ --x-color-background-button-default: var(
5953
+ --x-color-background-option-list-button-default-selected-hover
5954
+ );
5955
+ --x-color-border-button-default: var(
5956
+ --x-color-border-option-list-button-default-selected-hover
5957
+ );
5958
+ --x-color-text-button-default: var(
5959
+ --x-color-text-option-list-button-default-selected-hover
5960
+ );
5961
+ }
5962
+ .x-option-list__item:last-child {
5963
+ --x-size-border-width-option-list-item-default: 0;
5964
+ --x-size-border-width-top-option-list-item-default: 0;
5965
+ --x-size-border-width-right-option-list-item-default: 0;
5966
+ --x-size-border-width-bottom-option-list-item-default: 0;
5967
+ --x-size-border-width-left-option-list-item-default: 0;
5968
+ }
5969
+ .x-option-list__item .x-button {
5970
+ --x-color-background-button-default: var(--x-color-background-option-list-button-default);
5971
+ --x-color-border-button-default: var(--x-color-border-option-list-button-default);
5972
+ --x-color-text-button-default: var(--x-color-text-option-list-button-default);
5973
+ min-height: auto;
5974
+ --x-size-padding-button-default: var(--x-size-padding-option-list-button-default);
5975
+ --x-size-padding-top-button-default: var(--x-size-padding-top-option-list-button-default);
5976
+ --x-size-padding-right-button-default: var(--x-size-padding-right-option-list-button-default);
5977
+ --x-size-padding-bottom-button-default: var(
5978
+ --x-size-padding-bottom-option-list-button-default
5979
+ );
5980
+ --x-size-padding-left-button-default: var(--x-size-padding-left-option-list-button-default);
5981
+ --x-number-font-weight-button-default: var(--x-number-font-weight-option-list-button-default);
5982
+ --x-size-font-button-default: var(--x-size-font-option-list-button-default);
5983
+ }
5984
+ .x-option-list__item .x-button:hover {
5985
+ --x-color-background-button-default: var(
5986
+ --x-color-background-option-list-button-default-hover
5987
+ );
5988
+ --x-color-border-button-default: var(--x-color-border-option-list-button-default-hover);
5989
+ --x-color-text-button-default: var(--x-color-text-option-list-button-default-hover);
5990
+ -webkit-text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5991
+ text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5992
+ }