@empathyco/x-components 6.0.0-alpha.3 → 6.0.0-alpha.4

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 (17) hide show
  1. package/CHANGELOG.md +28 -1
  2. package/design-system/deprecated-full-theme.css +973 -974
  3. package/docs/API-reference/api/x-components.snippetconfigextraparams.md +1 -1
  4. package/docs/API-reference/api/x-components.tagging.md +17 -4
  5. package/docs/API-reference/components/tagging/x-components.tagging.md +2 -2
  6. package/js/x-modules/extra-params/components/snippet-config-extra-params.vue.js.map +1 -1
  7. package/js/x-modules/extra-params/components/snippet-config-extra-params.vue2.js +1 -1
  8. package/js/x-modules/extra-params/components/snippet-config-extra-params.vue2.js.map +1 -1
  9. package/js/x-modules/tagging/components/tagging.vue.js +8 -2
  10. package/js/x-modules/tagging/components/tagging.vue.js.map +1 -1
  11. package/package.json +3 -3
  12. package/report/x-components.api.json +17 -8
  13. package/report/x-components.api.md +18 -5
  14. package/tools/inject-css.js +5 -3
  15. package/types/x-modules/extra-params/components/snippet-config-extra-params.vue.d.ts +1 -1
  16. package/types/x-modules/tagging/components/tagging.vue.d.ts +17 -4
  17. package/types/x-modules/tagging/components/tagging.vue.d.ts.map +1 -1
package/design-system/deprecated-full-theme.css CHANGED
@@ -1,5 +1,19 @@
1
1
 
2
+ .x-uppercase {
3
+ text-transform: uppercase;
4
+ }
5
+
6
+ .x-lowercase {
7
+ text-transform: lowercase;
8
+ }
9
+
10
+ .x-capitalize {
11
+ text-transform: capitalize;
12
+ }
2
13
 
