@empathyco/x-components 6.0.0-alpha.50 → 6.0.0-alpha.52

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 (18) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/design-system/deprecated-full-theme.css +1542 -1542
  3. package/docs/API-reference/api/x-components.slidingpanel.md +13 -5
  4. package/docs/API-reference/components/common/x-components.sliding-panel.md +7 -7
  5. package/js/components/sliding-panel.vue.js.map +1 -1
  6. package/js/components/sliding-panel.vue2.js +2 -2
  7. package/js/components/sliding-panel.vue2.js.map +1 -1
  8. package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js +4 -1
  9. package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js.map +1 -1
  10. package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue2.js +7 -5
  11. package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue2.js.map +1 -1
  12. package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue3.js +1 -1
  13. package/package.json +10 -10
  14. package/report/x-components.api.json +52 -16
  15. package/report/x-components.api.md +12 -4
  16. package/types/components/sliding-panel.vue.d.ts +15 -5
  17. package/types/components/sliding-panel.vue.d.ts.map +1 -1
  18. package/types/x-modules/related-prompts/components/related-prompts-tag-list.vue.d.ts.map +1 -1
package/design-system/deprecated-full-theme.css CHANGED
@@ -53,908 +53,908 @@
53
53
  .x-sticky {
54
54
  position: sticky !important;
55
55
  }