14
+ .x-normal-case {
15
+ text-transform: none;
16
+ }
3
17
  .x-underline {
4
18
  -webkit-text-decoration-line: underline;
5
19
  text-decoration-line: underline;
@@ -38,923 +52,908 @@
38
52
  .x-sticky {
39
53
  position: sticky !important;
40
54
  }
41
- .x-margin--auto {
42
- margin: auto !important;
55
+ .x-padding--00 {
56
+ padding: 0 !important;
43
57
  }
44
- .x-margin--00 {
45
- margin: 0 !important;
58
+ .x-padding--01 {
59
+ padding: var(--x-size-base-01) !important;
46
60
  }
47
- .x-margin--01 {
48
- margin: var(--x-size-base-01) !important;
61
+ .x-padding--02 {
62
+ padding: var(--x-size-base-02) !important;
49
63
  }
50
- .x-margin--02 {
51
- margin: var(--x-size-base-02) !important;
64
+ .x-padding--03 {
65
+ padding: var(--x-size-base-03) !important;
52
66
  }
53
- .x-margin--03 {
54
- margin: var(--x-size-base-03) !important;
67
+ .x-padding--04 {
68
+ padding: var(--x-size-base-04) !important;
55
69
  }
56
- .x-margin--04 {
57
- margin: var(--x-size-base-04) !important;
70
+ .x-padding--05 {
71
+ padding: var(--x-size-base-05) !important;
58
72
  }
59
- .x-margin--05 {
60
- margin: var(--x-size-base-05) !important;
73
+ .x-padding--06 {
74
+ padding: var(--x-size-base-06) !important;
61
75
  }
62
- .x-margin--06 {
63
- margin: var(--x-size-base-06) !important;
76
+ .x-padding--07 {
77
+ padding: var(--x-size-base-07) !important;
64
78
  }
65
- .x-margin--07 {
66
- margin: var(--x-size-base-07) !important;
79
+ .x-padding--08 {
80
+ padding: var(--x-size-base-08) !important;
67
81
  }
68
- .x-margin--08 {
69
- margin: var(--x-size-base-08) !important;
82
+ .x-padding--09 {
83
+ padding: var(--x-size-base-09) !important;
70
84
  }
71
- .x-margin--09 {
72
- margin: var(--x-size-base-09) !important;
85
+ .x-padding--10 {
86
+ padding: var(--x-size-base-10) !important;
73
87
  }
74
- .x-margin--10 {
75
- margin: var(--x-size-base-10) !important;
88
+ .x-padding--11 {
89
+ padding: var(--x-size-base-11) !important;
76
90
  }
77
- .x-margin--11 {
78
- margin: var(--x-size-base-11) !important;
91
+ .x-padding--12 {
92
+ padding: var(--x-size-base-12) !important;
79
93
  }
80
- .x-margin--12 {
81
- margin: var(--x-size-base-12) !important;
94
+ .x-padding--13 {
95
+ padding: var(--x-size-base-13) !important;
82
96
  }
83
- .x-margin--13 {
84
- margin: var(--x-size-base-13) !important;
97
+ .x-padding--14 {
98
+ padding: var(--x-size-base-14) !important;
85
99
  }
86
- .x-margin--14 {
87
- margin: var(--x-size-base-14) !important;
100
+ .x-padding--15 {
101
+ padding: var(--x-size-base-15) !important;
88
102
  }
89
- .x-margin--15 {
90
- margin: var(--x-size-base-15) !important;
103
+ .x-padding--16 {
104
+ padding: var(--x-size-base-16) !important;
91
105
  }
92
- .x-margin--16 {
93
- margin: var(--x-size-base-16) !important;
106
+ .x-padding--17 {
107
+ padding: var(--x-size-base-17) !important;
94
108
  }
95
- .x-margin--17 {
96
- margin: var(--x-size-base-17) !important;
109
+ .x-padding--18 {
110
+ padding: var(--x-size-base-18) !important;
97
111
  }
98
- .x-margin--18 {
99
- margin: var(--x-size-base-18) !important;
112
+ .x-padding--19 {
113
+ padding: var(--x-size-base-19) !important;
100
114
  }
101
- .x-margin--19 {
102
- margin: var(--x-size-base-19) !important;
115
+ .x-padding--20 {
116
+ padding: var(--x-size-base-20) !important;
103
117
  }
104
- .x-margin--20 {
105
- margin: var(--x-size-base-20) !important;
118
+ .x-padding--top-00 {
119
+ padding-top: 0 !important;
106
120
  }
107
- .x-margin--top-auto {
108
- margin-top: auto !important;
121
+ .x-padding--bottom-00 {
122
+ padding-bottom: 0 !important;
109
123
  }
110
- .x-margin--bottom-auto {
111
- margin-bottom: auto !important;
124
+ [dir="ltr"] .x-padding--right-00 {
125
+ padding-right: 0 !important;
112
126
  }
113
- [dir="ltr"] .x-margin--right-auto {
114
- margin-right: auto !important;
127
+ [dir="rtl"] .x-padding--right-00 {
128
+ padding-left: 0 !important;
115
129
  }
116
- [dir="rtl"] .x-margin--right-auto {
117
- margin-left: auto !important;
130
+ [dir="ltr"] .x-padding--left-00 {
131
+ padding-left: 0 !important;
118
132
  }
119
- [dir="ltr"] .x-margin--left-auto {
120
- margin-left: auto !important;
133
+ [dir="rtl"] .x-padding--left-00 {
134
+ padding-right: 0 !important;
121
135
  }
122
- [dir="rtl"] .x-margin--left-auto {
123
- margin-right: auto !important;
136
+ .x-padding--top-01 {
137
+ padding-top: var(--x-size-base-01) !important;
124
138
  }
125
- .x-margin--top-00 {
126
- margin-top: 0 !important;
139
+ .x-padding--bottom-01 {
140
+ padding-bottom: var(--x-size-base-01) !important;
127
141
  }
128
- .x-margin--bottom-00 {
129
- margin-bottom: 0 !important;
142
+ [dir="ltr"] .x-padding--right-01 {
143
+ padding-right: var(--x-size-base-01) !important;
130
144
  }
131
- [dir="ltr"] .x-margin--right-00 {
132
- margin-right: 0 !important;
145
+ [dir="rtl"] .x-padding--right-01 {
146
+ padding-left: var(--x-size-base-01) !important;
133
147
  }
134
- [dir="rtl"] .x-margin--right-00 {
135
- margin-left: 0 !important;
148
+ [dir="ltr"] .x-padding--left-01 {
149
+ padding-left: var(--x-size-base-01) !important;
136
150
  }
137
- [dir="ltr"] .x-margin--left-00 {
138
- margin-left: 0 !important;
151
+ [dir="rtl"] .x-padding--left-01 {
152
+ padding-right: var(--x-size-base-01) !important;
139
153
  }
140
- [dir="rtl"] .x-margin--left-00 {
141
- margin-right: 0 !important;
154
+ .x-padding--top-02 {
155
+ padding-top: var(--x-size-base-02) !important;
142
156
  }
143
- .x-margin--top-01 {
144
- margin-top: var(--x-size-base-01) !important;
157
+ .x-padding--bottom-02 {
158
+ padding-bottom: var(--x-size-base-02) !important;
145
159
  }
146
- .x-margin--bottom-01 {
147
- margin-bottom: var(--x-size-base-01) !important;
160
+ [dir="ltr"] .x-padding--right-02 {
161
+ padding-right: var(--x-size-base-02) !important;
148
162
  }
149
- [dir="ltr"] .x-margin--right-01 {
150
- margin-right: var(--x-size-base-01) !important;
163
+ [dir="rtl"] .x-padding--right-02 {
164
+ padding-left: var(--x-size-base-02) !important;
151
165
  }
152
- [dir="rtl"] .x-margin--right-01 {
153
- margin-left: var(--x-size-base-01) !important;
166
+ [dir="ltr"] .x-padding--left-02 {
167
+ padding-left: var(--x-size-base-02) !important;
154
168
  }
155
- [dir="ltr"] .x-margin--left-01 {
156
- margin-left: var(--x-size-base-01) !important;
169
+ [dir="rtl"] .x-padding--left-02 {
170
+ padding-right: var(--x-size-base-02) !important;
157
171
  }
158
- [dir="rtl"] .x-margin--left-01 {
159
- margin-right: var(--x-size-base-01) !important;
172
+ .x-padding--top-03 {
173
+ padding-top: var(--x-size-base-03) !important;
160
174
  }
161
- .x-margin--top-02 {
162
- margin-top: var(--x-size-base-02) !important;
175
+ .x-padding--bottom-03 {
176
+ padding-bottom: var(--x-size-base-03) !important;
163
177
  }
164
- .x-margin--bottom-02 {
165
- margin-bottom: var(--x-size-base-02) !important;
178
+ [dir="ltr"] .x-padding--right-03 {
179
+ padding-right: var(--x-size-base-03) !important;
166
180
  }
167
- [dir="ltr"] .x-margin--right-02 {
168
- margin-right: var(--x-size-base-02) !important;
181
+ [dir="rtl"] .x-padding--right-03 {
182
+ padding-left: var(--x-size-base-03) !important;
169
183
  }
170
- [dir="rtl"] .x-margin--right-02 {
171
- margin-left: var(--x-size-base-02) !important;
184
+ [dir="ltr"] .x-padding--left-03 {
185
+ padding-left: var(--x-size-base-03) !important;
172
186
  }
173
- [dir="ltr"] .x-margin--left-02 {
174
- margin-left: var(--x-size-base-02) !important;
187
+ [dir="rtl"] .x-padding--left-03 {
188
+ padding-right: var(--x-size-base-03) !important;
175
189
  }
176
- [dir="rtl"] .x-margin--left-02 {
177
- margin-right: var(--x-size-base-02) !important;
190
+ .x-padding--top-04 {
191
+ padding-top: var(--x-size-base-04) !important;
178
192
  }
179
- .x-margin--top-03 {
180
- margin-top: var(--x-size-base-03) !important;
193
+ .x-padding--bottom-04 {
194
+ padding-bottom: var(--x-size-base-04) !important;
181
195
  }
182
- .x-margin--bottom-03 {
183
- margin-bottom: var(--x-size-base-03) !important;
196
+ [dir="ltr"] .x-padding--right-04 {
197
+ padding-right: var(--x-size-base-04) !important;
184
198
  }
185
- [dir="ltr"] .x-margin--right-03 {
186
- margin-right: var(--x-size-base-03) !important;
199
+ [dir="rtl"] .x-padding--right-04 {
200
+ padding-left: var(--x-size-base-04) !important;
187
201
  }
188
- [dir="rtl"] .x-margin--right-03 {
189
- margin-left: var(--x-size-base-03) !important;
202
+ [dir="ltr"] .x-padding--left-04 {
203
+ padding-left: var(--x-size-base-04) !important;
190
204
  }
191
- [dir="ltr"] .x-margin--left-03 {
192
- margin-left: var(--x-size-base-03) !important;
205
+ [dir="rtl"] .x-padding--left-04 {
206
+ padding-right: var(--x-size-base-04) !important;
193
207
  }
194
- [dir="rtl"] .x-margin--left-03 {
195
- margin-right: var(--x-size-base-03) !important;
208
+ .x-padding--top-05 {
209
+ padding-top: var(--x-size-base-05) !important;
196
210
  }
197
- .x-margin--top-04 {
198
- margin-top: var(--x-size-base-04) !important;
211
+ .x-padding--bottom-05 {
212
+ padding-bottom: var(--x-size-base-05) !important;
199
213
  }
200
- .x-margin--bottom-04 {
201
- margin-bottom: var(--x-size-base-04) !important;
214
+ [dir="ltr"] .x-padding--right-05 {
215
+ padding-right: var(--x-size-base-05) !important;
202
216
  }
203
- [dir="ltr"] .x-margin--right-04 {
204
- margin-right: var(--x-size-base-04) !important;
217
+ [dir="rtl"] .x-padding--right-05 {
218
+ padding-left: var(--x-size-base-05) !important;
205
219
  }
206
- [dir="rtl"] .x-margin--right-04 {
207
- margin-left: var(--x-size-base-04) !important;
220
+ [dir="ltr"] .x-padding--left-05 {
221
+ padding-left: var(--x-size-base-05) !important;
208
222
  }
209
- [dir="ltr"] .x-margin--left-04 {
210
- margin-left: var(--x-size-base-04) !important;
223
+ [dir="rtl"] .x-padding--left-05 {
224
+ padding-right: var(--x-size-base-05) !important;
211
225
  }
212
- [dir="rtl"] .x-margin--left-04 {
213
- margin-right: var(--x-size-base-04) !important;
226
+ .x-padding--top-06 {
227
+ padding-top: var(--x-size-base-06) !important;
214
228
  }
215
- .x-margin--top-05 {
216
- margin-top: var(--x-size-base-05) !important;
229
+ .x-padding--bottom-06 {
230
+ padding-bottom: var(--x-size-base-06) !important;
217
231
  }
218
- .x-margin--bottom-05 {
219
- margin-bottom: var(--x-size-base-05) !important;
232
+ [dir="ltr"] .x-padding--right-06 {
233
+ padding-right: var(--x-size-base-06) !important;
220
234
  }
221
- [dir="ltr"] .x-margin--right-05 {
222
- margin-right: var(--x-size-base-05) !important;
223
- }
224
- [dir="rtl"] .x-margin--right-05 {
225
- margin-left: var(--x-size-base-05) !important;
226
- }
227
- [dir="ltr"] .x-margin--left-05 {
228
- margin-left: var(--x-size-base-05) !important;
229
- }
230
- [dir="rtl"] .x-margin--left-05 {
231
- margin-right: var(--x-size-base-05) !important;
232
- }
233
- .x-margin--top-06 {
234
- margin-top: var(--x-size-base-06) !important;
235
+ [dir="rtl"] .x-padding--right-06 {
236
+ padding-left: var(--x-size-base-06) !important;
235
237
  }
236
- .x-margin--bottom-06 {
237
- margin-bottom: var(--x-size-base-06) !important;
238
+ [dir="ltr"] .x-padding--left-06 {
239
+ padding-left: var(--x-size-base-06) !important;
238
240
  }
239
- [dir="ltr"] .x-margin--right-06 {
240
- margin-right: var(--x-size-base-06) !important;
241
+ [dir="rtl"] .x-padding--left-06 {
242
+ padding-right: var(--x-size-base-06) !important;
241
243
  }
242
- [dir="rtl"] .x-margin--right-06 {
243
- margin-left: var(--x-size-base-06) !important;
244
+ .x-padding--top-07 {
245
+ padding-top: var(--x-size-base-07) !important;
244
246
  }
245
- [dir="ltr"] .x-margin--left-06 {
246
- margin-left: var(--x-size-base-06) !important;
247
+ .x-padding--bottom-07 {
248
+ padding-bottom: var(--x-size-base-07) !important;
247
249
  }
248
- [dir="rtl"] .x-margin--left-06 {
249
- margin-right: var(--x-size-base-06) !important;
250
+ [dir="ltr"] .x-padding--right-07 {
251
+ padding-right: var(--x-size-base-07) !important;
250
252
  }
251
- .x-margin--top-07 {
252
- margin-top: var(--x-size-base-07) !important;
253
+ [dir="rtl"] .x-padding--right-07 {
254
+ padding-left: var(--x-size-base-07) !important;
253
255
  }
254
- .x-margin--bottom-07 {
255
- margin-bottom: var(--x-size-base-07) !important;
256
+ [dir="ltr"] .x-padding--left-07 {
257
+ padding-left: var(--x-size-base-07) !important;
256
258
  }
257
- [dir="ltr"] .x-margin--right-07 {
258
- margin-right: var(--x-size-base-07) !important;
259
+ [dir="rtl"] .x-padding--left-07 {
260
+ padding-right: var(--x-size-base-07) !important;
259
261
  }
260
- [dir="rtl"] .x-margin--right-07 {
261
- margin-left: var(--x-size-base-07) !important;
262
+ .x-padding--top-08 {
263
+ padding-top: var(--x-size-base-08) !important;
262
264
  }
263
- [dir="ltr"] .x-margin--left-07 {
264
- margin-left: var(--x-size-base-07) !important;
265
+ .x-padding--bottom-08 {
266
+ padding-bottom: var(--x-size-base-08) !important;
265
267
  }
266
- [dir="rtl"] .x-margin--left-07 {
267
- margin-right: var(--x-size-base-07) !important;
268
+ [dir="ltr"] .x-padding--right-08 {
269
+ padding-right: var(--x-size-base-08) !important;
268
270
  }
269
- .x-margin--top-08 {
270
- margin-top: var(--x-size-base-08) !important;
271
+ [dir="rtl"] .x-padding--right-08 {
272
+ padding-left: var(--x-size-base-08) !important;
271
273
  }
272
- .x-margin--bottom-08 {
273
- margin-bottom: var(--x-size-base-08) !important;
274
+ [dir="ltr"] .x-padding--left-08 {
275
+ padding-left: var(--x-size-base-08) !important;
274
276
  }
275
- [dir="ltr"] .x-margin--right-08 {
276
- margin-right: var(--x-size-base-08) !important;
277
+ [dir="rtl"] .x-padding--left-08 {
278
+ padding-right: var(--x-size-base-08) !important;
277
279
  }
278
- [dir="rtl"] .x-margin--right-08 {
279
- margin-left: var(--x-size-base-08) !important;
280
+ .x-padding--top-09 {
281
+ padding-top: var(--x-size-base-09) !important;
280
282
  }
281
- [dir="ltr"] .x-margin--left-08 {
282
- margin-left: var(--x-size-base-08) !important;
283
+ .x-padding--bottom-09 {
284
+ padding-bottom: var(--x-size-base-09) !important;
283
285
  }
284
- [dir="rtl"] .x-margin--left-08 {
285
- margin-right: var(--x-size-base-08) !important;
286
+ [dir="ltr"] .x-padding--right-09 {
287
+ padding-right: var(--x-size-base-09) !important;
286
288
  }
287
- .x-margin--top-09 {
288
- margin-top: var(--x-size-base-09) !important;
289
+ [dir="rtl"] .x-padding--right-09 {
290
+ padding-left: var(--x-size-base-09) !important;
289
291
  }
290
- .x-margin--bottom-09 {
291
- margin-bottom: var(--x-size-base-09) !important;
292
+ [dir="ltr"] .x-padding--left-09 {
293
+ padding-left: var(--x-size-base-09) !important;
292
294
  }
293
- [dir="ltr"] .x-margin--right-09 {
294
- margin-right: var(--x-size-base-09) !important;
295
+ [dir="rtl"] .x-padding--left-09 {
296
+ padding-right: var(--x-size-base-09) !important;
295
297
  }
296
- [dir="rtl"] .x-margin--right-09 {
297
- margin-left: var(--x-size-base-09) !important;
298
+ .x-padding--top-10 {
299
+ padding-top: var(--x-size-base-10) !important;
298
300
  }
299
- [dir="ltr"] .x-margin--left-09 {
300
- margin-left: var(--x-size-base-09) !important;
301
+ .x-padding--bottom-10 {
302
+ padding-bottom: var(--x-size-base-10) !important;
301
303
  }
302
- [dir="rtl"] .x-margin--left-09 {
303
- margin-right: var(--x-size-base-09) !important;
304
+ [dir="ltr"] .x-padding--right-10 {
305
+ padding-right: var(--x-size-base-10) !important;
304
306
  }
305
- .x-margin--top-10 {
306
- margin-top: var(--x-size-base-10) !important;
307
+ [dir="rtl"] .x-padding--right-10 {
308
+ padding-left: var(--x-size-base-10) !important;
307
309
  }
308
- .x-margin--bottom-10 {
309
- margin-bottom: var(--x-size-base-10) !important;
310
+ [dir="ltr"] .x-padding--left-10 {
311
+ padding-left: var(--x-size-base-10) !important;
310
312
  }
311
- [dir="ltr"] .x-margin--right-10 {
312
- margin-right: var(--x-size-base-10) !important;
313
+ [dir="rtl"] .x-padding--left-10 {
314
+ padding-right: var(--x-size-base-10) !important;
313
315
  }
314
- [dir="rtl"] .x-margin--right-10 {
315
- margin-left: var(--x-size-base-10) !important;
316
+ .x-padding--top-11 {
317
+ padding-top: var(--x-size-base-11) !important;
316
318
  }
317
- [dir="ltr"] .x-margin--left-10 {
318
- margin-left: var(--x-size-base-10) !important;
319
+ .x-padding--bottom-11 {
320
+ padding-bottom: var(--x-size-base-11) !important;
319
321
  }
320
- [dir="rtl"] .x-margin--left-10 {
321
- margin-right: var(--x-size-base-10) !important;
322
+ [dir="ltr"] .x-padding--right-11 {
323
+ padding-right: var(--x-size-base-11) !important;
322
324
  }
323
- .x-margin--top-11 {
324
- margin-top: var(--x-size-base-11) !important;
325
+ [dir="rtl"] .x-padding--right-11 {
326
+ padding-left: var(--x-size-base-11) !important;
325
327
  }
326
- .x-margin--bottom-11 {
327
- margin-bottom: var(--x-size-base-11) !important;
328
+ [dir="ltr"] .x-padding--left-11 {
329
+ padding-left: var(--x-size-base-11) !important;
328
330
  }
329
- [dir="ltr"] .x-margin--right-11 {
330
- margin-right: var(--x-size-base-11) !important;
331
+ [dir="rtl"] .x-padding--left-11 {
332
+ padding-right: var(--x-size-base-11) !important;
331
333
  }
332
- [dir="rtl"] .x-margin--right-11 {
333
- margin-left: var(--x-size-base-11) !important;
334
+ .x-padding--top-12 {
335
+ padding-top: var(--x-size-base-12) !important;
334
336
  }
335
- [dir="ltr"] .x-margin--left-11 {
336
- margin-left: var(--x-size-base-11) !important;
337
+ .x-padding--bottom-12 {
338
+ padding-bottom: var(--x-size-base-12) !important;
337
339
  }
338
- [dir="rtl"] .x-margin--left-11 {
339
- margin-right: var(--x-size-base-11) !important;
340
+ [dir="ltr"] .x-padding--right-12 {
341
+ padding-right: var(--x-size-base-12) !important;
340
342
  }
341
- .x-margin--top-12 {
342
- margin-top: var(--x-size-base-12) !important;
343
+ [dir="rtl"] .x-padding--right-12 {
344
+ padding-left: var(--x-size-base-12) !important;
343
345
  }
344
- .x-margin--bottom-12 {
345
- margin-bottom: var(--x-size-base-12) !important;
346
+ [dir="ltr"] .x-padding--left-12 {
347
+ padding-left: var(--x-size-base-12) !important;
346
348
  }
347
- [dir="ltr"] .x-margin--right-12 {
348
- margin-right: var(--x-size-base-12) !important;
349
+ [dir="rtl"] .x-padding--left-12 {
350
+ padding-right: var(--x-size-base-12) !important;
349
351
  }
350
- [dir="rtl"] .x-margin--right-12 {
351
- margin-left: var(--x-size-base-12) !important;
352
+ .x-padding--top-13 {
353
+ padding-top: var(--x-size-base-13) !important;
352
354
  }
353
- [dir="ltr"] .x-margin--left-12 {
354
- margin-left: var(--x-size-base-12) !important;
355
+ .x-padding--bottom-13 {
356
+ padding-bottom: var(--x-size-base-13) !important;
355
357
  }
356
- [dir="rtl"] .x-margin--left-12 {
357
- margin-right: var(--x-size-base-12) !important;
358
+ [dir="ltr"] .x-padding--right-13 {
359
+ padding-right: var(--x-size-base-13) !important;
358
360
  }
359
- .x-margin--top-13 {
360
- margin-top: var(--x-size-base-13) !important;
361
+ [dir="rtl"] .x-padding--right-13 {
362
+ padding-left: var(--x-size-base-13) !important;
361
363
  }
362
- .x-margin--bottom-13 {
363
- margin-bottom: var(--x-size-base-13) !important;
364
+ [dir="ltr"] .x-padding--left-13 {
365
+ padding-left: var(--x-size-base-13) !important;
364
366
  }
365
- [dir="ltr"] .x-margin--right-13 {
366
- margin-right: var(--x-size-base-13) !important;
367
+ [dir="rtl"] .x-padding--left-13 {
368
+ padding-right: var(--x-size-base-13) !important;
367
369
  }
368
- [dir="rtl"] .x-margin--right-13 {
369
- margin-left: var(--x-size-base-13) !important;
370
+ .x-padding--top-14 {
371
+ padding-top: var(--x-size-base-14) !important;
370
372
  }
371
- [dir="ltr"] .x-margin--left-13 {
372
- margin-left: var(--x-size-base-13) !important;
373
+ .x-padding--bottom-14 {
374
+ padding-bottom: var(--x-size-base-14) !important;
373
375
  }
374
- [dir="rtl"] .x-margin--left-13 {
375
- margin-right: var(--x-size-base-13) !important;
376
+ [dir="ltr"] .x-padding--right-14 {
377
+ padding-right: var(--x-size-base-14) !important;
376
378
  }
377
- .x-margin--top-14 {
378
- margin-top: var(--x-size-base-14) !important;
379
+ [dir="rtl"] .x-padding--right-14 {
380
+ padding-left: var(--x-size-base-14) !important;
379
381
  }
380
- .x-margin--bottom-14 {
381
- margin-bottom: var(--x-size-base-14) !important;
382
+ [dir="ltr"] .x-padding--left-14 {
383
+ padding-left: var(--x-size-base-14) !important;
382
384
  }
383
- [dir="ltr"] .x-margin--right-14 {
384
- margin-right: var(--x-size-base-14) !important;
385
+ [dir="rtl"] .x-padding--left-14 {
386
+ padding-right: var(--x-size-base-14) !important;
385
387
  }
386
- [dir="rtl"] .x-margin--right-14 {
387
- margin-left: var(--x-size-base-14) !important;
388
+ .x-padding--top-15 {
389
+ padding-top: var(--x-size-base-15) !important;
388
390
  }
389
- [dir="ltr"] .x-margin--left-14 {
390
- margin-left: var(--x-size-base-14) !important;
391
+ .x-padding--bottom-15 {
392
+ padding-bottom: var(--x-size-base-15) !important;
391
393
  }
392
- [dir="rtl"] .x-margin--left-14 {
393
- margin-right: var(--x-size-base-14) !important;
394
+ [dir="ltr"] .x-padding--right-15 {
395
+ padding-right: var(--x-size-base-15) !important;
394
396
  }
395
- .x-margin--top-15 {
396
- margin-top: var(--x-size-base-15) !important;
397
+ [dir="rtl"] .x-padding--right-15 {
398
+ padding-left: var(--x-size-base-15) !important;
397
399
  }
398
- .x-margin--bottom-15 {
399
- margin-bottom: var(--x-size-base-15) !important;
400
+ [dir="ltr"] .x-padding--left-15 {
401
+ padding-left: var(--x-size-base-15) !important;
400
402
  }
401
- [dir="ltr"] .x-margin--right-15 {
402
- margin-right: var(--x-size-base-15) !important;
403
+ [dir="rtl"] .x-padding--left-15 {
404
+ padding-right: var(--x-size-base-15) !important;
403
405
  }
404
- [dir="rtl"] .x-margin--right-15 {
405
- margin-left: var(--x-size-base-15) !important;
406
+ .x-padding--top-16 {
407
+ padding-top: var(--x-size-base-16) !important;
406
408
  }
407
- [dir="ltr"] .x-margin--left-15 {
408
- margin-left: var(--x-size-base-15) !important;
409
+ .x-padding--bottom-16 {
410
+ padding-bottom: var(--x-size-base-16) !important;
409
411
  }
410
- [dir="rtl"] .x-margin--left-15 {
411
- margin-right: var(--x-size-base-15) !important;
412
+ [dir="ltr"] .x-padding--right-16 {
413
+ padding-right: var(--x-size-base-16) !important;
412
414
  }
413
- .x-margin--top-16 {
414
- margin-top: var(--x-size-base-16) !important;
415
+ [dir="rtl"] .x-padding--right-16 {
416
+ padding-left: var(--x-size-base-16) !important;
415
417
  }
416
- .x-margin--bottom-16 {
417
- margin-bottom: var(--x-size-base-16) !important;
418
+ [dir="ltr"] .x-padding--left-16 {
419
+ padding-left: var(--x-size-base-16) !important;
418
420
  }
419
- [dir="ltr"] .x-margin--right-16 {
420
- margin-right: var(--x-size-base-16) !important;
421
+ [dir="rtl"] .x-padding--left-16 {
422
+ padding-right: var(--x-size-base-16) !important;
421
423
  }
422
- [dir="rtl"] .x-margin--right-16 {
423
- margin-left: var(--x-size-base-16) !important;
424
+ .x-padding--top-17 {
425
+ padding-top: var(--x-size-base-17) !important;
424
426
  }
425
- [dir="ltr"] .x-margin--left-16 {
426
- margin-left: var(--x-size-base-16) !important;
427
+ .x-padding--bottom-17 {
428
+ padding-bottom: var(--x-size-base-17) !important;
427
429
  }
428
- [dir="rtl"] .x-margin--left-16 {
429
- margin-right: var(--x-size-base-16) !important;
430
+ [dir="ltr"] .x-padding--right-17 {
431
+ padding-right: var(--x-size-base-17) !important;
430
432
  }
431
- .x-margin--top-17 {
432
- margin-top: var(--x-size-base-17) !important;
433
+ [dir="rtl"] .x-padding--right-17 {
434
+ padding-left: var(--x-size-base-17) !important;
433
435
  }
434
- .x-margin--bottom-17 {
435
- margin-bottom: var(--x-size-base-17) !important;
436
+ [dir="ltr"] .x-padding--left-17 {
437
+ padding-left: var(--x-size-base-17) !important;
436
438
  }
437
- [dir="ltr"] .x-margin--right-17 {
438
- margin-right: var(--x-size-base-17) !important;
439
+ [dir="rtl"] .x-padding--left-17 {
440
+ padding-right: var(--x-size-base-17) !important;
439
441
  }
440
- [dir="rtl"] .x-margin--right-17 {
441
- margin-left: var(--x-size-base-17) !important;
442
+ .x-padding--top-18 {
443
+ padding-top: var(--x-size-base-18) !important;
442
444
  }
443
- [dir="ltr"] .x-margin--left-17 {
444
- margin-left: var(--x-size-base-17) !important;
445
+ .x-padding--bottom-18 {
446
+ padding-bottom: var(--x-size-base-18) !important;
445
447
  }
446
- [dir="rtl"] .x-margin--left-17 {
447
- margin-right: var(--x-size-base-17) !important;
448
+ [dir="ltr"] .x-padding--right-18 {
449
+ padding-right: var(--x-size-base-18) !important;
448
450
  }
449
- .x-margin--top-18 {
450
- margin-top: var(--x-size-base-18) !important;
451
+ [dir="rtl"] .x-padding--right-18 {
452
+ padding-left: var(--x-size-base-18) !important;
451
453
  }
452
- .x-margin--bottom-18 {
453
- margin-bottom: var(--x-size-base-18) !important;
454
+ [dir="ltr"] .x-padding--left-18 {
455
+ padding-left: var(--x-size-base-18) !important;
454
456
  }
455
- [dir="ltr"] .x-margin--right-18 {
456
- margin-right: var(--x-size-base-18) !important;
457
+ [dir="rtl"] .x-padding--left-18 {
458
+ padding-right: var(--x-size-base-18) !important;
457
459
  }
458
- [dir="rtl"] .x-margin--right-18 {
459
- margin-left: var(--x-size-base-18) !important;
460
+ .x-padding--top-19 {
461
+ padding-top: var(--x-size-base-19) !important;
460
462
  }
461
- [dir="ltr"] .x-margin--left-18 {
462
- margin-left: var(--x-size-base-18) !important;
463
+ .x-padding--bottom-19 {
464
+ padding-bottom: var(--x-size-base-19) !important;
463
465
  }
464
- [dir="rtl"] .x-margin--left-18 {
465
- margin-right: var(--x-size-base-18) !important;
466
+ [dir="ltr"] .x-padding--right-19 {
467
+ padding-right: var(--x-size-base-19) !important;
466
468
  }
467
- .x-margin--top-19 {
468
- margin-top: var(--x-size-base-19) !important;
469
+ [dir="rtl"] .x-padding--right-19 {
470
+ padding-left: var(--x-size-base-19) !important;
469
471
  }
470
- .x-margin--bottom-19 {
471
- margin-bottom: var(--x-size-base-19) !important;
472
+ [dir="ltr"] .x-padding--left-19 {
473
+ padding-left: var(--x-size-base-19) !important;
472
474
  }
473
- [dir="ltr"] .x-margin--right-19 {
474
- margin-right: var(--x-size-base-19) !important;
475
+ [dir="rtl"] .x-padding--left-19 {
476
+ padding-right: var(--x-size-base-19) !important;
475
477
  }
476
- [dir="rtl"] .x-margin--right-19 {
477
- margin-left: var(--x-size-base-19) !important;
478
+ .x-padding--top-20 {
479
+ padding-top: var(--x-size-base-20) !important;
478
480
  }
479
- [dir="ltr"] .x-margin--left-19 {
480
- margin-left: var(--x-size-base-19) !important;
481
+ .x-padding--bottom-20 {
482
+ padding-bottom: var(--x-size-base-20) !important;
481
483
  }
482
- [dir="rtl"] .x-margin--left-19 {
483
- margin-right: var(--x-size-base-19) !important;
484
+ [dir="ltr"] .x-padding--right-20 {
485
+ padding-right: var(--x-size-base-20) !important;
484
486
  }
485
- .x-margin--top-20 {
486
- margin-top: var(--x-size-base-20) !important;
487
+ [dir="rtl"] .x-padding--right-20 {
488
+ padding-left: var(--x-size-base-20) !important;
487
489
  }
488
- .x-margin--bottom-20 {
489
- margin-bottom: var(--x-size-base-20) !important;
490
+ [dir="ltr"] .x-padding--left-20 {
491
+ padding-left: var(--x-size-base-20) !important;
490
492
  }
491
- [dir="ltr"] .x-margin--right-20 {
492
- margin-right: var(--x-size-base-20) !important;
493
+ [dir="rtl"] .x-padding--left-20 {
494
+ padding-right: var(--x-size-base-20) !important;
493
495
  }
494
- [dir="rtl"] .x-margin--right-20 {
495
- margin-left: var(--x-size-base-20) !important;
496
+ .x-margin--auto {
497
+ margin: auto !important;
496
498
  }
497
- [dir="ltr"] .x-margin--left-20 {
498
- margin-left: var(--x-size-base-20) !important;
499
+ .x-margin--00 {
500
+ margin: 0 !important;
499
501
  }
500
- [dir="rtl"] .x-margin--left-20 {
501
- margin-right: var(--x-size-base-20) !important;
502
+ .x-margin--01 {
503
+ margin: var(--x-size-base-01) !important;
502
504
  }
503
- .x-padding--00 {
504
- padding: 0 !important;
505
+ .x-margin--02 {
506
+ margin: var(--x-size-base-02) !important;
505
507
  }
506
- .x-padding--01 {
507
- padding: var(--x-size-base-01) !important;
508
+ .x-margin--03 {
509
+ margin: var(--x-size-base-03) !important;
508
510
  }
509
- .x-padding--02 {
510
- padding: var(--x-size-base-02) !important;
511
+ .x-margin--04 {
512
+ margin: var(--x-size-base-04) !important;
511
513
  }
512
- .x-padding--03 {
513
- padding: var(--x-size-base-03) !important;
514
+ .x-margin--05 {
515
+ margin: var(--x-size-base-05) !important;
514
516
  }
515
- .x-padding--04 {
516
- padding: var(--x-size-base-04) !important;
517
+ .x-margin--06 {
518
+ margin: var(--x-size-base-06) !important;
517
519
  }
518
- .x-padding--05 {
519
- padding: var(--x-size-base-05) !important;
520
+ .x-margin--07 {
521
+ margin: var(--x-size-base-07) !important;
520
522
  }
521
- .x-padding--06 {
522
- padding: var(--x-size-base-06) !important;
523
+ .x-margin--08 {
524
+ margin: var(--x-size-base-08) !important;
523
525
  }
524
- .x-padding--07 {
525
- padding: var(--x-size-base-07) !important;
526
+ .x-margin--09 {
527
+ margin: var(--x-size-base-09) !important;
526
528
  }
527
- .x-padding--08 {
528
- padding: var(--x-size-base-08) !important;
529
+ .x-margin--10 {
530
+ margin: var(--x-size-base-10) !important;
529
531
  }
530
- .x-padding--09 {
531
- padding: var(--x-size-base-09) !important;
532
+ .x-margin--11 {
533
+ margin: var(--x-size-base-11) !important;
532
534
  }
533
- .x-padding--10 {
534
- padding: var(--x-size-base-10) !important;
535
+ .x-margin--12 {
536
+ margin: var(--x-size-base-12) !important;
535
537
  }
536
- .x-padding--11 {
537
- padding: var(--x-size-base-11) !important;
538
+ .x-margin--13 {
539
+ margin: var(--x-size-base-13) !important;
538
540
  }
539
- .x-padding--12 {
540
- padding: var(--x-size-base-12) !important;
541
+ .x-margin--14 {
542
+ margin: var(--x-size-base-14) !important;
541
543
  }
542
- .x-padding--13 {
543
- padding: var(--x-size-base-13) !important;
544
+ .x-margin--15 {
545
+ margin: var(--x-size-base-15) !important;
544
546
  }
545
- .x-padding--14 {
546
- padding: var(--x-size-base-14) !important;
547
+ .x-margin--16 {
548
+ margin: var(--x-size-base-16) !important;
547
549
  }
548
- .x-padding--15 {
549
- padding: var(--x-size-base-15) !important;
550
+ .x-margin--17 {
551
+ margin: var(--x-size-base-17) !important;
550
552
  }
551
- .x-padding--16 {
552
- padding: var(--x-size-base-16) !important;
553
+ .x-margin--18 {
554
+ margin: var(--x-size-base-18) !important;
553
555
  }
554
- .x-padding--17 {
555
- padding: var(--x-size-base-17) !important;
556
+ .x-margin--19 {
557
+ margin: var(--x-size-base-19) !important;
556
558
  }
557
- .x-padding--18 {
558
- padding: var(--x-size-base-18) !important;
559
+ .x-margin--20 {
560
+ margin: var(--x-size-base-20) !important;
559
561
  }
560
- .x-padding--19 {
561
- padding: var(--x-size-base-19) !important;
562
+ .x-margin--top-auto {
563
+ margin-top: auto !important;
562
564
  }
563
- .x-padding--20 {
564
- padding: var(--x-size-base-20) !important;
565
+ .x-margin--bottom-auto {
566
+ margin-bottom: auto !important;
565
567
  }
566
- .x-padding--top-00 {
567
- padding-top: 0 !important;
568
+ [dir="ltr"] .x-margin--right-auto {
569
+ margin-right: auto !important;
568
570
  }
569
- .x-padding--bottom-00 {
570
- padding-bottom: 0 !important;
571
+ [dir="rtl"] .x-margin--right-auto {
572
+ margin-left: auto !important;
571
573
  }
572
- [dir="ltr"] .x-padding--right-00 {
573
- padding-right: 0 !important;
574
+ [dir="ltr"] .x-margin--left-auto {
575
+ margin-left: auto !important;
574
576
  }
575
- [dir="rtl"] .x-padding--right-00 {
576
- padding-left: 0 !important;
577
+ [dir="rtl"] .x-margin--left-auto {
578
+ margin-right: auto !important;
577
579
  }
578
- [dir="ltr"] .x-padding--left-00 {
579
- padding-left: 0 !important;
580
+ .x-margin--top-00 {
581
+ margin-top: 0 !important;
580
582
  }
581
- [dir="rtl"] .x-padding--left-00 {
582
- padding-right: 0 !important;
583
+ .x-margin--bottom-00 {
584
+ margin-bottom: 0 !important;
583
585
  }
584
- .x-padding--top-01 {
585
- padding-top: var(--x-size-base-01) !important;
586
+ [dir="ltr"] .x-margin--right-00 {
587
+ margin-right: 0 !important;
586
588
  }
587
- .x-padding--bottom-01 {
588
- padding-bottom: var(--x-size-base-01) !important;
589
+ [dir="rtl"] .x-margin--right-00 {
590
+ margin-left: 0 !important;
589
591
  }
590
- [dir="ltr"] .x-padding--right-01 {
591
- padding-right: var(--x-size-base-01) !important;
592
+ [dir="ltr"] .x-margin--left-00 {
593
+ margin-left: 0 !important;
592
594
  }
593
- [dir="rtl"] .x-padding--right-01 {
594
- padding-left: var(--x-size-base-01) !important;
595
+ [dir="rtl"] .x-margin--left-00 {
596
+ margin-right: 0 !important;
595
597
  }
596
- [dir="ltr"] .x-padding--left-01 {
597
- padding-left: var(--x-size-base-01) !important;
598
+ .x-margin--top-01 {
599
+ margin-top: var(--x-size-base-01) !important;
598
600
  }
599
- [dir="rtl"] .x-padding--left-01 {
600
- padding-right: var(--x-size-base-01) !important;
601
+ .x-margin--bottom-01 {
602
+ margin-bottom: var(--x-size-base-01) !important;
601
603
  }
602
- .x-padding--top-02 {
603
- padding-top: var(--x-size-base-02) !important;
604
+ [dir="ltr"] .x-margin--right-01 {
605
+ margin-right: var(--x-size-base-01) !important;
604
606
  }
605
- .x-padding--bottom-02 {
606
- padding-bottom: var(--x-size-base-02) !important;
607
+ [dir="rtl"] .x-margin--right-01 {
608
+ margin-left: var(--x-size-base-01) !important;
607
609
  }
608
- [dir="ltr"] .x-padding--right-02 {
609
- padding-right: var(--x-size-base-02) !important;
610
+ [dir="ltr"] .x-margin--left-01 {
611
+ margin-left: var(--x-size-base-01) !important;
610
612
  }
611
- [dir="rtl"] .x-padding--right-02 {
612
- padding-left: var(--x-size-base-02) !important;
613
+ [dir="rtl"] .x-margin--left-01 {
614
+ margin-right: var(--x-size-base-01) !important;
613
615
  }
614
- [dir="ltr"] .x-padding--left-02 {
615
- padding-left: var(--x-size-base-02) !important;
616
+ .x-margin--top-02 {
617
+ margin-top: var(--x-size-base-02) !important;
616
618
  }
617
- [dir="rtl"] .x-padding--left-02 {
618
- padding-right: var(--x-size-base-02) !important;
619
+ .x-margin--bottom-02 {
620
+ margin-bottom: var(--x-size-base-02) !important;
619
621
  }
620
- .x-padding--top-03 {
621
- padding-top: var(--x-size-base-03) !important;
622
+ [dir="ltr"] .x-margin--right-02 {
623
+ margin-right: var(--x-size-base-02) !important;
622
624
  }
623
- .x-padding--bottom-03 {
624
- padding-bottom: var(--x-size-base-03) !important;
625
+ [dir="rtl"] .x-margin--right-02 {
626
+ margin-left: var(--x-size-base-02) !important;
625
627
  }
626
- [dir="ltr"] .x-padding--right-03 {
627
- padding-right: var(--x-size-base-03) !important;
628
+ [dir="ltr"] .x-margin--left-02 {
629
+ margin-left: var(--x-size-base-02) !important;
628
630
  }
629
- [dir="rtl"] .x-padding--right-03 {
630
- padding-left: var(--x-size-base-03) !important;
631
+ [dir="rtl"] .x-margin--left-02 {
632
+ margin-right: var(--x-size-base-02) !important;
631
633
  }
632
- [dir="ltr"] .x-padding--left-03 {
633
- padding-left: var(--x-size-base-03) !important;
634
+ .x-margin--top-03 {
635
+ margin-top: var(--x-size-base-03) !important;
634
636
  }
635
- [dir="rtl"] .x-padding--left-03 {
636
- padding-right: var(--x-size-base-03) !important;
637
+ .x-margin--bottom-03 {
638
+ margin-bottom: var(--x-size-base-03) !important;
637
639
  }
638
- .x-padding--top-04 {
639
- padding-top: var(--x-size-base-04) !important;
640
+ [dir="ltr"] .x-margin--right-03 {
641
+ margin-right: var(--x-size-base-03) !important;
640
642
  }
641
- .x-padding--bottom-04 {
642
- padding-bottom: var(--x-size-base-04) !important;
643
+ [dir="rtl"] .x-margin--right-03 {
644
+ margin-left: var(--x-size-base-03) !important;
643
645
  }
644
- [dir="ltr"] .x-padding--right-04 {
645
- padding-right: var(--x-size-base-04) !important;
646
+ [dir="ltr"] .x-margin--left-03 {
647
+ margin-left: var(--x-size-base-03) !important;
646
648
  }
647
- [dir="rtl"] .x-padding--right-04 {
648
- padding-left: var(--x-size-base-04) !important;
649
+ [dir="rtl"] .x-margin--left-03 {
650
+ margin-right: var(--x-size-base-03) !important;
649
651
  }
650
- [dir="ltr"] .x-padding--left-04 {
651
- padding-left: var(--x-size-base-04) !important;
652
+ .x-margin--top-04 {
653
+ margin-top: var(--x-size-base-04) !important;
652
654
  }
653
- [dir="rtl"] .x-padding--left-04 {
654
- padding-right: var(--x-size-base-04) !important;
655
+ .x-margin--bottom-04 {
656
+ margin-bottom: var(--x-size-base-04) !important;
655
657
  }
656
- .x-padding--top-05 {
657
- padding-top: var(--x-size-base-05) !important;
658
+ [dir="ltr"] .x-margin--right-04 {
659
+ margin-right: var(--x-size-base-04) !important;
658
660
  }
659
- .x-padding--bottom-05 {
660
- padding-bottom: var(--x-size-base-05) !important;
661
+ [dir="rtl"] .x-margin--right-04 {
662
+ margin-left: var(--x-size-base-04) !important;
661
663
  }
662
- [dir="ltr"] .x-padding--right-05 {
663
- padding-right: var(--x-size-base-05) !important;
664
+ [dir="ltr"] .x-margin--left-04 {
665
+ margin-left: var(--x-size-base-04) !important;
664
666
  }
665
- [dir="rtl"] .x-padding--right-05 {
666
- padding-left: var(--x-size-base-05) !important;
667
+ [dir="rtl"] .x-margin--left-04 {
668
+ margin-right: var(--x-size-base-04) !important;
667
669
  }
668
- [dir="ltr"] .x-padding--left-05 {
669
- padding-left: var(--x-size-base-05) !important;
670
+ .x-margin--top-05 {
671
+ margin-top: var(--x-size-base-05) !important;
670
672
  }
671
- [dir="rtl"] .x-padding--left-05 {
672
- padding-right: var(--x-size-base-05) !important;
673
+ .x-margin--bottom-05 {
674
+ margin-bottom: var(--x-size-base-05) !important;
673
675
  }
674
- .x-padding--top-06 {
675
- padding-top: var(--x-size-base-06) !important;
676
+ [dir="ltr"] .x-margin--right-05 {
677
+ margin-right: var(--x-size-base-05) !important;
676
678
  }
677
- .x-padding--bottom-06 {
678
- padding-bottom: var(--x-size-base-06) !important;
679
+ [dir="rtl"] .x-margin--right-05 {
680
+ margin-left: var(--x-size-base-05) !important;
679
681
  }
680
- [dir="ltr"] .x-padding--right-06 {
681
- padding-right: var(--x-size-base-06) !important;
682
+ [dir="ltr"] .x-margin--left-05 {
683
+ margin-left: var(--x-size-base-05) !important;
682
684
  }
683
- [dir="rtl"] .x-padding--right-06 {
684
- padding-left: var(--x-size-base-06) !important;
685
+ [dir="rtl"] .x-margin--left-05 {
686
+ margin-right: var(--x-size-base-05) !important;
685
687
  }
686
- [dir="ltr"] .x-padding--left-06 {
687
- padding-left: var(--x-size-base-06) !important;
688
+ .x-margin--top-06 {
689
+ margin-top: var(--x-size-base-06) !important;
688
690
  }
689
- [dir="rtl"] .x-padding--left-06 {
690
- padding-right: var(--x-size-base-06) !important;
691
+ .x-margin--bottom-06 {
692
+ margin-bottom: var(--x-size-base-06) !important;
691
693
  }
692
- .x-padding--top-07 {
693
- padding-top: var(--x-size-base-07) !important;
694
+ [dir="ltr"] .x-margin--right-06 {
695
+ margin-right: var(--x-size-base-06) !important;
694
696
  }
695
- .x-padding--bottom-07 {
696
- padding-bottom: var(--x-size-base-07) !important;
697
+ [dir="rtl"] .x-margin--right-06 {
698
+ margin-left: var(--x-size-base-06) !important;
697
699
  }
698
- [dir="ltr"] .x-padding--right-07 {
699
- padding-right: var(--x-size-base-07) !important;
700
+ [dir="ltr"] .x-margin--left-06 {
701
+ margin-left: var(--x-size-base-06) !important;
700
702
  }
701
- [dir="rtl"] .x-padding--right-07 {
702
- padding-left: var(--x-size-base-07) !important;
703
+ [dir="rtl"] .x-margin--left-06 {
704
+ margin-right: var(--x-size-base-06) !important;
703
705
  }
704
- [dir="ltr"] .x-padding--left-07 {
705
- padding-left: var(--x-size-base-07) !important;
706
+ .x-margin--top-07 {
707
+ margin-top: var(--x-size-base-07) !important;
706
708
  }
707
- [dir="rtl"] .x-padding--left-07 {
708
- padding-right: var(--x-size-base-07) !important;
709
+ .x-margin--bottom-07 {
710
+ margin-bottom: var(--x-size-base-07) !important;
709
711
  }
710
- .x-padding--top-08 {
711
- padding-top: var(--x-size-base-08) !important;
712
+ [dir="ltr"] .x-margin--right-07 {
713
+ margin-right: var(--x-size-base-07) !important;
712
714
  }
713
- .x-padding--bottom-08 {
714
- padding-bottom: var(--x-size-base-08) !important;
715
+ [dir="rtl"] .x-margin--right-07 {
716
+ margin-left: var(--x-size-base-07) !important;
715
717
  }
716
- [dir="ltr"] .x-padding--right-08 {
717
- padding-right: var(--x-size-base-08) !important;
718
+ [dir="ltr"] .x-margin--left-07 {
719
+ margin-left: var(--x-size-base-07) !important;
718
720
  }
719
- [dir="rtl"] .x-padding--right-08 {
720
- padding-left: var(--x-size-base-08) !important;
721
+ [dir="rtl"] .x-margin--left-07 {
722
+ margin-right: var(--x-size-base-07) !important;
721
723
  }
722
- [dir="ltr"] .x-padding--left-08 {
723
- padding-left: var(--x-size-base-08) !important;
724
+ .x-margin--top-08 {
725
+ margin-top: var(--x-size-base-08) !important;
724
726
  }
725
- [dir="rtl"] .x-padding--left-08 {
726
- padding-right: var(--x-size-base-08) !important;
727
+ .x-margin--bottom-08 {
728
+ margin-bottom: var(--x-size-base-08) !important;
727
729
  }
728
- .x-padding--top-09 {
729
- padding-top: var(--x-size-base-09) !important;
730
+ [dir="ltr"] .x-margin--right-08 {
731
+ margin-right: var(--x-size-base-08) !important;
730
732
  }
731
- .x-padding--bottom-09 {
732
- padding-bottom: var(--x-size-base-09) !important;
733
+ [dir="rtl"] .x-margin--right-08 {
734
+ margin-left: var(--x-size-base-08) !important;
733
735
  }
734
- [dir="ltr"] .x-padding--right-09 {
735
- padding-right: var(--x-size-base-09) !important;
736
+ [dir="ltr"] .x-margin--left-08 {
737
+ margin-left: var(--x-size-base-08) !important;
736
738
  }
737
- [dir="rtl"] .x-padding--right-09 {
738
- padding-left: var(--x-size-base-09) !important;
739
+ [dir="rtl"] .x-margin--left-08 {
740
+ margin-right: var(--x-size-base-08) !important;
739
741
  }
740
- [dir="ltr"] .x-padding--left-09 {
741
- padding-left: var(--x-size-base-09) !important;
742
+ .x-margin--top-09 {
743
+ margin-top: var(--x-size-base-09) !important;
742
744
  }
743
- [dir="rtl"] .x-padding--left-09 {
744
- padding-right: var(--x-size-base-09) !important;
745
+ .x-margin--bottom-09 {
746
+ margin-bottom: var(--x-size-base-09) !important;
745
747
  }
746
- .x-padding--top-10 {
747
- padding-top: var(--x-size-base-10) !important;
748
+ [dir="ltr"] .x-margin--right-09 {
749
+ margin-right: var(--x-size-base-09) !important;
748
750
  }
749
- .x-padding--bottom-10 {
750
- padding-bottom: var(--x-size-base-10) !important;
751
+ [dir="rtl"] .x-margin--right-09 {
752
+ margin-left: var(--x-size-base-09) !important;
751
753
  }
752
- [dir="ltr"] .x-padding--right-10 {
753
- padding-right: var(--x-size-base-10) !important;
754
+ [dir="ltr"] .x-margin--left-09 {
755
+ margin-left: var(--x-size-base-09) !important;
754
756
  }
755
- [dir="rtl"] .x-padding--right-10 {
756
- padding-left: var(--x-size-base-10) !important;
757
+ [dir="rtl"] .x-margin--left-09 {
758
+ margin-right: var(--x-size-base-09) !important;
757
759
  }
758
- [dir="ltr"] .x-padding--left-10 {
759
- padding-left: var(--x-size-base-10) !important;
760
+ .x-margin--top-10 {
761
+ margin-top: var(--x-size-base-10) !important;
760
762
  }
761
- [dir="rtl"] .x-padding--left-10 {
762
- padding-right: var(--x-size-base-10) !important;
763
+ .x-margin--bottom-10 {
764
+ margin-bottom: var(--x-size-base-10) !important;
763
765
  }
764
- .x-padding--top-11 {
765
- padding-top: var(--x-size-base-11) !important;
766
+ [dir="ltr"] .x-margin--right-10 {
767
+ margin-right: var(--x-size-base-10) !important;
766
768
  }
767
- .x-padding--bottom-11 {
768
- padding-bottom: var(--x-size-base-11) !important;
769
+ [dir="rtl"] .x-margin--right-10 {
770
+ margin-left: var(--x-size-base-10) !important;
769
771
  }
770
- [dir="ltr"] .x-padding--right-11 {
771
- padding-right: var(--x-size-base-11) !important;
772
+ [dir="ltr"] .x-margin--left-10 {
773
+ margin-left: var(--x-size-base-10) !important;
772
774
  }
773
- [dir="rtl"] .x-padding--right-11 {
774
- padding-left: var(--x-size-base-11) !important;
775
+ [dir="rtl"] .x-margin--left-10 {
776
+ margin-right: var(--x-size-base-10) !important;
775
777
  }
776
- [dir="ltr"] .x-padding--left-11 {
777
- padding-left: var(--x-size-base-11) !important;
778
+ .x-margin--top-11 {
779
+ margin-top: var(--x-size-base-11) !important;
778
780
  }
779
- [dir="rtl"] .x-padding--left-11 {
780
- padding-right: var(--x-size-base-11) !important;
781
+ .x-margin--bottom-11 {
782
+ margin-bottom: var(--x-size-base-11) !important;
781
783
  }
782
- .x-padding--top-12 {
783
- padding-top: var(--x-size-base-12) !important;
784
+ [dir="ltr"] .x-margin--right-11 {
785
+ margin-right: var(--x-size-base-11) !important;
784
786
  }
785
- .x-padding--bottom-12 {
786
- padding-bottom: var(--x-size-base-12) !important;
787
+ [dir="rtl"] .x-margin--right-11 {
788
+ margin-left: var(--x-size-base-11) !important;
787
789
  }
788
- [dir="ltr"] .x-padding--right-12 {
789
- padding-right: var(--x-size-base-12) !important;
790
+ [dir="ltr"] .x-margin--left-11 {
791
+ margin-left: var(--x-size-base-11) !important;
790
792
  }
791
- [dir="rtl"] .x-padding--right-12 {
792
- padding-left: var(--x-size-base-12) !important;
793
+ [dir="rtl"] .x-margin--left-11 {
794
+ margin-right: var(--x-size-base-11) !important;
793
795
  }
794
- [dir="ltr"] .x-padding--left-12 {
795
- padding-left: var(--x-size-base-12) !important;
796
+ .x-margin--top-12 {
797
+ margin-top: var(--x-size-base-12) !important;
796
798
  }
797
- [dir="rtl"] .x-padding--left-12 {
798
- padding-right: var(--x-size-base-12) !important;
799
+ .x-margin--bottom-12 {
800
+ margin-bottom: var(--x-size-base-12) !important;
799
801
  }
800
- .x-padding--top-13 {
801
- padding-top: var(--x-size-base-13) !important;
802
+ [dir="ltr"] .x-margin--right-12 {
803
+ margin-right: var(--x-size-base-12) !important;
802
804
  }
803
- .x-padding--bottom-13 {
804
- padding-bottom: var(--x-size-base-13) !important;
805
+ [dir="rtl"] .x-margin--right-12 {
806
+ margin-left: var(--x-size-base-12) !important;
805
807
  }
806
- [dir="ltr"] .x-padding--right-13 {
807
- padding-right: var(--x-size-base-13) !important;
808
+ [dir="ltr"] .x-margin--left-12 {
809
+ margin-left: var(--x-size-base-12) !important;
808
810
  }
809
- [dir="rtl"] .x-padding--right-13 {
810
- padding-left: var(--x-size-base-13) !important;
811
+ [dir="rtl"] .x-margin--left-12 {
812
+ margin-right: var(--x-size-base-12) !important;
811
813
  }
812
- [dir="ltr"] .x-padding--left-13 {
813
- padding-left: var(--x-size-base-13) !important;
814
+ .x-margin--top-13 {
815
+ margin-top: var(--x-size-base-13) !important;
814
816
  }
815
- [dir="rtl"] .x-padding--left-13 {
816
- padding-right: var(--x-size-base-13) !important;
817
+ .x-margin--bottom-13 {
818
+ margin-bottom: var(--x-size-base-13) !important;
817
819
  }
818
- .x-padding--top-14 {
819
- padding-top: var(--x-size-base-14) !important;
820
+ [dir="ltr"] .x-margin--right-13 {
821
+ margin-right: var(--x-size-base-13) !important;
820
822
  }
821
- .x-padding--bottom-14 {
822
- padding-bottom: var(--x-size-base-14) !important;
823
+ [dir="rtl"] .x-margin--right-13 {
824
+ margin-left: var(--x-size-base-13) !important;
823
825
  }
824
- [dir="ltr"] .x-padding--right-14 {
825
- padding-right: var(--x-size-base-14) !important;
826
+ [dir="ltr"] .x-margin--left-13 {
827
+ margin-left: var(--x-size-base-13) !important;
826
828
  }
827
- [dir="rtl"] .x-padding--right-14 {
828
- padding-left: var(--x-size-base-14) !important;
829
+ [dir="rtl"] .x-margin--left-13 {
830
+ margin-right: var(--x-size-base-13) !important;
829
831
  }
830
- [dir="ltr"] .x-padding--left-14 {
831
- padding-left: var(--x-size-base-14) !important;
832
+ .x-margin--top-14 {
833
+ margin-top: var(--x-size-base-14) !important;
832
834
  }
833
- [dir="rtl"] .x-padding--left-14 {
834
- padding-right: var(--x-size-base-14) !important;
835
+ .x-margin--bottom-14 {
836
+ margin-bottom: var(--x-size-base-14) !important;
835
837
  }
836
- .x-padding--top-15 {
837
- padding-top: var(--x-size-base-15) !important;
838
+ [dir="ltr"] .x-margin--right-14 {
839
+ margin-right: var(--x-size-base-14) !important;
838
840
  }
839
- .x-padding--bottom-15 {
840
- padding-bottom: var(--x-size-base-15) !important;
841
+ [dir="rtl"] .x-margin--right-14 {
842
+ margin-left: var(--x-size-base-14) !important;
841
843
  }
842
- [dir="ltr"] .x-padding--right-15 {
843
- padding-right: var(--x-size-base-15) !important;
844
+ [dir="ltr"] .x-margin--left-14 {
845
+ margin-left: var(--x-size-base-14) !important;
844
846
  }
845
- [dir="rtl"] .x-padding--right-15 {
846
- padding-left: var(--x-size-base-15) !important;
847
+ [dir="rtl"] .x-margin--left-14 {
848
+ margin-right: var(--x-size-base-14) !important;
847
849
  }
848
- [dir="ltr"] .x-padding--left-15 {
849
- padding-left: var(--x-size-base-15) !important;
850
+ .x-margin--top-15 {
851
+ margin-top: var(--x-size-base-15) !important;
850
852
  }
851
- [dir="rtl"] .x-padding--left-15 {
852
- padding-right: var(--x-size-base-15) !important;
853
+ .x-margin--bottom-15 {
854
+ margin-bottom: var(--x-size-base-15) !important;
853
855
  }
854
- .x-padding--top-16 {
855
- padding-top: var(--x-size-base-16) !important;
856
+ [dir="ltr"] .x-margin--right-15 {
857
+ margin-right: var(--x-size-base-15) !important;
856
858
  }
857
- .x-padding--bottom-16 {
858
- padding-bottom: var(--x-size-base-16) !important;
859
+ [dir="rtl"] .x-margin--right-15 {
860
+ margin-left: var(--x-size-base-15) !important;
859
861
  }
860
- [dir="ltr"] .x-padding--right-16 {
861
- padding-right: var(--x-size-base-16) !important;
862
+ [dir="ltr"] .x-margin--left-15 {
863
+ margin-left: var(--x-size-base-15) !important;
862
864
  }
863
- [dir="rtl"] .x-padding--right-16 {
864
- padding-left: var(--x-size-base-16) !important;
865
+ [dir="rtl"] .x-margin--left-15 {
866
+ margin-right: var(--x-size-base-15) !important;
865
867
  }
866
- [dir="ltr"] .x-padding--left-16 {
867
- padding-left: var(--x-size-base-16) !important;
868
+ .x-margin--top-16 {
869
+ margin-top: var(--x-size-base-16) !important;
868
870
  }
869
- [dir="rtl"] .x-padding--left-16 {
870
- padding-right: var(--x-size-base-16) !important;
871
+ .x-margin--bottom-16 {
872
+ margin-bottom: var(--x-size-base-16) !important;
871
873
  }
872
- .x-padding--top-17 {
873
- padding-top: var(--x-size-base-17) !important;
874
+ [dir="ltr"] .x-margin--right-16 {
875
+ margin-right: var(--x-size-base-16) !important;
874
876
  }
875
- .x-padding--bottom-17 {
876
- padding-bottom: var(--x-size-base-17) !important;
877
+ [dir="rtl"] .x-margin--right-16 {
878
+ margin-left: var(--x-size-base-16) !important;
877
879
  }
878
- [dir="ltr"] .x-padding--right-17 {
879
- padding-right: var(--x-size-base-17) !important;
880
+ [dir="ltr"] .x-margin--left-16 {
881
+ margin-left: var(--x-size-base-16) !important;
880
882
  }
881
- [dir="rtl"] .x-padding--right-17 {
882
- padding-left: var(--x-size-base-17) !important;
883
+ [dir="rtl"] .x-margin--left-16 {
884
+ margin-right: var(--x-size-base-16) !important;
883
885
  }
884
- [dir="ltr"] .x-padding--left-17 {
885
- padding-left: var(--x-size-base-17) !important;
886
+ .x-margin--top-17 {
887
+ margin-top: var(--x-size-base-17) !important;
886
888
  }
887
- [dir="rtl"] .x-padding--left-17 {
888
- padding-right: var(--x-size-base-17) !important;
889
+ .x-margin--bottom-17 {
890
+ margin-bottom: var(--x-size-base-17) !important;
889
891
  }
890
- .x-padding--top-18 {
891
- padding-top: var(--x-size-base-18) !important;
892
+ [dir="ltr"] .x-margin--right-17 {
893
+ margin-right: var(--x-size-base-17) !important;
892
894
  }
893
- .x-padding--bottom-18 {
894
- padding-bottom: var(--x-size-base-18) !important;
895
+ [dir="rtl"] .x-margin--right-17 {
896
+ margin-left: var(--x-size-base-17) !important;
895
897
  }
896
- [dir="ltr"] .x-padding--right-18 {
897
- padding-right: var(--x-size-base-18) !important;
898
+ [dir="ltr"] .x-margin--left-17 {
899
+ margin-left: var(--x-size-base-17) !important;
898
900
  }
899
- [dir="rtl"] .x-padding--right-18 {
900
- padding-left: var(--x-size-base-18) !important;
901
+ [dir="rtl"] .x-margin--left-17 {
902
+ margin-right: var(--x-size-base-17) !important;
901
903
  }
902
- [dir="ltr"] .x-padding--left-18 {
903
- padding-left: var(--x-size-base-18) !important;
904
+ .x-margin--top-18 {
905
+ margin-top: var(--x-size-base-18) !important;
904
906
  }
905
- [dir="rtl"] .x-padding--left-18 {
906
- padding-right: var(--x-size-base-18) !important;
907
+ .x-margin--bottom-18 {
908
+ margin-bottom: var(--x-size-base-18) !important;
907
909
  }
908
- .x-padding--top-19 {
909
- padding-top: var(--x-size-base-19) !important;
910
+ [dir="ltr"] .x-margin--right-18 {
911
+ margin-right: var(--x-size-base-18) !important;
910
912
  }
911
- .x-padding--bottom-19 {
912
- padding-bottom: var(--x-size-base-19) !important;
913
+ [dir="rtl"] .x-margin--right-18 {
914
+ margin-left: var(--x-size-base-18) !important;
913
915
  }
914
- [dir="ltr"] .x-padding--right-19 {
915
- padding-right: var(--x-size-base-19) !important;
916
+ [dir="ltr"] .x-margin--left-18 {
917
+ margin-left: var(--x-size-base-18) !important;
916
918
  }
917
- [dir="rtl"] .x-padding--right-19 {
918
- padding-left: var(--x-size-base-19) !important;
919
+ [dir="rtl"] .x-margin--left-18 {
920
+ margin-right: var(--x-size-base-18) !important;
919
921
  }
920
- [dir="ltr"] .x-padding--left-19 {
921
- padding-left: var(--x-size-base-19) !important;
922
+ .x-margin--top-19 {
923
+ margin-top: var(--x-size-base-19) !important;
922
924
  }
923
- [dir="rtl"] .x-padding--left-19 {
924
- padding-right: var(--x-size-base-19) !important;
925
+ .x-margin--bottom-19 {
926
+ margin-bottom: var(--x-size-base-19) !important;
925
927
  }
926
- .x-padding--top-20 {
927
- padding-top: var(--x-size-base-20) !important;
928
+ [dir="ltr"] .x-margin--right-19 {
929
+ margin-right: var(--x-size-base-19) !important;
928
930
  }
929
- .x-padding--bottom-20 {
930
- padding-bottom: var(--x-size-base-20) !important;
931
+ [dir="rtl"] .x-margin--right-19 {
932
+ margin-left: var(--x-size-base-19) !important;
931
933
  }
932
- [dir="ltr"] .x-padding--right-20 {
933
- padding-right: var(--x-size-base-20) !important;
934
+ [dir="ltr"] .x-margin--left-19 {
935
+ margin-left: var(--x-size-base-19) !important;
934
936
  }
935
- [dir="rtl"] .x-padding--right-20 {
936
- padding-left: var(--x-size-base-20) !important;
937
+ [dir="rtl"] .x-margin--left-19 {
938
+ margin-right: var(--x-size-base-19) !important;
937
939
  }
938
- [dir="ltr"] .x-padding--left-20 {
939
- padding-left: var(--x-size-base-20) !important;
940
+ .x-margin--top-20 {
941
+ margin-top: var(--x-size-base-20) !important;
940
942
  }
941
- [dir="rtl"] .x-padding--left-20 {
942
- padding-right: var(--x-size-base-20) !important;
943
+ .x-margin--bottom-20 {
944
+ margin-bottom: var(--x-size-base-20) !important;
943
945
  }
944
- .x-uppercase {
945
- text-transform: uppercase;
946
+ [dir="ltr"] .x-margin--right-20 {
947
+ margin-right: var(--x-size-base-20) !important;
946
948
  }
947
-
948
- .x-lowercase {
949
- text-transform: lowercase;
949
+ [dir="rtl"] .x-margin--right-20 {
950
+ margin-left: var(--x-size-base-20) !important;
950
951
  }
951
-
952
- .x-capitalize {
953
- text-transform: capitalize;
952
+ [dir="ltr"] .x-margin--left-20 {
953
+ margin-left: var(--x-size-base-20) !important;
954
954
  }
955
-
956
- .x-normal-case {
957
- text-transform: none;
955
+ [dir="rtl"] .x-margin--left-20 {
956
+ margin-right: var(--x-size-base-20) !important;
958
957
  }
959
958
  .x-line-height--none {
960
959
  line-height: 1 !important;
@@ -1013,6 +1012,15 @@
1013
1012
  -webkit-box-orient: vertical !important;
1014
1013
  -webkit-line-clamp: 6 !important;
1015
1014
  }
1015
+ .x-font-weight--light {
1016
+ font-weight: var(--x-number-font-weight-base-light) !important;
1017
+ }
1018
+ .x-font-weight--regular {
1019
+ font-weight: var(--x-number-font-weight-base-regular) !important;
1020
+ }
1021
+ .x-font-weight--bold {
1022
+ font-weight: var(--x-number-font-weight-base-bold) !important;
1023
+ }
1016
1024
  .x-font-size--01 {
1017
1025
  font-size: var(--x-size-base-01) !important;
1018
1026
  line-height: 1.5;
@@ -1093,15 +1101,6 @@
1093
1101
  font-size: var(--x-size-base-20) !important;
1094
1102
  line-height: 1.5;
1095
1103
  }
1096
- .x-font-weight--light {
1097
- font-weight: var(--x-number-font-weight-base-light) !important;
1098
- }
1099
- .x-font-weight--regular {
1100
- font-weight: var(--x-number-font-weight-base-regular) !important;
1101
- }
1102
- .x-font-weight--bold {
1103
- font-weight: var(--x-number-font-weight-base-bold) !important;
1104
- }
1105
1104
  .x-font-color--lead {
1106
1105
  color: var(--x-color-base-lead) !important;
1107
1106
  }
@@ -3274,49 +3273,6 @@
3274
3273
  [dir="rtl"] .x-border-radius--bottom-right-20 {
3275
3274
  border-bottom-left-radius: var(--x-size-base-20) !important;
3276
3275
  }
3277
- .x-background--lead {
3278
- background-color: var(--x-color-base-lead) !important;
3279
- }
3280
-
3281
- .x-background--auxiliary {
3282
- background-color: var(--x-color-base-auxiliary) !important;
3283
- }
3284
-
3285
- .x-background--neutral-10 {
3286
- background-color: var(--x-color-base-neutral-10) !important;
3287
- }
3288
-
3289
- .x-background--neutral-35 {
3290
- background-color: var(--x-color-base-neutral-35) !important;
3291
- }
3292
-
3293
- .x-background--neutral-70 {
3294
- background-color: var(--x-color-base-neutral-70) !important;
3295
- }
3296
-
3297
- .x-background--neutral-95 {
3298
- background-color: var(--x-color-base-neutral-95) !important;
3299
- }
3300
-
3301
- .x-background--neutral-100 {
3302
- background-color: var(--x-color-base-neutral-100) !important;
3303
- }
3304
-
3305
- .x-background--accent {
3306
- background-color: var(--x-color-base-accent) !important;
3307
- }
3308
-
3309
- .x-background--enable {
3310
- background-color: var(--x-color-base-enable) !important;
3311
- }
3312
-
3313
- .x-background--disable {
3314
- background-color: var(--x-color-base-disable) !important;
3315
- }
3316
-
3317
- .x-background--transparent {
3318
- background-color: var(--x-color-base-transparent) !important;
3319
- }
3320
3276
  .x-border-color--lead {
3321
3277
  border-color: var(--x-color-base-lead) !important;
3322
3278
  }
@@ -3360,11 +3316,48 @@
3360
3316
  .x-border-color--transparent {
3361
3317
  border-color: var(--x-color-base-transparent) !important;
3362
3318
  }
3363
- .x-text--secondary {
3364
- --x-color-text-default: var(--x-color-text-secondary);
3319
+ .x-background--lead {
3320
+ background-color: var(--x-color-base-lead) !important;
3365
3321
  }
3366
- :root {
3367
- --x-color-text-secondary: var(--x-color-base-neutral-35);
3322
+
3323
+ .x-background--auxiliary {
3324
+ background-color: var(--x-color-base-auxiliary) !important;
3325
+ }
3326
+
3327
+ .x-background--neutral-10 {
3328
+ background-color: var(--x-color-base-neutral-10) !important;
3329
+ }
3330
+
3331
+ .x-background--neutral-35 {
3332
+ background-color: var(--x-color-base-neutral-35) !important;
3333
+ }
3334
+
3335
+ .x-background--neutral-70 {
3336
+ background-color: var(--x-color-base-neutral-70) !important;
3337
+ }
3338
+
3339
+ .x-background--neutral-95 {
3340
+ background-color: var(--x-color-base-neutral-95) !important;
3341
+ }
3342
+
3343
+ .x-background--neutral-100 {
3344
+ background-color: var(--x-color-base-neutral-100) !important;
3345
+ }
3346
+
3347
+ .x-background--accent {
3348
+ background-color: var(--x-color-base-accent) !important;
3349
+ }
3350
+
3351
+ .x-background--enable {
3352
+ background-color: var(--x-color-base-enable) !important;
3353
+ }
3354
+
3355
+ .x-background--disable {
3356
+ background-color: var(--x-color-base-disable) !important;
3357
+ }
3358
+
3359
+ .x-background--transparent {
3360
+ background-color: var(--x-color-base-transparent) !important;
3368
3361
  }
3369
3362
  .x-text--stroke.x-text {
3370
3363
  --x-string-text-decoration: line-through;
@@ -3381,6 +3374,12 @@
3381
3374
  .x-text--stroke.x-small {
3382
3375
  --x-string-text-decoration-small: line-through;
3383
3376
  }
3377
+ :root {
3378
+ --x-color-text-secondary: var(--x-color-base-neutral-35);
3379
+ }
3380
+ .x-text--secondary {
3381
+ --x-color-text-default: var(--x-color-text-secondary);
3382
+ }
3384
3383
  .x-text--light.x-text {
3385
3384
  --x-number-font-weight-text: var(--x-number-font-weight-base-light);
3386
3385
  }
@@ -3900,6 +3899,13 @@
3900
3899
  --x-size-border-radius-bottom-right-tag-card: var(--x-size-border-radius-tag-card);
3901
3900
  --x-size-border-radius-bottom-left-tag-card: var(--x-size-border-radius-tag-card);
3902
3901
  }
3902
+ :root {
3903
+ --x-size-border-radius-tag-card: var(--x-size-border-radius-base-s);
3904
+ --x-size-border-radius-top-left-tag-card: var(--x-size-border-radius-tag-card);
3905
+ --x-size-border-radius-top-right-tag-card: var(--x-size-border-radius-tag-card);
3906
+ --x-size-border-radius-bottom-right-tag-card: var(--x-size-border-radius-tag-card);
3907
+ --x-size-border-radius-bottom-left-tag-card: var(--x-size-border-radius-tag-card);
3908
+ }
3903
3909
 
3904
3910
  .x-tag--card.x-tag,
3905
3911
  .x-tag--card .x-tag {
@@ -3912,11 +3918,45 @@
3912
3918
  --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-card);
3913
3919
  }
3914
3920
  :root {
3915
- --x-size-border-radius-tag-card: var(--x-size-border-radius-base-s);
3916
- --x-size-border-radius-top-left-tag-card: var(--x-size-border-radius-tag-card);
3917
- --x-size-border-radius-top-right-tag-card: var(--x-size-border-radius-tag-card);
3918
- --x-size-border-radius-bottom-right-tag-card: var(--x-size-border-radius-tag-card);
3919
- --x-size-border-radius-bottom-left-tag-card: var(--x-size-border-radius-tag-card);
3921
+ --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
3922
+ --x-color-text-suggestion-group-matching-part-default: var(
3923
+ --x-color-text-suggestion-matching-part-default
3924
+ );
3925
+ --x-color-background-suggestion-group-default: var(--x-color-background-suggestion-default);
3926
+ --x-color-border-suggestion-group-default: var(--x-color-text-suggestion-group-default);
3927
+ --x-size-padding-top-suggestion-group-default: var(--x-size-padding-top-suggestion-default);
3928
+ --x-size-padding-right-suggestion-group-default: var(--x-size-padding-right-suggestion-default);
3929
+ --x-size-padding-bottom-suggestion-group-default: var(--x-size-padding-bottom-suggestion-default);
3930
+ --x-size-padding-left-suggestion-group-default: var(--x-size-padding-left-suggestion-default);
3931
+ --x-size-gap-suggestion-group-default: var(--x-size-gap-suggestion-default);
3932
+ --x-size-border-width-suggestion-group-default: 0;
3933
+ --x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-suggestion-default);
3934
+ --x-size-border-width-right-suggestion-group-default: var(
3935
+ --x-size-border-width-suggestion-default
3936
+ );
3937
+ --x-size-border-width-bottom-suggestion-group-default: var(
3938
+ --x-size-border-width-suggestion-default
3939
+ );
3940
+ --x-size-border-width-left-suggestion-group-default: var(
3941
+ --x-size-border-width-suggestion-default
3942
+ );
3943
+ --x-size-border-radius-suggestion-group-default: var(--x-size-border-radius-base-none);
3944
+ --x-size-border-radius-top-left-suggestion-group-default: var(
3945
+ --x-size-border-radius-suggestion-default
3946
+ );
3947
+ --x-size-border-radius-top-right-suggestion-group-default: var(
3948
+ --x-size-border-radius-suggestion-default
3949
+ );
3950
+ --x-size-border-radius-bottom-right-suggestion-group-default: var(
3951
+ --x-size-border-radius-suggestion-default
3952
+ );
3953
+ --x-size-border-radius-bottom-left-suggestion-group-default: var(
3954
+ --x-size-border-radius-suggestion-default
3955
+ );
3956
+ --x-font-family-suggestion-group-default: var(--x-font-family-suggestion-default);
3957
+ --x-size-font-suggestion-group-default: var(--x-size-font-suggestion-default);
3958
+ --x-size-line-height-suggestion-group-default: var(--x-size-line-height-suggestion-default);
3959
+ --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-suggestion-default);
3920
3960
  }
3921
3961
  :root {
3922
3962
  --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
@@ -4105,65 +4145,24 @@
4105
4145
  --x-font-family-suggestion-matching-part-default
4106
4146
  );
4107
4147
  --x-size-font-suggestion-matching-part-default-curated: var(
4108
- --x-size-font-suggestion-matching-part-default
4109
- );
4110
- --x-size-line-height-suggestion-matching-part-default-curated: var(
4111
- --x-size-line-height-suggestion-matching-part-default
4112
- );
4113
- --x-number-font-weight-suggestion-matching-part-default-curated: var(
4114
- --x-number-font-weight-suggestion-matching-part-default
4115
- );
4116
- --x-font-family-suggestion-default-matching-curated: var(
4117
- --x-font-family-suggestion-default-matching
4118
- );
4119
- --x-size-font-suggestion-default-matching-curated: var(--x-size-font-suggestion-default-matching);
4120
- --x-size-line-height-suggestion-default-matching-curated: var(
4121
- --x-size-line-height-suggestion-default-matching
4122
- );
4123
- --x-number-font-weight-suggestion-default-matching-curated: var(
4124
- --x-number-font-weight-suggestion-default-matching
4125
- );
4126
- }
4127
- :root {
4128
- --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
4129
- --x-color-text-suggestion-group-matching-part-default: var(
4130
- --x-color-text-suggestion-matching-part-default
4131
- );
4132
- --x-color-background-suggestion-group-default: var(--x-color-background-suggestion-default);
4133
- --x-color-border-suggestion-group-default: var(--x-color-text-suggestion-group-default);
4134
- --x-size-padding-top-suggestion-group-default: var(--x-size-padding-top-suggestion-default);
4135
- --x-size-padding-right-suggestion-group-default: var(--x-size-padding-right-suggestion-default);
4136
- --x-size-padding-bottom-suggestion-group-default: var(--x-size-padding-bottom-suggestion-default);
4137
- --x-size-padding-left-suggestion-group-default: var(--x-size-padding-left-suggestion-default);
4138
- --x-size-gap-suggestion-group-default: var(--x-size-gap-suggestion-default);
4139
- --x-size-border-width-suggestion-group-default: 0;
4140
- --x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-suggestion-default);
4141
- --x-size-border-width-right-suggestion-group-default: var(
4142
- --x-size-border-width-suggestion-default
4143
- );
4144
- --x-size-border-width-bottom-suggestion-group-default: var(
4145
- --x-size-border-width-suggestion-default
4148
+ --x-size-font-suggestion-matching-part-default
4146
4149
  );
4147
- --x-size-border-width-left-suggestion-group-default: var(
4148
- --x-size-border-width-suggestion-default
4150
+ --x-size-line-height-suggestion-matching-part-default-curated: var(
4151
+ --x-size-line-height-suggestion-matching-part-default
4149
4152
  );
4150
- --x-size-border-radius-suggestion-group-default: var(--x-size-border-radius-base-none);
4151
- --x-size-border-radius-top-left-suggestion-group-default: var(
4152
- --x-size-border-radius-suggestion-default
4153
+ --x-number-font-weight-suggestion-matching-part-default-curated: var(
4154
+ --x-number-font-weight-suggestion-matching-part-default
4153
4155
  );
4154
- --x-size-border-radius-top-right-suggestion-group-default: var(
4155
- --x-size-border-radius-suggestion-default
4156
+ --x-font-family-suggestion-default-matching-curated: var(
4157
+ --x-font-family-suggestion-default-matching
4156
4158
  );
4157
- --x-size-border-radius-bottom-right-suggestion-group-default: var(
4158
- --x-size-border-radius-suggestion-default
4159
+ --x-size-font-suggestion-default-matching-curated: var(--x-size-font-suggestion-default-matching);
4160
+ --x-size-line-height-suggestion-default-matching-curated: var(
4161
+ --x-size-line-height-suggestion-default-matching
4159
4162
  );
4160
- --x-size-border-radius-bottom-left-suggestion-group-default: var(
4161
- --x-size-border-radius-suggestion-default
4163
+ --x-number-font-weight-suggestion-default-matching-curated: var(
4164
+ --x-number-font-weight-suggestion-default-matching
4162
4165
  );
4163
- --x-font-family-suggestion-group-default: var(--x-font-family-suggestion-default);
4164
- --x-size-font-suggestion-group-default: var(--x-size-font-suggestion-default);
4165
- --x-size-line-height-suggestion-group-default: var(--x-size-line-height-suggestion-default);
4166
- --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-suggestion-default);
4167
4166
  }
4168
4167
  :root {
4169
4168
  --x-string-align-items-suggestion-default: center;
@@ -4551,14 +4550,6 @@
4551
4550
  --x-size-gap-row-19: var(--x-size-base-19);
4552
4551
  --x-size-gap-row-20: var(--x-size-base-20);
4553
4552
  }
4554
- :root {
4555
- --x-size-gap-row: 0;
4556
- --x-size-padding-row: 0;
4557
- --x-size-justify-row: stretch;
4558
- --x-size-align-row: center;
4559
- --x-size-span-row-item: 1;
4560
- --x-size-start-row-item: 0;
4561
- }
4562
4553
  :root {
4563
4554
  --x-size-gap-row-01: var(--x-size-base-01);
4564
4555
  --x-size-gap-row-02: var(--x-size-base-02);
@@ -4789,6 +4780,31 @@
4789
4780
  .x-row--align-stretch {
4790
4781
  --x-size-align-row: stretch;
4791
4782
  }
4783
+ :root {
4784
+ --x-size-gap-row: 0;
4785
+ --x-size-padding-row: 0;
4786
+ --x-size-justify-row: stretch;
4787
+ --x-size-align-row: center;
4788
+ --x-size-span-row-item: 1;
4789
+ --x-size-start-row-item: 0;
4790
+ }
4791
+ :root {
4792
+ --x-color-border-result-default: var(--x-color-base-lead);
4793
+ --x-color-border-result-overlay-default: var(--x-color-border-result-default);
4794
+ --x-color-border-result-description-default: var(--x-color-border-result-default);
4795
+ --x-color-border-result-picture-default: var(--x-color-border-result-default);
4796
+ --x-color-background-result-default: transparent;
4797
+ --x-size-padding-result-default: 0;
4798
+ --x-size-padding-result-overlay-default: 0;
4799
+ --x-size-padding-result-description-default: 0;
4800
+ --x-size-gap-result-default: var(--x-size-base-03);
4801
+ --x-size-padding-result-picture-default: 0;
4802
+ --x-size-border-radius-result-default: var(--x-size-border-radius-base-none);
4803
+ --x-size-border-width-result-default: 0;
4804
+ --x-size-border-width-result-overlay-default: 0;
4805
+ --x-size-border-width-result-description-default: 0;
4806
+ --x-size-border-width-result-picture-default: 0;
4807
+ }
4792
4808
  :root {
4793
4809
  --x-color-border-result-default: var(--x-color-base-lead);
4794
4810
  --x-color-border-result-overlay-default: var(--x-color-border-result-default);
@@ -4862,23 +4878,6 @@
4862
4878
  :root {
4863
4879
  --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4864
4880
  }
4865
- :root {
4866
- --x-color-border-result-default: var(--x-color-base-lead);
4867
- --x-color-border-result-overlay-default: var(--x-color-border-result-default);
4868
- --x-color-border-result-description-default: var(--x-color-border-result-default);
4869
- --x-color-border-result-picture-default: var(--x-color-border-result-default);
4870
- --x-color-background-result-default: transparent;
4871
- --x-size-padding-result-default: 0;
4872
- --x-size-padding-result-overlay-default: 0;
4873
- --x-size-padding-result-description-default: 0;
4874
- --x-size-gap-result-default: var(--x-size-base-03);
4875
- --x-size-padding-result-picture-default: 0;
4876
- --x-size-border-radius-result-default: var(--x-size-border-radius-base-none);
4877
- --x-size-border-width-result-default: 0;
4878
- --x-size-border-width-result-overlay-default: 0;
4879
- --x-size-border-width-result-description-default: 0;
4880
- --x-size-border-width-result-picture-default: 0;
4881
- }
4882
4881
  :root {
4883
4882
  --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4884
4883
  }
@@ -5172,6 +5171,86 @@
5172
5171
  --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
5173
5172
  --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
5174
5173
  }
5174
+ :root {
5175
+ --x-color-background-option-list-button-default: transparent;
5176
+ --x-color-border-option-list-button-default: transparent;
5177
+ --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
5178
+ --x-color-background-option-list-button-default-hover: var(
5179
+ --x-color-background-option-list-button-default
5180
+ );
5181
+ --x-color-border-option-list-button-default-hover: var(
5182
+ --x-color-border-option-list-button-default
5183
+ );
5184
+ --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
5185
+ --x-color-background-option-list-button-default-selected: var(
5186
+ --x-color-background-option-list-button-default
5187
+ );
5188
+ --x-color-border-option-list-button-default-selected: var(
5189
+ --x-color-border-option-list-button-default
5190
+ );
5191
+ --x-color-text-option-list-button-default-selected: var(--x-color-text-default);
5192
+ --x-color-background-option-list-button-default-selected-hover: var(
5193
+ --x-color-background-option-list-button-default-selected
5194
+ );
5195
+ --x-color-border-option-list-button-default-selected-hover: var(
5196
+ --x-color-border-option-list-button-default-selected
5197
+ );
5198
+ --x-color-text-option-list-button-default-selected-hover: var(
5199
+ --x-color-text-option-list-button-default-selected
5200
+ );
5201
+ --x-color-border-option-list-item-default: var(--x-color-base-neutral-70);
5202
+ --x-color-border-top-option-list-item-default: var(--x-color-border-option-list-item-default);
5203
+ --x-color-border-right-option-list-item-default: var(--x-color-border-option-list-item-default);
5204
+ --x-color-border-bottom-option-list-item-default: var(--x-color-border-option-list-item-default);
5205
+ --x-color-border-left-option-list-item-default: var(--x-color-border-option-list-item-default);
5206
+ --x-color-border-option-list-item-default-selected: var(--x-color-base-neutral-70);
5207
+ --x-color-border-top-option-list-item-default-selected: var(
5208
+ --x-color-border-option-list-item-default-selected
5209
+ );
5210
+ --x-color-border-right-option-list-item-default-selected: var(
5211
+ --x-color-border-option-list-item-default-selected
5212
+ );
5213
+ --x-color-border-bottom-option-list-item-default-selected: var(
5214
+ --x-color-border-option-list-item-default-selected
5215
+ );
5216
+ --x-color-border-left-option-list-item-default-selected: var(
5217
+ --x-color-border-option-list-item-default-selected
5218
+ );
5219
+ --x-size-border-width-option-list-item-default: var(--x-size-border-width-base);
5220
+ --x-size-border-width-top-option-list-item-default: 0;
5221
+ --x-size-border-width-right-option-list-item-default: var(
5222
+ --x-size-border-width-option-list-item-default
5223
+ );
5224
+ --x-size-border-width-bottom-option-list-item-default: 0;
5225
+ --x-size-border-width-left-option-list-item-default: 0;
5226
+ --x-size-border-width-top-option-list-item-default-selected: var(
5227
+ --x-size-border-width-top-option-list-item-default
5228
+ );
5229
+ --x-size-border-width-right-option-list-item-default-selected: var(
5230
+ --x-size-border-width-right-option-list-item-default
5231
+ );
5232
+ --x-size-border-width-bottom-option-list-item-default-selected: var(
5233
+ --x-size-border-width-bottom-option-list-item-default
5234
+ );
5235
+ --x-size-border-width-left-option-list-item-default-selected: var(
5236
+ --x-size-border-width-left-option-list-item-default
5237
+ );
5238
+ --x-size-padding-option-list-button-default: var(--x-size-base-02);
5239
+ --x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
5240
+ --x-size-padding-right-option-list-button-default: var(
5241
+ --x-size-padding-option-list-button-default
5242
+ );
5243
+ --x-size-padding-bottom-option-list-button-default: var(
5244
+ --x-size-padding-option-list-button-default
5245
+ );
5246
+ --x-size-padding-left-option-list-button-default: var(
5247
+ --x-size-padding-option-list-button-default
5248
+ );
5249
+ --x-font-decoration-option-list-button-default-hover: underline;
5250
+ --x-size-font-option-list-button-default: var(--x-size-font-text);
5251
+ --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
5252
+ --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
5253
+ }
5175
5254
 
5176
5255
  .x-option-list {
5177
5256
  display: inline-flex;
@@ -5279,139 +5358,55 @@
5279
5358
  --x-color-background-button-default: var(
5280
5359
  --x-color-background-option-list-button-default-hover
5281
5360
  );
5282
- --x-color-border-button-default: var(--x-color-border-option-list-button-default-hover);
5283
- --x-color-text-button-default: var(--x-color-text-option-list-button-default-hover);
5284
- -webkit-text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5285
- text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5286
- }
5287
- :root {
5288
- --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5289
- --x-color-text-option-list-button-bottom-selected-hover: var(
5290
- --x-color-text-option-list-button-bottom-selected
5291
- );
5292
- --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
5293
- --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
5294
- --x-color-border-option-list-item-bottom: transparent;
5295
- --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5296
- --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5297
- --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5298
- --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5299
- --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
5300
- --x-color-border-top-option-list-item-bottom-selected: var(
5301
- --x-color-border-option-list-item-bottom
5302
- );
5303
- --x-color-border-right-option-list-item-bottom-selected: var(
5304
- --x-color-border-option-list-item-bottom
5305
- );
5306
- --x-color-border-bottom-option-list-item-bottom-selected: var(
5307
- --x-color-border-option-list-item-bottom-selected
5308
- );
5309
- --x-color-border-left-option-list-item-bottom-selected: var(
5310
- --x-color-border-option-list-item-bottom
5311
- );
5312
- --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
5313
- --x-size-border-width-top-option-list-item-bottom: 0;
5314
- --x-size-border-width-right-option-list-item-bottom: 0;
5315
- --x-size-border-width-bottom-option-list-item-bottom: var(
5316
- --x-size-border-width-option-list-item-bottom
5317
- );
5318
- --x-size-border-width-left-option-list-item-bottom: 0;
5319
- --x-size-border-width-top-option-list-item-bottom-selected: 0;
5320
- --x-size-border-width-right-option-list-item-bottom-selected: 0;
5321
- --x-size-border-width-bottom-option-list-item-bottom-selected: var(
5322
- --x-size-border-width-option-list-item-bottom
5323
- );
5324
- --x-size-border-width-left-option-list-item-bottom-selected: 0;
5325
- --x-size-font-option-list-button-bottom: var(--x-size-font-text);
5326
- --x-font-decoration-option-list-button-bottom-hover: none;
5327
- --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
5328
- --x-number-font-weight-option-list-button-bottom-selected: var(
5329
- --x-number-font-weight-base-regular
5330
- );
5331
- }
5332
- :root {
5333
- --x-color-background-option-list-button-default: transparent;
5334
- --x-color-border-option-list-button-default: transparent;
5335
- --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
5336
- --x-color-background-option-list-button-default-hover: var(
5337
- --x-color-background-option-list-button-default
5338
- );
5339
- --x-color-border-option-list-button-default-hover: var(
5340
- --x-color-border-option-list-button-default
5341
- );
5342
- --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
5343
- --x-color-background-option-list-button-default-selected: var(
5344
- --x-color-background-option-list-button-default
5345
- );
5346
- --x-color-border-option-list-button-default-selected: var(
5347
- --x-color-border-option-list-button-default
5348
- );
5349
- --x-color-text-option-list-button-default-selected: var(--x-color-text-default);
5350
- --x-color-background-option-list-button-default-selected-hover: var(
5351
- --x-color-background-option-list-button-default-selected
5352
- );
5353
- --x-color-border-option-list-button-default-selected-hover: var(
5354
- --x-color-border-option-list-button-default-selected
5355
- );
5356
- --x-color-text-option-list-button-default-selected-hover: var(
5357
- --x-color-text-option-list-button-default-selected
5358
- );
5359
- --x-color-border-option-list-item-default: var(--x-color-base-neutral-70);
5360
- --x-color-border-top-option-list-item-default: var(--x-color-border-option-list-item-default);
5361
- --x-color-border-right-option-list-item-default: var(--x-color-border-option-list-item-default);
5362
- --x-color-border-bottom-option-list-item-default: var(--x-color-border-option-list-item-default);
5363
- --x-color-border-left-option-list-item-default: var(--x-color-border-option-list-item-default);
5364
- --x-color-border-option-list-item-default-selected: var(--x-color-base-neutral-70);
5365
- --x-color-border-top-option-list-item-default-selected: var(
5366
- --x-color-border-option-list-item-default-selected
5367
- );
5368
- --x-color-border-right-option-list-item-default-selected: var(
5369
- --x-color-border-option-list-item-default-selected
5370
- );
5371
- --x-color-border-bottom-option-list-item-default-selected: var(
5372
- --x-color-border-option-list-item-default-selected
5373
- );
5374
- --x-color-border-left-option-list-item-default-selected: var(
5375
- --x-color-border-option-list-item-default-selected
5376
- );
5377
- --x-size-border-width-option-list-item-default: var(--x-size-border-width-base);
5378
- --x-size-border-width-top-option-list-item-default: 0;
5379
- --x-size-border-width-right-option-list-item-default: var(
5380
- --x-size-border-width-option-list-item-default
5361
+ --x-color-border-button-default: var(--x-color-border-option-list-button-default-hover);
5362
+ --x-color-text-button-default: var(--x-color-text-option-list-button-default-hover);
5363
+ -webkit-text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5364
+ text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5365
+ }
5366
+ :root {
5367
+ --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5368
+ --x-color-text-option-list-button-bottom-selected-hover: var(
5369
+ --x-color-text-option-list-button-bottom-selected
5381
5370
  );
5382
- --x-size-border-width-bottom-option-list-item-default: 0;
5383
- --x-size-border-width-left-option-list-item-default: 0;
5384
- --x-size-border-width-top-option-list-item-default-selected: var(
5385
- --x-size-border-width-top-option-list-item-default
5371
+ --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
5372
+ --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
5373
+ --x-color-border-option-list-item-bottom: transparent;
5374
+ --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5375
+ --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5376
+ --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5377
+ --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5378
+ --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
5379
+ --x-color-border-top-option-list-item-bottom-selected: var(
5380
+ --x-color-border-option-list-item-bottom
5386
5381
  );
5387
- --x-size-border-width-right-option-list-item-default-selected: var(
5388
- --x-size-border-width-right-option-list-item-default
5382
+ --x-color-border-right-option-list-item-bottom-selected: var(
5383
+ --x-color-border-option-list-item-bottom
5389
5384
  );
5390
- --x-size-border-width-bottom-option-list-item-default-selected: var(
5391
- --x-size-border-width-bottom-option-list-item-default
5385
+ --x-color-border-bottom-option-list-item-bottom-selected: var(
5386
+ --x-color-border-option-list-item-bottom-selected
5392
5387
  );
5393
- --x-size-border-width-left-option-list-item-default-selected: var(
5394
- --x-size-border-width-left-option-list-item-default
5388
+ --x-color-border-left-option-list-item-bottom-selected: var(
5389
+ --x-color-border-option-list-item-bottom
5395
5390
  );
5396
- --x-size-padding-option-list-button-default: var(--x-size-base-02);
5397
- --x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
5398
- --x-size-padding-right-option-list-button-default: var(
5399
- --x-size-padding-option-list-button-default
5391
+ --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
5392
+ --x-size-border-width-top-option-list-item-bottom: 0;
5393
+ --x-size-border-width-right-option-list-item-bottom: 0;
5394
+ --x-size-border-width-bottom-option-list-item-bottom: var(
5395
+ --x-size-border-width-option-list-item-bottom
5400
5396
  );
5401
- --x-size-padding-bottom-option-list-button-default: var(
5402
- --x-size-padding-option-list-button-default
5397
+ --x-size-border-width-left-option-list-item-bottom: 0;
5398
+ --x-size-border-width-top-option-list-item-bottom-selected: 0;
5399
+ --x-size-border-width-right-option-list-item-bottom-selected: 0;
5400
+ --x-size-border-width-bottom-option-list-item-bottom-selected: var(
5401
+ --x-size-border-width-option-list-item-bottom
5403
5402
  );
5404
- --x-size-padding-left-option-list-button-default: var(
5405
- --x-size-padding-option-list-button-default
5403
+ --x-size-border-width-left-option-list-item-bottom-selected: 0;
5404
+ --x-size-font-option-list-button-bottom: var(--x-size-font-text);
5405
+ --x-font-decoration-option-list-button-bottom-hover: none;
5406
+ --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
5407
+ --x-number-font-weight-option-list-button-bottom-selected: var(
5408
+ --x-number-font-weight-base-regular
5406
5409
  );
5407
- --x-font-decoration-option-list-button-default-hover: underline;
5408
- --x-size-font-option-list-button-default: var(--x-size-font-text);
5409
- --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
5410
- --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
5411
- }
5412
- :root {
5413
- --x-modal-overlay-color: rgb(0, 0, 0);
5414
- --x-modal-overlay-opacity: 0.7;
5415
5410
  }
5416
5411
  :root {
5417
5412
  --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
@@ -5548,6 +5543,10 @@
5548
5543
  --x-modal-overlay-color: rgb(0, 0, 0);
5549
5544
  --x-modal-overlay-opacity: 0.7;
5550
5545
  }
5546
+ :root {
5547
+ --x-modal-overlay-color: rgb(0, 0, 0);
5548
+ --x-modal-overlay-opacity: 0.7;
5549
+ }
5551
5550
 
5552
5551
  .x-modal__overlay {
5553
5552
  background-color: var(--x-modal-overlay-color) !important;
@@ -5661,6 +5660,22 @@
5661
5660
  --x-size-padding-list-12: var(--x-size-base-12);
5662
5661
  --x-size-padding-list-13: var(--x-size-base-13);
5663
5662
  }
5663
+ /* @deprecated */
5664
+ :root {
5665
+ --x-size-padding-list-01: var(--x-size-base-01);
5666
+ --x-size-padding-list-02: var(--x-size-base-02);
5667
+ --x-size-padding-list-03: var(--x-size-base-03);
5668
+ --x-size-padding-list-04: var(--x-size-base-04);
5669
+ --x-size-padding-list-05: var(--x-size-base-05);
5670
+ --x-size-padding-list-06: var(--x-size-base-06);
5671
+ --x-size-padding-list-07: var(--x-size-base-07);
5672
+ --x-size-padding-list-08: var(--x-size-base-08);
5673
+ --x-size-padding-list-09: var(--x-size-base-09);
5674
+ --x-size-padding-list-10: var(--x-size-base-10);
5675
+ --x-size-padding-list-11: var(--x-size-base-11);
5676
+ --x-size-padding-list-12: var(--x-size-base-12);
5677
+ --x-size-padding-list-13: var(--x-size-base-13);
5678
+ }
5664
5679
 
5665
5680
  /* @deprecated */
5666
5681
  [class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-right) {
@@ -5985,22 +6000,6 @@
5985
6000
  margin-right: var(--x-size-gap-list-13);
5986
6001
  }
5987
6002
  }
5988
- /* @deprecated */
5989
- :root {
5990
- --x-size-padding-list-01: var(--x-size-base-01);
5991
- --x-size-padding-list-02: var(--x-size-base-02);
5992
- --x-size-padding-list-03: var(--x-size-base-03);
5993
- --x-size-padding-list-04: var(--x-size-base-04);
5994
- --x-size-padding-list-05: var(--x-size-base-05);
5995
- --x-size-padding-list-06: var(--x-size-base-06);
5996
- --x-size-padding-list-07: var(--x-size-base-07);
5997
- --x-size-padding-list-08: var(--x-size-base-08);
5998
- --x-size-padding-list-09: var(--x-size-base-09);
5999
- --x-size-padding-list-10: var(--x-size-base-10);
6000
- --x-size-padding-list-11: var(--x-size-base-11);
6001
- --x-size-padding-list-12: var(--x-size-base-12);
6002
- --x-size-padding-list-13: var(--x-size-base-13);
6003
- }
6004
6003
  :root {
6005
6004
  --x-size-gap-list-01: var(--x-size-base-01);
6006
6005
  --x-size-gap-list-02: var(--x-size-base-02);
@@ -6835,15 +6834,6 @@
6835
6834
  );
6836
6835
  --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6837
6836
  }
6838
- :root {
6839
- --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
6840
- --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
6841
- --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
6842
- --x-size-border-radius-bottom-right-input-group-card: var(
6843
- --x-size-border-radius-input-group-card
6844
- );
6845
- --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
6846
- }
6847
6837
  :root {
6848
6838
  --x-color-background-input-group-default: var(--x-color-background-input-default);
6849
6839
  --x-color-border-input-group-default: var(--x-color-border-input-default);
@@ -7022,11 +7012,13 @@
7022
7012
  margin-left: calc(var(--x-size-border-width-right-input-group-default) * -1);
7023
7013
  }
7024
7014
  :root {
7025
- --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7026
- --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7027
- --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7028
- --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7029
- --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7015
+ --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
7016
+ --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
7017
+ --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
7018
+ --x-size-border-radius-bottom-right-input-group-card: var(
7019
+ --x-size-border-radius-input-group-card
7020
+ );
7021
+ --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
7030
7022
  }
7031
7023
  :root {
7032
7024
  --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
@@ -7071,6 +7063,13 @@
7071
7063
  --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7072
7064
  --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7073
7065
  }
7066
+ :root {
7067
+ --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7068
+ --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7069
+ --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7070
+ --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7071
+ --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7072
+ }
7074
7073
 
7075
7074
  .x-input--pill.x-input,
7076
7075
  .x-input--pill .x-input {
@@ -7410,6 +7409,13 @@
7410
7409
  --x-size-padding-bottom-filter-children: 0;
7411
7410
  --x-size-padding-left-filter-children: var(--x-size-base-05);
7412
7411
  }
7412
+ :root {
7413
+ --x-size-margin-filter-children: 0;
7414
+ --x-size-padding-top-filter-children: 0;
7415
+ --x-size-padding-right-filter-children: 0;
7416
+ --x-size-padding-bottom-filter-children: 0;
7417
+ --x-size-padding-left-filter-children: var(--x-size-base-05);
7418
+ }
7413
7419
 
7414
7420
  .x-hierarchical-filter-container {
7415
7421
  list-style: none;
@@ -7467,13 +7473,6 @@
7467
7473
  );
7468
7474
  --x-size-line-height-filter-default: var(--x-size-line-height-text);
7469
7475
  }
7470
- :root {
7471
- --x-size-margin-filter-children: 0;
7472
- --x-size-padding-top-filter-children: 0;
7473
- --x-size-padding-right-filter-children: 0;
7474
- --x-size-padding-bottom-filter-children: 0;
7475
- --x-size-padding-left-filter-children: var(--x-size-base-05);
7476
- }
7477
7476
  :root {
7478
7477
  --x-color-background-filter-default: transparent;
7479
7478
  --x-color-border-filter-default: var(--x-color-background-filter-default);
@@ -7636,6 +7635,14 @@
7636
7635
  --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7637
7636
  --x-size-border-width-left-facet-header-line: 0;
7638
7637
  }
7638
+ :root {
7639
+ --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7640
+ --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7641
+ --x-size-border-width-top-facet-header-line: 0;
7642
+ --x-size-border-width-right-facet-header-line: 0;
7643
+ --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7644
+ --x-size-border-width-left-facet-header-line: 0;
7645
+ }
7639
7646
 
7640
7647
  .x-facet--line.x-facet,
7641
7648
  .x-facet--line .x-facet {
@@ -7652,14 +7659,6 @@
7652
7659
  --x-size-border-width-left-facet-header-line
7653
7660
  );
7654
7661
  }
7655
- :root {
7656
- --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7657
- --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7658
- --x-size-border-width-top-facet-header-line: 0;
7659
- --x-size-border-width-right-facet-header-line: 0;
7660
- --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7661
- --x-size-border-width-left-facet-header-line: 0;
7662
- }
7663
7662
  :root {
7664
7663
  --x-color-background-facet-default: transparent;
7665
7664
  --x-color-border-facet-default: var(--x-color-background-facet-default);
@@ -7932,6 +7931,13 @@
7932
7931
  :root {
7933
7932
  --x-size-width-dropdown-m: 130px;
7934
7933
  }
7934
+ :root {
7935
+ --x-size-width-dropdown-m: 130px;
7936
+ }
7937
+
7938
+ .x-dropdown.x-dropdown--m {
7939
+ --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-m);
7940
+ }
7935
7941
  :root {
7936
7942
  --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
7937
7943
  --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
@@ -7956,13 +7962,6 @@
7956
7962
  --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7957
7963
  --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7958
7964
  }
7959
- :root {
7960
- --x-size-width-dropdown-m: 130px;
7961
- }
7962
-
7963
- .x-dropdown.x-dropdown--m {
7964
- --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-m);
7965
- }
7966
7965
  :root {
7967
7966
  --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
7968
7967
  --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
@@ -8539,11 +8538,6 @@
8539
8538
  --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
8540
8539
  --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
8541
8540
  }
8542
- :root {
8543
- --x-color-background-button-ghost: transparent;
8544
- --x-color-border-button-ghost: transparent;
8545
- --x-color-text-button-ghost: var(--x-color-base-lead);
8546
- }
8547
8541
  :root {
8548
8542
  --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
8549
8543
  --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
@@ -8571,6 +8565,11 @@
8571
8565
  --x-color-border-button-ghost: transparent;
8572
8566
  --x-color-text-button-ghost: var(--x-color-base-lead);
8573
8567
  }
8568
+ :root {
8569
+ --x-color-background-button-ghost: transparent;
8570
+ --x-color-border-button-ghost: transparent;
8571
+ --x-color-text-button-ghost: var(--x-color-base-lead);
8572
+ }
8574
8573
 
8575
8574
  .x-button--ghost.x-button,
8576
8575
  .x-button--ghost .x-button {
@@ -8611,13 +8610,6 @@
8611
8610
  --x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
8612
8611
  --x-size-line-height-button-default: var(--x-size-line-height-text);
8613
8612
  }
8614
- :root {
8615
- --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8616
- --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8617
- --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8618
- --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8619
- --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8620
- }
8621
8613
  :root {
8622
8614
  --x-color-background-button-default: var(--x-color-base-lead);
8623
8615
  --x-color-border-button-default: var(--x-color-background-button-default);
@@ -8704,14 +8696,11 @@
8704
8696
  }
8705
8697
  }
8706
8698
  :root {
8707
- --x-color-background-badge-default: var(--x-color-base-neutral-10);
8708
- --x-color-text-badge-default: var(--x-color-base-neutral-100);
8709
- --x-color-border-badge-default: var(--x-color-base-neutral-10);
8710
- --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
8711
- --x-size-border-width-badge-default: 0;
8712
- --x-size-width-badge-default: 1.5em;
8713
- --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
8714
- --x-size-font-badge-default: var(--x-size-font-base-xs);
8699
+ --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8700
+ --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8701
+ --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8702
+ --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8703
+ --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8715
8704
  }
8716
8705
  :root {
8717
8706
  --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
@@ -8736,26 +8725,14 @@
8736
8725
  );
8737
8726
  }
8738
8727
  :root {
8739
- --x-size-base-01: 2px;
8740
- --x-size-base-02: 4px;
8741
- --x-size-base-03: 8px;
8742
- --x-size-base-04: 12px;
8743
- --x-size-base-05: 16px;
8744
- --x-size-base-06: 24px;
8745
- --x-size-base-07: 32px;
8746
- --x-size-base-08: 40px;
8747
- --x-size-base-09: 48px;
8748
- --x-size-base-10: 56px;
8749
- --x-size-base-11: 64px;
8750
- --x-size-base-12: 80px;
8751
- --x-size-base-13: 80px;
8752
- --x-size-base-14: 96px;
8753
- --x-size-base-15: 128px;
8754
- --x-size-base-16: 152px;
8755
- --x-size-base-17: 184px;
8756
- --x-size-base-18: 216px;
8757
- --x-size-base-19: 280px;
8758
- --x-size-base-20: 344px;
8728
+ --x-color-background-badge-default: var(--x-color-base-neutral-10);
8729
+ --x-color-text-badge-default: var(--x-color-base-neutral-100);
8730
+ --x-color-border-badge-default: var(--x-color-base-neutral-10);
8731
+ --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
8732
+ --x-size-border-width-badge-default: 0;
8733
+ --x-size-width-badge-default: 1.5em;
8734
+ --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
8735
+ --x-size-font-badge-default: var(--x-size-font-base-xs);
8759
8736
  }
8760
8737
  :root {
8761
8738
  --x-color-background-badge-default: var(--x-color-base-neutral-10);
@@ -8806,6 +8783,28 @@
8806
8783
  .x-badge-container {
8807
8784
  position: relative;
8808
8785
  }
8786
+ :root {
8787
+ --x-size-base-01: 2px;
8788
+ --x-size-base-02: 4px;
8789
+ --x-size-base-03: 8px;
8790
+ --x-size-base-04: 12px;
8791
+ --x-size-base-05: 16px;
8792
+ --x-size-base-06: 24px;
8793
+ --x-size-base-07: 32px;
8794
+ --x-size-base-08: 40px;
8795
+ --x-size-base-09: 48px;
8796
+ --x-size-base-10: 56px;
8797
+ --x-size-base-11: 64px;
8798
+ --x-size-base-12: 80px;
8799
+ --x-size-base-13: 80px;
8800
+ --x-size-base-14: 96px;
8801
+ --x-size-base-15: 128px;
8802
+ --x-size-base-16: 152px;
8803
+ --x-size-base-17: 184px;
8804
+ --x-size-base-18: 216px;
8805
+ --x-size-base-19: 280px;
8806
+ --x-size-base-20: 344px;
8807
+ }
8809
8808
  :root {
8810
8809
  --x-color-base-lead: #243d48;
8811
8810
  --x-color-base-auxiliary: #bfe1ec;
@@ -8825,4 +8824,4 @@
8825
8824
  --x-size-border-radius-base-m: var(--x-size-base-06);
8826
8825
  --x-size-border-radius-base-pill: 99999px;
8827
8826
  --x-size-border-width-base: 1px;
8828
- }
8827
+ }