56
- .x-padding--00 {
57
- padding: 0 !important;
56
+ .x-margin--auto {
57
+ margin: auto !important;
58
58
  }
59
- .x-padding--01 {
60
- padding: var(--x-size-base-01) !important;
59
+ .x-margin--00 {
60
+ margin: 0 !important;
61
61
  }
62
- .x-padding--02 {
63
- padding: var(--x-size-base-02) !important;
62
+ .x-margin--01 {
63
+ margin: var(--x-size-base-01) !important;
64
64
  }
65
- .x-padding--03 {
66
- padding: var(--x-size-base-03) !important;
65
+ .x-margin--02 {
66
+ margin: var(--x-size-base-02) !important;
67
67
  }
68
- .x-padding--04 {
69
- padding: var(--x-size-base-04) !important;
68
+ .x-margin--03 {
69
+ margin: var(--x-size-base-03) !important;
70
70
  }
71
- .x-padding--05 {
72
- padding: var(--x-size-base-05) !important;
71
+ .x-margin--04 {
72
+ margin: var(--x-size-base-04) !important;
73
73
  }
74
- .x-padding--06 {
75
- padding: var(--x-size-base-06) !important;
74
+ .x-margin--05 {
75
+ margin: var(--x-size-base-05) !important;
76
76
  }
77
- .x-padding--07 {
78
- padding: var(--x-size-base-07) !important;
77
+ .x-margin--06 {
78
+ margin: var(--x-size-base-06) !important;
79
79
  }
80
- .x-padding--08 {
81
- padding: var(--x-size-base-08) !important;
80
+ .x-margin--07 {
81
+ margin: var(--x-size-base-07) !important;
82
82
  }
83
- .x-padding--09 {
84
- padding: var(--x-size-base-09) !important;
83
+ .x-margin--08 {
84
+ margin: var(--x-size-base-08) !important;
85
85
  }
86
- .x-padding--10 {
87
- padding: var(--x-size-base-10) !important;
86
+ .x-margin--09 {
87
+ margin: var(--x-size-base-09) !important;
88
88
  }
89
- .x-padding--11 {
90
- padding: var(--x-size-base-11) !important;
89
+ .x-margin--10 {
90
+ margin: var(--x-size-base-10) !important;
91
91
  }
92
- .x-padding--12 {
93
- padding: var(--x-size-base-12) !important;
92
+ .x-margin--11 {
93
+ margin: var(--x-size-base-11) !important;
94
94
  }
95
- .x-padding--13 {
96
- padding: var(--x-size-base-13) !important;
95
+ .x-margin--12 {
96
+ margin: var(--x-size-base-12) !important;
97
97
  }
98
- .x-padding--14 {
99
- padding: var(--x-size-base-14) !important;
98
+ .x-margin--13 {
99
+ margin: var(--x-size-base-13) !important;
100
100
  }
101
- .x-padding--15 {
102
- padding: var(--x-size-base-15) !important;
101
+ .x-margin--14 {
102
+ margin: var(--x-size-base-14) !important;
103
103
  }
104
- .x-padding--16 {
105
- padding: var(--x-size-base-16) !important;
104
+ .x-margin--15 {
105
+ margin: var(--x-size-base-15) !important;
106
106
  }
107
- .x-padding--17 {
108
- padding: var(--x-size-base-17) !important;
107
+ .x-margin--16 {
108
+ margin: var(--x-size-base-16) !important;
109
109
  }
110
- .x-padding--18 {
111
- padding: var(--x-size-base-18) !important;
110
+ .x-margin--17 {
111
+ margin: var(--x-size-base-17) !important;
112
112
  }
113
- .x-padding--19 {
114
- padding: var(--x-size-base-19) !important;
113
+ .x-margin--18 {
114
+ margin: var(--x-size-base-18) !important;
115
115
  }
116
- .x-padding--20 {
117
- padding: var(--x-size-base-20) !important;
116
+ .x-margin--19 {
117
+ margin: var(--x-size-base-19) !important;
118
118
  }
119
- .x-padding--top-00 {
120
- padding-top: 0 !important;
119
+ .x-margin--20 {
120
+ margin: var(--x-size-base-20) !important;
121
121
  }
122
- .x-padding--bottom-00 {
123
- padding-bottom: 0 !important;
122
+ .x-margin--top-auto {
123
+ margin-top: auto !important;
124
124
  }
125
- [dir="ltr"] .x-padding--right-00 {
126
- padding-right: 0 !important;
125
+ .x-margin--bottom-auto {
126
+ margin-bottom: auto !important;
127
127
  }
128
- [dir="rtl"] .x-padding--right-00 {
129
- padding-left: 0 !important;
128
+ [dir="ltr"] .x-margin--right-auto {
129
+ margin-right: auto !important;
130
130
  }
131
- [dir="ltr"] .x-padding--left-00 {
132
- padding-left: 0 !important;
131
+ [dir="rtl"] .x-margin--right-auto {
132
+ margin-left: auto !important;
133
133
  }
134
- [dir="rtl"] .x-padding--left-00 {
135
- padding-right: 0 !important;
134
+ [dir="ltr"] .x-margin--left-auto {
135
+ margin-left: auto !important;
136
136
  }
137
- .x-padding--top-01 {
138
- padding-top: var(--x-size-base-01) !important;
137
+ [dir="rtl"] .x-margin--left-auto {
138
+ margin-right: auto !important;
139
139
  }
140
- .x-padding--bottom-01 {
141
- padding-bottom: var(--x-size-base-01) !important;
140
+ .x-margin--top-00 {
141
+ margin-top: 0 !important;
142
142
  }
143
- [dir="ltr"] .x-padding--right-01 {
144
- padding-right: var(--x-size-base-01) !important;
143
+ .x-margin--bottom-00 {
144
+ margin-bottom: 0 !important;
145
145
  }
146
- [dir="rtl"] .x-padding--right-01 {
147
- padding-left: var(--x-size-base-01) !important;
146
+ [dir="ltr"] .x-margin--right-00 {
147
+ margin-right: 0 !important;
148
148
  }
149
- [dir="ltr"] .x-padding--left-01 {
150
- padding-left: var(--x-size-base-01) !important;
149
+ [dir="rtl"] .x-margin--right-00 {
150
+ margin-left: 0 !important;
151
151
  }
152
- [dir="rtl"] .x-padding--left-01 {
153
- padding-right: var(--x-size-base-01) !important;
152
+ [dir="ltr"] .x-margin--left-00 {
153
+ margin-left: 0 !important;
154
154
  }
155
- .x-padding--top-02 {
156
- padding-top: var(--x-size-base-02) !important;
155
+ [dir="rtl"] .x-margin--left-00 {
156
+ margin-right: 0 !important;
157
157
  }
158
- .x-padding--bottom-02 {
159
- padding-bottom: var(--x-size-base-02) !important;
158
+ .x-margin--top-01 {
159
+ margin-top: var(--x-size-base-01) !important;
160
160
  }
161
- [dir="ltr"] .x-padding--right-02 {
162
- padding-right: var(--x-size-base-02) !important;
161
+ .x-margin--bottom-01 {
162
+ margin-bottom: var(--x-size-base-01) !important;
163
163
  }
164
- [dir="rtl"] .x-padding--right-02 {
165
- padding-left: var(--x-size-base-02) !important;
164
+ [dir="ltr"] .x-margin--right-01 {
165
+ margin-right: var(--x-size-base-01) !important;
166
166
  }
167
- [dir="ltr"] .x-padding--left-02 {
168
- padding-left: var(--x-size-base-02) !important;
167
+ [dir="rtl"] .x-margin--right-01 {
168
+ margin-left: var(--x-size-base-01) !important;
169
169
  }
170
- [dir="rtl"] .x-padding--left-02 {
171
- padding-right: var(--x-size-base-02) !important;
170
+ [dir="ltr"] .x-margin--left-01 {
171
+ margin-left: var(--x-size-base-01) !important;
172
172
  }
173
- .x-padding--top-03 {
174
- padding-top: var(--x-size-base-03) !important;
173
+ [dir="rtl"] .x-margin--left-01 {
174
+ margin-right: var(--x-size-base-01) !important;
175
175
  }
176
- .x-padding--bottom-03 {
177
- padding-bottom: var(--x-size-base-03) !important;
176
+ .x-margin--top-02 {
177
+ margin-top: var(--x-size-base-02) !important;
178
178
  }
179
- [dir="ltr"] .x-padding--right-03 {
180
- padding-right: var(--x-size-base-03) !important;
179
+ .x-margin--bottom-02 {
180
+ margin-bottom: var(--x-size-base-02) !important;
181
181
  }
182
- [dir="rtl"] .x-padding--right-03 {
183
- padding-left: var(--x-size-base-03) !important;
182
+ [dir="ltr"] .x-margin--right-02 {
183
+ margin-right: var(--x-size-base-02) !important;
184
184
  }
185
- [dir="ltr"] .x-padding--left-03 {
186
- padding-left: var(--x-size-base-03) !important;
185
+ [dir="rtl"] .x-margin--right-02 {
186
+ margin-left: var(--x-size-base-02) !important;
187
187
  }
188
- [dir="rtl"] .x-padding--left-03 {
189
- padding-right: var(--x-size-base-03) !important;
188
+ [dir="ltr"] .x-margin--left-02 {
189
+ margin-left: var(--x-size-base-02) !important;
190
190
  }
191
- .x-padding--top-04 {
192
- padding-top: var(--x-size-base-04) !important;
191
+ [dir="rtl"] .x-margin--left-02 {
192
+ margin-right: var(--x-size-base-02) !important;
193
193
  }
194
- .x-padding--bottom-04 {
195
- padding-bottom: var(--x-size-base-04) !important;
194
+ .x-margin--top-03 {
195
+ margin-top: var(--x-size-base-03) !important;
196
196
  }
197
- [dir="ltr"] .x-padding--right-04 {
198
- padding-right: var(--x-size-base-04) !important;
197
+ .x-margin--bottom-03 {
198
+ margin-bottom: var(--x-size-base-03) !important;
199
199
  }
200
- [dir="rtl"] .x-padding--right-04 {
201
- padding-left: var(--x-size-base-04) !important;
200
+ [dir="ltr"] .x-margin--right-03 {
201
+ margin-right: var(--x-size-base-03) !important;
202
202
  }
203
- [dir="ltr"] .x-padding--left-04 {
204
- padding-left: var(--x-size-base-04) !important;
203
+ [dir="rtl"] .x-margin--right-03 {
204
+ margin-left: var(--x-size-base-03) !important;
205
205
  }
206
- [dir="rtl"] .x-padding--left-04 {
207
- padding-right: var(--x-size-base-04) !important;
206
+ [dir="ltr"] .x-margin--left-03 {
207
+ margin-left: var(--x-size-base-03) !important;
208
208
  }
209
- .x-padding--top-05 {
210
- padding-top: var(--x-size-base-05) !important;
209
+ [dir="rtl"] .x-margin--left-03 {
210
+ margin-right: var(--x-size-base-03) !important;
211
211
  }
212
- .x-padding--bottom-05 {
213
- padding-bottom: var(--x-size-base-05) !important;
212
+ .x-margin--top-04 {
213
+ margin-top: var(--x-size-base-04) !important;
214
214
  }
215
- [dir="ltr"] .x-padding--right-05 {
216
- padding-right: var(--x-size-base-05) !important;
215
+ .x-margin--bottom-04 {
216
+ margin-bottom: var(--x-size-base-04) !important;
217
217
  }
218
- [dir="rtl"] .x-padding--right-05 {
219
- padding-left: var(--x-size-base-05) !important;
218
+ [dir="ltr"] .x-margin--right-04 {
219
+ margin-right: var(--x-size-base-04) !important;
220
220
  }
221
- [dir="ltr"] .x-padding--left-05 {
222
- padding-left: var(--x-size-base-05) !important;
221
+ [dir="rtl"] .x-margin--right-04 {
222
+ margin-left: var(--x-size-base-04) !important;
223
223
  }
224
- [dir="rtl"] .x-padding--left-05 {
225
- padding-right: var(--x-size-base-05) !important;
224
+ [dir="ltr"] .x-margin--left-04 {
225
+ margin-left: var(--x-size-base-04) !important;
226
226
  }
227
- .x-padding--top-06 {
228
- padding-top: var(--x-size-base-06) !important;
227
+ [dir="rtl"] .x-margin--left-04 {
228
+ margin-right: var(--x-size-base-04) !important;
229
229
  }
230
- .x-padding--bottom-06 {
231
- padding-bottom: var(--x-size-base-06) !important;
230
+ .x-margin--top-05 {
231
+ margin-top: var(--x-size-base-05) !important;
232
232
  }
233
- [dir="ltr"] .x-padding--right-06 {
234
- padding-right: var(--x-size-base-06) !important;
233
+ .x-margin--bottom-05 {
234
+ margin-bottom: var(--x-size-base-05) !important;
235
235
  }
236
- [dir="rtl"] .x-padding--right-06 {
237
- padding-left: var(--x-size-base-06) !important;
236
+ [dir="ltr"] .x-margin--right-05 {
237
+ margin-right: var(--x-size-base-05) !important;
238
238
  }
239
- [dir="ltr"] .x-padding--left-06 {
240
- padding-left: var(--x-size-base-06) !important;
239
+ [dir="rtl"] .x-margin--right-05 {
240
+ margin-left: var(--x-size-base-05) !important;
241
241
  }
242
- [dir="rtl"] .x-padding--left-06 {
243
- padding-right: var(--x-size-base-06) !important;
242
+ [dir="ltr"] .x-margin--left-05 {
243
+ margin-left: var(--x-size-base-05) !important;
244
244
  }
245
- .x-padding--top-07 {
246
- padding-top: var(--x-size-base-07) !important;
245
+ [dir="rtl"] .x-margin--left-05 {
246
+ margin-right: var(--x-size-base-05) !important;
247
247
  }
248
- .x-padding--bottom-07 {
249
- padding-bottom: var(--x-size-base-07) !important;
248
+ .x-margin--top-06 {
249
+ margin-top: var(--x-size-base-06) !important;
250
250
  }
251
- [dir="ltr"] .x-padding--right-07 {
252
- padding-right: var(--x-size-base-07) !important;
251
+ .x-margin--bottom-06 {
252
+ margin-bottom: var(--x-size-base-06) !important;
253
253
  }
254
- [dir="rtl"] .x-padding--right-07 {
255
- padding-left: var(--x-size-base-07) !important;
254
+ [dir="ltr"] .x-margin--right-06 {
255
+ margin-right: var(--x-size-base-06) !important;
256
256
  }
257
- [dir="ltr"] .x-padding--left-07 {
258
- padding-left: var(--x-size-base-07) !important;
257
+ [dir="rtl"] .x-margin--right-06 {
258
+ margin-left: var(--x-size-base-06) !important;
259
259
  }
260
- [dir="rtl"] .x-padding--left-07 {
261
- padding-right: var(--x-size-base-07) !important;
260
+ [dir="ltr"] .x-margin--left-06 {
261
+ margin-left: var(--x-size-base-06) !important;
262
262
  }
263
- .x-padding--top-08 {
264
- padding-top: var(--x-size-base-08) !important;
263
+ [dir="rtl"] .x-margin--left-06 {
264
+ margin-right: var(--x-size-base-06) !important;
265
265
  }
266
- .x-padding--bottom-08 {
267
- padding-bottom: var(--x-size-base-08) !important;
266
+ .x-margin--top-07 {
267
+ margin-top: var(--x-size-base-07) !important;
268
268
  }
269
- [dir="ltr"] .x-padding--right-08 {
270
- padding-right: var(--x-size-base-08) !important;
269
+ .x-margin--bottom-07 {
270
+ margin-bottom: var(--x-size-base-07) !important;
271
271
  }
272
- [dir="rtl"] .x-padding--right-08 {
273
- padding-left: var(--x-size-base-08) !important;
272
+ [dir="ltr"] .x-margin--right-07 {
273
+ margin-right: var(--x-size-base-07) !important;
274
274
  }
275
- [dir="ltr"] .x-padding--left-08 {
276
- padding-left: var(--x-size-base-08) !important;
275
+ [dir="rtl"] .x-margin--right-07 {
276
+ margin-left: var(--x-size-base-07) !important;
277
277
  }
278
- [dir="rtl"] .x-padding--left-08 {
279
- padding-right: var(--x-size-base-08) !important;
278
+ [dir="ltr"] .x-margin--left-07 {
279
+ margin-left: var(--x-size-base-07) !important;
280
280
  }
281
- .x-padding--top-09 {
282
- padding-top: var(--x-size-base-09) !important;
281
+ [dir="rtl"] .x-margin--left-07 {
282
+ margin-right: var(--x-size-base-07) !important;
283
283
  }
284
- .x-padding--bottom-09 {
285
- padding-bottom: var(--x-size-base-09) !important;
284
+ .x-margin--top-08 {
285
+ margin-top: var(--x-size-base-08) !important;
286
286
  }
287
- [dir="ltr"] .x-padding--right-09 {
288
- padding-right: var(--x-size-base-09) !important;
287
+ .x-margin--bottom-08 {
288
+ margin-bottom: var(--x-size-base-08) !important;
289
289
  }
290
- [dir="rtl"] .x-padding--right-09 {
291
- padding-left: var(--x-size-base-09) !important;
290
+ [dir="ltr"] .x-margin--right-08 {
291
+ margin-right: var(--x-size-base-08) !important;
292
292
  }
293
- [dir="ltr"] .x-padding--left-09 {
294
- padding-left: var(--x-size-base-09) !important;
293
+ [dir="rtl"] .x-margin--right-08 {
294
+ margin-left: var(--x-size-base-08) !important;
295
295
  }
296
- [dir="rtl"] .x-padding--left-09 {
297
- padding-right: var(--x-size-base-09) !important;
296
+ [dir="ltr"] .x-margin--left-08 {
297
+ margin-left: var(--x-size-base-08) !important;
298
298
  }
299
- .x-padding--top-10 {
300
- padding-top: var(--x-size-base-10) !important;
299
+ [dir="rtl"] .x-margin--left-08 {
300
+ margin-right: var(--x-size-base-08) !important;
301
301
  }
302
- .x-padding--bottom-10 {
303
- padding-bottom: var(--x-size-base-10) !important;
302
+ .x-margin--top-09 {
303
+ margin-top: var(--x-size-base-09) !important;
304
304
  }
305
- [dir="ltr"] .x-padding--right-10 {
306
- padding-right: var(--x-size-base-10) !important;
305
+ .x-margin--bottom-09 {
306
+ margin-bottom: var(--x-size-base-09) !important;
307
307
  }
308
- [dir="rtl"] .x-padding--right-10 {
309
- padding-left: var(--x-size-base-10) !important;
308
+ [dir="ltr"] .x-margin--right-09 {
309
+ margin-right: var(--x-size-base-09) !important;
310
310
  }
311
- [dir="ltr"] .x-padding--left-10 {
312
- padding-left: var(--x-size-base-10) !important;
311
+ [dir="rtl"] .x-margin--right-09 {
312
+ margin-left: var(--x-size-base-09) !important;
313
313
  }
314
- [dir="rtl"] .x-padding--left-10 {
315
- padding-right: var(--x-size-base-10) !important;
314
+ [dir="ltr"] .x-margin--left-09 {
315
+ margin-left: var(--x-size-base-09) !important;
316
316
  }
317
- .x-padding--top-11 {
318
- padding-top: var(--x-size-base-11) !important;
317
+ [dir="rtl"] .x-margin--left-09 {
318
+ margin-right: var(--x-size-base-09) !important;
319
319
  }
320
- .x-padding--bottom-11 {
321
- padding-bottom: var(--x-size-base-11) !important;
320
+ .x-margin--top-10 {
321
+ margin-top: var(--x-size-base-10) !important;
322
322
  }
323
- [dir="ltr"] .x-padding--right-11 {
324
- padding-right: var(--x-size-base-11) !important;
323
+ .x-margin--bottom-10 {
324
+ margin-bottom: var(--x-size-base-10) !important;
325
325
  }
326
- [dir="rtl"] .x-padding--right-11 {
327
- padding-left: var(--x-size-base-11) !important;
326
+ [dir="ltr"] .x-margin--right-10 {
327
+ margin-right: var(--x-size-base-10) !important;
328
328
  }
329
- [dir="ltr"] .x-padding--left-11 {
330
- padding-left: var(--x-size-base-11) !important;
329
+ [dir="rtl"] .x-margin--right-10 {
330
+ margin-left: var(--x-size-base-10) !important;
331
331
  }
332
- [dir="rtl"] .x-padding--left-11 {
333
- padding-right: var(--x-size-base-11) !important;
332
+ [dir="ltr"] .x-margin--left-10 {
333
+ margin-left: var(--x-size-base-10) !important;
334
334
  }
335
- .x-padding--top-12 {
336
- padding-top: var(--x-size-base-12) !important;
335
+ [dir="rtl"] .x-margin--left-10 {
336
+ margin-right: var(--x-size-base-10) !important;
337
337
  }
338
- .x-padding--bottom-12 {
339
- padding-bottom: var(--x-size-base-12) !important;
338
+ .x-margin--top-11 {
339
+ margin-top: var(--x-size-base-11) !important;
340
340
  }
341
- [dir="ltr"] .x-padding--right-12 {
342
- padding-right: var(--x-size-base-12) !important;
341
+ .x-margin--bottom-11 {
342
+ margin-bottom: var(--x-size-base-11) !important;
343
343
  }
344
- [dir="rtl"] .x-padding--right-12 {
345
- padding-left: var(--x-size-base-12) !important;
344
+ [dir="ltr"] .x-margin--right-11 {
345
+ margin-right: var(--x-size-base-11) !important;
346
346
  }
347
- [dir="ltr"] .x-padding--left-12 {
348
- padding-left: var(--x-size-base-12) !important;
347
+ [dir="rtl"] .x-margin--right-11 {
348
+ margin-left: var(--x-size-base-11) !important;
349
349
  }
350
- [dir="rtl"] .x-padding--left-12 {
351
- padding-right: var(--x-size-base-12) !important;
350
+ [dir="ltr"] .x-margin--left-11 {
351
+ margin-left: var(--x-size-base-11) !important;
352
352
  }
353
- .x-padding--top-13 {
354
- padding-top: var(--x-size-base-13) !important;
353
+ [dir="rtl"] .x-margin--left-11 {
354
+ margin-right: var(--x-size-base-11) !important;
355
355
  }
356
- .x-padding--bottom-13 {
357
- padding-bottom: var(--x-size-base-13) !important;
356
+ .x-margin--top-12 {
357
+ margin-top: var(--x-size-base-12) !important;
358
358
  }
359
- [dir="ltr"] .x-padding--right-13 {
360
- padding-right: var(--x-size-base-13) !important;
359
+ .x-margin--bottom-12 {
360
+ margin-bottom: var(--x-size-base-12) !important;
361
361
  }
362
- [dir="rtl"] .x-padding--right-13 {
363
- padding-left: var(--x-size-base-13) !important;
362
+ [dir="ltr"] .x-margin--right-12 {
363
+ margin-right: var(--x-size-base-12) !important;
364
364
  }
365
- [dir="ltr"] .x-padding--left-13 {
366
- padding-left: var(--x-size-base-13) !important;
365
+ [dir="rtl"] .x-margin--right-12 {
366
+ margin-left: var(--x-size-base-12) !important;
367
367
  }
368
- [dir="rtl"] .x-padding--left-13 {
369
- padding-right: var(--x-size-base-13) !important;
368
+ [dir="ltr"] .x-margin--left-12 {
369
+ margin-left: var(--x-size-base-12) !important;
370
370
  }
371
- .x-padding--top-14 {
372
- padding-top: var(--x-size-base-14) !important;
371
+ [dir="rtl"] .x-margin--left-12 {
372
+ margin-right: var(--x-size-base-12) !important;
373
373
  }
374
- .x-padding--bottom-14 {
375
- padding-bottom: var(--x-size-base-14) !important;
374
+ .x-margin--top-13 {
375
+ margin-top: var(--x-size-base-13) !important;
376
376
  }
377
- [dir="ltr"] .x-padding--right-14 {
378
- padding-right: var(--x-size-base-14) !important;
377
+ .x-margin--bottom-13 {
378
+ margin-bottom: var(--x-size-base-13) !important;
379
379
  }
380
- [dir="rtl"] .x-padding--right-14 {
381
- padding-left: var(--x-size-base-14) !important;
380
+ [dir="ltr"] .x-margin--right-13 {
381
+ margin-right: var(--x-size-base-13) !important;
382
382
  }
383
- [dir="ltr"] .x-padding--left-14 {
384
- padding-left: var(--x-size-base-14) !important;
383
+ [dir="rtl"] .x-margin--right-13 {
384
+ margin-left: var(--x-size-base-13) !important;
385
385
  }
386
- [dir="rtl"] .x-padding--left-14 {
387
- padding-right: var(--x-size-base-14) !important;
386
+ [dir="ltr"] .x-margin--left-13 {
387
+ margin-left: var(--x-size-base-13) !important;
388
388
  }
389
- .x-padding--top-15 {
390
- padding-top: var(--x-size-base-15) !important;
389
+ [dir="rtl"] .x-margin--left-13 {
390
+ margin-right: var(--x-size-base-13) !important;
391
391
  }
392
- .x-padding--bottom-15 {
393
- padding-bottom: var(--x-size-base-15) !important;
392
+ .x-margin--top-14 {
393
+ margin-top: var(--x-size-base-14) !important;
394
394
  }
395
- [dir="ltr"] .x-padding--right-15 {
396
- padding-right: var(--x-size-base-15) !important;
395
+ .x-margin--bottom-14 {
396
+ margin-bottom: var(--x-size-base-14) !important;
397
397
  }
398
- [dir="rtl"] .x-padding--right-15 {
399
- padding-left: var(--x-size-base-15) !important;
398
+ [dir="ltr"] .x-margin--right-14 {
399
+ margin-right: var(--x-size-base-14) !important;
400
400
  }
401
- [dir="ltr"] .x-padding--left-15 {
402
- padding-left: var(--x-size-base-15) !important;
401
+ [dir="rtl"] .x-margin--right-14 {
402
+ margin-left: var(--x-size-base-14) !important;
403
403
  }
404
- [dir="rtl"] .x-padding--left-15 {
405
- padding-right: var(--x-size-base-15) !important;
404
+ [dir="ltr"] .x-margin--left-14 {
405
+ margin-left: var(--x-size-base-14) !important;
406
406
  }
407
- .x-padding--top-16 {
408
- padding-top: var(--x-size-base-16) !important;
407
+ [dir="rtl"] .x-margin--left-14 {
408
+ margin-right: var(--x-size-base-14) !important;
409
409
  }
410
- .x-padding--bottom-16 {
411
- padding-bottom: var(--x-size-base-16) !important;
410
+ .x-margin--top-15 {
411
+ margin-top: var(--x-size-base-15) !important;
412
412
  }
413
- [dir="ltr"] .x-padding--right-16 {
414
- padding-right: var(--x-size-base-16) !important;
413
+ .x-margin--bottom-15 {
414
+ margin-bottom: var(--x-size-base-15) !important;
415
415
  }
416
- [dir="rtl"] .x-padding--right-16 {
417
- padding-left: var(--x-size-base-16) !important;
416
+ [dir="ltr"] .x-margin--right-15 {
417
+ margin-right: var(--x-size-base-15) !important;
418
418
  }
419
- [dir="ltr"] .x-padding--left-16 {
420
- padding-left: var(--x-size-base-16) !important;
419
+ [dir="rtl"] .x-margin--right-15 {
420
+ margin-left: var(--x-size-base-15) !important;
421
421
  }
422
- [dir="rtl"] .x-padding--left-16 {
423
- padding-right: var(--x-size-base-16) !important;
422
+ [dir="ltr"] .x-margin--left-15 {
423
+ margin-left: var(--x-size-base-15) !important;
424
424
  }
425
- .x-padding--top-17 {
426
- padding-top: var(--x-size-base-17) !important;
425
+ [dir="rtl"] .x-margin--left-15 {
426
+ margin-right: var(--x-size-base-15) !important;
427
427
  }
428
- .x-padding--bottom-17 {
429
- padding-bottom: var(--x-size-base-17) !important;
428
+ .x-margin--top-16 {
429
+ margin-top: var(--x-size-base-16) !important;
430
430
  }
431
- [dir="ltr"] .x-padding--right-17 {
432
- padding-right: var(--x-size-base-17) !important;
431
+ .x-margin--bottom-16 {
432
+ margin-bottom: var(--x-size-base-16) !important;
433
433
  }
434
- [dir="rtl"] .x-padding--right-17 {
435
- padding-left: var(--x-size-base-17) !important;
434
+ [dir="ltr"] .x-margin--right-16 {
435
+ margin-right: var(--x-size-base-16) !important;
436
436
  }
437
- [dir="ltr"] .x-padding--left-17 {
438
- padding-left: var(--x-size-base-17) !important;
437
+ [dir="rtl"] .x-margin--right-16 {
438
+ margin-left: var(--x-size-base-16) !important;
439
439
  }
440
- [dir="rtl"] .x-padding--left-17 {
441
- padding-right: var(--x-size-base-17) !important;
440
+ [dir="ltr"] .x-margin--left-16 {
441
+ margin-left: var(--x-size-base-16) !important;
442
442
  }
443
- .x-padding--top-18 {
444
- padding-top: var(--x-size-base-18) !important;
443
+ [dir="rtl"] .x-margin--left-16 {
444
+ margin-right: var(--x-size-base-16) !important;
445
445
  }
446
- .x-padding--bottom-18 {
447
- padding-bottom: var(--x-size-base-18) !important;
446
+ .x-margin--top-17 {
447
+ margin-top: var(--x-size-base-17) !important;
448
448
  }
449
- [dir="ltr"] .x-padding--right-18 {
450
- padding-right: var(--x-size-base-18) !important;
449
+ .x-margin--bottom-17 {
450
+ margin-bottom: var(--x-size-base-17) !important;
451
451
  }
452
- [dir="rtl"] .x-padding--right-18 {
453
- padding-left: var(--x-size-base-18) !important;
452
+ [dir="ltr"] .x-margin--right-17 {
453
+ margin-right: var(--x-size-base-17) !important;
454
454
  }
455
- [dir="ltr"] .x-padding--left-18 {
456
- padding-left: var(--x-size-base-18) !important;
455
+ [dir="rtl"] .x-margin--right-17 {
456
+ margin-left: var(--x-size-base-17) !important;
457
457
  }
458
- [dir="rtl"] .x-padding--left-18 {
459
- padding-right: var(--x-size-base-18) !important;
458
+ [dir="ltr"] .x-margin--left-17 {
459
+ margin-left: var(--x-size-base-17) !important;
460
460
  }
461
- .x-padding--top-19 {
462
- padding-top: var(--x-size-base-19) !important;
461
+ [dir="rtl"] .x-margin--left-17 {
462
+ margin-right: var(--x-size-base-17) !important;
463
463
  }
464
- .x-padding--bottom-19 {
465
- padding-bottom: var(--x-size-base-19) !important;
464
+ .x-margin--top-18 {
465
+ margin-top: var(--x-size-base-18) !important;
466
466
  }
467
- [dir="ltr"] .x-padding--right-19 {
468
- padding-right: var(--x-size-base-19) !important;
467
+ .x-margin--bottom-18 {
468
+ margin-bottom: var(--x-size-base-18) !important;
469
469
  }
470
- [dir="rtl"] .x-padding--right-19 {
471
- padding-left: var(--x-size-base-19) !important;
470
+ [dir="ltr"] .x-margin--right-18 {
471
+ margin-right: var(--x-size-base-18) !important;
472
472
  }
473
- [dir="ltr"] .x-padding--left-19 {
474
- padding-left: var(--x-size-base-19) !important;
473
+ [dir="rtl"] .x-margin--right-18 {
474
+ margin-left: var(--x-size-base-18) !important;
475
475
  }
476
- [dir="rtl"] .x-padding--left-19 {
477
- padding-right: var(--x-size-base-19) !important;
476
+ [dir="ltr"] .x-margin--left-18 {
477
+ margin-left: var(--x-size-base-18) !important;
478
478
  }
479
- .x-padding--top-20 {
480
- padding-top: var(--x-size-base-20) !important;
479
+ [dir="rtl"] .x-margin--left-18 {
480
+ margin-right: var(--x-size-base-18) !important;
481
481
  }
482
- .x-padding--bottom-20 {
483
- padding-bottom: var(--x-size-base-20) !important;
482
+ .x-margin--top-19 {
483
+ margin-top: var(--x-size-base-19) !important;
484
484
  }
485
- [dir="ltr"] .x-padding--right-20 {
486
- padding-right: var(--x-size-base-20) !important;
485
+ .x-margin--bottom-19 {
486
+ margin-bottom: var(--x-size-base-19) !important;
487
487
  }
488
- [dir="rtl"] .x-padding--right-20 {
489
- padding-left: var(--x-size-base-20) !important;
488
+ [dir="ltr"] .x-margin--right-19 {
489
+ margin-right: var(--x-size-base-19) !important;
490
490
  }
491
- [dir="ltr"] .x-padding--left-20 {
492
- padding-left: var(--x-size-base-20) !important;
491
+ [dir="rtl"] .x-margin--right-19 {
492
+ margin-left: var(--x-size-base-19) !important;
493
493
  }
494
- [dir="rtl"] .x-padding--left-20 {
495
- padding-right: var(--x-size-base-20) !important;
494
+ [dir="ltr"] .x-margin--left-19 {
495
+ margin-left: var(--x-size-base-19) !important;
496
496
  }
497
- .x-margin--auto {
498
- margin: auto !important;
497
+ [dir="rtl"] .x-margin--left-19 {
498
+ margin-right: var(--x-size-base-19) !important;
499
499
  }
500
- .x-margin--00 {
501
- margin: 0 !important;
500
+ .x-margin--top-20 {
501
+ margin-top: var(--x-size-base-20) !important;
502
502
  }
503
- .x-margin--01 {
504
- margin: var(--x-size-base-01) !important;
503
+ .x-margin--bottom-20 {
504
+ margin-bottom: var(--x-size-base-20) !important;
505
505
  }
506
- .x-margin--02 {
507
- margin: var(--x-size-base-02) !important;
506
+ [dir="ltr"] .x-margin--right-20 {
507
+ margin-right: var(--x-size-base-20) !important;
508
508
  }
509
- .x-margin--03 {
510
- margin: var(--x-size-base-03) !important;
509
+ [dir="rtl"] .x-margin--right-20 {
510
+ margin-left: var(--x-size-base-20) !important;
511
511
  }
512
- .x-margin--04 {
513
- margin: var(--x-size-base-04) !important;
512
+ [dir="ltr"] .x-margin--left-20 {
513
+ margin-left: var(--x-size-base-20) !important;
514
514
  }
515
- .x-margin--05 {
516
- margin: var(--x-size-base-05) !important;
515
+ [dir="rtl"] .x-margin--left-20 {
516
+ margin-right: var(--x-size-base-20) !important;
517
517
  }
518
- .x-margin--06 {
519
- margin: var(--x-size-base-06) !important;
518
+ .x-padding--00 {
519
+ padding: 0 !important;
520
520
  }
521
- .x-margin--07 {
522
- margin: var(--x-size-base-07) !important;
521
+ .x-padding--01 {
522
+ padding: var(--x-size-base-01) !important;
523
523
  }
524
- .x-margin--08 {
525
- margin: var(--x-size-base-08) !important;
524
+ .x-padding--02 {
525
+ padding: var(--x-size-base-02) !important;
526
526
  }
527
- .x-margin--09 {
528
- margin: var(--x-size-base-09) !important;
527
+ .x-padding--03 {
528
+ padding: var(--x-size-base-03) !important;
529
529
  }
530
- .x-margin--10 {
531
- margin: var(--x-size-base-10) !important;
530
+ .x-padding--04 {
531
+ padding: var(--x-size-base-04) !important;
532
532
  }
533
- .x-margin--11 {
534
- margin: var(--x-size-base-11) !important;
533
+ .x-padding--05 {
534
+ padding: var(--x-size-base-05) !important;
535
535
  }
536
- .x-margin--12 {
537
- margin: var(--x-size-base-12) !important;
536
+ .x-padding--06 {
537
+ padding: var(--x-size-base-06) !important;
538
538
  }
539
- .x-margin--13 {
540
- margin: var(--x-size-base-13) !important;
539
+ .x-padding--07 {
540
+ padding: var(--x-size-base-07) !important;
541
541
  }
542
- .x-margin--14 {
543
- margin: var(--x-size-base-14) !important;
542
+ .x-padding--08 {
543
+ padding: var(--x-size-base-08) !important;
544
544
  }
545
- .x-margin--15 {
546
- margin: var(--x-size-base-15) !important;
545
+ .x-padding--09 {
546
+ padding: var(--x-size-base-09) !important;
547
547
  }
548
- .x-margin--16 {
549
- margin: var(--x-size-base-16) !important;
548
+ .x-padding--10 {
549
+ padding: var(--x-size-base-10) !important;
550
550
  }
551
- .x-margin--17 {
552
- margin: var(--x-size-base-17) !important;
551
+ .x-padding--11 {
552
+ padding: var(--x-size-base-11) !important;
553
553
  }
554
- .x-margin--18 {
555
- margin: var(--x-size-base-18) !important;
554
+ .x-padding--12 {
555
+ padding: var(--x-size-base-12) !important;
556
556
  }
557
- .x-margin--19 {
558
- margin: var(--x-size-base-19) !important;
557
+ .x-padding--13 {
558
+ padding: var(--x-size-base-13) !important;
559
559
  }
560
- .x-margin--20 {
561
- margin: var(--x-size-base-20) !important;
560
+ .x-padding--14 {
561
+ padding: var(--x-size-base-14) !important;
562
562
  }
563
- .x-margin--top-auto {
564
- margin-top: auto !important;
563
+ .x-padding--15 {
564
+ padding: var(--x-size-base-15) !important;
565
565
  }
566
- .x-margin--bottom-auto {
567
- margin-bottom: auto !important;
566
+ .x-padding--16 {
567
+ padding: var(--x-size-base-16) !important;
568
568
  }
569
- [dir="ltr"] .x-margin--right-auto {
570
- margin-right: auto !important;
569
+ .x-padding--17 {
570
+ padding: var(--x-size-base-17) !important;
571
571
  }
572
- [dir="rtl"] .x-margin--right-auto {
573
- margin-left: auto !important;
572
+ .x-padding--18 {
573
+ padding: var(--x-size-base-18) !important;
574
574
  }
575
- [dir="ltr"] .x-margin--left-auto {
576
- margin-left: auto !important;
575
+ .x-padding--19 {
576
+ padding: var(--x-size-base-19) !important;
577
577
  }
578
- [dir="rtl"] .x-margin--left-auto {
579
- margin-right: auto !important;
578
+ .x-padding--20 {
579
+ padding: var(--x-size-base-20) !important;
580
580
  }
581
- .x-margin--top-00 {
582
- margin-top: 0 !important;
581
+ .x-padding--top-00 {
582
+ padding-top: 0 !important;
583
583
  }
584
- .x-margin--bottom-00 {
585
- margin-bottom: 0 !important;
584
+ .x-padding--bottom-00 {
585
+ padding-bottom: 0 !important;
586
586
  }
587
- [dir="ltr"] .x-margin--right-00 {
588
- margin-right: 0 !important;
587
+ [dir="ltr"] .x-padding--right-00 {
588
+ padding-right: 0 !important;
589
589
  }
590
- [dir="rtl"] .x-margin--right-00 {
591
- margin-left: 0 !important;
590
+ [dir="rtl"] .x-padding--right-00 {
591
+ padding-left: 0 !important;
592
592
  }
593
- [dir="ltr"] .x-margin--left-00 {
594
- margin-left: 0 !important;
593
+ [dir="ltr"] .x-padding--left-00 {
594
+ padding-left: 0 !important;
595
595
  }
596
- [dir="rtl"] .x-margin--left-00 {
597
- margin-right: 0 !important;
596
+ [dir="rtl"] .x-padding--left-00 {
597
+ padding-right: 0 !important;
598
598
  }
599
- .x-margin--top-01 {
600
- margin-top: var(--x-size-base-01) !important;
599
+ .x-padding--top-01 {
600
+ padding-top: var(--x-size-base-01) !important;
601
601
  }
602
- .x-margin--bottom-01 {
603
- margin-bottom: var(--x-size-base-01) !important;
602
+ .x-padding--bottom-01 {
603
+ padding-bottom: var(--x-size-base-01) !important;
604
604
  }
605
- [dir="ltr"] .x-margin--right-01 {
606
- margin-right: var(--x-size-base-01) !important;
605
+ [dir="ltr"] .x-padding--right-01 {
606
+ padding-right: var(--x-size-base-01) !important;
607
607
  }
608
- [dir="rtl"] .x-margin--right-01 {
609
- margin-left: var(--x-size-base-01) !important;
608
+ [dir="rtl"] .x-padding--right-01 {
609
+ padding-left: var(--x-size-base-01) !important;
610
610
  }
611
- [dir="ltr"] .x-margin--left-01 {
612
- margin-left: var(--x-size-base-01) !important;
611
+ [dir="ltr"] .x-padding--left-01 {
612
+ padding-left: var(--x-size-base-01) !important;
613
613
  }
614
- [dir="rtl"] .x-margin--left-01 {
615
- margin-right: var(--x-size-base-01) !important;
614
+ [dir="rtl"] .x-padding--left-01 {
615
+ padding-right: var(--x-size-base-01) !important;
616
616
  }
617
- .x-margin--top-02 {
618
- margin-top: var(--x-size-base-02) !important;
617
+ .x-padding--top-02 {
618
+ padding-top: var(--x-size-base-02) !important;
619
619
  }
620
- .x-margin--bottom-02 {
621
- margin-bottom: var(--x-size-base-02) !important;
620
+ .x-padding--bottom-02 {
621
+ padding-bottom: var(--x-size-base-02) !important;
622
622
  }
623
- [dir="ltr"] .x-margin--right-02 {
624
- margin-right: var(--x-size-base-02) !important;
623
+ [dir="ltr"] .x-padding--right-02 {
624
+ padding-right: var(--x-size-base-02) !important;
625
625
  }
626
- [dir="rtl"] .x-margin--right-02 {
627
- margin-left: var(--x-size-base-02) !important;
626
+ [dir="rtl"] .x-padding--right-02 {
627
+ padding-left: var(--x-size-base-02) !important;
628
628
  }
629
- [dir="ltr"] .x-margin--left-02 {
630
- margin-left: var(--x-size-base-02) !important;
629
+ [dir="ltr"] .x-padding--left-02 {
630
+ padding-left: var(--x-size-base-02) !important;
631
631
  }
632
- [dir="rtl"] .x-margin--left-02 {
633
- margin-right: var(--x-size-base-02) !important;
632
+ [dir="rtl"] .x-padding--left-02 {
633
+ padding-right: var(--x-size-base-02) !important;
634
634
  }
635
- .x-margin--top-03 {
636
- margin-top: var(--x-size-base-03) !important;
635
+ .x-padding--top-03 {
636
+ padding-top: var(--x-size-base-03) !important;
637
637
  }
638
- .x-margin--bottom-03 {
639
- margin-bottom: var(--x-size-base-03) !important;
638
+ .x-padding--bottom-03 {
639
+ padding-bottom: var(--x-size-base-03) !important;
640
640
  }
641
- [dir="ltr"] .x-margin--right-03 {
642
- margin-right: var(--x-size-base-03) !important;
641
+ [dir="ltr"] .x-padding--right-03 {
642
+ padding-right: var(--x-size-base-03) !important;
643
643
  }
644
- [dir="rtl"] .x-margin--right-03 {
645
- margin-left: var(--x-size-base-03) !important;
644
+ [dir="rtl"] .x-padding--right-03 {
645
+ padding-left: var(--x-size-base-03) !important;
646
646
  }
647
- [dir="ltr"] .x-margin--left-03 {
648
- margin-left: var(--x-size-base-03) !important;
647
+ [dir="ltr"] .x-padding--left-03 {
648
+ padding-left: var(--x-size-base-03) !important;
649
649
  }
650
- [dir="rtl"] .x-margin--left-03 {
651
- margin-right: var(--x-size-base-03) !important;
650
+ [dir="rtl"] .x-padding--left-03 {
651
+ padding-right: var(--x-size-base-03) !important;
652
652
  }
653
- .x-margin--top-04 {
654
- margin-top: var(--x-size-base-04) !important;
653
+ .x-padding--top-04 {
654
+ padding-top: var(--x-size-base-04) !important;
655
655
  }
656
- .x-margin--bottom-04 {
657
- margin-bottom: var(--x-size-base-04) !important;
656
+ .x-padding--bottom-04 {
657
+ padding-bottom: var(--x-size-base-04) !important;
658
658
  }
659
- [dir="ltr"] .x-margin--right-04 {
660
- margin-right: var(--x-size-base-04) !important;
659
+ [dir="ltr"] .x-padding--right-04 {
660
+ padding-right: var(--x-size-base-04) !important;
661
661
  }
662
- [dir="rtl"] .x-margin--right-04 {
663
- margin-left: var(--x-size-base-04) !important;
662
+ [dir="rtl"] .x-padding--right-04 {
663
+ padding-left: var(--x-size-base-04) !important;
664
664
  }
665
- [dir="ltr"] .x-margin--left-04 {
666
- margin-left: var(--x-size-base-04) !important;
665
+ [dir="ltr"] .x-padding--left-04 {
666
+ padding-left: var(--x-size-base-04) !important;
667
667
  }
668
- [dir="rtl"] .x-margin--left-04 {
669
- margin-right: var(--x-size-base-04) !important;
668
+ [dir="rtl"] .x-padding--left-04 {
669
+ padding-right: var(--x-size-base-04) !important;
670
670
  }
671
- .x-margin--top-05 {
672
- margin-top: var(--x-size-base-05) !important;
671
+ .x-padding--top-05 {
672
+ padding-top: var(--x-size-base-05) !important;
673
673
  }
674
- .x-margin--bottom-05 {
675
- margin-bottom: var(--x-size-base-05) !important;
674
+ .x-padding--bottom-05 {
675
+ padding-bottom: var(--x-size-base-05) !important;
676
676
  }
677
- [dir="ltr"] .x-margin--right-05 {
678
- margin-right: var(--x-size-base-05) !important;
677
+ [dir="ltr"] .x-padding--right-05 {
678
+ padding-right: var(--x-size-base-05) !important;
679
679
  }
680
- [dir="rtl"] .x-margin--right-05 {
681
- margin-left: var(--x-size-base-05) !important;
680
+ [dir="rtl"] .x-padding--right-05 {
681
+ padding-left: var(--x-size-base-05) !important;
682
682
  }
683
- [dir="ltr"] .x-margin--left-05 {
684
- margin-left: var(--x-size-base-05) !important;
683
+ [dir="ltr"] .x-padding--left-05 {
684
+ padding-left: var(--x-size-base-05) !important;
685
685
  }
686
- [dir="rtl"] .x-margin--left-05 {
687
- margin-right: var(--x-size-base-05) !important;
686
+ [dir="rtl"] .x-padding--left-05 {
687
+ padding-right: var(--x-size-base-05) !important;
688
688
  }
689
- .x-margin--top-06 {
690
- margin-top: var(--x-size-base-06) !important;
689
+ .x-padding--top-06 {
690
+ padding-top: var(--x-size-base-06) !important;
691
691
  }
692
- .x-margin--bottom-06 {
693
- margin-bottom: var(--x-size-base-06) !important;
692
+ .x-padding--bottom-06 {
693
+ padding-bottom: var(--x-size-base-06) !important;
694
694
  }
695
- [dir="ltr"] .x-margin--right-06 {
696
- margin-right: var(--x-size-base-06) !important;
695
+ [dir="ltr"] .x-padding--right-06 {
696
+ padding-right: var(--x-size-base-06) !important;
697
697
  }
698
- [dir="rtl"] .x-margin--right-06 {
699
- margin-left: var(--x-size-base-06) !important;
698
+ [dir="rtl"] .x-padding--right-06 {
699
+ padding-left: var(--x-size-base-06) !important;
700
700
  }
701
- [dir="ltr"] .x-margin--left-06 {
702
- margin-left: var(--x-size-base-06) !important;
701
+ [dir="ltr"] .x-padding--left-06 {
702
+ padding-left: var(--x-size-base-06) !important;
703
703
  }
704
- [dir="rtl"] .x-margin--left-06 {
705
- margin-right: var(--x-size-base-06) !important;
704
+ [dir="rtl"] .x-padding--left-06 {
705
+ padding-right: var(--x-size-base-06) !important;
706
706
  }
707
- .x-margin--top-07 {
708
- margin-top: var(--x-size-base-07) !important;
707
+ .x-padding--top-07 {
708
+ padding-top: var(--x-size-base-07) !important;
709
709
  }
710
- .x-margin--bottom-07 {
711
- margin-bottom: var(--x-size-base-07) !important;
710
+ .x-padding--bottom-07 {
711
+ padding-bottom: var(--x-size-base-07) !important;
712
712
  }
713
- [dir="ltr"] .x-margin--right-07 {
714
- margin-right: var(--x-size-base-07) !important;
713
+ [dir="ltr"] .x-padding--right-07 {
714
+ padding-right: var(--x-size-base-07) !important;
715
715
  }
716
- [dir="rtl"] .x-margin--right-07 {
717
- margin-left: var(--x-size-base-07) !important;
716
+ [dir="rtl"] .x-padding--right-07 {
717
+ padding-left: var(--x-size-base-07) !important;
718
718
  }
719
- [dir="ltr"] .x-margin--left-07 {
720
- margin-left: var(--x-size-base-07) !important;
719
+ [dir="ltr"] .x-padding--left-07 {
720
+ padding-left: var(--x-size-base-07) !important;
721
721
  }
722
- [dir="rtl"] .x-margin--left-07 {
723
- margin-right: var(--x-size-base-07) !important;
722
+ [dir="rtl"] .x-padding--left-07 {
723
+ padding-right: var(--x-size-base-07) !important;
724
724
  }
725
- .x-margin--top-08 {
726
- margin-top: var(--x-size-base-08) !important;
725
+ .x-padding--top-08 {
726
+ padding-top: var(--x-size-base-08) !important;
727
727
  }
728
- .x-margin--bottom-08 {
729
- margin-bottom: var(--x-size-base-08) !important;
728
+ .x-padding--bottom-08 {
729
+ padding-bottom: var(--x-size-base-08) !important;
730
730
  }
731
- [dir="ltr"] .x-margin--right-08 {
732
- margin-right: var(--x-size-base-08) !important;
731
+ [dir="ltr"] .x-padding--right-08 {
732
+ padding-right: var(--x-size-base-08) !important;
733
733
  }
734
- [dir="rtl"] .x-margin--right-08 {
735
- margin-left: var(--x-size-base-08) !important;
734
+ [dir="rtl"] .x-padding--right-08 {
735
+ padding-left: var(--x-size-base-08) !important;
736
736
  }
737
- [dir="ltr"] .x-margin--left-08 {
738
- margin-left: var(--x-size-base-08) !important;
737
+ [dir="ltr"] .x-padding--left-08 {
738
+ padding-left: var(--x-size-base-08) !important;
739
739
  }
740
- [dir="rtl"] .x-margin--left-08 {
741
- margin-right: var(--x-size-base-08) !important;
740
+ [dir="rtl"] .x-padding--left-08 {
741
+ padding-right: var(--x-size-base-08) !important;
742
742
  }
743
- .x-margin--top-09 {
744
- margin-top: var(--x-size-base-09) !important;
743
+ .x-padding--top-09 {
744
+ padding-top: var(--x-size-base-09) !important;
745
745
  }
746
- .x-margin--bottom-09 {
747
- margin-bottom: var(--x-size-base-09) !important;
746
+ .x-padding--bottom-09 {
747
+ padding-bottom: var(--x-size-base-09) !important;
748
748
  }
749
- [dir="ltr"] .x-margin--right-09 {
750
- margin-right: var(--x-size-base-09) !important;
749
+ [dir="ltr"] .x-padding--right-09 {
750
+ padding-right: var(--x-size-base-09) !important;
751
751
  }
752
- [dir="rtl"] .x-margin--right-09 {
753
- margin-left: var(--x-size-base-09) !important;
752
+ [dir="rtl"] .x-padding--right-09 {
753
+ padding-left: var(--x-size-base-09) !important;
754
754
  }
755
- [dir="ltr"] .x-margin--left-09 {
756
- margin-left: var(--x-size-base-09) !important;
755
+ [dir="ltr"] .x-padding--left-09 {
756
+ padding-left: var(--x-size-base-09) !important;
757
757
  }
758
- [dir="rtl"] .x-margin--left-09 {
759
- margin-right: var(--x-size-base-09) !important;
758
+ [dir="rtl"] .x-padding--left-09 {
759
+ padding-right: var(--x-size-base-09) !important;
760
760
  }
761
- .x-margin--top-10 {
762
- margin-top: var(--x-size-base-10) !important;
761
+ .x-padding--top-10 {
762
+ padding-top: var(--x-size-base-10) !important;
763
763
  }
764
- .x-margin--bottom-10 {
765
- margin-bottom: var(--x-size-base-10) !important;
764
+ .x-padding--bottom-10 {
765
+ padding-bottom: var(--x-size-base-10) !important;
766
766
  }
767
- [dir="ltr"] .x-margin--right-10 {
768
- margin-right: var(--x-size-base-10) !important;
767
+ [dir="ltr"] .x-padding--right-10 {
768
+ padding-right: var(--x-size-base-10) !important;
769
769
  }
770
- [dir="rtl"] .x-margin--right-10 {
771
- margin-left: var(--x-size-base-10) !important;
770
+ [dir="rtl"] .x-padding--right-10 {
771
+ padding-left: var(--x-size-base-10) !important;
772
772
  }
773
- [dir="ltr"] .x-margin--left-10 {
774
- margin-left: var(--x-size-base-10) !important;
773
+ [dir="ltr"] .x-padding--left-10 {
774
+ padding-left: var(--x-size-base-10) !important;
775
775
  }
776
- [dir="rtl"] .x-margin--left-10 {
777
- margin-right: var(--x-size-base-10) !important;
776
+ [dir="rtl"] .x-padding--left-10 {
777
+ padding-right: var(--x-size-base-10) !important;
778
778
  }
779
- .x-margin--top-11 {
780
- margin-top: var(--x-size-base-11) !important;
779
+ .x-padding--top-11 {
780
+ padding-top: var(--x-size-base-11) !important;
781
781
  }
782
- .x-margin--bottom-11 {
783
- margin-bottom: var(--x-size-base-11) !important;
782
+ .x-padding--bottom-11 {
783
+ padding-bottom: var(--x-size-base-11) !important;
784
784
  }
785
- [dir="ltr"] .x-margin--right-11 {
786
- margin-right: var(--x-size-base-11) !important;
785
+ [dir="ltr"] .x-padding--right-11 {
786
+ padding-right: var(--x-size-base-11) !important;
787
787
  }
788
- [dir="rtl"] .x-margin--right-11 {
789
- margin-left: var(--x-size-base-11) !important;
788
+ [dir="rtl"] .x-padding--right-11 {
789
+ padding-left: var(--x-size-base-11) !important;
790
790
  }
791
- [dir="ltr"] .x-margin--left-11 {
792
- margin-left: var(--x-size-base-11) !important;
791
+ [dir="ltr"] .x-padding--left-11 {
792
+ padding-left: var(--x-size-base-11) !important;
793
793
  }
794
- [dir="rtl"] .x-margin--left-11 {
795
- margin-right: var(--x-size-base-11) !important;
794
+ [dir="rtl"] .x-padding--left-11 {
795
+ padding-right: var(--x-size-base-11) !important;
796
796
  }
797
- .x-margin--top-12 {
798
- margin-top: var(--x-size-base-12) !important;
797
+ .x-padding--top-12 {
798
+ padding-top: var(--x-size-base-12) !important;
799
799
  }
800
- .x-margin--bottom-12 {
801
- margin-bottom: var(--x-size-base-12) !important;
800
+ .x-padding--bottom-12 {
801
+ padding-bottom: var(--x-size-base-12) !important;
802
802
  }
803
- [dir="ltr"] .x-margin--right-12 {
804
- margin-right: var(--x-size-base-12) !important;
803
+ [dir="ltr"] .x-padding--right-12 {
804
+ padding-right: var(--x-size-base-12) !important;
805
805
  }
806
- [dir="rtl"] .x-margin--right-12 {
807
- margin-left: var(--x-size-base-12) !important;
806
+ [dir="rtl"] .x-padding--right-12 {
807
+ padding-left: var(--x-size-base-12) !important;
808
808
  }
809
- [dir="ltr"] .x-margin--left-12 {
810
- margin-left: var(--x-size-base-12) !important;
809
+ [dir="ltr"] .x-padding--left-12 {
810
+ padding-left: var(--x-size-base-12) !important;
811
811
  }
812
- [dir="rtl"] .x-margin--left-12 {
813
- margin-right: var(--x-size-base-12) !important;
812
+ [dir="rtl"] .x-padding--left-12 {
813
+ padding-right: var(--x-size-base-12) !important;
814
814
  }
815
- .x-margin--top-13 {
816
- margin-top: var(--x-size-base-13) !important;
815
+ .x-padding--top-13 {
816
+ padding-top: var(--x-size-base-13) !important;
817
817
  }
818
- .x-margin--bottom-13 {
819
- margin-bottom: var(--x-size-base-13) !important;
818
+ .x-padding--bottom-13 {
819
+ padding-bottom: var(--x-size-base-13) !important;
820
820
  }
821
- [dir="ltr"] .x-margin--right-13 {
822
- margin-right: var(--x-size-base-13) !important;
821
+ [dir="ltr"] .x-padding--right-13 {
822
+ padding-right: var(--x-size-base-13) !important;
823
823
  }
824
- [dir="rtl"] .x-margin--right-13 {
825
- margin-left: var(--x-size-base-13) !important;
824
+ [dir="rtl"] .x-padding--right-13 {
825
+ padding-left: var(--x-size-base-13) !important;
826
826
  }
827
- [dir="ltr"] .x-margin--left-13 {
828
- margin-left: var(--x-size-base-13) !important;
827
+ [dir="ltr"] .x-padding--left-13 {
828
+ padding-left: var(--x-size-base-13) !important;
829
829
  }
830
- [dir="rtl"] .x-margin--left-13 {
831
- margin-right: var(--x-size-base-13) !important;
830
+ [dir="rtl"] .x-padding--left-13 {
831
+ padding-right: var(--x-size-base-13) !important;
832
832
  }
833
- .x-margin--top-14 {
834
- margin-top: var(--x-size-base-14) !important;
833
+ .x-padding--top-14 {
834
+ padding-top: var(--x-size-base-14) !important;
835
835
  }
836
- .x-margin--bottom-14 {
837
- margin-bottom: var(--x-size-base-14) !important;
836
+ .x-padding--bottom-14 {
837
+ padding-bottom: var(--x-size-base-14) !important;
838
838
  }
839
- [dir="ltr"] .x-margin--right-14 {
840
- margin-right: var(--x-size-base-14) !important;
839
+ [dir="ltr"] .x-padding--right-14 {
840
+ padding-right: var(--x-size-base-14) !important;
841
841
  }
842
- [dir="rtl"] .x-margin--right-14 {
843
- margin-left: var(--x-size-base-14) !important;
842
+ [dir="rtl"] .x-padding--right-14 {
843
+ padding-left: var(--x-size-base-14) !important;
844
844
  }
845
- [dir="ltr"] .x-margin--left-14 {
846
- margin-left: var(--x-size-base-14) !important;
845
+ [dir="ltr"] .x-padding--left-14 {
846
+ padding-left: var(--x-size-base-14) !important;
847
847
  }
848
- [dir="rtl"] .x-margin--left-14 {
849
- margin-right: var(--x-size-base-14) !important;
848
+ [dir="rtl"] .x-padding--left-14 {
849
+ padding-right: var(--x-size-base-14) !important;
850
850
  }
851
- .x-margin--top-15 {
852
- margin-top: var(--x-size-base-15) !important;
851
+ .x-padding--top-15 {
852
+ padding-top: var(--x-size-base-15) !important;
853
853
  }
854
- .x-margin--bottom-15 {
855
- margin-bottom: var(--x-size-base-15) !important;
854
+ .x-padding--bottom-15 {
855
+ padding-bottom: var(--x-size-base-15) !important;
856
856
  }
857
- [dir="ltr"] .x-margin--right-15 {
858
- margin-right: var(--x-size-base-15) !important;
857
+ [dir="ltr"] .x-padding--right-15 {
858
+ padding-right: var(--x-size-base-15) !important;
859
859
  }
860
- [dir="rtl"] .x-margin--right-15 {
861
- margin-left: var(--x-size-base-15) !important;
860
+ [dir="rtl"] .x-padding--right-15 {
861
+ padding-left: var(--x-size-base-15) !important;
862
862
  }
863
- [dir="ltr"] .x-margin--left-15 {
864
- margin-left: var(--x-size-base-15) !important;
863
+ [dir="ltr"] .x-padding--left-15 {
864
+ padding-left: var(--x-size-base-15) !important;
865
865
  }
866
- [dir="rtl"] .x-margin--left-15 {
867
- margin-right: var(--x-size-base-15) !important;
866
+ [dir="rtl"] .x-padding--left-15 {
867
+ padding-right: var(--x-size-base-15) !important;
868
868
  }
869
- .x-margin--top-16 {
870
- margin-top: var(--x-size-base-16) !important;
869
+ .x-padding--top-16 {
870
+ padding-top: var(--x-size-base-16) !important;
871
871
  }
872
- .x-margin--bottom-16 {
873
- margin-bottom: var(--x-size-base-16) !important;
872
+ .x-padding--bottom-16 {
873
+ padding-bottom: var(--x-size-base-16) !important;
874
874
  }
875
- [dir="ltr"] .x-margin--right-16 {
876
- margin-right: var(--x-size-base-16) !important;
875
+ [dir="ltr"] .x-padding--right-16 {
876
+ padding-right: var(--x-size-base-16) !important;
877
877
  }
878
- [dir="rtl"] .x-margin--right-16 {
879
- margin-left: var(--x-size-base-16) !important;
878
+ [dir="rtl"] .x-padding--right-16 {
879
+ padding-left: var(--x-size-base-16) !important;
880
880
  }
881
- [dir="ltr"] .x-margin--left-16 {
882
- margin-left: var(--x-size-base-16) !important;
881
+ [dir="ltr"] .x-padding--left-16 {
882
+ padding-left: var(--x-size-base-16) !important;
883
883
  }
884
- [dir="rtl"] .x-margin--left-16 {
885
- margin-right: var(--x-size-base-16) !important;
884
+ [dir="rtl"] .x-padding--left-16 {
885
+ padding-right: var(--x-size-base-16) !important;
886
886
  }
887
- .x-margin--top-17 {
888
- margin-top: var(--x-size-base-17) !important;
887
+ .x-padding--top-17 {
888
+ padding-top: var(--x-size-base-17) !important;
889
889
  }
890
- .x-margin--bottom-17 {
891
- margin-bottom: var(--x-size-base-17) !important;
890
+ .x-padding--bottom-17 {
891
+ padding-bottom: var(--x-size-base-17) !important;
892
892
  }
893
- [dir="ltr"] .x-margin--right-17 {
894
- margin-right: var(--x-size-base-17) !important;
893
+ [dir="ltr"] .x-padding--right-17 {
894
+ padding-right: var(--x-size-base-17) !important;
895
895
  }
896
- [dir="rtl"] .x-margin--right-17 {
897
- margin-left: var(--x-size-base-17) !important;
896
+ [dir="rtl"] .x-padding--right-17 {
897
+ padding-left: var(--x-size-base-17) !important;
898
898
  }
899
- [dir="ltr"] .x-margin--left-17 {
900
- margin-left: var(--x-size-base-17) !important;
899
+ [dir="ltr"] .x-padding--left-17 {
900
+ padding-left: var(--x-size-base-17) !important;
901
901
  }
902
- [dir="rtl"] .x-margin--left-17 {
903
- margin-right: var(--x-size-base-17) !important;
902
+ [dir="rtl"] .x-padding--left-17 {
903
+ padding-right: var(--x-size-base-17) !important;
904
904
  }
905
- .x-margin--top-18 {
906
- margin-top: var(--x-size-base-18) !important;
905
+ .x-padding--top-18 {
906
+ padding-top: var(--x-size-base-18) !important;
907
907
  }
908
- .x-margin--bottom-18 {
909
- margin-bottom: var(--x-size-base-18) !important;
908
+ .x-padding--bottom-18 {
909
+ padding-bottom: var(--x-size-base-18) !important;
910
910
  }
911
- [dir="ltr"] .x-margin--right-18 {
912
- margin-right: var(--x-size-base-18) !important;
911
+ [dir="ltr"] .x-padding--right-18 {
912
+ padding-right: var(--x-size-base-18) !important;
913
913
  }
914
- [dir="rtl"] .x-margin--right-18 {
915
- margin-left: var(--x-size-base-18) !important;
914
+ [dir="rtl"] .x-padding--right-18 {
915
+ padding-left: var(--x-size-base-18) !important;
916
916
  }
917
- [dir="ltr"] .x-margin--left-18 {
918
- margin-left: var(--x-size-base-18) !important;
917
+ [dir="ltr"] .x-padding--left-18 {
918
+ padding-left: var(--x-size-base-18) !important;
919
919
  }
920
- [dir="rtl"] .x-margin--left-18 {
921
- margin-right: var(--x-size-base-18) !important;
920
+ [dir="rtl"] .x-padding--left-18 {
921
+ padding-right: var(--x-size-base-18) !important;
922
922
  }
923
- .x-margin--top-19 {
924
- margin-top: var(--x-size-base-19) !important;
923
+ .x-padding--top-19 {
924
+ padding-top: var(--x-size-base-19) !important;
925
925
  }
926
- .x-margin--bottom-19 {
927
- margin-bottom: var(--x-size-base-19) !important;
926
+ .x-padding--bottom-19 {
927
+ padding-bottom: var(--x-size-base-19) !important;
928
928
  }
929
- [dir="ltr"] .x-margin--right-19 {
930
- margin-right: var(--x-size-base-19) !important;
929
+ [dir="ltr"] .x-padding--right-19 {
930
+ padding-right: var(--x-size-base-19) !important;
931
931
  }
932
- [dir="rtl"] .x-margin--right-19 {
933
- margin-left: var(--x-size-base-19) !important;
932
+ [dir="rtl"] .x-padding--right-19 {
933
+ padding-left: var(--x-size-base-19) !important;
934
934
  }
935
- [dir="ltr"] .x-margin--left-19 {
936
- margin-left: var(--x-size-base-19) !important;
935
+ [dir="ltr"] .x-padding--left-19 {
936
+ padding-left: var(--x-size-base-19) !important;
937
937
  }
938
- [dir="rtl"] .x-margin--left-19 {
939
- margin-right: var(--x-size-base-19) !important;
938
+ [dir="rtl"] .x-padding--left-19 {
939
+ padding-right: var(--x-size-base-19) !important;
940
940
  }
941
- .x-margin--top-20 {
942
- margin-top: var(--x-size-base-20) !important;
941
+ .x-padding--top-20 {
942
+ padding-top: var(--x-size-base-20) !important;
943
943
  }
944
- .x-margin--bottom-20 {
945
- margin-bottom: var(--x-size-base-20) !important;
944
+ .x-padding--bottom-20 {
945
+ padding-bottom: var(--x-size-base-20) !important;
946
946
  }
947
- [dir="ltr"] .x-margin--right-20 {
948
- margin-right: var(--x-size-base-20) !important;
947
+ [dir="ltr"] .x-padding--right-20 {
948
+ padding-right: var(--x-size-base-20) !important;
949
949
  }
950
- [dir="rtl"] .x-margin--right-20 {
951
- margin-left: var(--x-size-base-20) !important;
950
+ [dir="rtl"] .x-padding--right-20 {
951
+ padding-left: var(--x-size-base-20) !important;
952
952
  }
953
- [dir="ltr"] .x-margin--left-20 {
954
- margin-left: var(--x-size-base-20) !important;
953
+ [dir="ltr"] .x-padding--left-20 {
954
+ padding-left: var(--x-size-base-20) !important;
955
955
  }
956
- [dir="rtl"] .x-margin--left-20 {
957
- margin-right: var(--x-size-base-20) !important;
956
+ [dir="rtl"] .x-padding--left-20 {
957
+ padding-right: var(--x-size-base-20) !important;
958
958
  }
959
959
  .x-line-height--none {
960
960
  line-height: 1 !important;
@@ -1022,6 +1022,49 @@
1022
1022
  .x-font-weight--bold {
1023
1023
  font-weight: var(--x-number-font-weight-base-bold) !important;
1024
1024
  }
1025
+ .x-font-color--lead {
1026
+ color: var(--x-color-base-lead) !important;
1027
+ }
1028
+
1029
+ .x-font-color--auxiliary {
1030
+ color: var(--x-color-base-auxiliary) !important;
1031
+ }
1032
+
1033
+ .x-font-color--neutral-10 {
1034
+ color: var(--x-color-base-neutral-10) !important;
1035
+ }
1036
+
1037
+ .x-font-color--neutral-35 {
1038
+ color: var(--x-color-base-neutral-35) !important;
1039
+ }
1040
+
1041
+ .x-font-color--neutral-70 {
1042
+ color: var(--x-color-base-neutral-70) !important;
1043
+ }
1044
+
1045
+ .x-font-color--neutral-95 {
1046
+ color: var(--x-color-base-neutral-95) !important;
1047
+ }
1048
+
1049
+ .x-font-color--neutral-100 {
1050
+ color: var(--x-color-base-neutral-100) !important;
1051
+ }
1052
+
1053
+ .x-font-color--accent {
1054
+ color: var(--x-color-base-accent) !important;
1055
+ }
1056
+
1057
+ .x-font-color--enable {
1058
+ color: var(--x-color-base-enable) !important;
1059
+ }
1060
+
1061
+ .x-font-color--disable {
1062
+ color: var(--x-color-base-disable) !important;
1063
+ }
1064
+
1065
+ .x-font-color--transparent {
1066
+ color: var(--x-color-base-transparent) !important;
1067
+ }
1025
1068
  .x-font-size--01 {
1026
1069
  font-size: var(--x-size-base-01) !important;
1027
1070
  line-height: 1.5;
@@ -1091,59 +1134,16 @@
1091
1134
  line-height: 1.5;
1092
1135
  }
1093
1136
  .x-font-size--18 {
1094
- font-size: var(--x-size-base-18) !important;
1095
- line-height: 1.5;
1096
- }
1097
- .x-font-size--19 {
1098
- font-size: var(--x-size-base-19) !important;
1099
- line-height: 1.5;
1100
- }
1101
- .x-font-size--20 {
1102
- font-size: var(--x-size-base-20) !important;
1103
- line-height: 1.5;
1104
- }
1105
- .x-font-color--lead {
1106
- color: var(--x-color-base-lead) !important;
1107
- }
1108
-
1109
- .x-font-color--auxiliary {
1110
- color: var(--x-color-base-auxiliary) !important;
1111
- }
1112
-
1113
- .x-font-color--neutral-10 {
1114
- color: var(--x-color-base-neutral-10) !important;
1115
- }
1116
-
1117
- .x-font-color--neutral-35 {
1118
- color: var(--x-color-base-neutral-35) !important;
1119
- }
1120
-
1121
- .x-font-color--neutral-70 {
1122
- color: var(--x-color-base-neutral-70) !important;
1123
- }
1124
-
1125
- .x-font-color--neutral-95 {
1126
- color: var(--x-color-base-neutral-95) !important;
1127
- }
1128
-
1129
- .x-font-color--neutral-100 {
1130
- color: var(--x-color-base-neutral-100) !important;
1131
- }
1132
-
1133
- .x-font-color--accent {
1134
- color: var(--x-color-base-accent) !important;
1135
- }
1136
-
1137
- .x-font-color--enable {
1138
- color: var(--x-color-base-enable) !important;
1137
+ font-size: var(--x-size-base-18) !important;
1138
+ line-height: 1.5;
1139
1139
  }
1140
-
1141
- .x-font-color--disable {
1142
- color: var(--x-color-base-disable) !important;
1140
+ .x-font-size--19 {
1141
+ font-size: var(--x-size-base-19) !important;
1142
+ line-height: 1.5;
1143
1143
  }
1144
-
1145
- .x-font-color--transparent {
1146
- color: var(--x-color-base-transparent) !important;
1144
+ .x-font-size--20 {
1145
+ font-size: var(--x-size-base-20) !important;
1146
+ line-height: 1.5;
1147
1147
  }
1148
1148
  .x-flex-1 {
1149
1149
  flex: 1 1 0% !important;
@@ -1299,139 +1299,6 @@
1299
1299
  --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
1300
1300
  0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1301
1301
  }
1302
- /* Material Elevations extracted from:
1303
- https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
1304
- */
1305
- :root {
1306
- /* Shadow none */
1307
- --x-string-box-shadow-00: none;
1308
- /* Shadow 1dp */
1309
- --x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
1310
- 0 1px 3px 0 rgba(0, 0, 0, 0.2);
1311
- /* Shadow 2dp */
1312
- --x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
1313
- 0 1px 5px 0 rgba(0, 0, 0, 0.2);
1314
- /* Shadow 3dp */
1315
- --x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
1316
- 0 1px 8px 0 rgba(0, 0, 0, 0.2);
1317
- /* Shadow 4dp */
1318
- --x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
1319
- 0 2px 4px -1px rgba(0, 0, 0, 0.2);
1320
- /* Shadow 6dp */
1321
- --x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
1322
- 0 3px 5px -1px rgba(0, 0, 0, 0.2);
1323
- /* Shadow 8dp */
1324
- --x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
1325
- 0 5px 5px -3px rgba(0, 0, 0, 0.2);
1326
- /* Shadow 9dp */
1327
- --x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
1328
- 0 5px 6px -3px rgba(0, 0, 0, 0.2);
1329
- /* Shadow 12dp */
1330
- --x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
1331
- 0 7px 8px -4px rgba(0, 0, 0, 0.2);
1332
- /* Shadow 16dp */
1333
- --x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
1334
- 0 8px 10px -5px rgba(0, 0, 0, 0.2);
1335
- /* Shadow 24dp */
1336
- --x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
1337
- 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1338
- /* BOTTOM ONLY SHADOW (not overflows on top of the element) */
1339
- /* Shadow 1dp */
1340
- --x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
1341
- 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
1342
- /* Shadow 2dp */
1343
- --x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
1344
- 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
1345
- /* Shadow 3dp */
1346
- --x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
1347
- 0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
1348
- /* Shadow 4dp */
1349
- --x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
1350
- 0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
1351
- /* Shadow 6dp */
1352
- --x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
1353
- 0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
1354
- /* Shadow 8dp */
1355
- --x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
1356
- 0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
1357
- /* Shadow 9dp */
1358
- --x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
1359
- 0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
1360
- /* Shadow 12dp */
1361
- --x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
1362
- 0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
1363
- /* Shadow 16dp */
1364
- --x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
1365
- 0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
1366
- /* Shadow 24dp */
1367
- --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
1368
- 0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1369
- }
1370
-
1371
- .x-shadow--none {
1372
- box-shadow: none !important;
1373
- }
1374
-
1375
- .x-shadow--01 {
1376
- box-shadow: var(--x-string-box-shadow-01) !important;
1377
- }
1378
- .x-shadow--bottom-01 {
1379
- box-shadow: var(--x-string-box-shadow-bottom-01) !important;
1380
- }
1381
- .x-shadow--02 {
1382
- box-shadow: var(--x-string-box-shadow-02) !important;
1383
- }
1384
- .x-shadow--bottom-02 {
1385
- box-shadow: var(--x-string-box-shadow-bottom-02) !important;
1386
- }
1387
- .x-shadow--03 {
1388
- box-shadow: var(--x-string-box-shadow-03) !important;
1389
- }
1390
- .x-shadow--bottom-03 {
1391
- box-shadow: var(--x-string-box-shadow-bottom-03) !important;
1392
- }
1393
- .x-shadow--04 {
1394
- box-shadow: var(--x-string-box-shadow-04) !important;
1395
- }
1396
- .x-shadow--bottom-04 {
1397
- box-shadow: var(--x-string-box-shadow-bottom-04) !important;
1398
- }
1399
- .x-shadow--05 {
1400
- box-shadow: var(--x-string-box-shadow-05) !important;
1401
- }
1402
- .x-shadow--bottom-05 {
1403
- box-shadow: var(--x-string-box-shadow-bottom-05) !important;
1404
- }
1405
- .x-shadow--06 {
1406
- box-shadow: var(--x-string-box-shadow-06) !important;
1407
- }
1408
- .x-shadow--bottom-06 {
1409
- box-shadow: var(--x-string-box-shadow-bottom-06) !important;
1410
- }
1411
- .x-shadow--07 {
1412
- box-shadow: var(--x-string-box-shadow-07) !important;
1413
- }
1414
- .x-shadow--bottom-07 {
1415
- box-shadow: var(--x-string-box-shadow-bottom-07) !important;
1416
- }
1417
- .x-shadow--08 {
1418
- box-shadow: var(--x-string-box-shadow-08) !important;
1419
- }
1420
- .x-shadow--bottom-08 {
1421
- box-shadow: var(--x-string-box-shadow-bottom-08) !important;
1422
- }
1423
- .x-shadow--09 {
1424
- box-shadow: var(--x-string-box-shadow-09) !important;
1425
- }
1426
- .x-shadow--bottom-09 {
1427
- box-shadow: var(--x-string-box-shadow-bottom-09) !important;
1428
- }
1429
- .x-shadow--10 {
1430
- box-shadow: var(--x-string-box-shadow-10) !important;
1431
- }
1432
- .x-shadow--bottom-10 {
1433
- box-shadow: var(--x-string-box-shadow-bottom-10) !important;
1434
- }
1435
1302
  *[class*=x-border-width--] {
1436
1303
  border-width: 0;
1437
1304
  }
@@ -1697,74 +1564,207 @@
1697
1564
  .x-border-width--right-08 {
1698
1565
  border-style: solid !important;
1699
1566
  }
1700
- [dir="ltr"] .x-border-width--left-08 {
1701
- border-left-width: 8px !important;
1567
+ [dir="ltr"] .x-border-width--left-08 {
1568
+ border-left-width: 8px !important;
1569
+ }
1570
+ [dir="rtl"] .x-border-width--left-08 {
1571
+ border-right-width: 8px !important;
1572
+ }
1573
+ .x-border-width--left-08 {
1574
+ border-style: solid !important;
1575
+ }
1576
+ .x-border-width--09 {
1577
+ border-width: 9px !important;
1578
+ border-style: solid !important;
1579
+ }
1580
+ .x-border-width--top-09 {
1581
+ border-top-width: 9px !important;
1582
+ border-style: solid !important;
1583
+ }
1584
+ .x-border-width--bottom-09 {
1585
+ border-bottom-width: 9px !important;
1586
+ border-style: solid !important;
1587
+ }
1588
+ [dir="ltr"] .x-border-width--right-09 {
1589
+ border-right-width: 9px !important;
1590
+ }
1591
+ [dir="rtl"] .x-border-width--right-09 {
1592
+ border-left-width: 9px !important;
1593
+ }
1594
+ .x-border-width--right-09 {
1595
+ border-style: solid !important;
1596
+ }
1597
+ [dir="ltr"] .x-border-width--left-09 {
1598
+ border-left-width: 9px !important;
1599
+ }
1600
+ [dir="rtl"] .x-border-width--left-09 {
1601
+ border-right-width: 9px !important;
1602
+ }
1603
+ .x-border-width--left-09 {
1604
+ border-style: solid !important;
1605
+ }
1606
+ .x-border-width--10 {
1607
+ border-width: 10px !important;
1608
+ border-style: solid !important;
1609
+ }
1610
+ .x-border-width--top-10 {
1611
+ border-top-width: 10px !important;
1612
+ border-style: solid !important;
1613
+ }
1614
+ .x-border-width--bottom-10 {
1615
+ border-bottom-width: 10px !important;
1616
+ border-style: solid !important;
1617
+ }
1618
+ [dir="ltr"] .x-border-width--right-10 {
1619
+ border-right-width: 10px !important;
1620
+ }
1621
+ [dir="rtl"] .x-border-width--right-10 {
1622
+ border-left-width: 10px !important;
1623
+ }
1624
+ .x-border-width--right-10 {
1625
+ border-style: solid !important;
1626
+ }
1627
+ [dir="ltr"] .x-border-width--left-10 {
1628
+ border-left-width: 10px !important;
1629
+ }
1630
+ [dir="rtl"] .x-border-width--left-10 {
1631
+ border-right-width: 10px !important;
1632
+ }
1633
+ .x-border-width--left-10 {
1634
+ border-style: solid !important;
1635
+ }
1636
+ /* Material Elevations extracted from:
1637
+ https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
1638
+ */
1639
+ :root {
1640
+ /* Shadow none */
1641
+ --x-string-box-shadow-00: none;
1642
+ /* Shadow 1dp */
1643
+ --x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
1644
+ 0 1px 3px 0 rgba(0, 0, 0, 0.2);
1645
+ /* Shadow 2dp */
1646
+ --x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
1647
+ 0 1px 5px 0 rgba(0, 0, 0, 0.2);
1648
+ /* Shadow 3dp */
1649
+ --x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
1650
+ 0 1px 8px 0 rgba(0, 0, 0, 0.2);
1651
+ /* Shadow 4dp */
1652
+ --x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
1653
+ 0 2px 4px -1px rgba(0, 0, 0, 0.2);
1654
+ /* Shadow 6dp */
1655
+ --x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
1656
+ 0 3px 5px -1px rgba(0, 0, 0, 0.2);
1657
+ /* Shadow 8dp */
1658
+ --x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
1659
+ 0 5px 5px -3px rgba(0, 0, 0, 0.2);
1660
+ /* Shadow 9dp */
1661
+ --x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
1662
+ 0 5px 6px -3px rgba(0, 0, 0, 0.2);
1663
+ /* Shadow 12dp */
1664
+ --x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
1665
+ 0 7px 8px -4px rgba(0, 0, 0, 0.2);
1666
+ /* Shadow 16dp */
1667
+ --x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
1668
+ 0 8px 10px -5px rgba(0, 0, 0, 0.2);
1669
+ /* Shadow 24dp */
1670
+ --x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
1671
+ 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1672
+ /* BOTTOM ONLY SHADOW (not overflows on top of the element) */
1673
+ /* Shadow 1dp */
1674
+ --x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
1675
+ 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
1676
+ /* Shadow 2dp */
1677
+ --x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
1678
+ 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
1679
+ /* Shadow 3dp */
1680
+ --x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
1681
+ 0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
1682
+ /* Shadow 4dp */
1683
+ --x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
1684
+ 0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
1685
+ /* Shadow 6dp */
1686
+ --x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
1687
+ 0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
1688
+ /* Shadow 8dp */
1689
+ --x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
1690
+ 0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
1691
+ /* Shadow 9dp */
1692
+ --x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
1693
+ 0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
1694
+ /* Shadow 12dp */
1695
+ --x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
1696
+ 0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
1697
+ /* Shadow 16dp */
1698
+ --x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
1699
+ 0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
1700
+ /* Shadow 24dp */
1701
+ --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
1702
+ 0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1703
+ }
1704
+
1705
+ .x-shadow--none {
1706
+ box-shadow: none !important;
1702
1707
  }
1703
- [dir="rtl"] .x-border-width--left-08 {
1704
- border-right-width: 8px !important;
1708
+
1709
+ .x-shadow--01 {
1710
+ box-shadow: var(--x-string-box-shadow-01) !important;
1705
1711
  }
1706
- .x-border-width--left-08 {
1707
- border-style: solid !important;
1712
+ .x-shadow--bottom-01 {
1713
+ box-shadow: var(--x-string-box-shadow-bottom-01) !important;
1708
1714
  }
1709
- .x-border-width--09 {
1710
- border-width: 9px !important;
1711
- border-style: solid !important;
1715
+ .x-shadow--02 {
1716
+ box-shadow: var(--x-string-box-shadow-02) !important;
1712
1717
  }
1713
- .x-border-width--top-09 {
1714
- border-top-width: 9px !important;
1715
- border-style: solid !important;
1718
+ .x-shadow--bottom-02 {
1719
+ box-shadow: var(--x-string-box-shadow-bottom-02) !important;
1716
1720
  }
1717
- .x-border-width--bottom-09 {
1718
- border-bottom-width: 9px !important;
1719
- border-style: solid !important;
1721
+ .x-shadow--03 {
1722
+ box-shadow: var(--x-string-box-shadow-03) !important;
1720
1723
  }
1721
- [dir="ltr"] .x-border-width--right-09 {
1722
- border-right-width: 9px !important;
1724
+ .x-shadow--bottom-03 {
1725
+ box-shadow: var(--x-string-box-shadow-bottom-03) !important;
1723
1726
  }
1724
- [dir="rtl"] .x-border-width--right-09 {
1725
- border-left-width: 9px !important;
1727
+ .x-shadow--04 {
1728
+ box-shadow: var(--x-string-box-shadow-04) !important;
1726
1729
  }
1727
- .x-border-width--right-09 {
1728
- border-style: solid !important;
1730
+ .x-shadow--bottom-04 {
1731
+ box-shadow: var(--x-string-box-shadow-bottom-04) !important;
1729
1732
  }
1730
- [dir="ltr"] .x-border-width--left-09 {
1731
- border-left-width: 9px !important;
1733
+ .x-shadow--05 {
1734
+ box-shadow: var(--x-string-box-shadow-05) !important;
1732
1735
  }
1733
- [dir="rtl"] .x-border-width--left-09 {
1734
- border-right-width: 9px !important;
1736
+ .x-shadow--bottom-05 {
1737
+ box-shadow: var(--x-string-box-shadow-bottom-05) !important;
1735
1738
  }
1736
- .x-border-width--left-09 {
1737
- border-style: solid !important;
1739
+ .x-shadow--06 {
1740
+ box-shadow: var(--x-string-box-shadow-06) !important;
1738
1741
  }
1739
- .x-border-width--10 {
1740
- border-width: 10px !important;
1741
- border-style: solid !important;
1742
+ .x-shadow--bottom-06 {
1743
+ box-shadow: var(--x-string-box-shadow-bottom-06) !important;
1742
1744
  }
1743
- .x-border-width--top-10 {
1744
- border-top-width: 10px !important;
1745
- border-style: solid !important;
1745
+ .x-shadow--07 {
1746
+ box-shadow: var(--x-string-box-shadow-07) !important;
1746
1747
  }
1747
- .x-border-width--bottom-10 {
1748
- border-bottom-width: 10px !important;
1749
- border-style: solid !important;
1748
+ .x-shadow--bottom-07 {
1749
+ box-shadow: var(--x-string-box-shadow-bottom-07) !important;
1750
1750
  }
1751
- [dir="ltr"] .x-border-width--right-10 {
1752
- border-right-width: 10px !important;
1751
+ .x-shadow--08 {
1752
+ box-shadow: var(--x-string-box-shadow-08) !important;
1753
1753
  }
1754
- [dir="rtl"] .x-border-width--right-10 {
1755
- border-left-width: 10px !important;
1754
+ .x-shadow--bottom-08 {
1755
+ box-shadow: var(--x-string-box-shadow-bottom-08) !important;
1756
1756
  }
1757
- .x-border-width--right-10 {
1758
- border-style: solid !important;
1757
+ .x-shadow--09 {
1758
+ box-shadow: var(--x-string-box-shadow-09) !important;
1759
1759
  }
1760
- [dir="ltr"] .x-border-width--left-10 {
1761
- border-left-width: 10px !important;
1760
+ .x-shadow--bottom-09 {
1761
+ box-shadow: var(--x-string-box-shadow-bottom-09) !important;
1762
1762
  }
1763
- [dir="rtl"] .x-border-width--left-10 {
1764
- border-right-width: 10px !important;
1763
+ .x-shadow--10 {
1764
+ box-shadow: var(--x-string-box-shadow-10) !important;
1765
1765
  }
1766
- .x-border-width--left-10 {
1767
- border-style: solid !important;
1766
+ .x-shadow--bottom-10 {
1767
+ box-shadow: var(--x-string-box-shadow-bottom-10) !important;
1768
1768
  }
1769
1769
  .x-border-radius--00 {
1770
1770
  border-radius: 0 !important;
@@ -3317,24 +3317,6 @@
3317
3317
  .x-border-color--transparent {
3318
3318
  border-color: var(--x-color-base-transparent) !important;
3319
3319
  }
3320
- .x-text--stroke.x-text {
3321
- --x-string-text-decoration: line-through;
3322
- }
3323
- .x-text--stroke.x-title1 {
3324
- --x-string-text-decoration-title1: line-through;
3325
- }
3326
- .x-text--stroke.x-title2 {
3327
- --x-string-text-decoration-title2: line-through;
3328
- }
3329
- .x-text--stroke.x-title3 {
3330
- --x-string-text-decoration-title3: line-through;
3331
- }
3332
- .x-text--stroke.x-small {
3333
- --x-string-text-decoration-small: line-through;
3334
- }
3335
- :root {
3336
- --x-color-text-secondary: var(--x-color-base-neutral-35);
3337
- }
3338
3320
  .x-background--lead {
3339
3321
  background-color: var(--x-color-base-lead) !important;
3340
3322
  }
@@ -3378,6 +3360,24 @@
3378
3360
  .x-background--transparent {
3379
3361
  background-color: var(--x-color-base-transparent) !important;
3380
3362
  }
3363
+ :root {
3364
+ --x-color-text-secondary: var(--x-color-base-neutral-35);
3365
+ }
3366
+ .x-text--stroke.x-text {
3367
+ --x-string-text-decoration: line-through;
3368
+ }
3369
+ .x-text--stroke.x-title1 {
3370
+ --x-string-text-decoration-title1: line-through;
3371
+ }
3372
+ .x-text--stroke.x-title2 {
3373
+ --x-string-text-decoration-title2: line-through;
3374
+ }
3375
+ .x-text--stroke.x-title3 {
3376
+ --x-string-text-decoration-title3: line-through;
3377
+ }
3378
+ .x-text--stroke.x-small {
3379
+ --x-string-text-decoration-small: line-through;
3380
+ }
3381
3381
  .x-text--secondary {
3382
3382
  --x-color-text-default: var(--x-color-text-secondary);
3383
3383
  }
@@ -3436,6 +3436,21 @@
3436
3436
  --x-size-line-height-small: var(--x-size-line-height-base-s);
3437
3437
  --x-string-text-decoration-small: none;
3438
3438
  }
3439
+ .x-text--bold.x-text {
3440
+ --x-number-font-weight-text: var(--x-number-font-weight-base-bold);
3441
+ }
3442
+ .x-text--bold.x-title1 {
3443
+ --x-number-font-weight-title1: var(--x-number-font-weight-base-bold);
3444
+ }
3445
+ .x-text--bold.x-title2 {
3446
+ --x-number-font-weight-title2: var(--x-number-font-weight-base-bold);
3447
+ }
3448
+ .x-text--bold.x-title3 {
3449
+ --x-number-font-weight-title3: var(--x-number-font-weight-base-bold);
3450
+ }
3451
+ .x-text--bold.x-small {
3452
+ --x-number-font-weight-small: var(--x-number-font-weight-base-bold);
3453
+ }
3439
3454
  :root {
3440
3455
  --x-font-family-base: "Montserrat", sans-serif;
3441
3456
  --x-size-font-base-xs: 12px;
@@ -3538,21 +3553,6 @@
3538
3553
  overflow: hidden;
3539
3554
  white-space: nowrap;
3540
3555
  }
3541
- .x-text--bold.x-text {
3542
- --x-number-font-weight-text: var(--x-number-font-weight-base-bold);
3543
- }
3544
- .x-text--bold.x-title1 {
3545
- --x-number-font-weight-title1: var(--x-number-font-weight-base-bold);
3546
- }
3547
- .x-text--bold.x-title2 {
3548
- --x-number-font-weight-title2: var(--x-number-font-weight-base-bold);
3549
- }
3550
- .x-text--bold.x-title3 {
3551
- --x-number-font-weight-title3: var(--x-number-font-weight-base-bold);
3552
- }
3553
- .x-text--bold.x-small {
3554
- --x-number-font-weight-small: var(--x-number-font-weight-base-bold);
3555
- }
3556
3556
  :root {
3557
3557
  --x-color-text-accent: var(--x-color-base-accent);
3558
3558
  }
@@ -3566,6 +3566,17 @@
3566
3566
  --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3567
3567
  --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3568
3568
  }
3569
+
3570
+ .x-tag--pill.x-tag,
3571
+ .x-tag--pill .x-tag {
3572
+ --x-size-border-radius-tag-default: var(--x-size-border-radius-tag-pill);
3573
+ --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-top-left-tag-pill);
3574
+ --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-top-right-tag-pill);
3575
+ --x-size-border-radius-bottom-right-tag-default: var(
3576
+ --x-size-border-radius-bottom-right-tag-pill
3577
+ );
3578
+ --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-pill);
3579
+ }
3569
3580
  :root {
3570
3581
  --x-color-background-tag-ghost: transparent;
3571
3582
  --x-color-border-tag-ghost: transparent;
@@ -3578,6 +3589,13 @@
3578
3589
  --x-number-font-weight-tag-selected-ghost: var(--x-number-font-weight-base-bold);
3579
3590
  --x-number-font-weight-tag-curated-selected-ghost: var(--x-number-font-weight-base-bold);
3580
3591
  }
3592
+ :root {
3593
+ --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
3594
+ --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
3595
+ --x-size-border-radius-top-right-tag-pill: var(--x-size-border-radius-tag-pill);
3596
+ --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3597
+ --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3598
+ }
3581
3599
  :root {
3582
3600
  --x-color-background-tag-ghost: transparent;
3583
3601
  --x-color-border-tag-ghost: transparent;
@@ -3654,52 +3672,6 @@
3654
3672
  --x-number-font-weight-tag-default-selected
3655
3673
  );
3656
3674
  }
3657
- :root {
3658
- --x-color-background-tag-default: var(--x-color-base-neutral-100);
3659
- --x-color-border-tag-default: var(--x-color-text-tag-default);
3660
- --x-color-text-tag-default: var(--x-color-text-default);
3661
- --x-color-background-tag-default-selected: var(--x-color-base-neutral-95);
3662
- --x-color-border-tag-default-selected: var(--x-color-border-tag-default);
3663
- --x-color-text-tag-default-selected: var(--x-color-text-tag-default);
3664
- --x-color-background-tag-default-curated: var(--x-color-background-tag-default);
3665
- --x-color-border-tag-default-curated: var(--x-color-border-tag-default);
3666
- --x-color-text-tag-default-curated: var(--x-color-text-tag-default);
3667
- --x-color-background-tag-default-curated-selected: var(--x-color-background-tag-default-selected);
3668
- --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-default-selected);
3669
- --x-color-text-tag-default-curated-selected: var(--x-color-text-tag-default-selected);
3670
- --x-size-border-width-tag-default: var(--x-size-border-width-base);
3671
- --x-size-border-width-top-tag-default: var(--x-size-border-width-tag-default);
3672
- --x-size-border-width-right-tag-default: var(--x-size-border-width-tag-default);
3673
- --x-size-border-width-bottom-tag-default: var(--x-size-border-width-tag-default);
3674
- --x-size-border-width-left-tag-default: var(--x-size-border-width-tag-default);
3675
- --x-size-border-radius-tag-default: var(--x-size-border-radius-base-none);
3676
- --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-tag-default);
3677
- --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-tag-default);
3678
- --x-size-border-radius-bottom-right-tag-default: var(--x-size-border-radius-tag-default);
3679
- --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-tag-default);
3680
- --x-size-height-tag-default: var(--x-size-base-07);
3681
- --x-size-padding-right-tag-default: var(--x-size-base-04);
3682
- --x-size-padding-left-tag-default: var(--x-size-base-04);
3683
- --x-size-gap-tag-default: var(--x-size-base-02);
3684
- --x-font-family-tag-default: var(--x-font-family-text);
3685
- --x-size-font-tag-default: var(--x-size-font-text);
3686
- --x-size-line-height-tag-default: var(--x-size-line-height-text);
3687
- --x-number-font-weight-tag-default: var(--x-number-font-weight-text);
3688
- --x-font-family-tag-default-selected: var(--x-font-family-tag-default);
3689
- --x-size-font-tag-default-selected: var(--x-size-font-tag-default);
3690
- --x-size-line-height-tag-default-selected: var(--x-size-line-height-tag-default);
3691
- --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-default);
3692
- --x-font-family-tag-default-curated: var(--x-font-family-tag-default);
3693
- --x-size-font-tag-default-curated: var(--x-size-font-tag-default);
3694
- --x-size-line-height-tag-default-curated: var(--x-size-line-height-tag-default);
3695
- --x-number-font-weight-tag-default-curated: var(--x-number-font-weight-tag-default);
3696
- --x-font-family-tag-default-curated-selected: var(--x-font-family-tag-default-selected);
3697
- --x-size-font-tag-default-curated-selected: var(--x-size-font-tag-default-selected);
3698
- --x-size-line-height-tag-default-curated-selected: var(--x-size-line-height-tag-default-selected);
3699
- --x-number-font-weight-tag-default-curated-selected: var(
3700
- --x-number-font-weight-tag-default-selected
3701
- );
3702
- }
3703
3675
 
3704
3676
  [dir="ltr"] .x-tag {
3705
3677
  border-left-width: var(--x-size-border-width-left-tag-default);
@@ -3873,7 +3845,53 @@
3873
3845
  --x-number-font-weight-filter-count-default-selected: var(
3874
3846
  --x-number-font-weight-tag-default-selected
3875
3847
  );
3876
- --x-size-line-height-filter-default-selected: var(--x-size-line-height-tag-default-selected);
3848
+ --x-size-line-height-filter-default-selected: var(--x-size-line-height-tag-default-selected);
3849
+ }
3850
+ :root {
3851
+ --x-color-background-tag-default: var(--x-color-base-neutral-100);
3852
+ --x-color-border-tag-default: var(--x-color-text-tag-default);
3853
+ --x-color-text-tag-default: var(--x-color-text-default);
3854
+ --x-color-background-tag-default-selected: var(--x-color-base-neutral-95);
3855
+ --x-color-border-tag-default-selected: var(--x-color-border-tag-default);
3856
+ --x-color-text-tag-default-selected: var(--x-color-text-tag-default);
3857
+ --x-color-background-tag-default-curated: var(--x-color-background-tag-default);
3858
+ --x-color-border-tag-default-curated: var(--x-color-border-tag-default);
3859
+ --x-color-text-tag-default-curated: var(--x-color-text-tag-default);
3860
+ --x-color-background-tag-default-curated-selected: var(--x-color-background-tag-default-selected);
3861
+ --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-default-selected);
3862
+ --x-color-text-tag-default-curated-selected: var(--x-color-text-tag-default-selected);
3863
+ --x-size-border-width-tag-default: var(--x-size-border-width-base);
3864
+ --x-size-border-width-top-tag-default: var(--x-size-border-width-tag-default);
3865
+ --x-size-border-width-right-tag-default: var(--x-size-border-width-tag-default);
3866
+ --x-size-border-width-bottom-tag-default: var(--x-size-border-width-tag-default);
3867
+ --x-size-border-width-left-tag-default: var(--x-size-border-width-tag-default);
3868
+ --x-size-border-radius-tag-default: var(--x-size-border-radius-base-none);
3869
+ --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-tag-default);
3870
+ --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-tag-default);
3871
+ --x-size-border-radius-bottom-right-tag-default: var(--x-size-border-radius-tag-default);
3872
+ --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-tag-default);
3873
+ --x-size-height-tag-default: var(--x-size-base-07);
3874
+ --x-size-padding-right-tag-default: var(--x-size-base-04);
3875
+ --x-size-padding-left-tag-default: var(--x-size-base-04);
3876
+ --x-size-gap-tag-default: var(--x-size-base-02);
3877
+ --x-font-family-tag-default: var(--x-font-family-text);
3878
+ --x-size-font-tag-default: var(--x-size-font-text);
3879
+ --x-size-line-height-tag-default: var(--x-size-line-height-text);
3880
+ --x-number-font-weight-tag-default: var(--x-number-font-weight-text);
3881
+ --x-font-family-tag-default-selected: var(--x-font-family-tag-default);
3882
+ --x-size-font-tag-default-selected: var(--x-size-font-tag-default);
3883
+ --x-size-line-height-tag-default-selected: var(--x-size-line-height-tag-default);
3884
+ --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-default);
3885
+ --x-font-family-tag-default-curated: var(--x-font-family-tag-default);
3886
+ --x-size-font-tag-default-curated: var(--x-size-font-tag-default);
3887
+ --x-size-line-height-tag-default-curated: var(--x-size-line-height-tag-default);
3888
+ --x-number-font-weight-tag-default-curated: var(--x-number-font-weight-tag-default);
3889
+ --x-font-family-tag-default-curated-selected: var(--x-font-family-tag-default-selected);
3890
+ --x-size-font-tag-default-curated-selected: var(--x-size-font-tag-default-selected);
3891
+ --x-size-line-height-tag-default-curated-selected: var(--x-size-line-height-tag-default-selected);
3892
+ --x-number-font-weight-tag-default-curated-selected: var(
3893
+ --x-number-font-weight-tag-default-selected
3894
+ );
3877
3895
  }
3878
3896
  :root {
3879
3897
  --x-size-border-radius-tag-card: var(--x-size-border-radius-base-s);
@@ -3942,22 +3960,94 @@
3942
3960
  --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-suggestion-default);
3943
3961
  }
3944
3962
  :root {
3945
- --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
3946
- --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
3947
- --x-size-border-radius-top-right-tag-pill: var(--x-size-border-radius-tag-pill);
3948
- --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3949
- --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3950
- }
3951
-
3952
- .x-tag--pill.x-tag,
3953
- .x-tag--pill .x-tag {
3954
- --x-size-border-radius-tag-default: var(--x-size-border-radius-tag-pill);
3955
- --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-top-left-tag-pill);
3956
- --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-top-right-tag-pill);
3957
- --x-size-border-radius-bottom-right-tag-default: var(
3958
- --x-size-border-radius-bottom-right-tag-pill
3963
+ --x-string-align-items-suggestion-default: center;
3964
+ --x-color-text-suggestion-default: var(--x-color-text-default);
3965
+ --x-color-text-suggestion-matching-part-default: var(--x-color-base-neutral-35);
3966
+ --x-color-text-suggestion-default-matching: var(--x-color-text-suggestion-default);
3967
+ --x-color-text-suggestion-filter-default: var(--x-color-base-neutral-35);
3968
+ --x-color-background-suggestion-default: transparent;
3969
+ --x-color-border-suggestion-default: var(--x-color-text-suggestion-default);
3970
+ --x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default);
3971
+ --x-color-text-suggestion-matching-part-default-curated: var(
3972
+ --x-color-text-suggestion-matching-part-default
3973
+ );
3974
+ --x-color-text-suggestion-default-matching-curated: var(
3975
+ --x-color-text-suggestion-default-matching
3976
+ );
3977
+ --x-color-background-suggestion-default-curated: var(--x-color-background-suggestion-default);
3978
+ --x-color-border-suggestion-default-curated: var(--x-color-border-suggestion-default);
3979
+ --x-size-padding-top-suggestion-default: var(--x-size-base-01);
3980
+ --x-size-padding-right-suggestion-default: 0;
3981
+ --x-size-padding-bottom-suggestion-default: var(--x-size-base-02);
3982
+ --x-size-padding-left-suggestion-default: 0;
3983
+ --x-size-gap-suggestion-default: var(--x-size-base-03);
3984
+ --x-size-border-width-suggestion-default: 0;
3985
+ --x-size-border-width-top-suggestion-default: var(--x-size-border-width-suggestion-default);
3986
+ --x-size-border-width-right-suggestion-default: var(--x-size-border-width-suggestion-default);
3987
+ --x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-suggestion-default);
3988
+ --x-size-border-width-left-suggestion-default: var(--x-size-border-width-suggestion-default);
3989
+ --x-size-border-radius-suggestion-default: var(--x-size-border-radius-base-none);
3990
+ --x-size-border-radius-top-left-suggestion-default: var(
3991
+ --x-size-border-radius-suggestion-default
3992
+ );
3993
+ --x-size-border-radius-top-right-suggestion-default: var(
3994
+ --x-size-border-radius-suggestion-default
3995
+ );
3996
+ --x-size-border-radius-bottom-right-suggestion-default: var(
3997
+ --x-size-border-radius-suggestion-default
3998
+ );
3999
+ --x-size-border-radius-bottom-left-suggestion-default: var(
4000
+ --x-size-border-radius-suggestion-default
4001
+ );
4002
+ --x-font-family-suggestion-default: var(--x-font-family-text);
4003
+ --x-size-font-suggestion-default: var(--x-size-font-text);
4004
+ --x-size-line-height-suggestion-default: var(--x-size-line-height-text);
4005
+ --x-number-font-weight-suggestion-default: var(--x-number-font-weight-text);
4006
+ --x-font-family-suggestion-matching-part-default: var(--x-font-family-suggestion-default);
4007
+ --x-size-font-suggestion-matching-part-default: var(--x-size-font-suggestion-default);
4008
+ --x-size-line-height-suggestion-matching-part-default: var(
4009
+ --x-size-line-height-suggestion-default
4010
+ );
4011
+ --x-number-font-weight-suggestion-matching-part-default: var(
4012
+ --x-number-font-weight-suggestion-default
4013
+ );
4014
+ --x-font-family-suggestion-default-matching: var(--x-font-family-suggestion-default);
4015
+ --x-size-font-suggestion-default-matching: var(--x-size-font-suggestion-default);
4016
+ --x-size-line-height-suggestion-default-matching: var(--x-size-line-height-suggestion-default);
4017
+ --x-number-font-weight-suggestion-default-matching: var(
4018
+ --x-number-font-weight-suggestion-default
4019
+ );
4020
+ --x-font-family-suggestion-filter-default: var(--x-font-family-suggestion-default);
4021
+ --x-size-font-suggestion-filter-default: var(--x-size-font-suggestion-default);
4022
+ --x-size-line-height-suggestion-filter-default: var(--x-size-line-height-suggestion-default);
4023
+ --x-number-font-weight-suggestion-filter-default: var(--x-number-font-weight-suggestion-default);
4024
+ --x-text-transform-suggestion-filter-default: none;
4025
+ --x-font-family-suggestion-default-curated: var(--x-font-family-suggestion-default);
4026
+ --x-size-font-suggestion-default-curated: var(--x-size-font-suggestion-default);
4027
+ --x-size-line-height-suggestion-default-curated: var(--x-size-line-height-suggestion-default);
4028
+ --x-number-font-weight-suggestion-default-curated: var(--x-number-font-weight-suggestion-default);
4029
+ --x-font-family-suggestion-matching-part-default-curated: var(
4030
+ --x-font-family-suggestion-matching-part-default
4031
+ );
4032
+ --x-size-font-suggestion-matching-part-default-curated: var(
4033
+ --x-size-font-suggestion-matching-part-default
4034
+ );
4035
+ --x-size-line-height-suggestion-matching-part-default-curated: var(
4036
+ --x-size-line-height-suggestion-matching-part-default
4037
+ );
4038
+ --x-number-font-weight-suggestion-matching-part-default-curated: var(
4039
+ --x-number-font-weight-suggestion-matching-part-default
4040
+ );
4041
+ --x-font-family-suggestion-default-matching-curated: var(
4042
+ --x-font-family-suggestion-default-matching
4043
+ );
4044
+ --x-size-font-suggestion-default-matching-curated: var(--x-size-font-suggestion-default-matching);
4045
+ --x-size-line-height-suggestion-default-matching-curated: var(
4046
+ --x-size-line-height-suggestion-default-matching
4047
+ );
4048
+ --x-number-font-weight-suggestion-default-matching-curated: var(
4049
+ --x-number-font-weight-suggestion-default-matching
3959
4050
  );
3960
- --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-pill);
3961
4051
  }
3962
4052
  :root {
3963
4053
  --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
@@ -4053,118 +4143,28 @@
4053
4143
  border-bottom-width: var(--x-size-border-width-bottom-suggestion-group-default);
4054
4144
  border-radius: var(--x-size-border-radius-top-left-suggestion-group-default) var(--x-size-border-radius-top-right-suggestion-group-default) var(--x-size-border-radius-bottom-right-suggestion-group-default) var(--x-size-border-radius-bottom-left-suggestion-group-default);
4055
4145
  }
4056
- @media not all and (min-resolution: 0.001dpcm) {
4057
- .x-suggestion-group {
4058
- gap: 0;
4059
- }
4060
- .x-suggestion-group > *:not(:last-child) {
4061
- margin-right: var(--x-size-gap-suggestion-group-default);
4062
- }
4063
- }
4064
- .x-suggestion-group .x-suggestion {
4065
- padding: 0;
4066
- flex: 1 1 auto;
4067
- border: none;
4068
- }
4069
- .x-suggestion-group .x-button {
4070
- --x-color-background-button-default: transparent;
4071
- --x-color-border-button-default: transparent;
4072
- --x-color-text-button-default: var(--x-color-text-suggestion-group-default);
4073
- --x-size-height-button-default: var(--x-size-line-height-suggestion-group-default);
4074
- --x-size-padding-right-button-default: 0;
4075
- --x-size-padding-left-button-default: 0;
4076
- border: none;
4077
- }
4078
- :root {
4079
- --x-string-align-items-suggestion-default: center;
4080
- --x-color-text-suggestion-default: var(--x-color-text-default);
4081
- --x-color-text-suggestion-matching-part-default: var(--x-color-base-neutral-35);
4082
- --x-color-text-suggestion-default-matching: var(--x-color-text-suggestion-default);
4083
- --x-color-text-suggestion-filter-default: var(--x-color-base-neutral-35);
4084
- --x-color-background-suggestion-default: transparent;
4085
- --x-color-border-suggestion-default: var(--x-color-text-suggestion-default);
4086
- --x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default);
4087
- --x-color-text-suggestion-matching-part-default-curated: var(
4088
- --x-color-text-suggestion-matching-part-default
4089
- );
4090
- --x-color-text-suggestion-default-matching-curated: var(
4091
- --x-color-text-suggestion-default-matching
4092
- );
4093
- --x-color-background-suggestion-default-curated: var(--x-color-background-suggestion-default);
4094
- --x-color-border-suggestion-default-curated: var(--x-color-border-suggestion-default);
4095
- --x-size-padding-top-suggestion-default: var(--x-size-base-01);
4096
- --x-size-padding-right-suggestion-default: 0;
4097
- --x-size-padding-bottom-suggestion-default: var(--x-size-base-02);
4098
- --x-size-padding-left-suggestion-default: 0;
4099
- --x-size-gap-suggestion-default: var(--x-size-base-03);
4100
- --x-size-border-width-suggestion-default: 0;
4101
- --x-size-border-width-top-suggestion-default: var(--x-size-border-width-suggestion-default);
4102
- --x-size-border-width-right-suggestion-default: var(--x-size-border-width-suggestion-default);
4103
- --x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-suggestion-default);
4104
- --x-size-border-width-left-suggestion-default: var(--x-size-border-width-suggestion-default);
4105
- --x-size-border-radius-suggestion-default: var(--x-size-border-radius-base-none);
4106
- --x-size-border-radius-top-left-suggestion-default: var(
4107
- --x-size-border-radius-suggestion-default
4108
- );
4109
- --x-size-border-radius-top-right-suggestion-default: var(
4110
- --x-size-border-radius-suggestion-default
4111
- );
4112
- --x-size-border-radius-bottom-right-suggestion-default: var(
4113
- --x-size-border-radius-suggestion-default
4114
- );
4115
- --x-size-border-radius-bottom-left-suggestion-default: var(
4116
- --x-size-border-radius-suggestion-default
4117
- );
4118
- --x-font-family-suggestion-default: var(--x-font-family-text);
4119
- --x-size-font-suggestion-default: var(--x-size-font-text);
4120
- --x-size-line-height-suggestion-default: var(--x-size-line-height-text);
4121
- --x-number-font-weight-suggestion-default: var(--x-number-font-weight-text);
4122
- --x-font-family-suggestion-matching-part-default: var(--x-font-family-suggestion-default);
4123
- --x-size-font-suggestion-matching-part-default: var(--x-size-font-suggestion-default);
4124
- --x-size-line-height-suggestion-matching-part-default: var(
4125
- --x-size-line-height-suggestion-default
4126
- );
4127
- --x-number-font-weight-suggestion-matching-part-default: var(
4128
- --x-number-font-weight-suggestion-default
4129
- );
4130
- --x-font-family-suggestion-default-matching: var(--x-font-family-suggestion-default);
4131
- --x-size-font-suggestion-default-matching: var(--x-size-font-suggestion-default);
4132
- --x-size-line-height-suggestion-default-matching: var(--x-size-line-height-suggestion-default);
4133
- --x-number-font-weight-suggestion-default-matching: var(
4134
- --x-number-font-weight-suggestion-default
4135
- );
4136
- --x-font-family-suggestion-filter-default: var(--x-font-family-suggestion-default);
4137
- --x-size-font-suggestion-filter-default: var(--x-size-font-suggestion-default);
4138
- --x-size-line-height-suggestion-filter-default: var(--x-size-line-height-suggestion-default);
4139
- --x-number-font-weight-suggestion-filter-default: var(--x-number-font-weight-suggestion-default);
4140
- --x-text-transform-suggestion-filter-default: none;
4141
- --x-font-family-suggestion-default-curated: var(--x-font-family-suggestion-default);
4142
- --x-size-font-suggestion-default-curated: var(--x-size-font-suggestion-default);
4143
- --x-size-line-height-suggestion-default-curated: var(--x-size-line-height-suggestion-default);
4144
- --x-number-font-weight-suggestion-default-curated: var(--x-number-font-weight-suggestion-default);
4145
- --x-font-family-suggestion-matching-part-default-curated: var(
4146
- --x-font-family-suggestion-matching-part-default
4147
- );
4148
- --x-size-font-suggestion-matching-part-default-curated: var(
4149
- --x-size-font-suggestion-matching-part-default
4150
- );
4151
- --x-size-line-height-suggestion-matching-part-default-curated: var(
4152
- --x-size-line-height-suggestion-matching-part-default
4153
- );
4154
- --x-number-font-weight-suggestion-matching-part-default-curated: var(
4155
- --x-number-font-weight-suggestion-matching-part-default
4156
- );
4157
- --x-font-family-suggestion-default-matching-curated: var(
4158
- --x-font-family-suggestion-default-matching
4159
- );
4160
- --x-size-font-suggestion-default-matching-curated: var(--x-size-font-suggestion-default-matching);
4161
- --x-size-line-height-suggestion-default-matching-curated: var(
4162
- --x-size-line-height-suggestion-default-matching
4163
- );
4164
- --x-number-font-weight-suggestion-default-matching-curated: var(
4165
- --x-number-font-weight-suggestion-default-matching
4166
- );
4167
- }
4146
+ @media not all and (min-resolution: 0.001dpcm) {
4147
+ .x-suggestion-group {
4148
+ gap: 0;
4149
+ }
4150
+ .x-suggestion-group > *:not(:last-child) {
4151
+ margin-right: var(--x-size-gap-suggestion-group-default);
4152
+ }
4153
+ }
4154
+ .x-suggestion-group .x-suggestion {
4155
+ padding: 0;
4156
+ flex: 1 1 auto;
4157
+ border: none;
4158
+ }
4159
+ .x-suggestion-group .x-button {
4160
+ --x-color-background-button-default: transparent;
4161
+ --x-color-border-button-default: transparent;
4162
+ --x-color-text-button-default: var(--x-color-text-suggestion-group-default);
4163
+ --x-size-height-button-default: var(--x-size-line-height-suggestion-group-default);
4164
+ --x-size-padding-right-button-default: 0;
4165
+ --x-size-padding-left-button-default: 0;
4166
+ border: none;
4167
+ }
4168
4168
  :root {
4169
4169
  --x-string-align-items-suggestion-default: center;
4170
4170
  --x-color-text-suggestion-default: var(--x-color-text-default);
@@ -4387,12 +4387,6 @@
4387
4387
  --x-color-text-suggestion-default-matching-curated
4388
4388
  );
4389
4389
  }
4390
- :root {
4391
- --x-color-background-sliding-panel: var(--x-color-base-neutral-100);
4392
- --x-size-width-sliding-panel-gradient: var(--x-size-base-09);
4393
- --x-size-padding-sliding-panel-button: var(--x-size-base-03);
4394
- --x-size-horizontal-margin-sliding-panel-button-overflow: var(--x-size-base-02);
4395
- }
4396
4390
  .x-sliding-panel {
4397
4391
  z-index: 0;
4398
4392
  background-color: var(--x-color-background-sliding-panel);
@@ -4447,6 +4441,12 @@
4447
4441
  opacity: 1;
4448
4442
  pointer-events: all;
4449
4443
  }
4444
+ :root {
4445
+ --x-color-background-sliding-panel: var(--x-color-base-neutral-100);
4446
+ --x-size-width-sliding-panel-gradient: var(--x-size-base-09);
4447
+ --x-size-padding-sliding-panel-button: var(--x-size-base-03);
4448
+ --x-size-horizontal-margin-sliding-panel-button-overflow: var(--x-size-base-02);
4449
+ }
4450
4450
  :root {
4451
4451
  --x-string-overflow-scroll: auto;
4452
4452
  --x-color-background-scroll-bar: transparent;
@@ -4500,6 +4500,28 @@
4500
4500
  --x-size-padding-row-05: var(--x-size-base-05);
4501
4501
  --x-size-padding-row-06: var(--x-size-base-06);
4502
4502
  }
4503
+ :root {
4504
+ --x-size-gap-row-01: var(--x-size-base-01);
4505
+ --x-size-gap-row-02: var(--x-size-base-02);
4506
+ --x-size-gap-row-03: var(--x-size-base-03);
4507
+ --x-size-gap-row-04: var(--x-size-base-04);
4508
+ --x-size-gap-row-05: var(--x-size-base-05);
4509
+ --x-size-gap-row-06: var(--x-size-base-06);
4510
+ --x-size-gap-row-07: var(--x-size-base-07);
4511
+ --x-size-gap-row-08: var(--x-size-base-08);
4512
+ --x-size-gap-row-09: var(--x-size-base-09);
4513
+ --x-size-gap-row-10: var(--x-size-base-10);
4514
+ --x-size-gap-row-11: var(--x-size-base-11);
4515
+ --x-size-gap-row-12: var(--x-size-base-12);
4516
+ --x-size-gap-row-13: var(--x-size-base-13);
4517
+ --x-size-gap-row-14: var(--x-size-base-14);
4518
+ --x-size-gap-row-15: var(--x-size-base-15);
4519
+ --x-size-gap-row-16: var(--x-size-base-16);
4520
+ --x-size-gap-row-17: var(--x-size-base-17);
4521
+ --x-size-gap-row-18: var(--x-size-base-18);
4522
+ --x-size-gap-row-19: var(--x-size-base-19);
4523
+ --x-size-gap-row-20: var(--x-size-base-20);
4524
+ }
4503
4525
  /* @deprecated */
4504
4526
  :root {
4505
4527
  --x-size-padding-row-02: var(--x-size-base-02);
@@ -4551,28 +4573,6 @@
4551
4573
  --x-size-gap-row-19: var(--x-size-base-19);
4552
4574
  --x-size-gap-row-20: var(--x-size-base-20);
4553
4575
  }
4554
- :root {
4555
- --x-size-gap-row-01: var(--x-size-base-01);
4556
- --x-size-gap-row-02: var(--x-size-base-02);
4557
- --x-size-gap-row-03: var(--x-size-base-03);
4558
- --x-size-gap-row-04: var(--x-size-base-04);
4559
- --x-size-gap-row-05: var(--x-size-base-05);
4560
- --x-size-gap-row-06: var(--x-size-base-06);
4561
- --x-size-gap-row-07: var(--x-size-base-07);
4562
- --x-size-gap-row-08: var(--x-size-base-08);
4563
- --x-size-gap-row-09: var(--x-size-base-09);
4564
- --x-size-gap-row-10: var(--x-size-base-10);
4565
- --x-size-gap-row-11: var(--x-size-base-11);
4566
- --x-size-gap-row-12: var(--x-size-base-12);
4567
- --x-size-gap-row-13: var(--x-size-base-13);
4568
- --x-size-gap-row-14: var(--x-size-base-14);
4569
- --x-size-gap-row-15: var(--x-size-base-15);
4570
- --x-size-gap-row-16: var(--x-size-base-16);
4571
- --x-size-gap-row-17: var(--x-size-base-17);
4572
- --x-size-gap-row-18: var(--x-size-base-18);
4573
- --x-size-gap-row-19: var(--x-size-base-19);
4574
- --x-size-gap-row-20: var(--x-size-base-20);
4575
- }
4576
4576
 
4577
4577
  .x-row--gap-01 {
4578
4578
  --x-size-gap-row: var(--x-size-gap-row-01);
@@ -4789,6 +4789,9 @@
4789
4789
  .x-row--align-stretch {
4790
4790
  --x-size-align-row: stretch;
4791
4791
  }
4792
+ :root {
4793
+ --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4794
+ }
4792
4795
  :root {
4793
4796
  --x-color-border-result-default: var(--x-color-base-lead);
4794
4797
  --x-color-border-result-overlay-default: var(--x-color-border-result-default);
@@ -4877,7 +4880,13 @@
4877
4880
  }
4878
4881
  }
4879
4882
  :root {
4880
- --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4883
+ --x-size-height-progress-bar-line-default: var(--x-size-base-02);
4884
+ --x-size-width-progress-bar-line-default: var(--x-size-base-20);
4885
+ --x-color-background-progress-bar-default: var(--x-color-base-neutral-70);
4886
+ --x-color-border-progress-bar-default: var(--x-color-background-progress-bar-default);
4887
+ --x-color-background-progress-bar-line-default: var(--x-color-base-neutral-10);
4888
+ --x-size-border-radius-progress-bar-default: var(--x-size-border-radius-base-pill);
4889
+ --x-size-border-width-progress-bar-default: 0;
4881
4890
  }
4882
4891
  :root {
4883
4892
  --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
@@ -4896,15 +4905,6 @@
4896
4905
  --x-size-border-radius-progress-bar-default: var(--x-size-border-radius-base-pill);
4897
4906
  --x-size-border-width-progress-bar-default: 0;
4898
4907
  }
4899
- :root {
4900
- --x-size-height-progress-bar-line-default: var(--x-size-base-02);
4901
- --x-size-width-progress-bar-line-default: var(--x-size-base-20);
4902
- --x-color-background-progress-bar-default: var(--x-color-base-neutral-70);
4903
- --x-color-border-progress-bar-default: var(--x-color-background-progress-bar-default);
4904
- --x-color-background-progress-bar-line-default: var(--x-color-base-neutral-10);
4905
- --x-size-border-radius-progress-bar-default: var(--x-size-border-radius-base-pill);
4906
- --x-size-border-width-progress-bar-default: 0;
4907
- }
4908
4908
 
4909
4909
  .x-progress-bar {
4910
4910
  display: inline-block;
@@ -4939,14 +4939,14 @@
4939
4939
  :root {
4940
4940
  --x-number-aspect-ratio-picture: 1;
4941
4941
  }
4942
- :root {
4943
- --x-number-aspect-ratio-picture: 1;
4944
- }
4945
4942
 
4946
4943
  .x-picture--fixed-ratio.x-picture {
4947
4944
  aspect-ratio: var(--x-number-aspect-ratio-picture);
4948
4945
  width: 100%;
4949
4946
  }
4947
+ :root {
4948
+ --x-number-aspect-ratio-picture: 1;
4949
+ }
4950
4950
  :root {
4951
4951
  --x-size-border-radius-picture-default: 0;
4952
4952
  --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
@@ -5172,86 +5172,6 @@
5172
5172
  --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
5173
5173
  --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
5174
5174
  }
5175
- :root {
5176
- --x-color-background-option-list-button-default: transparent;
5177
- --x-color-border-option-list-button-default: transparent;
5178
- --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
5179
- --x-color-background-option-list-button-default-hover: var(
5180
- --x-color-background-option-list-button-default
5181
- );
5182
- --x-color-border-option-list-button-default-hover: var(
5183
- --x-color-border-option-list-button-default
5184
- );
5185
- --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
5186
- --x-color-background-option-list-button-default-selected: var(
5187
- --x-color-background-option-list-button-default
5188
- );
5189
- --x-color-border-option-list-button-default-selected: var(
5190
- --x-color-border-option-list-button-default
5191
- );
5192
- --x-color-text-option-list-button-default-selected: var(--x-color-text-default);
5193
- --x-color-background-option-list-button-default-selected-hover: var(
5194
- --x-color-background-option-list-button-default-selected
5195
- );
5196
- --x-color-border-option-list-button-default-selected-hover: var(
5197
- --x-color-border-option-list-button-default-selected
5198
- );
5199
- --x-color-text-option-list-button-default-selected-hover: var(
5200
- --x-color-text-option-list-button-default-selected
5201
- );
5202
- --x-color-border-option-list-item-default: var(--x-color-base-neutral-70);
5203
- --x-color-border-top-option-list-item-default: var(--x-color-border-option-list-item-default);
5204
- --x-color-border-right-option-list-item-default: var(--x-color-border-option-list-item-default);
5205
- --x-color-border-bottom-option-list-item-default: var(--x-color-border-option-list-item-default);
5206
- --x-color-border-left-option-list-item-default: var(--x-color-border-option-list-item-default);
5207
- --x-color-border-option-list-item-default-selected: var(--x-color-base-neutral-70);
5208
- --x-color-border-top-option-list-item-default-selected: var(
5209
- --x-color-border-option-list-item-default-selected
5210
- );
5211
- --x-color-border-right-option-list-item-default-selected: var(
5212
- --x-color-border-option-list-item-default-selected
5213
- );
5214
- --x-color-border-bottom-option-list-item-default-selected: var(
5215
- --x-color-border-option-list-item-default-selected
5216
- );
5217
- --x-color-border-left-option-list-item-default-selected: var(
5218
- --x-color-border-option-list-item-default-selected
5219
- );
5220
- --x-size-border-width-option-list-item-default: var(--x-size-border-width-base);
5221
- --x-size-border-width-top-option-list-item-default: 0;
5222
- --x-size-border-width-right-option-list-item-default: var(
5223
- --x-size-border-width-option-list-item-default
5224
- );
5225
- --x-size-border-width-bottom-option-list-item-default: 0;
5226
- --x-size-border-width-left-option-list-item-default: 0;
5227
- --x-size-border-width-top-option-list-item-default-selected: var(
5228
- --x-size-border-width-top-option-list-item-default
5229
- );
5230
- --x-size-border-width-right-option-list-item-default-selected: var(
5231
- --x-size-border-width-right-option-list-item-default
5232
- );
5233
- --x-size-border-width-bottom-option-list-item-default-selected: var(
5234
- --x-size-border-width-bottom-option-list-item-default
5235
- );
5236
- --x-size-border-width-left-option-list-item-default-selected: var(
5237
- --x-size-border-width-left-option-list-item-default
5238
- );
5239
- --x-size-padding-option-list-button-default: var(--x-size-base-02);
5240
- --x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
5241
- --x-size-padding-right-option-list-button-default: var(
5242
- --x-size-padding-option-list-button-default
5243
- );
5244
- --x-size-padding-bottom-option-list-button-default: var(
5245
- --x-size-padding-option-list-button-default
5246
- );
5247
- --x-size-padding-left-option-list-button-default: var(
5248
- --x-size-padding-option-list-button-default
5249
- );
5250
- --x-font-decoration-option-list-button-default-hover: underline;
5251
- --x-size-font-option-list-button-default: var(--x-size-font-text);
5252
- --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
5253
- --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
5254
- }
5255
5175
 
5256
5176
  .x-option-list {
5257
5177
  display: inline-flex;
@@ -5359,10 +5279,90 @@
5359
5279
  --x-color-background-button-default: var(
5360
5280
  --x-color-background-option-list-button-default-hover
5361
5281
  );
5362
- --x-color-border-button-default: var(--x-color-border-option-list-button-default-hover);
5363
- --x-color-text-button-default: var(--x-color-text-option-list-button-default-hover);
5364
- -webkit-text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5365
- text-decoration: var(--x-font-decoration-option-list-button-default-hover);
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-background-option-list-button-default: transparent;
5289
+ --x-color-border-option-list-button-default: transparent;
5290
+ --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
5291
+ --x-color-background-option-list-button-default-hover: var(
5292
+ --x-color-background-option-list-button-default
5293
+ );
5294
+ --x-color-border-option-list-button-default-hover: var(
5295
+ --x-color-border-option-list-button-default
5296
+ );
5297
+ --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
5298
+ --x-color-background-option-list-button-default-selected: var(
5299
+ --x-color-background-option-list-button-default
5300
+ );
5301
+ --x-color-border-option-list-button-default-selected: var(
5302
+ --x-color-border-option-list-button-default
5303
+ );
5304
+ --x-color-text-option-list-button-default-selected: var(--x-color-text-default);
5305
+ --x-color-background-option-list-button-default-selected-hover: var(
5306
+ --x-color-background-option-list-button-default-selected
5307
+ );
5308
+ --x-color-border-option-list-button-default-selected-hover: var(
5309
+ --x-color-border-option-list-button-default-selected
5310
+ );
5311
+ --x-color-text-option-list-button-default-selected-hover: var(
5312
+ --x-color-text-option-list-button-default-selected
5313
+ );
5314
+ --x-color-border-option-list-item-default: var(--x-color-base-neutral-70);
5315
+ --x-color-border-top-option-list-item-default: var(--x-color-border-option-list-item-default);
5316
+ --x-color-border-right-option-list-item-default: var(--x-color-border-option-list-item-default);
5317
+ --x-color-border-bottom-option-list-item-default: var(--x-color-border-option-list-item-default);
5318
+ --x-color-border-left-option-list-item-default: var(--x-color-border-option-list-item-default);
5319
+ --x-color-border-option-list-item-default-selected: var(--x-color-base-neutral-70);
5320
+ --x-color-border-top-option-list-item-default-selected: var(
5321
+ --x-color-border-option-list-item-default-selected
5322
+ );
5323
+ --x-color-border-right-option-list-item-default-selected: var(
5324
+ --x-color-border-option-list-item-default-selected
5325
+ );
5326
+ --x-color-border-bottom-option-list-item-default-selected: var(
5327
+ --x-color-border-option-list-item-default-selected
5328
+ );
5329
+ --x-color-border-left-option-list-item-default-selected: var(
5330
+ --x-color-border-option-list-item-default-selected
5331
+ );
5332
+ --x-size-border-width-option-list-item-default: var(--x-size-border-width-base);
5333
+ --x-size-border-width-top-option-list-item-default: 0;
5334
+ --x-size-border-width-right-option-list-item-default: var(
5335
+ --x-size-border-width-option-list-item-default
5336
+ );
5337
+ --x-size-border-width-bottom-option-list-item-default: 0;
5338
+ --x-size-border-width-left-option-list-item-default: 0;
5339
+ --x-size-border-width-top-option-list-item-default-selected: var(
5340
+ --x-size-border-width-top-option-list-item-default
5341
+ );
5342
+ --x-size-border-width-right-option-list-item-default-selected: var(
5343
+ --x-size-border-width-right-option-list-item-default
5344
+ );
5345
+ --x-size-border-width-bottom-option-list-item-default-selected: var(
5346
+ --x-size-border-width-bottom-option-list-item-default
5347
+ );
5348
+ --x-size-border-width-left-option-list-item-default-selected: var(
5349
+ --x-size-border-width-left-option-list-item-default
5350
+ );
5351
+ --x-size-padding-option-list-button-default: var(--x-size-base-02);
5352
+ --x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
5353
+ --x-size-padding-right-option-list-button-default: var(
5354
+ --x-size-padding-option-list-button-default
5355
+ );
5356
+ --x-size-padding-bottom-option-list-button-default: var(
5357
+ --x-size-padding-option-list-button-default
5358
+ );
5359
+ --x-size-padding-left-option-list-button-default: var(
5360
+ --x-size-padding-option-list-button-default
5361
+ );
5362
+ --x-font-decoration-option-list-button-default-hover: underline;
5363
+ --x-size-font-option-list-button-default: var(--x-size-font-text);
5364
+ --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
5365
+ --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
5366
5366
  }
5367
5367
  :root {
5368
5368
  --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
@@ -5409,6 +5409,10 @@
5409
5409
  --x-number-font-weight-base-regular
5410
5410
  );
5411
5411
  }
5412
+ :root {
5413
+ --x-modal-overlay-color: rgb(0, 0, 0);
5414
+ --x-modal-overlay-opacity: 0.7;
5415
+ }
5412
5416
  :root {
5413
5417
  --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5414
5418
  --x-color-text-option-list-button-bottom-selected-hover: var(
@@ -5544,10 +5548,6 @@
5544
5548
  --x-modal-overlay-color: rgb(0, 0, 0);
5545
5549
  --x-modal-overlay-opacity: 0.7;
5546
5550
  }
5547
- :root {
5548
- --x-modal-overlay-color: rgb(0, 0, 0);
5549
- --x-modal-overlay-opacity: 0.7;
5550
- }
5551
5551
 
5552
5552
  .x-modal__overlay {
5553
5553
  background-color: var(--x-modal-overlay-color) !important;
@@ -5661,22 +5661,6 @@
5661
5661
  --x-size-padding-list-12: var(--x-size-base-12);
5662
5662
  --x-size-padding-list-13: var(--x-size-base-13);
5663
5663
  }
5664
- /* @deprecated */
5665
- :root {
5666
- --x-size-padding-list-01: var(--x-size-base-01);
5667
- --x-size-padding-list-02: var(--x-size-base-02);
5668
- --x-size-padding-list-03: var(--x-size-base-03);
5669
- --x-size-padding-list-04: var(--x-size-base-04);
5670
- --x-size-padding-list-05: var(--x-size-base-05);
5671
- --x-size-padding-list-06: var(--x-size-base-06);
5672
- --x-size-padding-list-07: var(--x-size-base-07);
5673
- --x-size-padding-list-08: var(--x-size-base-08);
5674
- --x-size-padding-list-09: var(--x-size-base-09);
5675
- --x-size-padding-list-10: var(--x-size-base-10);
5676
- --x-size-padding-list-11: var(--x-size-base-11);
5677
- --x-size-padding-list-12: var(--x-size-base-12);
5678
- --x-size-padding-list-13: var(--x-size-base-13);
5679
- }
5680
5664
 
5681
5665
  /* @deprecated */
5682
5666
  [class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-right) {
@@ -6001,6 +5985,22 @@
6001
5985
  margin-right: var(--x-size-gap-list-13);
6002
5986
  }
6003
5987
  }
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
6004
  :root {
6005
6005
  --x-size-gap-list-01: var(--x-size-base-01);
6006
6006
  --x-size-gap-list-02: var(--x-size-base-02);
@@ -6719,6 +6719,41 @@
6719
6719
  --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6720
6720
  --x-size-border-width-left-input-group-line: 0;
6721
6721
  }
6722
+ :root {
6723
+ --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
6724
+ --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6725
+ --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
6726
+ --x-size-border-radius-bottom-right-input-group-pill: var(
6727
+ --x-size-border-radius-input-group-pill
6728
+ );
6729
+ --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6730
+ }
6731
+
6732
+ .x-input-group--pill.x-input-group,
6733
+ .x-input-group--pill .x-input-group {
6734
+ --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-pill);
6735
+ --x-size-border-radius-top-left-input-group-default: var(
6736
+ --x-size-border-radius-top-left-input-group-pill
6737
+ );
6738
+ --x-size-border-radius-top-right-input-group-default: var(
6739
+ --x-size-border-radius-top-right-input-group-pill
6740
+ );
6741
+ --x-size-border-radius-bottom-right-input-group-default: var(
6742
+ --x-size-border-radius-bottom-right-input-group-pill
6743
+ );
6744
+ --x-size-border-radius-bottom-left-input-group-default: var(
6745
+ --x-size-border-radius-bottom-left-input-group-pill
6746
+ );
6747
+ }
6748
+ :root {
6749
+ --x-size-padding-left-input-group-line: 0;
6750
+ --x-size-padding-right-input-group-line: 0;
6751
+ --x-size-border-width-input-group-line: var(--x-size-border-width-input-group-default);
6752
+ --x-size-border-width-top-input-group-line: 0;
6753
+ --x-size-border-width-right-input-group-line: 0;
6754
+ --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6755
+ --x-size-border-width-left-input-group-line: 0;
6756
+ }
6722
6757
 
6723
6758
  .x-input-group--line .x-input-group,
6724
6759
  .x-input-group--line.x-input-group {
@@ -6758,13 +6793,13 @@
6758
6793
  margin-bottom: calc(var(--x-size-border-width-bottom-input-group-line) * -1) !important;
6759
6794
  }
6760
6795
  :root {
6761
- --x-size-padding-left-input-group-line: 0;
6762
- --x-size-padding-right-input-group-line: 0;
6763
- --x-size-border-width-input-group-line: var(--x-size-border-width-input-group-default);
6764
- --x-size-border-width-top-input-group-line: 0;
6765
- --x-size-border-width-right-input-group-line: 0;
6766
- --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6767
- --x-size-border-width-left-input-group-line: 0;
6796
+ --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
6797
+ --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
6798
+ --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
6799
+ --x-size-border-radius-bottom-right-input-group-card: var(
6800
+ --x-size-border-radius-input-group-card
6801
+ );
6802
+ --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
6768
6803
  }
6769
6804
  :root {
6770
6805
  --x-color-background-input-group-default: var(--x-color-background-input-default);
@@ -6809,6 +6844,42 @@
6809
6844
  );
6810
6845
  --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6811
6846
  }
6847
+ :root {
6848
+ --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
6849
+ --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
6850
+ --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
6851
+ --x-size-border-radius-bottom-right-input-group-card: var(
6852
+ --x-size-border-radius-input-group-card
6853
+ );
6854
+ --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
6855
+ }
6856
+
6857
+ .x-input-group--card.x-input-group,
6858
+ .x-input-group--card .x-input-group {
6859
+ --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-card);
6860
+ --x-size-border-radius-top-left-input-group-default: var(
6861
+ --x-size-border-radius-top-left-input-group-card
6862
+ );
6863
+ --x-size-border-radius-top-right-input-group-default: var(
6864
+ --x-size-border-radius-top-right-input-group-card
6865
+ );
6866
+ --x-size-border-radius-bottom-right-input-group-default: var(
6867
+ --x-size-border-radius-bottom-right-input-group-card
6868
+ );
6869
+ --x-size-border-radius-bottom-left-input-group-default: var(
6870
+ --x-size-border-radius-bottom-left-input-group-card
6871
+ );
6872
+ }
6873
+ .x-input-group--card.x-input-group__action:first-child,
6874
+ .x-input-group--card .x-input-group__action:first-child {
6875
+ --x-size-border-radius-top-right-input-group-default: 0;
6876
+ --x-size-border-radius-bottom-right-input-group-default: 0;
6877
+ }
6878
+ .x-input-group--card.x-input-group__action:last-child,
6879
+ .x-input-group--card .x-input-group__action:last-child {
6880
+ --x-size-border-radius-top-left-input-group-default: 0;
6881
+ --x-size-border-radius-bottom-left-input-group-default: 0;
6882
+ }
6812
6883
  :root {
6813
6884
  --x-color-background-input-group-default: var(--x-color-background-input-default);
6814
6885
  --x-color-border-input-group-default: var(--x-color-border-input-default);
@@ -6986,58 +7057,6 @@
6986
7057
  [dir="rtl"] .x-input-group > .x-input-group__action:last-child {
6987
7058
  margin-left: calc(var(--x-size-border-width-right-input-group-default) * -1);
6988
7059
  }
6989
- :root {
6990
- --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
6991
- --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
6992
- --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
6993
- --x-size-border-radius-bottom-right-input-group-card: var(
6994
- --x-size-border-radius-input-group-card
6995
- );
6996
- --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
6997
- }
6998
- :root {
6999
- --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
7000
- --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
7001
- --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
7002
- --x-size-border-radius-bottom-right-input-group-card: var(
7003
- --x-size-border-radius-input-group-card
7004
- );
7005
- --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
7006
- }
7007
-
7008
- .x-input-group--card.x-input-group,
7009
- .x-input-group--card .x-input-group {
7010
- --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-card);
7011
- --x-size-border-radius-top-left-input-group-default: var(
7012
- --x-size-border-radius-top-left-input-group-card
7013
- );
7014
- --x-size-border-radius-top-right-input-group-default: var(
7015
- --x-size-border-radius-top-right-input-group-card
7016
- );
7017
- --x-size-border-radius-bottom-right-input-group-default: var(
7018
- --x-size-border-radius-bottom-right-input-group-card
7019
- );
7020
- --x-size-border-radius-bottom-left-input-group-default: var(
7021
- --x-size-border-radius-bottom-left-input-group-card
7022
- );
7023
- }
7024
- .x-input-group--card.x-input-group__action:first-child,
7025
- .x-input-group--card .x-input-group__action:first-child {
7026
- --x-size-border-radius-top-right-input-group-default: 0;
7027
- --x-size-border-radius-bottom-right-input-group-default: 0;
7028
- }
7029
- .x-input-group--card.x-input-group__action:last-child,
7030
- .x-input-group--card .x-input-group__action:last-child {
7031
- --x-size-border-radius-top-left-input-group-default: 0;
7032
- --x-size-border-radius-bottom-left-input-group-default: 0;
7033
- }
7034
- :root {
7035
- --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7036
- --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7037
- --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7038
- --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7039
- --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7040
- }
7041
7060
  :root {
7042
7061
  --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7043
7062
  --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
@@ -7045,25 +7064,6 @@
7045
7064
  --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7046
7065
  --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7047
7066
  }
7048
-
7049
- .x-input--pill.x-input,
7050
- .x-input--pill .x-input {
7051
- --x-size-border-radius-input-default: var(--x-size-border-radius-input-pill);
7052
- --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-pill);
7053
- --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-pill);
7054
- --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-pill);
7055
- --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-pill);
7056
- }
7057
- :root {
7058
- --x-size-padding-top-input-line: var(--x-size-base-03);
7059
- --x-size-padding-right-input-line: 0;
7060
- --x-size-padding-bottom-input-line: var(--x-size-base-03);
7061
- --x-size-padding-left-input-line: 0;
7062
- --x-size-border-width-top-input-line: 0;
7063
- --x-size-border-width-right-input-line: 0;
7064
- --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7065
- --x-size-border-width-left-input-line: 0;
7066
- }
7067
7067
  :root {
7068
7068
  --x-size-padding-top-input-line: var(--x-size-base-03);
7069
7069
  --x-size-padding-right-input-line: 0;
@@ -7074,43 +7074,43 @@
7074
7074
  --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7075
7075
  --x-size-border-width-left-input-line: 0;
7076
7076
  }
7077
-
7078
- .x-input--line .x-input,
7079
- .x-input--line.x-input {
7080
- --x-size-padding-top-input-default: var(--x-size-padding-top-input-line);
7081
- --x-size-padding-right-input-default: var(--x-size-padding-right-input-line);
7082
- --x-size-padding-bottom-input-default: var(--x-size-padding-bottom-input-line);
7083
- --x-size-padding-left-input-default: var(--x-size-padding-left-input-line);
7084
- --x-size-border-width-top-input-default: var(--x-size-border-width-top-input-line);
7085
- --x-size-border-width-right-input-default: var(--x-size-border-width-right-input-line);
7086
- --x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
7087
- --x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
7088
- }
7089
7077
  :root {
7090
- --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
7091
- --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
7092
- --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
7093
- --x-size-border-radius-bottom-right-input-group-pill: var(
7094
- --x-size-border-radius-input-group-pill
7095
- );
7096
- --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
7078
+ --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7079
+ --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7080
+ --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7081
+ --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7082
+ --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7097
7083
  }
7098
7084
 
7099
- .x-input-group--pill.x-input-group,
7100
- .x-input-group--pill .x-input-group {
7101
- --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-pill);
7102
- --x-size-border-radius-top-left-input-group-default: var(
7103
- --x-size-border-radius-top-left-input-group-pill
7104
- );
7105
- --x-size-border-radius-top-right-input-group-default: var(
7106
- --x-size-border-radius-top-right-input-group-pill
7107
- );
7108
- --x-size-border-radius-bottom-right-input-group-default: var(
7109
- --x-size-border-radius-bottom-right-input-group-pill
7110
- );
7111
- --x-size-border-radius-bottom-left-input-group-default: var(
7112
- --x-size-border-radius-bottom-left-input-group-pill
7113
- );
7085
+ .x-input--pill.x-input,
7086
+ .x-input--pill .x-input {
7087
+ --x-size-border-radius-input-default: var(--x-size-border-radius-input-pill);
7088
+ --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-pill);
7089
+ --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-pill);
7090
+ --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-pill);
7091
+ --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-pill);
7092
+ }
7093
+ :root {
7094
+ --x-size-padding-top-input-line: var(--x-size-base-03);
7095
+ --x-size-padding-right-input-line: 0;
7096
+ --x-size-padding-bottom-input-line: var(--x-size-base-03);
7097
+ --x-size-padding-left-input-line: 0;
7098
+ --x-size-border-width-top-input-line: 0;
7099
+ --x-size-border-width-right-input-line: 0;
7100
+ --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7101
+ --x-size-border-width-left-input-line: 0;
7102
+ }
7103
+
7104
+ .x-input--line .x-input,
7105
+ .x-input--line.x-input {
7106
+ --x-size-padding-top-input-default: var(--x-size-padding-top-input-line);
7107
+ --x-size-padding-right-input-default: var(--x-size-padding-right-input-line);
7108
+ --x-size-padding-bottom-input-default: var(--x-size-padding-bottom-input-line);
7109
+ --x-size-padding-left-input-default: var(--x-size-padding-left-input-line);
7110
+ --x-size-border-width-top-input-default: var(--x-size-border-width-top-input-line);
7111
+ --x-size-border-width-right-input-default: var(--x-size-border-width-right-input-line);
7112
+ --x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
7113
+ --x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
7114
7114
  }
7115
7115
  :root {
7116
7116
  --x-color-background-input-default: var(--x-color-base-neutral-100);
@@ -7255,13 +7255,6 @@
7255
7255
  --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7256
7256
  --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7257
7257
  }
7258
- :root {
7259
- --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7260
- --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7261
- --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7262
- --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7263
- --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7264
- }
7265
7258
 
7266
7259
  .x-input--card.x-input,
7267
7260
  .x-input--card .x-input {
@@ -7275,10 +7268,30 @@
7275
7268
  --x-size-border-radius-bottom-left-input-card
7276
7269
  );
7277
7270
  }
7271
+ :root {
7272
+ --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7273
+ --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7274
+ --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7275
+ --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7276
+ --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7277
+ }
7278
7278
  :root {
7279
7279
  --x-size-width-icon-xl: var(--x-size-base-07);
7280
7280
  --x-size-height-icon-xl: var(--x-size-base-07);
7281
7281
  }
7282
+ :root {
7283
+ --x-size-width-icon-s: var(--x-size-base-03);
7284
+ --x-size-height-icon-s: var(--x-size-base-03);
7285
+ }
7286
+
7287
+ .x-icon--s {
7288
+ --x-size-width-icon-default: var(--x-size-width-icon-s);
7289
+ --x-size-height-icon-default: var(--x-size-height-icon-s);
7290
+ }
7291
+ :root {
7292
+ --x-size-width-icon-s: var(--x-size-base-03);
7293
+ --x-size-height-icon-s: var(--x-size-base-03);
7294
+ }
7282
7295
  :root {
7283
7296
  --x-size-width-icon-xl: var(--x-size-base-07);
7284
7297
  --x-size-height-icon-xl: var(--x-size-base-07);
@@ -7288,22 +7301,18 @@
7288
7301
  --x-size-width-icon-default: var(--x-size-width-icon-xl);
7289
7302
  --x-size-height-icon-default: var(--x-size-height-icon-xl);
7290
7303
  }
7291
- :root {
7292
- --x-size-width-icon-s: var(--x-size-base-03);
7293
- --x-size-height-icon-s: var(--x-size-base-03);
7294
- }
7295
7304
  :root {
7296
7305
  --x-size-width-icon-m: var(--x-size-base-05);
7297
7306
  --x-size-height-icon-m: var(--x-size-base-05);
7298
7307
  }
7299
- :root {
7300
- --x-size-width-icon-s: var(--x-size-base-03);
7301
- --x-size-height-icon-s: var(--x-size-base-03);
7302
- }
7303
7308
 
7304
- .x-icon--s {
7305
- --x-size-width-icon-default: var(--x-size-width-icon-s);
7306
- --x-size-height-icon-default: var(--x-size-height-icon-s);
7309
+ .x-icon--m {
7310
+ --x-size-width-icon-default: var(--x-size-width-icon-m);
7311
+ --x-size-height-icon-default: var(--x-size-height-icon-m);
7312
+ }
7313
+ :root {
7314
+ --x-size-width-icon-m: var(--x-size-base-05);
7315
+ --x-size-height-icon-m: var(--x-size-base-05);
7307
7316
  }
7308
7317
  :root {
7309
7318
  --x-size-width-icon-l: var(--x-size-base-06);
@@ -7318,15 +7327,6 @@
7318
7327
  --x-size-width-icon-l: var(--x-size-base-06);
7319
7328
  --x-size-height-icon-l: var(--x-size-base-06);
7320
7329
  }
7321
- :root {
7322
- --x-size-width-icon-m: var(--x-size-base-05);
7323
- --x-size-height-icon-m: var(--x-size-base-05);
7324
- }
7325
-
7326
- .x-icon--m {
7327
- --x-size-width-icon-default: var(--x-size-width-icon-m);
7328
- --x-size-height-icon-default: var(--x-size-height-icon-m);
7329
- }
7330
7330
  :root {
7331
7331
  --x-color-stroke-icon-default: currentColor;
7332
7332
  --x-color-fill-icon-default: none;
@@ -7410,38 +7410,6 @@
7410
7410
  --x-size-padding-bottom-filter-children: 0;
7411
7411
  --x-size-padding-left-filter-children: var(--x-size-base-05);
7412
7412
  }
7413
- :root {
7414
- --x-size-margin-filter-children: 0;
7415
- --x-size-padding-top-filter-children: 0;
7416
- --x-size-padding-right-filter-children: 0;
7417
- --x-size-padding-bottom-filter-children: 0;
7418
- --x-size-padding-left-filter-children: var(--x-size-base-05);
7419
- }
7420
-
7421
- .x-hierarchical-filter-container {
7422
- list-style: none;
7423
- }
7424
- [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7425
- padding-left: var(--x-size-padding-left-filter-children);
7426
- }
7427
- [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7428
- padding-right: var(--x-size-padding-left-filter-children);
7429
- }
7430
- [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7431
- padding-right: var(--x-size-padding-right-filter-children);
7432
- }
7433
- [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7434
- padding-left: var(--x-size-padding-right-filter-children);
7435
- }
7436
- .x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7437
- margin: var(--x-size-margin-filter-children);
7438
- padding-top: var(--x-size-padding-top-filter-children);
7439
- padding-bottom: var(--x-size-padding-bottom-filter-children);
7440
- }
7441
- .x-hierarchical-filter-container .x-hierarchical-filter-container,
7442
- .x-hierarchical-filter-container .x-filter, .x-hierarchical-filter-container .x-facet-filter {
7443
- width: 100%;
7444
- }
7445
7413
  :root {
7446
7414
  --x-color-background-filter-default: transparent;
7447
7415
  --x-color-border-filter-default: var(--x-color-background-filter-default);
@@ -7474,6 +7442,38 @@
7474
7442
  );
7475
7443
  --x-size-line-height-filter-default: var(--x-size-line-height-text);
7476
7444
  }
7445
+ :root {
7446
+ --x-size-margin-filter-children: 0;
7447
+ --x-size-padding-top-filter-children: 0;
7448
+ --x-size-padding-right-filter-children: 0;
7449
+ --x-size-padding-bottom-filter-children: 0;
7450
+ --x-size-padding-left-filter-children: var(--x-size-base-05);
7451
+ }
7452
+
7453
+ .x-hierarchical-filter-container {
7454
+ list-style: none;
7455
+ }
7456
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7457
+ padding-left: var(--x-size-padding-left-filter-children);
7458
+ }
7459
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7460
+ padding-right: var(--x-size-padding-left-filter-children);
7461
+ }
7462
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7463
+ padding-right: var(--x-size-padding-right-filter-children);
7464
+ }
7465
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7466
+ padding-left: var(--x-size-padding-right-filter-children);
7467
+ }
7468
+ .x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7469
+ margin: var(--x-size-margin-filter-children);
7470
+ padding-top: var(--x-size-padding-top-filter-children);
7471
+ padding-bottom: var(--x-size-padding-bottom-filter-children);
7472
+ }
7473
+ .x-hierarchical-filter-container .x-hierarchical-filter-container,
7474
+ .x-hierarchical-filter-container .x-filter, .x-hierarchical-filter-container .x-facet-filter {
7475
+ width: 100%;
7476
+ }
7477
7477
  :root {
7478
7478
  --x-color-background-filter-default: transparent;
7479
7479
  --x-color-border-filter-default: var(--x-color-background-filter-default);
@@ -7693,39 +7693,6 @@
7693
7693
  --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
7694
7694
  --x-size-line-height-facet-default: var(--x-size-line-height-title3);
7695
7695
  }
7696
- :root {
7697
- --x-color-background-facet-default: transparent;
7698
- --x-color-border-facet-default: var(--x-color-background-facet-default);
7699
- --x-color-text-facet-default: var(--x-color-text-default);
7700
- --x-color-background-facet-header-default: var(--x-color-background-facet-default);
7701
- --x-color-border-facet-header-default: var(--x-color-background-facet-default);
7702
- --x-size-border-width-facet-default: var(--x-size-border-width-base);
7703
- --x-size-border-width-top-facet-default: var(--x-size-border-width-facet-default);
7704
- --x-size-border-width-right-facet-default: var(--x-size-border-width-facet-default);
7705
- --x-size-border-width-bottom-facet-default: var(--x-size-border-width-facet-default);
7706
- --x-size-border-width-left-facet-default: var(--x-size-border-width-facet-default);
7707
- --x-size-border-width-facet-header-default: var(--x-size-border-width-base);
7708
- --x-size-border-width-top-facet-header-default: var(--x-size-border-width-facet-header-default);
7709
- --x-size-border-width-right-facet-header-default: var(--x-size-border-width-facet-header-default);
7710
- --x-size-border-width-bottom-facet-header-default: var(
7711
- --x-size-border-width-facet-header-default
7712
- );
7713
- --x-size-border-width-left-facet-header-default: var(--x-size-border-width-facet-header-default);
7714
- --x-size-border-radius-facet-default: var(--x-size-border-radius-base-none);
7715
- --x-size-border-radius-top-left-facet-default: var(--x-size-border-radius-facet-default);
7716
- --x-size-border-radius-top-right-facet-default: var(--x-size-border-radius-facet-default);
7717
- --x-size-border-radius-bottom-right-facet-default: var(--x-size-border-radius-facet-default);
7718
- --x-size-border-radius-bottom-left-facet-default: var(--x-size-border-radius-facet-default);
7719
- --x-size-padding-top-facet-header-default: var(--x-size-base-03);
7720
- --x-size-padding-right-facet-header-default: 0;
7721
- --x-size-padding-bottom-facet-header-default: var(--x-size-base-03);
7722
- --x-size-padding-left-facet-header-default: 0;
7723
- --x-size-gap-facet-header-default: var(--x-size-base-03);
7724
- --x-font-family-facet-default: var(--x-font-family-title3);
7725
- --x-size-font-facet-default: var(--x-size-font-title3);
7726
- --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
7727
- --x-size-line-height-facet-default: var(--x-size-line-height-title3);
7728
- }
7729
7696
 
7730
7697
  [dir="ltr"] .x-facet {
7731
7698
  border-right-width: var(--x-size-border-width-right-facet-default);
@@ -7820,6 +7787,51 @@
7820
7787
  .x-facet > *:first-child .x-icon:last-child:not(:first-child), .x-facet__header .x-icon:last-child:not(:first-child) {
7821
7788
  margin-left: auto;
7822
7789
  }
7790
+ :root {
7791
+ --x-color-background-facet-default: transparent;
7792
+ --x-color-border-facet-default: var(--x-color-background-facet-default);
7793
+ --x-color-text-facet-default: var(--x-color-text-default);
7794
+ --x-color-background-facet-header-default: var(--x-color-background-facet-default);
7795
+ --x-color-border-facet-header-default: var(--x-color-background-facet-default);
7796
+ --x-size-border-width-facet-default: var(--x-size-border-width-base);
7797
+ --x-size-border-width-top-facet-default: var(--x-size-border-width-facet-default);
7798
+ --x-size-border-width-right-facet-default: var(--x-size-border-width-facet-default);
7799
+ --x-size-border-width-bottom-facet-default: var(--x-size-border-width-facet-default);
7800
+ --x-size-border-width-left-facet-default: var(--x-size-border-width-facet-default);
7801
+ --x-size-border-width-facet-header-default: var(--x-size-border-width-base);
7802
+ --x-size-border-width-top-facet-header-default: var(--x-size-border-width-facet-header-default);
7803
+ --x-size-border-width-right-facet-header-default: var(--x-size-border-width-facet-header-default);
7804
+ --x-size-border-width-bottom-facet-header-default: var(
7805
+ --x-size-border-width-facet-header-default
7806
+ );
7807
+ --x-size-border-width-left-facet-header-default: var(--x-size-border-width-facet-header-default);
7808
+ --x-size-border-radius-facet-default: var(--x-size-border-radius-base-none);
7809
+ --x-size-border-radius-top-left-facet-default: var(--x-size-border-radius-facet-default);
7810
+ --x-size-border-radius-top-right-facet-default: var(--x-size-border-radius-facet-default);
7811
+ --x-size-border-radius-bottom-right-facet-default: var(--x-size-border-radius-facet-default);
7812
+ --x-size-border-radius-bottom-left-facet-default: var(--x-size-border-radius-facet-default);
7813
+ --x-size-padding-top-facet-header-default: var(--x-size-base-03);
7814
+ --x-size-padding-right-facet-header-default: 0;
7815
+ --x-size-padding-bottom-facet-header-default: var(--x-size-base-03);
7816
+ --x-size-padding-left-facet-header-default: 0;
7817
+ --x-size-gap-facet-header-default: var(--x-size-base-03);
7818
+ --x-font-family-facet-default: var(--x-font-family-title3);
7819
+ --x-size-font-facet-default: var(--x-size-font-title3);
7820
+ --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
7821
+ --x-size-line-height-facet-default: var(--x-size-line-height-title3);
7822
+ }
7823
+ :root {
7824
+ --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7825
+ --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
7826
+ --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
7827
+ --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
7828
+ --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
7829
+ --x-size-padding-facet-header-card: var(--x-size-base-03);
7830
+ --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
7831
+ --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
7832
+ --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7833
+ --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7834
+ }
7823
7835
  :root {
7824
7836
  --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7825
7837
  --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
@@ -7847,19 +7859,7 @@
7847
7859
  --x-size-padding-left-facet-header-default: var(--x-size-padding-left-facet-header-card);
7848
7860
  }
7849
7861
  :root {
7850
- --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7851
- --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
7852
- --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
7853
- --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
7854
- --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
7855
- --x-size-padding-facet-header-card: var(--x-size-base-03);
7856
- --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
7857
- --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
7858
- --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7859
- --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7860
- }
7861
- :root {
7862
- --x-size-width-dropdown-s: 74px;
7862
+ --x-size-width-dropdown-xl: 282px;
7863
7863
  }
7864
7864
  :root {
7865
7865
  --x-size-width-dropdown-xl: 282px;
@@ -7869,7 +7869,14 @@
7869
7869
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-xl);
7870
7870
  }
7871
7871
  :root {
7872
- --x-size-width-dropdown-xl: 282px;
7872
+ --x-size-width-dropdown-s: 74px;
7873
+ }
7874
+ :root {
7875
+ --x-size-width-dropdown-s: 74px;
7876
+ }
7877
+
7878
+ .x-dropdown.x-dropdown--s {
7879
+ --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-s);
7873
7880
  }
7874
7881
  :root {
7875
7882
  --x-size-gap-dropdown-pill: var(--x-size-base-03);
@@ -7879,6 +7886,9 @@
7879
7886
  --x-size-border-width-bottom-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7880
7887
  --x-size-border-width-left-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7881
7888
  }
7889
+ :root {
7890
+ --x-size-width-dropdown-m: 130px;
7891
+ }
7882
7892
  :root {
7883
7893
  --x-size-gap-dropdown-pill: var(--x-size-base-03);
7884
7894
  --x-size-border-width-dropdown-list-pill: var(--x-size-border-width-base);
@@ -7922,13 +7932,6 @@
7922
7932
  --x-size-border-width-left-dropdown-list-pill
7923
7933
  );
7924
7934
  }
7925
- :root {
7926
- --x-size-width-dropdown-s: 74px;
7927
- }
7928
-
7929
- .x-dropdown.x-dropdown--s {
7930
- --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-s);
7931
- }
7932
7935
  :root {
7933
7936
  --x-size-width-dropdown-m: 130px;
7934
7937
  }
@@ -7936,9 +7939,6 @@
7936
7939
  .x-dropdown.x-dropdown--m {
7937
7940
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-m);
7938
7941
  }
7939
- :root {
7940
- --x-size-width-dropdown-m: 130px;
7941
- }
7942
7942
  :root {
7943
7943
  --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
7944
7944
  --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
@@ -7963,9 +7963,6 @@
7963
7963
  --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7964
7964
  --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7965
7965
  }
7966
- :root {
7967
- --x-size-width-dropdown-l: 202px;
7968
- }
7969
7966
  :root {
7970
7967
  --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
7971
7968
  --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
@@ -8036,6 +8033,9 @@
8036
8033
  .x-dropdown.x-dropdown--l {
8037
8034
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-l);
8038
8035
  }
8036
+ :root {
8037
+ --x-size-width-dropdown-l: 202px;
8038
+ }
8039
8039
  :root {
8040
8040
  --x-size-border-radius-dropdown-default: var(--x-size-border-radius-base-none);
8041
8041
  --x-size-border-radius-top-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
@@ -8109,6 +8109,49 @@
8109
8109
  --x-string-overflow-dropdown-toggle-default: hidden;
8110
8110
  --x-string-overflow-dropdown-list-default: hidden;
8111
8111
  }
8112
+ :root {
8113
+ --x-size-gap-dropdown-card: var(--x-size-base-03);
8114
+ --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8115
+ --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8116
+ --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8117
+ --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8118
+ --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8119
+ --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8120
+ --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8121
+ --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8122
+ --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8123
+ --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8124
+ }
8125
+
8126
+ .x-dropdown--card {
8127
+ --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-card);
8128
+ --x-size-border-radius-dropdown-default: var(--x-size-border-radius-dropdown-card);
8129
+ --x-size-border-radius-top-left-dropdown-default: var(
8130
+ --x-size-border-radius-top-left-dropdown-card
8131
+ );
8132
+ --x-size-border-radius-top-right-dropdown-default: var(
8133
+ --x-size-border-radius-top-right-dropdown-card
8134
+ );
8135
+ --x-size-border-radius-bottom-right-dropdown-default: var(
8136
+ --x-size-border-radius-bottom-right-dropdown-card
8137
+ );
8138
+ --x-size-border-radius-bottom-left-dropdown-default: var(
8139
+ --x-size-border-radius-bottom-left-dropdown-card
8140
+ );
8141
+ --x-size-border-width-dropdown-list-default: var(--x-size-border-width-dropdown-list-card);
8142
+ --x-size-border-width-top-dropdown-list-default: var(
8143
+ --x-size-border-width-top-dropdown-list-card
8144
+ );
8145
+ --x-size-border-width-right-dropdown-list-default: var(
8146
+ --x-size-border-width-right-dropdown-list-card
8147
+ );
8148
+ --x-size-border-width-bottom-dropdown-list-default: var(
8149
+ --x-size-border-width-bottom-dropdown-list-card
8150
+ );
8151
+ --x-size-border-width-left-dropdown-list-default: var(
8152
+ --x-size-border-width-left-dropdown-list-card
8153
+ );
8154
+ }
8112
8155
  :root {
8113
8156
  --x-size-border-radius-dropdown-default: var(--x-size-border-radius-base-none);
8114
8157
  --x-size-border-radius-top-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
@@ -8364,49 +8407,6 @@
8364
8407
  --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8365
8408
  --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8366
8409
  }
8367
- :root {
8368
- --x-size-gap-dropdown-card: var(--x-size-base-03);
8369
- --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8370
- --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8371
- --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8372
- --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8373
- --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8374
- --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8375
- --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8376
- --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8377
- --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8378
- --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8379
- }
8380
-
8381
- .x-dropdown--card {
8382
- --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-card);
8383
- --x-size-border-radius-dropdown-default: var(--x-size-border-radius-dropdown-card);
8384
- --x-size-border-radius-top-left-dropdown-default: var(
8385
- --x-size-border-radius-top-left-dropdown-card
8386
- );
8387
- --x-size-border-radius-top-right-dropdown-default: var(
8388
- --x-size-border-radius-top-right-dropdown-card
8389
- );
8390
- --x-size-border-radius-bottom-right-dropdown-default: var(
8391
- --x-size-border-radius-bottom-right-dropdown-card
8392
- );
8393
- --x-size-border-radius-bottom-left-dropdown-default: var(
8394
- --x-size-border-radius-bottom-left-dropdown-card
8395
- );
8396
- --x-size-border-width-dropdown-list-default: var(--x-size-border-width-dropdown-list-card);
8397
- --x-size-border-width-top-dropdown-list-default: var(
8398
- --x-size-border-width-top-dropdown-list-card
8399
- );
8400
- --x-size-border-width-right-dropdown-list-default: var(
8401
- --x-size-border-width-right-dropdown-list-card
8402
- );
8403
- --x-size-border-width-bottom-dropdown-list-default: var(
8404
- --x-size-border-width-bottom-dropdown-list-card
8405
- );
8406
- --x-size-border-width-left-dropdown-list-default: var(
8407
- --x-size-border-width-left-dropdown-list-card
8408
- );
8409
- }
8410
8410
  :root {
8411
8411
  --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8412
8412
  --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
@@ -8417,16 +8417,6 @@
8417
8417
  --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
8418
8418
  --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
8419
8419
  }
8420
- :root {
8421
- --x-color-background-button-secondary: transparent;
8422
- --x-color-border-button-secondary: var(--x-color-border-button-default);
8423
- --x-color-text-button-secondary: var(--x-color-border-button-default);
8424
- --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8425
- --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8426
- --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8427
- --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8428
- --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8429
- }
8430
8420
  :root {
8431
8421
  --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8432
8422
  --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
@@ -8469,6 +8459,16 @@
8469
8459
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-secondary);
8470
8460
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-secondary);
8471
8461
  }
8462
+ :root {
8463
+ --x-color-background-button-secondary: transparent;
8464
+ --x-color-border-button-secondary: var(--x-color-border-button-default);
8465
+ --x-color-text-button-secondary: var(--x-color-border-button-default);
8466
+ --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8467
+ --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8468
+ --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8469
+ --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8470
+ --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8471
+ }
8472
8472
  :root {
8473
8473
  --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
8474
8474
  --x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
@@ -8511,6 +8511,13 @@
8511
8511
  --x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
8512
8512
  --x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
8513
8513
  }
8514
+ :root {
8515
+ --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
8516
+ --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
8517
+ --x-size-border-radius-top-right-button-pill: var(--x-size-border-radius-button-pill);
8518
+ --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
8519
+ --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
8520
+ }
8514
8521
  :root {
8515
8522
  --x-color-background-button-primary: var(--x-color-background-button-default);
8516
8523
  --x-color-border-button-primary: var(--x-color-border-button-default);
@@ -8532,35 +8539,6 @@
8532
8539
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-primary);
8533
8540
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-primary);
8534
8541
  }
8535
- :root {
8536
- --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
8537
- --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
8538
- --x-size-border-radius-top-right-button-pill: var(--x-size-border-radius-button-pill);
8539
- --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
8540
- --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
8541
- }
8542
- :root {
8543
- --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
8544
- --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
8545
- --x-size-border-radius-top-right-button-pill: var(--x-size-border-radius-button-pill);
8546
- --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
8547
- --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
8548
- }
8549
-
8550
- .x-button--pill.x-button,
8551
- .x-button--pill .x-button {
8552
- --x-size-border-radius-button-default: var(--x-size-border-radius-button-pill);
8553
- --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-top-left-button-pill);
8554
- --x-size-border-radius-top-right-button-default: var(
8555
- --x-size-border-radius-top-right-button-pill
8556
- );
8557
- --x-size-border-radius-bottom-right-button-default: var(
8558
- --x-size-border-radius-bottom-right-button-pill
8559
- );
8560
- --x-size-border-radius-bottom-left-button-default: var(
8561
- --x-size-border-radius-bottom-left-button-pill
8562
- );
8563
- }
8564
8542
  :root {
8565
8543
  --x-color-background-button-ghost: transparent;
8566
8544
  --x-color-border-button-ghost: transparent;
@@ -8588,6 +8566,28 @@
8588
8566
  .x-button--ghost.x-button--ghost-end .x-button {
8589
8567
  --x-size-padding-right-button-default: 0;
8590
8568
  }
8569
+ :root {
8570
+ --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
8571
+ --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
8572
+ --x-size-border-radius-top-right-button-pill: var(--x-size-border-radius-button-pill);
8573
+ --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
8574
+ --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
8575
+ }
8576
+
8577
+ .x-button--pill.x-button,
8578
+ .x-button--pill .x-button {
8579
+ --x-size-border-radius-button-default: var(--x-size-border-radius-button-pill);
8580
+ --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-top-left-button-pill);
8581
+ --x-size-border-radius-top-right-button-default: var(
8582
+ --x-size-border-radius-top-right-button-pill
8583
+ );
8584
+ --x-size-border-radius-bottom-right-button-default: var(
8585
+ --x-size-border-radius-bottom-right-button-pill
8586
+ );
8587
+ --x-size-border-radius-bottom-left-button-default: var(
8588
+ --x-size-border-radius-bottom-left-button-pill
8589
+ );
8590
+ }
8591
8591
  :root {
8592
8592
  --x-color-background-button-default: var(--x-color-base-lead);
8593
8593
  --x-color-border-button-default: var(--x-color-background-button-default);
@@ -8713,6 +8713,38 @@
8713
8713
  --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
8714
8714
  --x-size-font-badge-default: var(--x-size-font-base-xs);
8715
8715
  }
8716
+ :root {
8717
+ --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8718
+ --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8719
+ --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8720
+ --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8721
+ --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8722
+ }
8723
+
8724
+ .x-button--card.x-button,
8725
+ .x-button--card .x-button {
8726
+ --x-size-border-radius-button-default: var(--x-size-border-radius-button-card);
8727
+ --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-top-left-button-card);
8728
+ --x-size-border-radius-top-right-button-default: var(
8729
+ --x-size-border-radius-top-right-button-card
8730
+ );
8731
+ --x-size-border-radius-bottom-right-button-default: var(
8732
+ --x-size-border-radius-bottom-right-button-card
8733
+ );
8734
+ --x-size-border-radius-bottom-left-button-default: var(
8735
+ --x-size-border-radius-bottom-left-button-card
8736
+ );
8737
+ }
8738
+ :root {
8739
+ --x-color-background-badge-default: var(--x-color-base-neutral-10);
8740
+ --x-color-text-badge-default: var(--x-color-base-neutral-100);
8741
+ --x-color-border-badge-default: var(--x-color-base-neutral-10);
8742
+ --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
8743
+ --x-size-border-width-badge-default: 0;
8744
+ --x-size-width-badge-default: 1.5em;
8745
+ --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
8746
+ --x-size-font-badge-default: var(--x-size-font-base-xs);
8747
+ }
8716
8748
 
8717
8749
  [dir="ltr"] .x-badge {
8718
8750
  right: calc(var(--x-size-width-badge-default) / 4);
@@ -8753,36 +8785,17 @@
8753
8785
  position: relative;
8754
8786
  }
8755
8787
  :root {
8756
- --x-color-background-badge-default: var(--x-color-base-neutral-10);
8757
- --x-color-text-badge-default: var(--x-color-base-neutral-100);
8758
- --x-color-border-badge-default: var(--x-color-base-neutral-10);
8759
- --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
8760
- --x-size-border-width-badge-default: 0;
8761
- --x-size-width-badge-default: 1.5em;
8762
- --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
8763
- --x-size-font-badge-default: var(--x-size-font-base-xs);
8764
- }
8765
- :root {
8766
- --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8767
- --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8768
- --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8769
- --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8770
- --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8771
- }
8772
-
8773
- .x-button--card.x-button,
8774
- .x-button--card .x-button {
8775
- --x-size-border-radius-button-default: var(--x-size-border-radius-button-card);
8776
- --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-top-left-button-card);
8777
- --x-size-border-radius-top-right-button-default: var(
8778
- --x-size-border-radius-top-right-button-card
8779
- );
8780
- --x-size-border-radius-bottom-right-button-default: var(
8781
- --x-size-border-radius-bottom-right-button-card
8782
- );
8783
- --x-size-border-radius-bottom-left-button-default: var(
8784
- --x-size-border-radius-bottom-left-button-card
8785
- );
8788
+ --x-color-base-lead: #243d48;
8789
+ --x-color-base-auxiliary: #bfe1ec;
8790
+ --x-color-base-neutral-10: #1a1a1a;
8791
+ --x-color-base-neutral-35: #595959;
8792
+ --x-color-base-neutral-70: #b3b3b3;
8793
+ --x-color-base-neutral-95: #f2f2f2;
8794
+ --x-color-base-neutral-100: #ffffff;
8795
+ --x-color-base-accent: #0086b2;
8796
+ --x-color-base-enable: #00705c;
8797
+ --x-color-base-disable: #e11f26;
8798
+ --x-color-base-transparent: transparent;
8786
8799
  }
8787
8800
  :root {
8788
8801
  --x-size-base-01: 2px;
@@ -8806,19 +8819,6 @@
8806
8819
  --x-size-base-19: 280px;
8807
8820
  --x-size-base-20: 344px;
8808
8821
  }
8809
- :root {
8810
- --x-color-base-lead: #243d48;
8811
- --x-color-base-auxiliary: #bfe1ec;
8812
- --x-color-base-neutral-10: #1a1a1a;
8813
- --x-color-base-neutral-35: #595959;
8814
- --x-color-base-neutral-70: #b3b3b3;
8815
- --x-color-base-neutral-95: #f2f2f2;
8816
- --x-color-base-neutral-100: #ffffff;
8817
- --x-color-base-accent: #0086b2;
8818
- --x-color-base-enable: #00705c;
8819
- --x-color-base-disable: #e11f26;
8820
- --x-color-base-transparent: transparent;
8821
- }
8822
8822
  :root {
8823
8823
  --x-size-border-radius-base-none: 0;
8824
8824
  --x-size-border-radius-base-s: var(--x-size-base-02);