@empathyco/x-components 6.0.0-alpha.5 → 6.0.0-alpha.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/design-system/deprecated-full-theme.css +1322 -1322
  3. package/docs/API-reference/api/x-adapter-platform.platformadapter.relatedprompts.md +11 -0
  4. package/docs/API-reference/api/x-types.md +3 -0
  5. package/docs/API-reference/api/x-types.relatedprompt.md +23 -0
  6. package/docs/API-reference/api/x-types.relatedprompt.nextqueries.md +13 -0
  7. package/docs/API-reference/api/x-types.relatedprompt.suggestiontext.md +13 -0
  8. package/docs/API-reference/api/x-types.relatedprompt.type.md +13 -0
  9. package/docs/API-reference/api/x-types.relatedpromptsrequest.md +15 -0
  10. package/docs/API-reference/api/x-types.relatedpromptsresponse.md +20 -0
  11. package/docs/API-reference/api/x-types.relatedpromptsresponse.relatedprompts.md +11 -0
  12. package/docs/API-reference/api/x-types.xcomponentsadapter.md +1 -0
  13. package/docs/API-reference/api/x-types.xcomponentsadapter.relatedprompts.md +11 -0
  14. package/package.json +4 -4
  15. package/report/x-adapter-platform.api.json +27 -0
  16. package/report/x-types.api.json +261 -0
  17. package/types/adapter/e2e-adapter.d.ts.map +1 -1
package/design-system/deprecated-full-theme.css CHANGED
@@ -1,5 +1,4 @@
1
1
 
2
-
3
2
  .x-uppercase {
4
3
  text-transform: uppercase;
5
4
  }
@@ -53,931 +52,932 @@
53
52
  .x-sticky {
54
53
  position: sticky !important;
55
54
  }
56
- .x-padding--00 {
57
- padding: 0 !important;
58
- }
59
- .x-padding--01 {
60
- padding: var(--x-size-base-01) !important;
55
+ .x-margin--auto {
56
+ margin: auto !important;
61
57
  }
62
- .x-padding--02 {
63
- padding: var(--x-size-base-02) !important;
58
+ .x-margin--00 {
59
+ margin: 0 !important;
64
60
  }
65
- .x-padding--03 {
66
- padding: var(--x-size-base-03) !important;
61
+ .x-margin--01 {
62
+ margin: var(--x-size-base-01) !important;
67
63
  }
68
- .x-padding--04 {
69
- padding: var(--x-size-base-04) !important;
64
+ .x-margin--02 {
65
+ margin: var(--x-size-base-02) !important;
70
66
  }
71
- .x-padding--05 {
72
- padding: var(--x-size-base-05) !important;
67
+ .x-margin--03 {
68
+ margin: var(--x-size-base-03) !important;
73
69
  }
74
- .x-padding--06 {
75
- padding: var(--x-size-base-06) !important;
70
+ .x-margin--04 {
71
+ margin: var(--x-size-base-04) !important;
76
72
  }
77
- .x-padding--07 {
78
- padding: var(--x-size-base-07) !important;
73
+ .x-margin--05 {
74
+ margin: var(--x-size-base-05) !important;
79
75
  }
80
- .x-padding--08 {
81
- padding: var(--x-size-base-08) !important;
76
+ .x-margin--06 {
77
+ margin: var(--x-size-base-06) !important;
82
78
  }
83
- .x-padding--09 {
84
- padding: var(--x-size-base-09) !important;
79
+ .x-margin--07 {
80
+ margin: var(--x-size-base-07) !important;
85
81
  }
86
- .x-padding--10 {
87
- padding: var(--x-size-base-10) !important;
82
+ .x-margin--08 {
83
+ margin: var(--x-size-base-08) !important;
88
84
  }
89
- .x-padding--11 {
90
- padding: var(--x-size-base-11) !important;
85
+ .x-margin--09 {
86
+ margin: var(--x-size-base-09) !important;
91
87
  }
92
- .x-padding--12 {
93
- padding: var(--x-size-base-12) !important;
88
+ .x-margin--10 {
89
+ margin: var(--x-size-base-10) !important;
94
90
  }
95
- .x-padding--13 {
96
- padding: var(--x-size-base-13) !important;
91
+ .x-margin--11 {
92
+ margin: var(--x-size-base-11) !important;
97
93
  }
98
- .x-padding--14 {
99
- padding: var(--x-size-base-14) !important;
94
+ .x-margin--12 {
95
+ margin: var(--x-size-base-12) !important;
100
96
  }
101
- .x-padding--15 {
102
- padding: var(--x-size-base-15) !important;
97
+ .x-margin--13 {
98
+ margin: var(--x-size-base-13) !important;
103
99
  }
104
- .x-padding--16 {
105
- padding: var(--x-size-base-16) !important;
100
+ .x-margin--14 {
101
+ margin: var(--x-size-base-14) !important;
106
102
  }
107
- .x-padding--17 {
108
- padding: var(--x-size-base-17) !important;
103
+ .x-margin--15 {
104
+ margin: var(--x-size-base-15) !important;
109
105
  }
110
- .x-padding--18 {
111
- padding: var(--x-size-base-18) !important;
106
+ .x-margin--16 {
107
+ margin: var(--x-size-base-16) !important;
112
108
  }
113
- .x-padding--19 {
114
- padding: var(--x-size-base-19) !important;
109
+ .x-margin--17 {
110
+ margin: var(--x-size-base-17) !important;
115
111
  }
116
- .x-padding--20 {
117
- padding: var(--x-size-base-20) !important;
112
+ .x-margin--18 {
113
+ margin: var(--x-size-base-18) !important;
118
114
  }
119
- .x-padding--top-00 {
120
- padding-top: 0 !important;
115
+ .x-margin--19 {
116
+ margin: var(--x-size-base-19) !important;
121
117
  }
122
- .x-padding--bottom-00 {
123
- padding-bottom: 0 !important;
118
+ .x-margin--20 {
119
+ margin: var(--x-size-base-20) !important;
124
120
  }
125
- [dir="ltr"] .x-padding--right-00 {
126
- padding-right: 0 !important;
121
+ .x-margin--top-auto {
122
+ margin-top: auto !important;
127
123
  }
128
- [dir="rtl"] .x-padding--right-00 {
129
- padding-left: 0 !important;
124
+ .x-margin--bottom-auto {
125
+ margin-bottom: auto !important;
130
126
  }
131
- [dir="ltr"] .x-padding--left-00 {
132
- padding-left: 0 !important;
127
+ [dir="ltr"] .x-margin--right-auto {
128
+ margin-right: auto !important;
133
129
  }
134
- [dir="rtl"] .x-padding--left-00 {
135
- padding-right: 0 !important;
130
+ [dir="rtl"] .x-margin--right-auto {
131
+ margin-left: auto !important;
136
132
  }
137
- .x-padding--top-01 {
138
- padding-top: var(--x-size-base-01) !important;
133
+ [dir="ltr"] .x-margin--left-auto {
134
+ margin-left: auto !important;
139
135
  }
140
- .x-padding--bottom-01 {
141
- padding-bottom: var(--x-size-base-01) !important;
136
+ [dir="rtl"] .x-margin--left-auto {
137
+ margin-right: auto !important;
142
138
  }
143
- [dir="ltr"] .x-padding--right-01 {
144
- padding-right: var(--x-size-base-01) !important;
139
+ .x-margin--top-00 {
140
+ margin-top: 0 !important;
145
141
  }
146
- [dir="rtl"] .x-padding--right-01 {
147
- padding-left: var(--x-size-base-01) !important;
142
+ .x-margin--bottom-00 {
143
+ margin-bottom: 0 !important;
148
144
  }
149
- [dir="ltr"] .x-padding--left-01 {
150
- padding-left: var(--x-size-base-01) !important;
145
+ [dir="ltr"] .x-margin--right-00 {
146
+ margin-right: 0 !important;
151
147
  }
152
- [dir="rtl"] .x-padding--left-01 {
153
- padding-right: var(--x-size-base-01) !important;
148
+ [dir="rtl"] .x-margin--right-00 {
149
+ margin-left: 0 !important;
154
150
  }
155
- .x-padding--top-02 {
156
- padding-top: var(--x-size-base-02) !important;
151
+ [dir="ltr"] .x-margin--left-00 {
152
+ margin-left: 0 !important;
157
153
  }
158
- .x-padding--bottom-02 {
159
- padding-bottom: var(--x-size-base-02) !important;
154
+ [dir="rtl"] .x-margin--left-00 {
155
+ margin-right: 0 !important;
160
156
  }
161
- [dir="ltr"] .x-padding--right-02 {
162
- padding-right: var(--x-size-base-02) !important;
157
+ .x-margin--top-01 {
158
+ margin-top: var(--x-size-base-01) !important;
163
159
  }
164
- [dir="rtl"] .x-padding--right-02 {
165
- padding-left: var(--x-size-base-02) !important;
160
+ .x-margin--bottom-01 {
161
+ margin-bottom: var(--x-size-base-01) !important;
166
162
  }
167
- [dir="ltr"] .x-padding--left-02 {
168
- padding-left: var(--x-size-base-02) !important;
163
+ [dir="ltr"] .x-margin--right-01 {
164
+ margin-right: var(--x-size-base-01) !important;
169
165
  }
170
- [dir="rtl"] .x-padding--left-02 {
171
- padding-right: var(--x-size-base-02) !important;
166
+ [dir="rtl"] .x-margin--right-01 {
167
+ margin-left: var(--x-size-base-01) !important;
172
168
  }
173
- .x-padding--top-03 {
174
- padding-top: var(--x-size-base-03) !important;
169
+ [dir="ltr"] .x-margin--left-01 {
170
+ margin-left: var(--x-size-base-01) !important;
175
171
  }
176
- .x-padding--bottom-03 {
177
- padding-bottom: var(--x-size-base-03) !important;
172
+ [dir="rtl"] .x-margin--left-01 {
173
+ margin-right: var(--x-size-base-01) !important;
178
174
  }
179
- [dir="ltr"] .x-padding--right-03 {
180
- padding-right: var(--x-size-base-03) !important;
175
+ .x-margin--top-02 {
176
+ margin-top: var(--x-size-base-02) !important;
181
177
  }
182
- [dir="rtl"] .x-padding--right-03 {
183
- padding-left: var(--x-size-base-03) !important;
178
+ .x-margin--bottom-02 {
179
+ margin-bottom: var(--x-size-base-02) !important;
184
180
  }
185
- [dir="ltr"] .x-padding--left-03 {
186
- padding-left: var(--x-size-base-03) !important;
181
+ [dir="ltr"] .x-margin--right-02 {
182
+ margin-right: var(--x-size-base-02) !important;
187
183
  }
188
- [dir="rtl"] .x-padding--left-03 {
189
- padding-right: var(--x-size-base-03) !important;
184
+ [dir="rtl"] .x-margin--right-02 {
185
+ margin-left: var(--x-size-base-02) !important;
190
186
  }
191
- .x-padding--top-04 {
192
- padding-top: var(--x-size-base-04) !important;
187
+ [dir="ltr"] .x-margin--left-02 {
188
+ margin-left: var(--x-size-base-02) !important;
193
189
  }
194
- .x-padding--bottom-04 {
195
- padding-bottom: var(--x-size-base-04) !important;
190
+ [dir="rtl"] .x-margin--left-02 {
191
+ margin-right: var(--x-size-base-02) !important;
196
192
  }
197
- [dir="ltr"] .x-padding--right-04 {
198
- padding-right: var(--x-size-base-04) !important;
193
+ .x-margin--top-03 {
194
+ margin-top: var(--x-size-base-03) !important;
199
195
  }
200
- [dir="rtl"] .x-padding--right-04 {
201
- padding-left: var(--x-size-base-04) !important;
196
+ .x-margin--bottom-03 {
197
+ margin-bottom: var(--x-size-base-03) !important;
202
198
  }
203
- [dir="ltr"] .x-padding--left-04 {
204
- padding-left: var(--x-size-base-04) !important;
199
+ [dir="ltr"] .x-margin--right-03 {
200
+ margin-right: var(--x-size-base-03) !important;
205
201
  }
206
- [dir="rtl"] .x-padding--left-04 {
207
- padding-right: var(--x-size-base-04) !important;
202
+ [dir="rtl"] .x-margin--right-03 {
203
+ margin-left: var(--x-size-base-03) !important;
208
204
  }
209
- .x-padding--top-05 {
210
- padding-top: var(--x-size-base-05) !important;
205
+ [dir="ltr"] .x-margin--left-03 {
206
+ margin-left: var(--x-size-base-03) !important;
211
207
  }
212
- .x-padding--bottom-05 {
213
- padding-bottom: var(--x-size-base-05) !important;
208
+ [dir="rtl"] .x-margin--left-03 {
209
+ margin-right: var(--x-size-base-03) !important;
214
210
  }
215
- [dir="ltr"] .x-padding--right-05 {
216
- padding-right: var(--x-size-base-05) !important;
211
+ .x-margin--top-04 {
212
+ margin-top: var(--x-size-base-04) !important;
217
213
  }
218
- [dir="rtl"] .x-padding--right-05 {
219
- padding-left: var(--x-size-base-05) !important;
214
+ .x-margin--bottom-04 {
215
+ margin-bottom: var(--x-size-base-04) !important;
220
216
  }
221
- [dir="ltr"] .x-padding--left-05 {
222
- padding-left: var(--x-size-base-05) !important;
217
+ [dir="ltr"] .x-margin--right-04 {
218
+ margin-right: var(--x-size-base-04) !important;
223
219
  }
224
- [dir="rtl"] .x-padding--left-05 {
225
- padding-right: var(--x-size-base-05) !important;
220
+ [dir="rtl"] .x-margin--right-04 {
221
+ margin-left: var(--x-size-base-04) !important;
226
222
  }
227
- .x-padding--top-06 {
228
- padding-top: var(--x-size-base-06) !important;
223
+ [dir="ltr"] .x-margin--left-04 {
224
+ margin-left: var(--x-size-base-04) !important;
229
225
  }
230
- .x-padding--bottom-06 {
231
- padding-bottom: var(--x-size-base-06) !important;
226
+ [dir="rtl"] .x-margin--left-04 {
227
+ margin-right: var(--x-size-base-04) !important;
232
228
  }
233
- [dir="ltr"] .x-padding--right-06 {
234
- padding-right: var(--x-size-base-06) !important;
229
+ .x-margin--top-05 {
230
+ margin-top: var(--x-size-base-05) !important;
235
231
  }
236
- [dir="rtl"] .x-padding--right-06 {
237
- padding-left: var(--x-size-base-06) !important;
232
+ .x-margin--bottom-05 {
233
+ margin-bottom: var(--x-size-base-05) !important;
238
234
  }
239
- [dir="ltr"] .x-padding--left-06 {
240
- padding-left: var(--x-size-base-06) !important;
235
+ [dir="ltr"] .x-margin--right-05 {
236
+ margin-right: var(--x-size-base-05) !important;
241
237
  }
242
- [dir="rtl"] .x-padding--left-06 {
243
- padding-right: var(--x-size-base-06) !important;
238
+ [dir="rtl"] .x-margin--right-05 {
239
+ margin-left: var(--x-size-base-05) !important;
244
240
  }
245
- .x-padding--top-07 {
246
- padding-top: var(--x-size-base-07) !important;
241
+ [dir="ltr"] .x-margin--left-05 {
242
+ margin-left: var(--x-size-base-05) !important;
247
243
  }
248
- .x-padding--bottom-07 {
249
- padding-bottom: var(--x-size-base-07) !important;
244
+ [dir="rtl"] .x-margin--left-05 {
245
+ margin-right: var(--x-size-base-05) !important;
250
246
  }
251
- [dir="ltr"] .x-padding--right-07 {
252
- padding-right: var(--x-size-base-07) !important;
247
+ .x-margin--top-06 {
248
+ margin-top: var(--x-size-base-06) !important;
253
249
  }
254
- [dir="rtl"] .x-padding--right-07 {
255
- padding-left: var(--x-size-base-07) !important;
250
+ .x-margin--bottom-06 {
251
+ margin-bottom: var(--x-size-base-06) !important;
256
252
  }
257
- [dir="ltr"] .x-padding--left-07 {
258
- padding-left: var(--x-size-base-07) !important;
253
+ [dir="ltr"] .x-margin--right-06 {
254
+ margin-right: var(--x-size-base-06) !important;
259
255
  }
260
- [dir="rtl"] .x-padding--left-07 {
261
- padding-right: var(--x-size-base-07) !important;
256
+ [dir="rtl"] .x-margin--right-06 {
257
+ margin-left: var(--x-size-base-06) !important;
262
258
  }
263
- .x-padding--top-08 {
264
- padding-top: var(--x-size-base-08) !important;
259
+ [dir="ltr"] .x-margin--left-06 {
260
+ margin-left: var(--x-size-base-06) !important;
265
261
  }
266
- .x-padding--bottom-08 {
267
- padding-bottom: var(--x-size-base-08) !important;
262
+ [dir="rtl"] .x-margin--left-06 {
263
+ margin-right: var(--x-size-base-06) !important;
268
264
  }
269
- [dir="ltr"] .x-padding--right-08 {
270
- padding-right: var(--x-size-base-08) !important;
265
+ .x-margin--top-07 {
266
+ margin-top: var(--x-size-base-07) !important;
271
267
  }
272
- [dir="rtl"] .x-padding--right-08 {
273
- padding-left: var(--x-size-base-08) !important;
268
+ .x-margin--bottom-07 {
269
+ margin-bottom: var(--x-size-base-07) !important;
274
270
  }
275
- [dir="ltr"] .x-padding--left-08 {
276
- padding-left: var(--x-size-base-08) !important;
271
+ [dir="ltr"] .x-margin--right-07 {
272
+ margin-right: var(--x-size-base-07) !important;
277
273
  }
278
- [dir="rtl"] .x-padding--left-08 {
279
- padding-right: var(--x-size-base-08) !important;
274
+ [dir="rtl"] .x-margin--right-07 {
275
+ margin-left: var(--x-size-base-07) !important;
280
276
  }
281
- .x-padding--top-09 {
282
- padding-top: var(--x-size-base-09) !important;
277
+ [dir="ltr"] .x-margin--left-07 {
278
+ margin-left: var(--x-size-base-07) !important;
283
279
  }
284
- .x-padding--bottom-09 {
285
- padding-bottom: var(--x-size-base-09) !important;
280
+ [dir="rtl"] .x-margin--left-07 {
281
+ margin-right: var(--x-size-base-07) !important;
286
282
  }
287
- [dir="ltr"] .x-padding--right-09 {
288
- padding-right: var(--x-size-base-09) !important;
283
+ .x-margin--top-08 {
284
+ margin-top: var(--x-size-base-08) !important;
289
285
  }
290
- [dir="rtl"] .x-padding--right-09 {
291
- padding-left: var(--x-size-base-09) !important;
286
+ .x-margin--bottom-08 {
287
+ margin-bottom: var(--x-size-base-08) !important;
292
288
  }
293
- [dir="ltr"] .x-padding--left-09 {
294
- padding-left: var(--x-size-base-09) !important;
289
+ [dir="ltr"] .x-margin--right-08 {
290
+ margin-right: var(--x-size-base-08) !important;
295
291
  }
296
- [dir="rtl"] .x-padding--left-09 {
297
- padding-right: var(--x-size-base-09) !important;
292
+ [dir="rtl"] .x-margin--right-08 {
293
+ margin-left: var(--x-size-base-08) !important;
298
294
  }
299
- .x-padding--top-10 {
300
- padding-top: var(--x-size-base-10) !important;
295
+ [dir="ltr"] .x-margin--left-08 {
296
+ margin-left: var(--x-size-base-08) !important;
301
297
  }
302
- .x-padding--bottom-10 {
303
- padding-bottom: var(--x-size-base-10) !important;
298
+ [dir="rtl"] .x-margin--left-08 {
299
+ margin-right: var(--x-size-base-08) !important;
304
300
  }
305
- [dir="ltr"] .x-padding--right-10 {
306
- padding-right: var(--x-size-base-10) !important;
301
+ .x-margin--top-09 {
302
+ margin-top: var(--x-size-base-09) !important;
307
303
  }
308
- [dir="rtl"] .x-padding--right-10 {
309
- padding-left: var(--x-size-base-10) !important;
304
+ .x-margin--bottom-09 {
305
+ margin-bottom: var(--x-size-base-09) !important;
310
306
  }
311
- [dir="ltr"] .x-padding--left-10 {
312
- padding-left: var(--x-size-base-10) !important;
307
+ [dir="ltr"] .x-margin--right-09 {
308
+ margin-right: var(--x-size-base-09) !important;
313
309
  }
314
- [dir="rtl"] .x-padding--left-10 {
315
- padding-right: var(--x-size-base-10) !important;
310
+ [dir="rtl"] .x-margin--right-09 {
311
+ margin-left: var(--x-size-base-09) !important;
316
312
  }
317
- .x-padding--top-11 {
318
- padding-top: var(--x-size-base-11) !important;
313
+ [dir="ltr"] .x-margin--left-09 {
314
+ margin-left: var(--x-size-base-09) !important;
319
315
  }
320
- .x-padding--bottom-11 {
321
- padding-bottom: var(--x-size-base-11) !important;
316
+ [dir="rtl"] .x-margin--left-09 {
317
+ margin-right: var(--x-size-base-09) !important;
322
318
  }
323
- [dir="ltr"] .x-padding--right-11 {
324
- padding-right: var(--x-size-base-11) !important;
319
+ .x-margin--top-10 {
320
+ margin-top: var(--x-size-base-10) !important;
325
321
  }
326
- [dir="rtl"] .x-padding--right-11 {
327
- padding-left: var(--x-size-base-11) !important;
322
+ .x-margin--bottom-10 {
323
+ margin-bottom: var(--x-size-base-10) !important;
328
324
  }
329
- [dir="ltr"] .x-padding--left-11 {
330
- padding-left: var(--x-size-base-11) !important;
325
+ [dir="ltr"] .x-margin--right-10 {
326
+ margin-right: var(--x-size-base-10) !important;
331
327
  }
332
- [dir="rtl"] .x-padding--left-11 {
333
- padding-right: var(--x-size-base-11) !important;
328
+ [dir="rtl"] .x-margin--right-10 {
329
+ margin-left: var(--x-size-base-10) !important;
334
330
  }
335
- .x-padding--top-12 {
336
- padding-top: var(--x-size-base-12) !important;
331
+ [dir="ltr"] .x-margin--left-10 {
332
+ margin-left: var(--x-size-base-10) !important;
337
333
  }
338
- .x-padding--bottom-12 {
339
- padding-bottom: var(--x-size-base-12) !important;
334
+ [dir="rtl"] .x-margin--left-10 {
335
+ margin-right: var(--x-size-base-10) !important;
340
336
  }
341
- [dir="ltr"] .x-padding--right-12 {
342
- padding-right: var(--x-size-base-12) !important;
337
+ .x-margin--top-11 {
338
+ margin-top: var(--x-size-base-11) !important;
343
339
  }
344
- [dir="rtl"] .x-padding--right-12 {
345
- padding-left: var(--x-size-base-12) !important;
340
+ .x-margin--bottom-11 {
341
+ margin-bottom: var(--x-size-base-11) !important;
346
342
  }
347
- [dir="ltr"] .x-padding--left-12 {
348
- padding-left: var(--x-size-base-12) !important;
343
+ [dir="ltr"] .x-margin--right-11 {
344
+ margin-right: var(--x-size-base-11) !important;
349
345
  }
350
- [dir="rtl"] .x-padding--left-12 {
351
- padding-right: var(--x-size-base-12) !important;
346
+ [dir="rtl"] .x-margin--right-11 {
347
+ margin-left: var(--x-size-base-11) !important;
352
348
  }
353
- .x-padding--top-13 {
354
- padding-top: var(--x-size-base-13) !important;
349
+ [dir="ltr"] .x-margin--left-11 {
350
+ margin-left: var(--x-size-base-11) !important;
355
351
  }
356
- .x-padding--bottom-13 {
357
- padding-bottom: var(--x-size-base-13) !important;
352
+ [dir="rtl"] .x-margin--left-11 {
353
+ margin-right: var(--x-size-base-11) !important;
358
354
  }
359
- [dir="ltr"] .x-padding--right-13 {
360
- padding-right: var(--x-size-base-13) !important;
355
+ .x-margin--top-12 {
356
+ margin-top: var(--x-size-base-12) !important;
361
357
  }
362
- [dir="rtl"] .x-padding--right-13 {
363
- padding-left: var(--x-size-base-13) !important;
358
+ .x-margin--bottom-12 {
359
+ margin-bottom: var(--x-size-base-12) !important;
364
360
  }
365
- [dir="ltr"] .x-padding--left-13 {
366
- padding-left: var(--x-size-base-13) !important;
361
+ [dir="ltr"] .x-margin--right-12 {
362
+ margin-right: var(--x-size-base-12) !important;
367
363
  }
368
- [dir="rtl"] .x-padding--left-13 {
369
- padding-right: var(--x-size-base-13) !important;
364
+ [dir="rtl"] .x-margin--right-12 {
365
+ margin-left: var(--x-size-base-12) !important;
370
366
  }
371
- .x-padding--top-14 {
372
- padding-top: var(--x-size-base-14) !important;
367
+ [dir="ltr"] .x-margin--left-12 {
368
+ margin-left: var(--x-size-base-12) !important;
373
369
  }
374
- .x-padding--bottom-14 {
375
- padding-bottom: var(--x-size-base-14) !important;
370
+ [dir="rtl"] .x-margin--left-12 {
371
+ margin-right: var(--x-size-base-12) !important;
376
372
  }
377
- [dir="ltr"] .x-padding--right-14 {
378
- padding-right: var(--x-size-base-14) !important;
373
+ .x-margin--top-13 {
374
+ margin-top: var(--x-size-base-13) !important;
379
375
  }
380
- [dir="rtl"] .x-padding--right-14 {
381
- padding-left: var(--x-size-base-14) !important;
376
+ .x-margin--bottom-13 {
377
+ margin-bottom: var(--x-size-base-13) !important;
382
378
  }
383
- [dir="ltr"] .x-padding--left-14 {
384
- padding-left: var(--x-size-base-14) !important;
379
+ [dir="ltr"] .x-margin--right-13 {
380
+ margin-right: var(--x-size-base-13) !important;
385
381
  }
386
- [dir="rtl"] .x-padding--left-14 {
387
- padding-right: var(--x-size-base-14) !important;
382
+ [dir="rtl"] .x-margin--right-13 {
383
+ margin-left: var(--x-size-base-13) !important;
388
384
  }
389
- .x-padding--top-15 {
390
- padding-top: var(--x-size-base-15) !important;
385
+ [dir="ltr"] .x-margin--left-13 {
386
+ margin-left: var(--x-size-base-13) !important;
391
387
  }
392
- .x-padding--bottom-15 {
393
- padding-bottom: var(--x-size-base-15) !important;
388
+ [dir="rtl"] .x-margin--left-13 {
389
+ margin-right: var(--x-size-base-13) !important;
394
390
  }
395
- [dir="ltr"] .x-padding--right-15 {
396
- padding-right: var(--x-size-base-15) !important;
391
+ .x-margin--top-14 {
392
+ margin-top: var(--x-size-base-14) !important;
397
393
  }
398
- [dir="rtl"] .x-padding--right-15 {
399
- padding-left: var(--x-size-base-15) !important;
394
+ .x-margin--bottom-14 {
395
+ margin-bottom: var(--x-size-base-14) !important;
400
396
  }
401
- [dir="ltr"] .x-padding--left-15 {
402
- padding-left: var(--x-size-base-15) !important;
397
+ [dir="ltr"] .x-margin--right-14 {
398
+ margin-right: var(--x-size-base-14) !important;
403
399
  }
404
- [dir="rtl"] .x-padding--left-15 {
405
- padding-right: var(--x-size-base-15) !important;
400
+ [dir="rtl"] .x-margin--right-14 {
401
+ margin-left: var(--x-size-base-14) !important;
406
402
  }
407
- .x-padding--top-16 {
408
- padding-top: var(--x-size-base-16) !important;
403
+ [dir="ltr"] .x-margin--left-14 {
404
+ margin-left: var(--x-size-base-14) !important;
409
405
  }
410
- .x-padding--bottom-16 {
411
- padding-bottom: var(--x-size-base-16) !important;
406
+ [dir="rtl"] .x-margin--left-14 {
407
+ margin-right: var(--x-size-base-14) !important;
412
408
  }
413
- [dir="ltr"] .x-padding--right-16 {
414
- padding-right: var(--x-size-base-16) !important;
409
+ .x-margin--top-15 {
410
+ margin-top: var(--x-size-base-15) !important;
415
411
  }
416
- [dir="rtl"] .x-padding--right-16 {
417
- padding-left: var(--x-size-base-16) !important;
412
+ .x-margin--bottom-15 {
413
+ margin-bottom: var(--x-size-base-15) !important;
418
414
  }
419
- [dir="ltr"] .x-padding--left-16 {
420
- padding-left: var(--x-size-base-16) !important;
415
+ [dir="ltr"] .x-margin--right-15 {
416
+ margin-right: var(--x-size-base-15) !important;
421
417
  }
422
- [dir="rtl"] .x-padding--left-16 {
423
- padding-right: var(--x-size-base-16) !important;
418
+ [dir="rtl"] .x-margin--right-15 {
419
+ margin-left: var(--x-size-base-15) !important;
424
420
  }
425
- .x-padding--top-17 {
426
- padding-top: var(--x-size-base-17) !important;
421
+ [dir="ltr"] .x-margin--left-15 {
422
+ margin-left: var(--x-size-base-15) !important;
427
423
  }
428
- .x-padding--bottom-17 {
429
- padding-bottom: var(--x-size-base-17) !important;
424
+ [dir="rtl"] .x-margin--left-15 {
425
+ margin-right: var(--x-size-base-15) !important;
430
426
  }
431
- [dir="ltr"] .x-padding--right-17 {
432
- padding-right: var(--x-size-base-17) !important;
427
+ .x-margin--top-16 {
428
+ margin-top: var(--x-size-base-16) !important;
433
429
  }
434
- [dir="rtl"] .x-padding--right-17 {
435
- padding-left: var(--x-size-base-17) !important;
430
+ .x-margin--bottom-16 {
431
+ margin-bottom: var(--x-size-base-16) !important;
436
432
  }
437
- [dir="ltr"] .x-padding--left-17 {
438
- padding-left: var(--x-size-base-17) !important;
433
+ [dir="ltr"] .x-margin--right-16 {
434
+ margin-right: var(--x-size-base-16) !important;
439
435
  }
440
- [dir="rtl"] .x-padding--left-17 {
441
- padding-right: var(--x-size-base-17) !important;
436
+ [dir="rtl"] .x-margin--right-16 {
437
+ margin-left: var(--x-size-base-16) !important;
442
438
  }
443
- .x-padding--top-18 {
444
- padding-top: var(--x-size-base-18) !important;
439
+ [dir="ltr"] .x-margin--left-16 {
440
+ margin-left: var(--x-size-base-16) !important;
445
441
  }
446
- .x-padding--bottom-18 {
447
- padding-bottom: var(--x-size-base-18) !important;
442
+ [dir="rtl"] .x-margin--left-16 {
443
+ margin-right: var(--x-size-base-16) !important;
448
444
  }
449
- [dir="ltr"] .x-padding--right-18 {
450
- padding-right: var(--x-size-base-18) !important;
445
+ .x-margin--top-17 {
446
+ margin-top: var(--x-size-base-17) !important;
451
447
  }
452
- [dir="rtl"] .x-padding--right-18 {
453
- padding-left: var(--x-size-base-18) !important;
448
+ .x-margin--bottom-17 {
449
+ margin-bottom: var(--x-size-base-17) !important;
454
450
  }
455
- [dir="ltr"] .x-padding--left-18 {
456
- padding-left: var(--x-size-base-18) !important;
451
+ [dir="ltr"] .x-margin--right-17 {
452
+ margin-right: var(--x-size-base-17) !important;
457
453
  }
458
- [dir="rtl"] .x-padding--left-18 {
459
- padding-right: var(--x-size-base-18) !important;
454
+ [dir="rtl"] .x-margin--right-17 {
455
+ margin-left: var(--x-size-base-17) !important;
460
456
  }
461
- .x-padding--top-19 {
462
- padding-top: var(--x-size-base-19) !important;
457
+ [dir="ltr"] .x-margin--left-17 {
458
+ margin-left: var(--x-size-base-17) !important;
463
459
  }
464
- .x-padding--bottom-19 {
465
- padding-bottom: var(--x-size-base-19) !important;
460
+ [dir="rtl"] .x-margin--left-17 {
461
+ margin-right: var(--x-size-base-17) !important;
466
462
  }
467
- [dir="ltr"] .x-padding--right-19 {
468
- padding-right: var(--x-size-base-19) !important;
463
+ .x-margin--top-18 {
464
+ margin-top: var(--x-size-base-18) !important;
469
465
  }
470
- [dir="rtl"] .x-padding--right-19 {
471
- padding-left: var(--x-size-base-19) !important;
466
+ .x-margin--bottom-18 {
467
+ margin-bottom: var(--x-size-base-18) !important;
472
468
  }
473
- [dir="ltr"] .x-padding--left-19 {
474
- padding-left: var(--x-size-base-19) !important;
469
+ [dir="ltr"] .x-margin--right-18 {
470
+ margin-right: var(--x-size-base-18) !important;
475
471
  }
476
- [dir="rtl"] .x-padding--left-19 {
477
- padding-right: var(--x-size-base-19) !important;
472
+ [dir="rtl"] .x-margin--right-18 {
473
+ margin-left: var(--x-size-base-18) !important;
478
474
  }
479
- .x-padding--top-20 {
480
- padding-top: var(--x-size-base-20) !important;
475
+ [dir="ltr"] .x-margin--left-18 {
476
+ margin-left: var(--x-size-base-18) !important;
481
477
  }
482
- .x-padding--bottom-20 {
483
- padding-bottom: var(--x-size-base-20) !important;
478
+ [dir="rtl"] .x-margin--left-18 {
479
+ margin-right: var(--x-size-base-18) !important;
484
480
  }
485
- [dir="ltr"] .x-padding--right-20 {
486
- padding-right: var(--x-size-base-20) !important;
481
+ .x-margin--top-19 {
482
+ margin-top: var(--x-size-base-19) !important;
487
483
  }
488
- [dir="rtl"] .x-padding--right-20 {
489
- padding-left: var(--x-size-base-20) !important;
484
+ .x-margin--bottom-19 {
485
+ margin-bottom: var(--x-size-base-19) !important;
490
486
  }
491
- [dir="ltr"] .x-padding--left-20 {
492
- padding-left: var(--x-size-base-20) !important;
487
+ [dir="ltr"] .x-margin--right-19 {
488
+ margin-right: var(--x-size-base-19) !important;
493
489
  }
494
- [dir="rtl"] .x-padding--left-20 {
495
- padding-right: var(--x-size-base-20) !important;
490
+ [dir="rtl"] .x-margin--right-19 {
491
+ margin-left: var(--x-size-base-19) !important;
496
492
  }
497
- .x-margin--auto {
498
- margin: auto !important;
493
+ [dir="ltr"] .x-margin--left-19 {
494
+ margin-left: var(--x-size-base-19) !important;
499
495
  }
500
- .x-margin--00 {
501
- margin: 0 !important;
496
+ [dir="rtl"] .x-margin--left-19 {
497
+ margin-right: var(--x-size-base-19) !important;
502
498
  }
503
- .x-margin--01 {
504
- margin: var(--x-size-base-01) !important;
499
+ .x-margin--top-20 {
500
+ margin-top: var(--x-size-base-20) !important;
505
501
  }
506
- .x-margin--02 {
507
- margin: var(--x-size-base-02) !important;
502
+ .x-margin--bottom-20 {
503
+ margin-bottom: var(--x-size-base-20) !important;
508
504
  }
509
- .x-margin--03 {
510
- margin: var(--x-size-base-03) !important;
505
+ [dir="ltr"] .x-margin--right-20 {
506
+ margin-right: var(--x-size-base-20) !important;
511
507
  }
512
- .x-margin--04 {
513
- margin: var(--x-size-base-04) !important;
508
+ [dir="rtl"] .x-margin--right-20 {
509
+ margin-left: var(--x-size-base-20) !important;
514
510
  }
515
- .x-margin--05 {
516
- margin: var(--x-size-base-05) !important;
511
+ [dir="ltr"] .x-margin--left-20 {
512
+ margin-left: var(--x-size-base-20) !important;
517
513
  }
518
- .x-margin--06 {
519
- margin: var(--x-size-base-06) !important;
514
+ [dir="rtl"] .x-margin--left-20 {
515
+ margin-right: var(--x-size-base-20) !important;
520
516
  }
521
- .x-margin--07 {
522
- margin: var(--x-size-base-07) !important;
517
+ .x-line-height--none {
518
+ line-height: 1 !important;
523
519
  }
524
- .x-margin--08 {
525
- margin: var(--x-size-base-08) !important;
520
+
521
+ .x-line-height--tight {
522
+ line-height: 1.25 !important;
526
523
  }
527
- .x-margin--09 {
528
- margin: var(--x-size-base-09) !important;
524
+
525
+ .x-line-height--snug {
526
+ line-height: 1.375 !important;
529
527
  }
530
- .x-margin--10 {
531
- margin: var(--x-size-base-10) !important;
528
+
529
+ .x-line-height--normal {
530
+ line-height: 1.5 !important;
532
531
  }
533
- .x-margin--11 {
534
- margin: var(--x-size-base-11) !important;
532
+
533
+ .x-line-height--relaxed {
534
+ line-height: 1.625 !important;
535
535
  }
536
- .x-margin--12 {
537
- margin: var(--x-size-base-12) !important;
536
+
537
+ .x-line-height--loose {
538
+ line-height: 2 !important;
538
539
  }
539
- .x-margin--13 {
540
- margin: var(--x-size-base-13) !important;
540
+
541
+ .x-padding--00 {
542
+ padding: 0 !important;
541
543
  }
542
- .x-margin--14 {
543
- margin: var(--x-size-base-14) !important;
544
+ .x-padding--01 {
545
+ padding: var(--x-size-base-01) !important;
544
546
  }
545
- .x-margin--15 {
546
- margin: var(--x-size-base-15) !important;
547
+ .x-padding--02 {
548
+ padding: var(--x-size-base-02) !important;
547
549
  }
548
- .x-margin--16 {
549
- margin: var(--x-size-base-16) !important;
550
+ .x-padding--03 {
551
+ padding: var(--x-size-base-03) !important;
550
552
  }
551
- .x-margin--17 {
552
- margin: var(--x-size-base-17) !important;
553
+ .x-padding--04 {
554
+ padding: var(--x-size-base-04) !important;
553
555
  }
554
- .x-margin--18 {
555
- margin: var(--x-size-base-18) !important;
556
+ .x-padding--05 {
557
+ padding: var(--x-size-base-05) !important;
556
558
  }
557
- .x-margin--19 {
558
- margin: var(--x-size-base-19) !important;
559
+ .x-padding--06 {
560
+ padding: var(--x-size-base-06) !important;
559
561
  }
560
- .x-margin--20 {
561
- margin: var(--x-size-base-20) !important;
562
+ .x-padding--07 {
563
+ padding: var(--x-size-base-07) !important;
562
564
  }
563
- .x-margin--top-auto {
564
- margin-top: auto !important;
565
+ .x-padding--08 {
566
+ padding: var(--x-size-base-08) !important;
565
567
  }
566
- .x-margin--bottom-auto {
567
- margin-bottom: auto !important;
568
+ .x-padding--09 {
569
+ padding: var(--x-size-base-09) !important;
568
570
  }
569
- [dir="ltr"] .x-margin--right-auto {
570
- margin-right: auto !important;
571
+ .x-padding--10 {
572
+ padding: var(--x-size-base-10) !important;
571
573
  }
572
- [dir="rtl"] .x-margin--right-auto {
573
- margin-left: auto !important;
574
+ .x-padding--11 {
575
+ padding: var(--x-size-base-11) !important;
574
576
  }
575
- [dir="ltr"] .x-margin--left-auto {
576
- margin-left: auto !important;
577
+ .x-padding--12 {
578
+ padding: var(--x-size-base-12) !important;
577
579
  }
578
- [dir="rtl"] .x-margin--left-auto {
579
- margin-right: auto !important;
580
+ .x-padding--13 {
581
+ padding: var(--x-size-base-13) !important;
580
582
  }
581
- .x-margin--top-00 {
582
- margin-top: 0 !important;
583
+ .x-padding--14 {
584
+ padding: var(--x-size-base-14) !important;
583
585
  }
584
- .x-margin--bottom-00 {
585
- margin-bottom: 0 !important;
586
+ .x-padding--15 {
587
+ padding: var(--x-size-base-15) !important;
586
588
  }
587
- [dir="ltr"] .x-margin--right-00 {
588
- margin-right: 0 !important;
589
+ .x-padding--16 {
590
+ padding: var(--x-size-base-16) !important;
589
591
  }
590
- [dir="rtl"] .x-margin--right-00 {
591
- margin-left: 0 !important;
592
+ .x-padding--17 {
593
+ padding: var(--x-size-base-17) !important;
592
594
  }
593
- [dir="ltr"] .x-margin--left-00 {
594
- margin-left: 0 !important;
595
+ .x-padding--18 {
596
+ padding: var(--x-size-base-18) !important;
595
597
  }
596
- [dir="rtl"] .x-margin--left-00 {
597
- margin-right: 0 !important;
598
+ .x-padding--19 {
599
+ padding: var(--x-size-base-19) !important;
598
600
  }
599
- .x-margin--top-01 {
600
- margin-top: var(--x-size-base-01) !important;
601
+ .x-padding--20 {
602
+ padding: var(--x-size-base-20) !important;
601
603
  }
602
- .x-margin--bottom-01 {
603
- margin-bottom: var(--x-size-base-01) !important;
604
+ .x-padding--top-00 {
605
+ padding-top: 0 !important;
604
606
  }
605
- [dir="ltr"] .x-margin--right-01 {
606
- margin-right: var(--x-size-base-01) !important;
607
+ .x-padding--bottom-00 {
608
+ padding-bottom: 0 !important;
607
609
  }
608
- [dir="rtl"] .x-margin--right-01 {
609
- margin-left: var(--x-size-base-01) !important;
610
+ [dir="ltr"] .x-padding--right-00 {
611
+ padding-right: 0 !important;
610
612
  }
611
- [dir="ltr"] .x-margin--left-01 {
612
- margin-left: var(--x-size-base-01) !important;
613
+ [dir="rtl"] .x-padding--right-00 {
614
+ padding-left: 0 !important;
613
615
  }
614
- [dir="rtl"] .x-margin--left-01 {
615
- margin-right: var(--x-size-base-01) !important;
616
+ [dir="ltr"] .x-padding--left-00 {
617
+ padding-left: 0 !important;
616
618
  }
617
- .x-margin--top-02 {
618
- margin-top: var(--x-size-base-02) !important;
619
+ [dir="rtl"] .x-padding--left-00 {
620
+ padding-right: 0 !important;
619
621
  }
620
- .x-margin--bottom-02 {
621
- margin-bottom: var(--x-size-base-02) !important;
622
+ .x-padding--top-01 {
623
+ padding-top: var(--x-size-base-01) !important;
622
624
  }
623
- [dir="ltr"] .x-margin--right-02 {
624
- margin-right: var(--x-size-base-02) !important;
625
+ .x-padding--bottom-01 {
626
+ padding-bottom: var(--x-size-base-01) !important;
625
627
  }
626
- [dir="rtl"] .x-margin--right-02 {
627
- margin-left: var(--x-size-base-02) !important;
628
+ [dir="ltr"] .x-padding--right-01 {
629
+ padding-right: var(--x-size-base-01) !important;
628
630
  }
629
- [dir="ltr"] .x-margin--left-02 {
630
- margin-left: var(--x-size-base-02) !important;
631
+ [dir="rtl"] .x-padding--right-01 {
632
+ padding-left: var(--x-size-base-01) !important;
631
633
  }
632
- [dir="rtl"] .x-margin--left-02 {
633
- margin-right: var(--x-size-base-02) !important;
634
+ [dir="ltr"] .x-padding--left-01 {
635
+ padding-left: var(--x-size-base-01) !important;
634
636
  }
635
- .x-margin--top-03 {
636
- margin-top: var(--x-size-base-03) !important;
637
+ [dir="rtl"] .x-padding--left-01 {
638
+ padding-right: var(--x-size-base-01) !important;
637
639
  }
638
- .x-margin--bottom-03 {
639
- margin-bottom: var(--x-size-base-03) !important;
640
+ .x-padding--top-02 {
641
+ padding-top: var(--x-size-base-02) !important;
640
642
  }
641
- [dir="ltr"] .x-margin--right-03 {
642
- margin-right: var(--x-size-base-03) !important;
643
+ .x-padding--bottom-02 {
644
+ padding-bottom: var(--x-size-base-02) !important;
643
645
  }
644
- [dir="rtl"] .x-margin--right-03 {
645
- margin-left: var(--x-size-base-03) !important;
646
+ [dir="ltr"] .x-padding--right-02 {
647
+ padding-right: var(--x-size-base-02) !important;
646
648
  }
647
- [dir="ltr"] .x-margin--left-03 {
648
- margin-left: var(--x-size-base-03) !important;
649
+ [dir="rtl"] .x-padding--right-02 {
650
+ padding-left: var(--x-size-base-02) !important;
649
651
  }
650
- [dir="rtl"] .x-margin--left-03 {
651
- margin-right: var(--x-size-base-03) !important;
652
+ [dir="ltr"] .x-padding--left-02 {
653
+ padding-left: var(--x-size-base-02) !important;
652
654
  }
653
- .x-margin--top-04 {
654
- margin-top: var(--x-size-base-04) !important;
655
+ [dir="rtl"] .x-padding--left-02 {
656
+ padding-right: var(--x-size-base-02) !important;
655
657
  }
656
- .x-margin--bottom-04 {
657
- margin-bottom: var(--x-size-base-04) !important;
658
+ .x-padding--top-03 {
659
+ padding-top: var(--x-size-base-03) !important;
658
660
  }
659
- [dir="ltr"] .x-margin--right-04 {
660
- margin-right: var(--x-size-base-04) !important;
661
+ .x-padding--bottom-03 {
662
+ padding-bottom: var(--x-size-base-03) !important;
661
663
  }
662
- [dir="rtl"] .x-margin--right-04 {
663
- margin-left: var(--x-size-base-04) !important;
664
+ [dir="ltr"] .x-padding--right-03 {
665
+ padding-right: var(--x-size-base-03) !important;
664
666
  }
665
- [dir="ltr"] .x-margin--left-04 {
666
- margin-left: var(--x-size-base-04) !important;
667
+ [dir="rtl"] .x-padding--right-03 {
668
+ padding-left: var(--x-size-base-03) !important;
667
669
  }
668
- [dir="rtl"] .x-margin--left-04 {
669
- margin-right: var(--x-size-base-04) !important;
670
+ [dir="ltr"] .x-padding--left-03 {
671
+ padding-left: var(--x-size-base-03) !important;
670
672
  }
671
- .x-margin--top-05 {
672
- margin-top: var(--x-size-base-05) !important;
673
+ [dir="rtl"] .x-padding--left-03 {
674
+ padding-right: var(--x-size-base-03) !important;
673
675
  }
674
- .x-margin--bottom-05 {
675
- margin-bottom: var(--x-size-base-05) !important;
676
+ .x-padding--top-04 {
677
+ padding-top: var(--x-size-base-04) !important;
676
678
  }
677
- [dir="ltr"] .x-margin--right-05 {
678
- margin-right: var(--x-size-base-05) !important;
679
+ .x-padding--bottom-04 {
680
+ padding-bottom: var(--x-size-base-04) !important;
679
681
  }
680
- [dir="rtl"] .x-margin--right-05 {
681
- margin-left: var(--x-size-base-05) !important;
682
+ [dir="ltr"] .x-padding--right-04 {
683
+ padding-right: var(--x-size-base-04) !important;
682
684
  }
683
- [dir="ltr"] .x-margin--left-05 {
684
- margin-left: var(--x-size-base-05) !important;
685
+ [dir="rtl"] .x-padding--right-04 {
686
+ padding-left: var(--x-size-base-04) !important;
685
687
  }
686
- [dir="rtl"] .x-margin--left-05 {
687
- margin-right: var(--x-size-base-05) !important;
688
+ [dir="ltr"] .x-padding--left-04 {
689
+ padding-left: var(--x-size-base-04) !important;
690
+ }
691
+ [dir="rtl"] .x-padding--left-04 {
692
+ padding-right: var(--x-size-base-04) !important;
688
693
  }
689
- .x-margin--top-06 {
690
- margin-top: var(--x-size-base-06) !important;
694
+ .x-padding--top-05 {
695
+ padding-top: var(--x-size-base-05) !important;
691
696
  }
692
- .x-margin--bottom-06 {
693
- margin-bottom: var(--x-size-base-06) !important;
697
+ .x-padding--bottom-05 {
698
+ padding-bottom: var(--x-size-base-05) !important;
694
699
  }
695
- [dir="ltr"] .x-margin--right-06 {
696
- margin-right: var(--x-size-base-06) !important;
700
+ [dir="ltr"] .x-padding--right-05 {
701
+ padding-right: var(--x-size-base-05) !important;
697
702
  }
698
- [dir="rtl"] .x-margin--right-06 {
699
- margin-left: var(--x-size-base-06) !important;
703
+ [dir="rtl"] .x-padding--right-05 {
704
+ padding-left: var(--x-size-base-05) !important;
700
705
  }
701
- [dir="ltr"] .x-margin--left-06 {
702
- margin-left: var(--x-size-base-06) !important;
706
+ [dir="ltr"] .x-padding--left-05 {
707
+ padding-left: var(--x-size-base-05) !important;
703
708
  }
704
- [dir="rtl"] .x-margin--left-06 {
705
- margin-right: var(--x-size-base-06) !important;
709
+ [dir="rtl"] .x-padding--left-05 {
710
+ padding-right: var(--x-size-base-05) !important;
706
711
  }
707
- .x-margin--top-07 {
708
- margin-top: var(--x-size-base-07) !important;
712
+ .x-padding--top-06 {
713
+ padding-top: var(--x-size-base-06) !important;
709
714
  }
710
- .x-margin--bottom-07 {
711
- margin-bottom: var(--x-size-base-07) !important;
715
+ .x-padding--bottom-06 {
716
+ padding-bottom: var(--x-size-base-06) !important;
712
717
  }
713
- [dir="ltr"] .x-margin--right-07 {
714
- margin-right: var(--x-size-base-07) !important;
718
+ [dir="ltr"] .x-padding--right-06 {
719
+ padding-right: var(--x-size-base-06) !important;
715
720
  }
716
- [dir="rtl"] .x-margin--right-07 {
717
- margin-left: var(--x-size-base-07) !important;
721
+ [dir="rtl"] .x-padding--right-06 {
722
+ padding-left: var(--x-size-base-06) !important;
718
723
  }
719
- [dir="ltr"] .x-margin--left-07 {
720
- margin-left: var(--x-size-base-07) !important;
724
+ [dir="ltr"] .x-padding--left-06 {
725
+ padding-left: var(--x-size-base-06) !important;
721
726
  }
722
- [dir="rtl"] .x-margin--left-07 {
723
- margin-right: var(--x-size-base-07) !important;
727
+ [dir="rtl"] .x-padding--left-06 {
728
+ padding-right: var(--x-size-base-06) !important;
724
729
  }
725
- .x-margin--top-08 {
726
- margin-top: var(--x-size-base-08) !important;
730
+ .x-padding--top-07 {
731
+ padding-top: var(--x-size-base-07) !important;
727
732
  }
728
- .x-margin--bottom-08 {
729
- margin-bottom: var(--x-size-base-08) !important;
733
+ .x-padding--bottom-07 {
734
+ padding-bottom: var(--x-size-base-07) !important;
730
735
  }
731
- [dir="ltr"] .x-margin--right-08 {
732
- margin-right: var(--x-size-base-08) !important;
736
+ [dir="ltr"] .x-padding--right-07 {
737
+ padding-right: var(--x-size-base-07) !important;
733
738
  }
734
- [dir="rtl"] .x-margin--right-08 {
735
- margin-left: var(--x-size-base-08) !important;
739
+ [dir="rtl"] .x-padding--right-07 {
740
+ padding-left: var(--x-size-base-07) !important;
736
741
  }
737
- [dir="ltr"] .x-margin--left-08 {
738
- margin-left: var(--x-size-base-08) !important;
742
+ [dir="ltr"] .x-padding--left-07 {
743
+ padding-left: var(--x-size-base-07) !important;
739
744
  }
740
- [dir="rtl"] .x-margin--left-08 {
741
- margin-right: var(--x-size-base-08) !important;
745
+ [dir="rtl"] .x-padding--left-07 {
746
+ padding-right: var(--x-size-base-07) !important;
742
747
  }
743
- .x-margin--top-09 {
744
- margin-top: var(--x-size-base-09) !important;
748
+ .x-padding--top-08 {
749
+ padding-top: var(--x-size-base-08) !important;
745
750
  }
746
- .x-margin--bottom-09 {
747
- margin-bottom: var(--x-size-base-09) !important;
751
+ .x-padding--bottom-08 {
752
+ padding-bottom: var(--x-size-base-08) !important;
748
753
  }
749
- [dir="ltr"] .x-margin--right-09 {
750
- margin-right: var(--x-size-base-09) !important;
754
+ [dir="ltr"] .x-padding--right-08 {
755
+ padding-right: var(--x-size-base-08) !important;
751
756
  }
752
- [dir="rtl"] .x-margin--right-09 {
753
- margin-left: var(--x-size-base-09) !important;
757
+ [dir="rtl"] .x-padding--right-08 {
758
+ padding-left: var(--x-size-base-08) !important;
754
759
  }
755
- [dir="ltr"] .x-margin--left-09 {
756
- margin-left: var(--x-size-base-09) !important;
760
+ [dir="ltr"] .x-padding--left-08 {
761
+ padding-left: var(--x-size-base-08) !important;
757
762
  }
758
- [dir="rtl"] .x-margin--left-09 {
759
- margin-right: var(--x-size-base-09) !important;
763
+ [dir="rtl"] .x-padding--left-08 {
764
+ padding-right: var(--x-size-base-08) !important;
760
765
  }
761
- .x-margin--top-10 {
762
- margin-top: var(--x-size-base-10) !important;
766
+ .x-padding--top-09 {
767
+ padding-top: var(--x-size-base-09) !important;
763
768
  }
764
- .x-margin--bottom-10 {
765
- margin-bottom: var(--x-size-base-10) !important;
769
+ .x-padding--bottom-09 {
770
+ padding-bottom: var(--x-size-base-09) !important;
766
771
  }
767
- [dir="ltr"] .x-margin--right-10 {
768
- margin-right: var(--x-size-base-10) !important;
772
+ [dir="ltr"] .x-padding--right-09 {
773
+ padding-right: var(--x-size-base-09) !important;
769
774
  }
770
- [dir="rtl"] .x-margin--right-10 {
771
- margin-left: var(--x-size-base-10) !important;
775
+ [dir="rtl"] .x-padding--right-09 {
776
+ padding-left: var(--x-size-base-09) !important;
772
777
  }
773
- [dir="ltr"] .x-margin--left-10 {
774
- margin-left: var(--x-size-base-10) !important;
778
+ [dir="ltr"] .x-padding--left-09 {
779
+ padding-left: var(--x-size-base-09) !important;
775
780
  }
776
- [dir="rtl"] .x-margin--left-10 {
777
- margin-right: var(--x-size-base-10) !important;
781
+ [dir="rtl"] .x-padding--left-09 {
782
+ padding-right: var(--x-size-base-09) !important;
778
783
  }
779
- .x-margin--top-11 {
780
- margin-top: var(--x-size-base-11) !important;
784
+ .x-padding--top-10 {
785
+ padding-top: var(--x-size-base-10) !important;
781
786
  }
782
- .x-margin--bottom-11 {
783
- margin-bottom: var(--x-size-base-11) !important;
787
+ .x-padding--bottom-10 {
788
+ padding-bottom: var(--x-size-base-10) !important;
784
789
  }
785
- [dir="ltr"] .x-margin--right-11 {
786
- margin-right: var(--x-size-base-11) !important;
790
+ [dir="ltr"] .x-padding--right-10 {
791
+ padding-right: var(--x-size-base-10) !important;
787
792
  }
788
- [dir="rtl"] .x-margin--right-11 {
789
- margin-left: var(--x-size-base-11) !important;
793
+ [dir="rtl"] .x-padding--right-10 {
794
+ padding-left: var(--x-size-base-10) !important;
790
795
  }
791
- [dir="ltr"] .x-margin--left-11 {
792
- margin-left: var(--x-size-base-11) !important;
796
+ [dir="ltr"] .x-padding--left-10 {
797
+ padding-left: var(--x-size-base-10) !important;
793
798
  }
794
- [dir="rtl"] .x-margin--left-11 {
795
- margin-right: var(--x-size-base-11) !important;
799
+ [dir="rtl"] .x-padding--left-10 {
800
+ padding-right: var(--x-size-base-10) !important;
796
801
  }
797
- .x-margin--top-12 {
798
- margin-top: var(--x-size-base-12) !important;
802
+ .x-padding--top-11 {
803
+ padding-top: var(--x-size-base-11) !important;
799
804
  }
800
- .x-margin--bottom-12 {
801
- margin-bottom: var(--x-size-base-12) !important;
805
+ .x-padding--bottom-11 {
806
+ padding-bottom: var(--x-size-base-11) !important;
802
807
  }
803
- [dir="ltr"] .x-margin--right-12 {
804
- margin-right: var(--x-size-base-12) !important;
808
+ [dir="ltr"] .x-padding--right-11 {
809
+ padding-right: var(--x-size-base-11) !important;
805
810
  }
806
- [dir="rtl"] .x-margin--right-12 {
807
- margin-left: var(--x-size-base-12) !important;
811
+ [dir="rtl"] .x-padding--right-11 {
812
+ padding-left: var(--x-size-base-11) !important;
808
813
  }
809
- [dir="ltr"] .x-margin--left-12 {
810
- margin-left: var(--x-size-base-12) !important;
814
+ [dir="ltr"] .x-padding--left-11 {
815
+ padding-left: var(--x-size-base-11) !important;
811
816
  }
812
- [dir="rtl"] .x-margin--left-12 {
813
- margin-right: var(--x-size-base-12) !important;
817
+ [dir="rtl"] .x-padding--left-11 {
818
+ padding-right: var(--x-size-base-11) !important;
814
819
  }
815
- .x-margin--top-13 {
816
- margin-top: var(--x-size-base-13) !important;
820
+ .x-padding--top-12 {
821
+ padding-top: var(--x-size-base-12) !important;
817
822
  }
818
- .x-margin--bottom-13 {
819
- margin-bottom: var(--x-size-base-13) !important;
823
+ .x-padding--bottom-12 {
824
+ padding-bottom: var(--x-size-base-12) !important;
820
825
  }
821
- [dir="ltr"] .x-margin--right-13 {
822
- margin-right: var(--x-size-base-13) !important;
826
+ [dir="ltr"] .x-padding--right-12 {
827
+ padding-right: var(--x-size-base-12) !important;
823
828
  }
824
- [dir="rtl"] .x-margin--right-13 {
825
- margin-left: var(--x-size-base-13) !important;
829
+ [dir="rtl"] .x-padding--right-12 {
830
+ padding-left: var(--x-size-base-12) !important;
826
831
  }
827
- [dir="ltr"] .x-margin--left-13 {
828
- margin-left: var(--x-size-base-13) !important;
832
+ [dir="ltr"] .x-padding--left-12 {
833
+ padding-left: var(--x-size-base-12) !important;
829
834
  }
830
- [dir="rtl"] .x-margin--left-13 {
831
- margin-right: var(--x-size-base-13) !important;
835
+ [dir="rtl"] .x-padding--left-12 {
836
+ padding-right: var(--x-size-base-12) !important;
832
837
  }
833
- .x-margin--top-14 {
834
- margin-top: var(--x-size-base-14) !important;
838
+ .x-padding--top-13 {
839
+ padding-top: var(--x-size-base-13) !important;
835
840
  }
836
- .x-margin--bottom-14 {
837
- margin-bottom: var(--x-size-base-14) !important;
841
+ .x-padding--bottom-13 {
842
+ padding-bottom: var(--x-size-base-13) !important;
838
843
  }
839
- [dir="ltr"] .x-margin--right-14 {
840
- margin-right: var(--x-size-base-14) !important;
844
+ [dir="ltr"] .x-padding--right-13 {
845
+ padding-right: var(--x-size-base-13) !important;
841
846
  }
842
- [dir="rtl"] .x-margin--right-14 {
843
- margin-left: var(--x-size-base-14) !important;
847
+ [dir="rtl"] .x-padding--right-13 {
848
+ padding-left: var(--x-size-base-13) !important;
844
849
  }
845
- [dir="ltr"] .x-margin--left-14 {
846
- margin-left: var(--x-size-base-14) !important;
850
+ [dir="ltr"] .x-padding--left-13 {
851
+ padding-left: var(--x-size-base-13) !important;
847
852
  }
848
- [dir="rtl"] .x-margin--left-14 {
849
- margin-right: var(--x-size-base-14) !important;
853
+ [dir="rtl"] .x-padding--left-13 {
854
+ padding-right: var(--x-size-base-13) !important;
850
855
  }
851
- .x-margin--top-15 {
852
- margin-top: var(--x-size-base-15) !important;
856
+ .x-padding--top-14 {
857
+ padding-top: var(--x-size-base-14) !important;
853
858
  }
854
- .x-margin--bottom-15 {
855
- margin-bottom: var(--x-size-base-15) !important;
859
+ .x-padding--bottom-14 {
860
+ padding-bottom: var(--x-size-base-14) !important;
856
861
  }
857
- [dir="ltr"] .x-margin--right-15 {
858
- margin-right: var(--x-size-base-15) !important;
862
+ [dir="ltr"] .x-padding--right-14 {
863
+ padding-right: var(--x-size-base-14) !important;
859
864
  }
860
- [dir="rtl"] .x-margin--right-15 {
861
- margin-left: var(--x-size-base-15) !important;
865
+ [dir="rtl"] .x-padding--right-14 {
866
+ padding-left: var(--x-size-base-14) !important;
862
867
  }
863
- [dir="ltr"] .x-margin--left-15 {
864
- margin-left: var(--x-size-base-15) !important;
868
+ [dir="ltr"] .x-padding--left-14 {
869
+ padding-left: var(--x-size-base-14) !important;
865
870
  }
866
- [dir="rtl"] .x-margin--left-15 {
867
- margin-right: var(--x-size-base-15) !important;
871
+ [dir="rtl"] .x-padding--left-14 {
872
+ padding-right: var(--x-size-base-14) !important;
868
873
  }
869
- .x-margin--top-16 {
870
- margin-top: var(--x-size-base-16) !important;
874
+ .x-padding--top-15 {
875
+ padding-top: var(--x-size-base-15) !important;
871
876
  }
872
- .x-margin--bottom-16 {
873
- margin-bottom: var(--x-size-base-16) !important;
877
+ .x-padding--bottom-15 {
878
+ padding-bottom: var(--x-size-base-15) !important;
874
879
  }
875
- [dir="ltr"] .x-margin--right-16 {
876
- margin-right: var(--x-size-base-16) !important;
880
+ [dir="ltr"] .x-padding--right-15 {
881
+ padding-right: var(--x-size-base-15) !important;
877
882
  }
878
- [dir="rtl"] .x-margin--right-16 {
879
- margin-left: var(--x-size-base-16) !important;
883
+ [dir="rtl"] .x-padding--right-15 {
884
+ padding-left: var(--x-size-base-15) !important;
880
885
  }
881
- [dir="ltr"] .x-margin--left-16 {
882
- margin-left: var(--x-size-base-16) !important;
886
+ [dir="ltr"] .x-padding--left-15 {
887
+ padding-left: var(--x-size-base-15) !important;
883
888
  }
884
- [dir="rtl"] .x-margin--left-16 {
885
- margin-right: var(--x-size-base-16) !important;
889
+ [dir="rtl"] .x-padding--left-15 {
890
+ padding-right: var(--x-size-base-15) !important;
886
891
  }
887
- .x-margin--top-17 {
888
- margin-top: var(--x-size-base-17) !important;
892
+ .x-padding--top-16 {
893
+ padding-top: var(--x-size-base-16) !important;
889
894
  }
890
- .x-margin--bottom-17 {
891
- margin-bottom: var(--x-size-base-17) !important;
895
+ .x-padding--bottom-16 {
896
+ padding-bottom: var(--x-size-base-16) !important;
892
897
  }
893
- [dir="ltr"] .x-margin--right-17 {
894
- margin-right: var(--x-size-base-17) !important;
898
+ [dir="ltr"] .x-padding--right-16 {
899
+ padding-right: var(--x-size-base-16) !important;
895
900
  }
896
- [dir="rtl"] .x-margin--right-17 {
897
- margin-left: var(--x-size-base-17) !important;
901
+ [dir="rtl"] .x-padding--right-16 {
902
+ padding-left: var(--x-size-base-16) !important;
898
903
  }
899
- [dir="ltr"] .x-margin--left-17 {
900
- margin-left: var(--x-size-base-17) !important;
904
+ [dir="ltr"] .x-padding--left-16 {
905
+ padding-left: var(--x-size-base-16) !important;
901
906
  }
902
- [dir="rtl"] .x-margin--left-17 {
903
- margin-right: var(--x-size-base-17) !important;
907
+ [dir="rtl"] .x-padding--left-16 {
908
+ padding-right: var(--x-size-base-16) !important;
904
909
  }
905
- .x-margin--top-18 {
906
- margin-top: var(--x-size-base-18) !important;
910
+ .x-padding--top-17 {
911
+ padding-top: var(--x-size-base-17) !important;
907
912
  }
908
- .x-margin--bottom-18 {
909
- margin-bottom: var(--x-size-base-18) !important;
913
+ .x-padding--bottom-17 {
914
+ padding-bottom: var(--x-size-base-17) !important;
910
915
  }
911
- [dir="ltr"] .x-margin--right-18 {
912
- margin-right: var(--x-size-base-18) !important;
916
+ [dir="ltr"] .x-padding--right-17 {
917
+ padding-right: var(--x-size-base-17) !important;
913
918
  }
914
- [dir="rtl"] .x-margin--right-18 {
915
- margin-left: var(--x-size-base-18) !important;
919
+ [dir="rtl"] .x-padding--right-17 {
920
+ padding-left: var(--x-size-base-17) !important;
916
921
  }
917
- [dir="ltr"] .x-margin--left-18 {
918
- margin-left: var(--x-size-base-18) !important;
922
+ [dir="ltr"] .x-padding--left-17 {
923
+ padding-left: var(--x-size-base-17) !important;
919
924
  }
920
- [dir="rtl"] .x-margin--left-18 {
921
- margin-right: var(--x-size-base-18) !important;
925
+ [dir="rtl"] .x-padding--left-17 {
926
+ padding-right: var(--x-size-base-17) !important;
922
927
  }
923
- .x-margin--top-19 {
924
- margin-top: var(--x-size-base-19) !important;
928
+ .x-padding--top-18 {
929
+ padding-top: var(--x-size-base-18) !important;
925
930
  }
926
- .x-margin--bottom-19 {
927
- margin-bottom: var(--x-size-base-19) !important;
931
+ .x-padding--bottom-18 {
932
+ padding-bottom: var(--x-size-base-18) !important;
928
933
  }
929
- [dir="ltr"] .x-margin--right-19 {
930
- margin-right: var(--x-size-base-19) !important;
934
+ [dir="ltr"] .x-padding--right-18 {
935
+ padding-right: var(--x-size-base-18) !important;
931
936
  }
932
- [dir="rtl"] .x-margin--right-19 {
933
- margin-left: var(--x-size-base-19) !important;
937
+ [dir="rtl"] .x-padding--right-18 {
938
+ padding-left: var(--x-size-base-18) !important;
934
939
  }
935
- [dir="ltr"] .x-margin--left-19 {
936
- margin-left: var(--x-size-base-19) !important;
940
+ [dir="ltr"] .x-padding--left-18 {
941
+ padding-left: var(--x-size-base-18) !important;
937
942
  }
938
- [dir="rtl"] .x-margin--left-19 {
939
- margin-right: var(--x-size-base-19) !important;
943
+ [dir="rtl"] .x-padding--left-18 {
944
+ padding-right: var(--x-size-base-18) !important;
940
945
  }
941
- .x-margin--top-20 {
942
- margin-top: var(--x-size-base-20) !important;
946
+ .x-padding--top-19 {
947
+ padding-top: var(--x-size-base-19) !important;
943
948
  }
944
- .x-margin--bottom-20 {
945
- margin-bottom: var(--x-size-base-20) !important;
949
+ .x-padding--bottom-19 {
950
+ padding-bottom: var(--x-size-base-19) !important;
946
951
  }
947
- [dir="ltr"] .x-margin--right-20 {
948
- margin-right: var(--x-size-base-20) !important;
952
+ [dir="ltr"] .x-padding--right-19 {
953
+ padding-right: var(--x-size-base-19) !important;
949
954
  }
950
- [dir="rtl"] .x-margin--right-20 {
951
- margin-left: var(--x-size-base-20) !important;
955
+ [dir="rtl"] .x-padding--right-19 {
956
+ padding-left: var(--x-size-base-19) !important;
952
957
  }
953
- [dir="ltr"] .x-margin--left-20 {
954
- margin-left: var(--x-size-base-20) !important;
958
+ [dir="ltr"] .x-padding--left-19 {
959
+ padding-left: var(--x-size-base-19) !important;
955
960
  }
956
- [dir="rtl"] .x-margin--left-20 {
957
- margin-right: var(--x-size-base-20) !important;
961
+ [dir="rtl"] .x-padding--left-19 {
962
+ padding-right: var(--x-size-base-19) !important;
958
963
  }
959
- .x-line-height--none {
960
- line-height: 1 !important;
964
+ .x-padding--top-20 {
965
+ padding-top: var(--x-size-base-20) !important;
961
966
  }
962
-
963
- .x-line-height--tight {
964
- line-height: 1.25 !important;
967
+ .x-padding--bottom-20 {
968
+ padding-bottom: var(--x-size-base-20) !important;
965
969
  }
966
-
967
- .x-line-height--snug {
968
- line-height: 1.375 !important;
970
+ [dir="ltr"] .x-padding--right-20 {
971
+ padding-right: var(--x-size-base-20) !important;
969
972
  }
970
-
971
- .x-line-height--normal {
972
- line-height: 1.5 !important;
973
+ [dir="rtl"] .x-padding--right-20 {
974
+ padding-left: var(--x-size-base-20) !important;
973
975
  }
974
-
975
- .x-line-height--relaxed {
976
- line-height: 1.625 !important;
976
+ [dir="ltr"] .x-padding--left-20 {
977
+ padding-left: var(--x-size-base-20) !important;
977
978
  }
978
-
979
- .x-line-height--loose {
980
- line-height: 2 !important;
979
+ [dir="rtl"] .x-padding--left-20 {
980
+ padding-right: var(--x-size-base-20) !important;
981
981
  }
982
982
  .x-line-clamp--2 {
983
983
  overflow: hidden !important;
@@ -1014,136 +1014,13 @@
1014
1014
  -webkit-line-clamp: 6 !important;
1015
1015
  }
1016
1016
  .x-font-weight--light {
1017
- font-weight: var(--x-number-font-weight-base-light) !important;
1018
- }
1019
- .x-font-weight--regular {
1020
- font-weight: var(--x-number-font-weight-base-regular) !important;
1021
- }
1022
- .x-font-weight--bold {
1023
- font-weight: var(--x-number-font-weight-base-bold) !important;
1024
- }
1025
- .x-font-size--01 {
1026
- font-size: var(--x-size-base-01) !important;
1027
- line-height: 1.5;
1028
- }
1029
- .x-font-size--02 {
1030
- font-size: var(--x-size-base-02) !important;
1031
- line-height: 1.5;
1032
- }
1033
- .x-font-size--03 {
1034
- font-size: var(--x-size-base-03) !important;
1035
- line-height: 1.5;
1036
- }
1037
- .x-font-size--04 {
1038
- font-size: var(--x-size-base-04) !important;
1039
- line-height: 1.5;
1040
- }
1041
- .x-font-size--05 {
1042
- font-size: var(--x-size-base-05) !important;
1043
- line-height: 1.5;
1044
- }
1045
- .x-font-size--06 {
1046
- font-size: var(--x-size-base-06) !important;
1047
- line-height: 1.5;
1048
- }
1049
- .x-font-size--07 {
1050
- font-size: var(--x-size-base-07) !important;
1051
- line-height: 1.5;
1052
- }
1053
- .x-font-size--08 {
1054
- font-size: var(--x-size-base-08) !important;
1055
- line-height: 1.5;
1056
- }
1057
- .x-font-size--09 {
1058
- font-size: var(--x-size-base-09) !important;
1059
- line-height: 1.5;
1060
- }
1061
- .x-font-size--10 {
1062
- font-size: var(--x-size-base-10) !important;
1063
- line-height: 1.5;
1064
- }
1065
- .x-font-size--11 {
1066
- font-size: var(--x-size-base-11) !important;
1067
- line-height: 1.5;
1068
- }
1069
- .x-font-size--12 {
1070
- font-size: var(--x-size-base-12) !important;
1071
- line-height: 1.5;
1072
- }
1073
- .x-font-size--13 {
1074
- font-size: var(--x-size-base-13) !important;
1075
- line-height: 1.5;
1076
- }
1077
- .x-font-size--14 {
1078
- font-size: var(--x-size-base-14) !important;
1079
- line-height: 1.5;
1080
- }
1081
- .x-font-size--15 {
1082
- font-size: var(--x-size-base-15) !important;
1083
- line-height: 1.5;
1084
- }
1085
- .x-font-size--16 {
1086
- font-size: var(--x-size-base-16) !important;
1087
- line-height: 1.5;
1088
- }
1089
- .x-font-size--17 {
1090
- font-size: var(--x-size-base-17) !important;
1091
- line-height: 1.5;
1092
- }
1093
- .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-flex-1 {
1106
- flex: 1 1 0% !important;
1107
- }
1108
-
1109
- .x-flex-auto {
1110
- flex: 1 1 auto !important;
1111
- }
1112
-
1113
- .x-flex-initial {
1114
- flex: 0 1 auto !important;
1115
- }
1116
-
1117
- .x-flex-no-shrink {
1118
- flex: 1 0 auto !important;
1119
- }
1120
-
1121
- .x-flex-none {
1122
- flex: none !important;
1123
- }
1124
-
1125
- .x-self-auto {
1126
- align-self: auto !important;
1127
- }
1128
-
1129
- .x-self-start {
1130
- align-self: flex-start !important;
1131
- }
1132
-
1133
- .x-self-end {
1134
- align-self: flex-end !important;
1135
- }
1136
-
1137
- .x-self-center {
1138
- align-self: center !important;
1017
+ font-weight: var(--x-number-font-weight-base-light) !important;
1139
1018
  }
1140
-
1141
- .x-self-stretch {
1142
- align-self: stretch !important;
1019
+ .x-font-weight--regular {
1020
+ font-weight: var(--x-number-font-weight-base-regular) !important;
1143
1021
  }
1144
-
1145
- .x-self-baseline {
1146
- align-self: baseline !important;
1022
+ .x-font-weight--bold {
1023
+ font-weight: var(--x-number-font-weight-base-bold) !important;
1147
1024
  }
1148
1025
  .x-font-color--lead {
1149
1026
  color: var(--x-color-base-lead) !important;
@@ -1188,48 +1065,48 @@
1188
1065
  .x-font-color--transparent {
1189
1066
  color: var(--x-color-base-transparent) !important;
1190
1067
  }
1191
- .x-fill--lead {
1192
- fill: var(--x-color-base-lead) !important;
1068
+ .x-flex-1 {
1069
+ flex: 1 1 0% !important;
1193
1070
  }
1194
1071
 
1195
- .x-fill--auxiliary {
1196
- fill: var(--x-color-base-auxiliary) !important;
1072
+ .x-flex-auto {
1073
+ flex: 1 1 auto !important;
1197
1074
  }
1198
1075
 
1199
- .x-fill--neutral-10 {
1200
- fill: var(--x-color-base-neutral-10) !important;
1076
+ .x-flex-initial {
1077
+ flex: 0 1 auto !important;
1201
1078
  }
1202
1079
 
1203
- .x-fill--neutral-35 {
1204
- fill: var(--x-color-base-neutral-35) !important;
1080
+ .x-flex-no-shrink {
1081
+ flex: 1 0 auto !important;
1205
1082
  }
1206
1083
 
1207
- .x-fill--neutral-70 {
1208
- fill: var(--x-color-base-neutral-70) !important;
1084
+ .x-flex-none {
1085
+ flex: none !important;
1209
1086
  }
1210
1087
 
1211
- .x-fill--neutral-95 {
1212
- fill: var(--x-color-base-neutral-95) !important;
1088
+ .x-self-auto {
1089
+ align-self: auto !important;
1213
1090
  }
1214
1091
 
1215
- .x-fill--neutral-100 {
1216
- fill: var(--x-color-base-neutral-100) !important;
1092
+ .x-self-start {
1093
+ align-self: flex-start !important;
1217
1094
  }
1218
1095
 
1219
- .x-fill--accent {
1220
- fill: var(--x-color-base-accent) !important;
1096
+ .x-self-end {
1097
+ align-self: flex-end !important;
1221
1098
  }
1222
1099
 
1223
- .x-fill--enable {
1224
- fill: var(--x-color-base-enable) !important;
1100
+ .x-self-center {
1101
+ align-self: center !important;
1225
1102
  }
1226
1103
 
1227
- .x-fill--disable {
1228
- fill: var(--x-color-base-disable) !important;
1104
+ .x-self-stretch {
1105
+ align-self: stretch !important;
1229
1106
  }
1230
1107
 
1231
- .x-fill--transparent {
1232
- fill: var(--x-color-base-transparent) !important;
1108
+ .x-self-baseline {
1109
+ align-self: baseline !important;
1233
1110
  }
1234
1111
  /* Material Elevations extracted from:
1235
1112
  https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
@@ -1299,6 +1176,49 @@
1299
1176
  --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
1300
1177
  0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1301
1178
  }
1179
+ .x-fill--lead {
1180
+ fill: var(--x-color-base-lead) !important;
1181
+ }
1182
+
1183
+ .x-fill--auxiliary {
1184
+ fill: var(--x-color-base-auxiliary) !important;
1185
+ }
1186
+
1187
+ .x-fill--neutral-10 {
1188
+ fill: var(--x-color-base-neutral-10) !important;
1189
+ }
1190
+
1191
+ .x-fill--neutral-35 {
1192
+ fill: var(--x-color-base-neutral-35) !important;
1193
+ }
1194
+
1195
+ .x-fill--neutral-70 {
1196
+ fill: var(--x-color-base-neutral-70) !important;
1197
+ }
1198
+
1199
+ .x-fill--neutral-95 {
1200
+ fill: var(--x-color-base-neutral-95) !important;
1201
+ }
1202
+
1203
+ .x-fill--neutral-100 {
1204
+ fill: var(--x-color-base-neutral-100) !important;
1205
+ }
1206
+
1207
+ .x-fill--accent {
1208
+ fill: var(--x-color-base-accent) !important;
1209
+ }
1210
+
1211
+ .x-fill--enable {
1212
+ fill: var(--x-color-base-enable) !important;
1213
+ }
1214
+
1215
+ .x-fill--disable {
1216
+ fill: var(--x-color-base-disable) !important;
1217
+ }
1218
+
1219
+ .x-fill--transparent {
1220
+ fill: var(--x-color-base-transparent) !important;
1221
+ }
1302
1222
  /* Material Elevations extracted from:
1303
1223
  https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
1304
1224
  */
@@ -1432,6 +1352,86 @@
1432
1352
  .x-shadow--bottom-10 {
1433
1353
  box-shadow: var(--x-string-box-shadow-bottom-10) !important;
1434
1354
  }
1355
+ .x-font-size--01 {
1356
+ font-size: var(--x-size-base-01) !important;
1357
+ line-height: 1.5;
1358
+ }
1359
+ .x-font-size--02 {
1360
+ font-size: var(--x-size-base-02) !important;
1361
+ line-height: 1.5;
1362
+ }
1363
+ .x-font-size--03 {
1364
+ font-size: var(--x-size-base-03) !important;
1365
+ line-height: 1.5;
1366
+ }
1367
+ .x-font-size--04 {
1368
+ font-size: var(--x-size-base-04) !important;
1369
+ line-height: 1.5;
1370
+ }
1371
+ .x-font-size--05 {
1372
+ font-size: var(--x-size-base-05) !important;
1373
+ line-height: 1.5;
1374
+ }
1375
+ .x-font-size--06 {
1376
+ font-size: var(--x-size-base-06) !important;
1377
+ line-height: 1.5;
1378
+ }
1379
+ .x-font-size--07 {
1380
+ font-size: var(--x-size-base-07) !important;
1381
+ line-height: 1.5;
1382
+ }
1383
+ .x-font-size--08 {
1384
+ font-size: var(--x-size-base-08) !important;
1385
+ line-height: 1.5;
1386
+ }
1387
+ .x-font-size--09 {
1388
+ font-size: var(--x-size-base-09) !important;
1389
+ line-height: 1.5;
1390
+ }
1391
+ .x-font-size--10 {
1392
+ font-size: var(--x-size-base-10) !important;
1393
+ line-height: 1.5;
1394
+ }
1395
+ .x-font-size--11 {
1396
+ font-size: var(--x-size-base-11) !important;
1397
+ line-height: 1.5;
1398
+ }
1399
+ .x-font-size--12 {
1400
+ font-size: var(--x-size-base-12) !important;
1401
+ line-height: 1.5;
1402
+ }
1403
+ .x-font-size--13 {
1404
+ font-size: var(--x-size-base-13) !important;
1405
+ line-height: 1.5;
1406
+ }
1407
+ .x-font-size--14 {
1408
+ font-size: var(--x-size-base-14) !important;
1409
+ line-height: 1.5;
1410
+ }
1411
+ .x-font-size--15 {
1412
+ font-size: var(--x-size-base-15) !important;
1413
+ line-height: 1.5;
1414
+ }
1415
+ .x-font-size--16 {
1416
+ font-size: var(--x-size-base-16) !important;
1417
+ line-height: 1.5;
1418
+ }
1419
+ .x-font-size--17 {
1420
+ font-size: var(--x-size-base-17) !important;
1421
+ line-height: 1.5;
1422
+ }
1423
+ .x-font-size--18 {
1424
+ font-size: var(--x-size-base-18) !important;
1425
+ line-height: 1.5;
1426
+ }
1427
+ .x-font-size--19 {
1428
+ font-size: var(--x-size-base-19) !important;
1429
+ line-height: 1.5;
1430
+ }
1431
+ .x-font-size--20 {
1432
+ font-size: var(--x-size-base-20) !important;
1433
+ line-height: 1.5;
1434
+ }
1435
1435
  *[class*=x-border-width--] {
1436
1436
  border-width: 0;
1437
1437
  }
@@ -3317,6 +3317,21 @@
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
+ }
3320
3335
  .x-background--lead {
3321
3336
  background-color: var(--x-color-base-lead) !important;
3322
3337
  }
@@ -3360,27 +3375,12 @@
3360
3375
  .x-background--transparent {
3361
3376
  background-color: var(--x-color-base-transparent) !important;
3362
3377
  }
3363
- .x-text--stroke.x-text {
3364
- --x-string-text-decoration: line-through;
3365
- }
3366
- .x-text--stroke.x-title1 {
3367
- --x-string-text-decoration-title1: line-through;
3368
- }
3369
- .x-text--stroke.x-title2 {
3370
- --x-string-text-decoration-title2: line-through;
3371
- }
3372
- .x-text--stroke.x-title3 {
3373
- --x-string-text-decoration-title3: line-through;
3374
- }
3375
- .x-text--stroke.x-small {
3376
- --x-string-text-decoration-small: line-through;
3378
+ .x-text--secondary {
3379
+ --x-color-text-default: var(--x-color-text-secondary);
3377
3380
  }
3378
3381
  :root {
3379
3382
  --x-color-text-secondary: var(--x-color-base-neutral-35);
3380
3383
  }
3381
- .x-text--secondary {
3382
- --x-color-text-default: var(--x-color-text-secondary);
3383
- }
3384
3384
  .x-text--light.x-text {
3385
3385
  --x-number-font-weight-text: var(--x-number-font-weight-base-light);
3386
3386
  }
@@ -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
  }
@@ -3916,7 +3916,48 @@
3916
3916
  --x-size-border-radius-bottom-right-tag-default: var(
3917
3917
  --x-size-border-radius-bottom-right-tag-card
3918
3918
  );
3919
- --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-card);
3919
+ --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-card);
3920
+ }
3921
+ :root {
3922
+ --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
3923
+ --x-color-text-suggestion-group-matching-part-default: var(
3924
+ --x-color-text-suggestion-matching-part-default
3925
+ );
3926
+ --x-color-background-suggestion-group-default: var(--x-color-background-suggestion-default);
3927
+ --x-color-border-suggestion-group-default: var(--x-color-text-suggestion-group-default);
3928
+ --x-size-padding-top-suggestion-group-default: var(--x-size-padding-top-suggestion-default);
3929
+ --x-size-padding-right-suggestion-group-default: var(--x-size-padding-right-suggestion-default);
3930
+ --x-size-padding-bottom-suggestion-group-default: var(--x-size-padding-bottom-suggestion-default);
3931
+ --x-size-padding-left-suggestion-group-default: var(--x-size-padding-left-suggestion-default);
3932
+ --x-size-gap-suggestion-group-default: var(--x-size-gap-suggestion-default);
3933
+ --x-size-border-width-suggestion-group-default: 0;
3934
+ --x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-suggestion-default);
3935
+ --x-size-border-width-right-suggestion-group-default: var(
3936
+ --x-size-border-width-suggestion-default
3937
+ );
3938
+ --x-size-border-width-bottom-suggestion-group-default: var(
3939
+ --x-size-border-width-suggestion-default
3940
+ );
3941
+ --x-size-border-width-left-suggestion-group-default: var(
3942
+ --x-size-border-width-suggestion-default
3943
+ );
3944
+ --x-size-border-radius-suggestion-group-default: var(--x-size-border-radius-base-none);
3945
+ --x-size-border-radius-top-left-suggestion-group-default: var(
3946
+ --x-size-border-radius-suggestion-default
3947
+ );
3948
+ --x-size-border-radius-top-right-suggestion-group-default: var(
3949
+ --x-size-border-radius-suggestion-default
3950
+ );
3951
+ --x-size-border-radius-bottom-right-suggestion-group-default: var(
3952
+ --x-size-border-radius-suggestion-default
3953
+ );
3954
+ --x-size-border-radius-bottom-left-suggestion-group-default: var(
3955
+ --x-size-border-radius-suggestion-default
3956
+ );
3957
+ --x-font-family-suggestion-group-default: var(--x-font-family-suggestion-default);
3958
+ --x-size-font-suggestion-group-default: var(--x-size-font-suggestion-default);
3959
+ --x-size-line-height-suggestion-group-default: var(--x-size-line-height-suggestion-default);
3960
+ --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-suggestion-default);
3920
3961
  }
3921
3962
  :root {
3922
3963
  --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
@@ -4034,47 +4075,6 @@
4034
4075
  --x-size-padding-left-button-default: 0;
4035
4076
  border: none;
4036
4077
  }
4037
- :root {
4038
- --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
4039
- --x-color-text-suggestion-group-matching-part-default: var(
4040
- --x-color-text-suggestion-matching-part-default
4041
- );
4042
- --x-color-background-suggestion-group-default: var(--x-color-background-suggestion-default);
4043
- --x-color-border-suggestion-group-default: var(--x-color-text-suggestion-group-default);
4044
- --x-size-padding-top-suggestion-group-default: var(--x-size-padding-top-suggestion-default);
4045
- --x-size-padding-right-suggestion-group-default: var(--x-size-padding-right-suggestion-default);
4046
- --x-size-padding-bottom-suggestion-group-default: var(--x-size-padding-bottom-suggestion-default);
4047
- --x-size-padding-left-suggestion-group-default: var(--x-size-padding-left-suggestion-default);
4048
- --x-size-gap-suggestion-group-default: var(--x-size-gap-suggestion-default);
4049
- --x-size-border-width-suggestion-group-default: 0;
4050
- --x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-suggestion-default);
4051
- --x-size-border-width-right-suggestion-group-default: var(
4052
- --x-size-border-width-suggestion-default
4053
- );
4054
- --x-size-border-width-bottom-suggestion-group-default: var(
4055
- --x-size-border-width-suggestion-default
4056
- );
4057
- --x-size-border-width-left-suggestion-group-default: var(
4058
- --x-size-border-width-suggestion-default
4059
- );
4060
- --x-size-border-radius-suggestion-group-default: var(--x-size-border-radius-base-none);
4061
- --x-size-border-radius-top-left-suggestion-group-default: var(
4062
- --x-size-border-radius-suggestion-default
4063
- );
4064
- --x-size-border-radius-top-right-suggestion-group-default: var(
4065
- --x-size-border-radius-suggestion-default
4066
- );
4067
- --x-size-border-radius-bottom-right-suggestion-group-default: var(
4068
- --x-size-border-radius-suggestion-default
4069
- );
4070
- --x-size-border-radius-bottom-left-suggestion-group-default: var(
4071
- --x-size-border-radius-suggestion-default
4072
- );
4073
- --x-font-family-suggestion-group-default: var(--x-font-family-suggestion-default);
4074
- --x-size-font-suggestion-group-default: var(--x-size-font-suggestion-default);
4075
- --x-size-line-height-suggestion-group-default: var(--x-size-line-height-suggestion-default);
4076
- --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-suggestion-default);
4077
- }
4078
4078
  :root {
4079
4079
  --x-string-align-items-suggestion-default: center;
4080
4080
  --x-color-text-suggestion-default: var(--x-color-text-default);
@@ -4165,6 +4165,66 @@
4165
4165
  --x-number-font-weight-suggestion-default-matching
4166
4166
  );
4167
4167
  }
4168
+ :root {
4169
+ --x-color-background-sliding-panel: var(--x-color-base-neutral-100);
4170
+ --x-size-width-sliding-panel-gradient: var(--x-size-base-09);
4171
+ --x-size-padding-sliding-panel-button: var(--x-size-base-03);
4172
+ --x-size-horizontal-margin-sliding-panel-button-overflow: var(--x-size-base-02);
4173
+ }
4174
+ .x-sliding-panel {
4175
+ z-index: 0;
4176
+ background-color: var(--x-color-background-sliding-panel);
4177
+ }
4178
+ .x-sliding-panel__button.x-button {
4179
+ --x-size-padding-button: var(--x-size-padding-sliding-panel-button);
4180
+ pointer-events: none;
4181
+ }
4182
+ .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel__button {
4183
+ pointer-events: all;
4184
+ }
4185
+ .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-left {
4186
+ transform: translateX(calc(-100% - var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
4187
+ }
4188
+ .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-right {
4189
+ transform: translateX(calc(100% + var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
4190
+ }
4191
+ .x-sliding-panel.x-sliding-panel--show-buttons-on-hover .x-sliding-panel__button {
4192
+ opacity: 0;
4193
+ }
4194
+ .x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-start):hover .x-sliding-panel-button-left {
4195
+ opacity: 1;
4196
+ pointer-events: all;
4197
+ }
4198
+ .x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-end):hover .x-sliding-panel-button-right {
4199
+ opacity: 1;
4200
+ pointer-events: all;
4201
+ }
4202
+ .x-sliding-panel:not(.x-sliding-panel--no-gradient) .x-sliding-panel__scroll {
4203
+ mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient), rgba(0, 0, 0, 0.8) calc(100% - 0.67 * var(--x-size-width-sliding-panel-gradient)), transparent calc(100% - 0.43 * var(--x-size-width-sliding-panel-gradient)));
4204
+ }
4205
+ .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start .x-sliding-panel__scroll {
4206
+ mask: linear-gradient(to left, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
4207
+ }
4208
+ .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-end .x-sliding-panel__scroll {
4209
+ mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
4210
+ }
4211
+ .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start.x-sliding-panel-at-end .x-sliding-panel__scroll {
4212
+ mask: none;
4213
+ }
4214
+ .x-sliding-panel__scroll > * {
4215
+ flex: 0 0 auto;
4216
+ }
4217
+ .x-sliding-panel__scroll > .x-list {
4218
+ --x-string-flow-list: row nowrap;
4219
+ }
4220
+ .x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-start) .x-sliding-panel-button-left {
4221
+ opacity: 1;
4222
+ pointer-events: all;
4223
+ }
4224
+ .x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-end) .x-sliding-panel-button-right {
4225
+ opacity: 1;
4226
+ pointer-events: all;
4227
+ }
4168
4228
  :root {
4169
4229
  --x-string-align-items-suggestion-default: center;
4170
4230
  --x-color-text-suggestion-default: var(--x-color-text-default);
@@ -4387,66 +4447,6 @@
4387
4447
  --x-color-text-suggestion-default-matching-curated
4388
4448
  );
4389
4449
  }
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
- .x-sliding-panel {
4397
- z-index: 0;
4398
- background-color: var(--x-color-background-sliding-panel);
4399
- }
4400
- .x-sliding-panel__button.x-button {
4401
- --x-size-padding-button: var(--x-size-padding-sliding-panel-button);
4402
- pointer-events: none;
4403
- }
4404
- .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel__button {
4405
- pointer-events: all;
4406
- }
4407
- .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-left {
4408
- transform: translateX(calc(-100% - var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
4409
- }
4410
- .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-right {
4411
- transform: translateX(calc(100% + var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
4412
- }
4413
- .x-sliding-panel.x-sliding-panel--show-buttons-on-hover .x-sliding-panel__button {
4414
- opacity: 0;
4415
- }
4416
- .x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-start):hover .x-sliding-panel-button-left {
4417
- opacity: 1;
4418
- pointer-events: all;
4419
- }
4420
- .x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-end):hover .x-sliding-panel-button-right {
4421
- opacity: 1;
4422
- pointer-events: all;
4423
- }
4424
- .x-sliding-panel:not(.x-sliding-panel--no-gradient) .x-sliding-panel__scroll {
4425
- mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient), rgba(0, 0, 0, 0.8) calc(100% - 0.67 * var(--x-size-width-sliding-panel-gradient)), transparent calc(100% - 0.43 * var(--x-size-width-sliding-panel-gradient)));
4426
- }
4427
- .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start .x-sliding-panel__scroll {
4428
- mask: linear-gradient(to left, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
4429
- }
4430
- .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-end .x-sliding-panel__scroll {
4431
- mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
4432
- }
4433
- .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start.x-sliding-panel-at-end .x-sliding-panel__scroll {
4434
- mask: none;
4435
- }
4436
- .x-sliding-panel__scroll > * {
4437
- flex: 0 0 auto;
4438
- }
4439
- .x-sliding-panel__scroll > .x-list {
4440
- --x-string-flow-list: row nowrap;
4441
- }
4442
- .x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-start) .x-sliding-panel-button-left {
4443
- opacity: 1;
4444
- pointer-events: all;
4445
- }
4446
- .x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-end) .x-sliding-panel-button-right {
4447
- opacity: 1;
4448
- pointer-events: all;
4449
- }
4450
4450
  :root {
4451
4451
  --x-string-overflow-scroll: auto;
4452
4452
  --x-color-background-scroll-bar: transparent;
@@ -4939,14 +4939,6 @@
4939
4939
  :root {
4940
4940
  --x-number-aspect-ratio-picture: 1;
4941
4941
  }
4942
- :root {
4943
- --x-number-aspect-ratio-picture: 1;
4944
- }
4945
-
4946
- .x-picture--fixed-ratio.x-picture {
4947
- aspect-ratio: var(--x-number-aspect-ratio-picture);
4948
- width: 100%;
4949
- }
4950
4942
  :root {
4951
4943
  --x-size-border-radius-picture-default: 0;
4952
4944
  --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
@@ -5022,29 +5014,17 @@
5022
5014
  fill: var(--x-color-fill-picture-placeholder-path-default) !important;
5023
5015
  }
5024
5016
  :root {
5025
- --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
5026
- --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
5017
+ --x-number-aspect-ratio-picture: 1;
5018
+ }
5019
+
5020
+ .x-picture--fixed-ratio.x-picture {
5021
+ aspect-ratio: var(--x-number-aspect-ratio-picture);
5022
+ width: 100%;
5027
5023
  }
5028
5024
  :root {
5029
5025
  --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
5030
5026
  --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
5031
5027
  }
5032
-
5033
- .x-picture--cover.x-picture {
5034
- position: relative;
5035
- }
5036
-
5037
- .x-result:hover .x-picture--cover:after,
5038
- .x-picture--cover:hover:after {
5039
- content: "";
5040
- display: block;
5041
- position: absolute;
5042
- top: 0;
5043
- left: 0;
5044
- background: linear-gradient(to bottom, var(--x-color-background-picture-cover-hover-from) 50%, var(--x-color-background-picture-cover-hover-to) 100%);
5045
- width: 100%;
5046
- height: 100%;
5047
- }
5048
5028
  :root {
5049
5029
  --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5050
5030
  --x-mix-blend-mode-picture-colored: multiply;
@@ -5071,26 +5051,31 @@
5071
5051
  --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-placeholder-colored);
5072
5052
  }
5073
5053
  :root {
5074
- --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5075
- --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5076
- --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5077
- --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5078
- --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5054
+ --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
5055
+ --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
5056
+ }
5057
+
5058
+ .x-picture--cover.x-picture {
5059
+ position: relative;
5060
+ }
5061
+
5062
+ .x-result:hover .x-picture--cover:after,
5063
+ .x-picture--cover:hover:after {
5064
+ content: "";
5065
+ display: block;
5066
+ position: absolute;
5067
+ top: 0;
5068
+ left: 0;
5069
+ background: linear-gradient(to bottom, var(--x-color-background-picture-cover-hover-from) 50%, var(--x-color-background-picture-cover-hover-to) 100%);
5070
+ width: 100%;
5071
+ height: 100%;
5079
5072
  }
5080
5073
  :root {
5081
5074
  --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5082
5075
  --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5083
- --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5084
- --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5085
- --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5086
- }
5087
-
5088
- .x-picture--card.x-picture {
5089
- --x-size-border-radius-picture-default: var(--x-size-border-radius-picture-card);
5090
- --x-size-border-radius-top-picture-default: var(--x-size-border-radius-top-picture-card);
5091
- --x-size-border-radius-right-picture-default: var(--x-size-border-radius-right-picture-card);
5092
- --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-bottom-picture-card);
5093
- --x-size-border-radius-left-picture-default: var(--x-size-border-radius-left-picture-card);
5076
+ --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5077
+ --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5078
+ --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5094
5079
  }
5095
5080
  :root {
5096
5081
  --x-color-background-option-list-button-default: transparent;
@@ -5365,49 +5350,19 @@
5365
5350
  text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5366
5351
  }
5367
5352
  :root {
5368
- --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5369
- --x-color-text-option-list-button-bottom-selected-hover: var(
5370
- --x-color-text-option-list-button-bottom-selected
5371
- );
5372
- --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
5373
- --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
5374
- --x-color-border-option-list-item-bottom: transparent;
5375
- --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5376
- --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5377
- --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5378
- --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5379
- --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
5380
- --x-color-border-top-option-list-item-bottom-selected: var(
5381
- --x-color-border-option-list-item-bottom
5382
- );
5383
- --x-color-border-right-option-list-item-bottom-selected: var(
5384
- --x-color-border-option-list-item-bottom
5385
- );
5386
- --x-color-border-bottom-option-list-item-bottom-selected: var(
5387
- --x-color-border-option-list-item-bottom-selected
5388
- );
5389
- --x-color-border-left-option-list-item-bottom-selected: var(
5390
- --x-color-border-option-list-item-bottom
5391
- );
5392
- --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
5393
- --x-size-border-width-top-option-list-item-bottom: 0;
5394
- --x-size-border-width-right-option-list-item-bottom: 0;
5395
- --x-size-border-width-bottom-option-list-item-bottom: var(
5396
- --x-size-border-width-option-list-item-bottom
5397
- );
5398
- --x-size-border-width-left-option-list-item-bottom: 0;
5399
- --x-size-border-width-top-option-list-item-bottom-selected: 0;
5400
- --x-size-border-width-right-option-list-item-bottom-selected: 0;
5401
- --x-size-border-width-bottom-option-list-item-bottom-selected: var(
5402
- --x-size-border-width-option-list-item-bottom
5403
- );
5404
- --x-size-border-width-left-option-list-item-bottom-selected: 0;
5405
- --x-size-font-option-list-button-bottom: var(--x-size-font-text);
5406
- --x-font-decoration-option-list-button-bottom-hover: none;
5407
- --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
5408
- --x-number-font-weight-option-list-button-bottom-selected: var(
5409
- --x-number-font-weight-base-regular
5410
- );
5353
+ --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5354
+ --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5355
+ --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5356
+ --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5357
+ --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5358
+ }
5359
+
5360
+ .x-picture--card.x-picture {
5361
+ --x-size-border-radius-picture-default: var(--x-size-border-radius-picture-card);
5362
+ --x-size-border-radius-top-picture-default: var(--x-size-border-radius-top-picture-card);
5363
+ --x-size-border-radius-right-picture-default: var(--x-size-border-radius-right-picture-card);
5364
+ --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-bottom-picture-card);
5365
+ --x-size-border-radius-left-picture-default: var(--x-size-border-radius-left-picture-card);
5411
5366
  }
5412
5367
  :root {
5413
5368
  --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
@@ -5454,96 +5409,6 @@
5454
5409
  --x-number-font-weight-base-regular
5455
5410
  );
5456
5411
  }
5457
-
5458
- .x-option-list--bottom.x-option-list,
5459
- .x-option-list--bottom .x-option-list {
5460
- --x-color-text-option-list-button-default: var(--x-color-text-option-list-button-bottom);
5461
- --x-color-text-option-list-button-default-hover: var(
5462
- --x-color-text-option-list-button-bottom-hover
5463
- );
5464
- --x-color-border-option-list-item-default: var(--x-color-border-option-list-item-bottom);
5465
- --x-color-border-top-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
5466
- --x-color-border-right-option-list-item-default: var(
5467
- --x-color-border-top-option-list-item-bottom
5468
- );
5469
- --x-color-border-bottom-option-list-item-default: var(
5470
- --x-color-border-top-option-list-item-bottom
5471
- );
5472
- --x-color-border-left-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
5473
- --x-size-border-width-option-list-item-default: var(
5474
- --x-size-border-width-option-list-item-bottom
5475
- );
5476
- --x-size-border-width-top-option-list-item-default: var(
5477
- --x-size-border-width-top-option-list-item-bottom
5478
- );
5479
- --x-size-border-width-right-option-list-item-default: var(
5480
- --x-size-border-width-right-option-list-item-bottom
5481
- );
5482
- --x-size-border-width-bottom-option-list-item-default: var(
5483
- --x-size-border-width-bottom-option-list-item-bottom
5484
- );
5485
- --x-size-border-width-left-option-list-item-default: var(
5486
- --x-size-border-width-left-option-list-item-bottom
5487
- );
5488
- --x-font-decoration-option-list-button-default-hover: var(
5489
- --x-font-decoration-option-list-button-bottom-hover
5490
- );
5491
- --x-size-font-option-list-button-default: var(--x-size-font-option-list-button-bottom);
5492
- --x-number-font-weight-option-list-button-default: var(
5493
- --x-number-font-weight-option-list-button-bottom
5494
- );
5495
- }
5496
- .x-option-list--bottom.x-option-list .x-option-list__item.x-option-list__item--is-selected,
5497
- .x-option-list--bottom .x-option-list .x-option-list__item.x-option-list__item--is-selected {
5498
- --x-color-text-option-list-button-default-selected: var(
5499
- --x-color-text-option-list-button-bottom-selected
5500
- );
5501
- --x-color-text-option-list-button-default-selected-hover: var(
5502
- --x-color-text-option-list-button-bottom-selected-hover
5503
- );
5504
- --x-color-border-option-list-item-default-selected: var(
5505
- --x-color-border-option-list-item-bottom-selected
5506
- );
5507
- --x-color-border-top-option-list-item-default-selected: var(
5508
- --x-color-border-top-option-list-item-bottom-selected
5509
- );
5510
- --x-color-border-right-option-list-item-default-selected: var(
5511
- --x-color-border-top-option-list-item-bottom-selected
5512
- );
5513
- --x-color-border-bottom-option-list-item-default-selected: var(
5514
- --x-color-border-bottom-option-list-item-bottom-selected
5515
- );
5516
- --x-color-border-left-option-list-item-default-selected: var(
5517
- --x-color-border-top-option-list-item-bottom-selected
5518
- );
5519
- --x-size-border-width-top-option-list-item-default: var(
5520
- --x-size-border-width-top-option-list-item-bottom-selected
5521
- );
5522
- --x-size-border-width-right-option-list-item-default: var(
5523
- --x-size-border-width-right-option-list-item-bottom-selected
5524
- );
5525
- --x-size-border-width-bottom-option-list-item-default: var(
5526
- --x-size-border-width-bottom-option-list-item-bottom-selected
5527
- );
5528
- --x-size-border-width-left-option-list-item-default: var(
5529
- --x-size-border-width-left-option-list-item-bottom-selected
5530
- );
5531
- --x-number-font-weight-option-list-button-default-selected: var(
5532
- --x-number-font-weight-option-list-button-bottom-selected
5533
- );
5534
- }
5535
- .x-option-list--bottom.x-option-list .x-option-list__item:last-child,
5536
- .x-option-list--bottom .x-option-list .x-option-list__item:last-child {
5537
- --x-size-border-width-option-list-item-default: inherit;
5538
- --x-size-border-width-top-option-list-item-default: inherit;
5539
- --x-size-border-width-right-option-list-item-default: inherit;
5540
- --x-size-border-width-bottom-option-list-item-default: inherit;
5541
- --x-size-border-width-left-option-list-item-default: inherit;
5542
- }
5543
- :root {
5544
- --x-modal-overlay-color: rgb(0, 0, 0);
5545
- --x-modal-overlay-opacity: 0.7;
5546
- }
5547
5412
  :root {
5548
5413
  --x-modal-overlay-color: rgb(0, 0, 0);
5549
5414
  --x-modal-overlay-opacity: 0.7;
@@ -5574,6 +5439,10 @@
5574
5439
  --x-size-font-message-default: var(--x-size-font-title3);
5575
5440
  --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5576
5441
  }
5442
+ :root {
5443
+ --x-modal-overlay-color: rgb(0, 0, 0);
5444
+ --x-modal-overlay-opacity: 0.7;
5445
+ }
5577
5446
  :root {
5578
5447
  --x-string-justify-message-default: center;
5579
5448
  --x-size-gap-message-default: var(--x-size-base-03);
@@ -5661,22 +5530,6 @@
5661
5530
  --x-size-padding-list-12: var(--x-size-base-12);
5662
5531
  --x-size-padding-list-13: var(--x-size-base-13);
5663
5532
  }
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
5533
 
5681
5534
  /* @deprecated */
5682
5535
  [class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-right) {
@@ -6001,6 +5854,22 @@
6001
5854
  margin-right: var(--x-size-gap-list-13);
6002
5855
  }
6003
5856
  }
5857
+ /* @deprecated */
5858
+ :root {
5859
+ --x-size-padding-list-01: var(--x-size-base-01);
5860
+ --x-size-padding-list-02: var(--x-size-base-02);
5861
+ --x-size-padding-list-03: var(--x-size-base-03);
5862
+ --x-size-padding-list-04: var(--x-size-base-04);
5863
+ --x-size-padding-list-05: var(--x-size-base-05);
5864
+ --x-size-padding-list-06: var(--x-size-base-06);
5865
+ --x-size-padding-list-07: var(--x-size-base-07);
5866
+ --x-size-padding-list-08: var(--x-size-base-08);
5867
+ --x-size-padding-list-09: var(--x-size-base-09);
5868
+ --x-size-padding-list-10: var(--x-size-base-10);
5869
+ --x-size-padding-list-11: var(--x-size-base-11);
5870
+ --x-size-padding-list-12: var(--x-size-base-12);
5871
+ --x-size-padding-list-13: var(--x-size-base-13);
5872
+ }
6004
5873
  :root {
6005
5874
  --x-size-gap-list-01: var(--x-size-base-01);
6006
5875
  --x-size-gap-list-02: var(--x-size-base-02);
@@ -6179,50 +6048,6 @@
6179
6048
  .x-list > .x-list__item--12 {
6180
6049
  flex: 12 1 auto;
6181
6050
  }
6182
- :root {
6183
- --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
6184
- --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6185
- --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
6186
- --x-size-border-radius-bottom-right-input-group-pill: var(
6187
- --x-size-border-radius-input-group-pill
6188
- );
6189
- --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6190
- }
6191
- :root {
6192
- --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
6193
- --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6194
- --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
6195
- --x-size-border-radius-bottom-right-input-group-pill: var(
6196
- --x-size-border-radius-input-group-pill
6197
- );
6198
- --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6199
- }
6200
-
6201
- .x-input-group--pill.x-input-group,
6202
- .x-input-group--pill .x-input-group {
6203
- --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-pill);
6204
- --x-size-border-radius-top-left-input-group-default: var(
6205
- --x-size-border-radius-top-left-input-group-pill
6206
- );
6207
- --x-size-border-radius-top-right-input-group-default: var(
6208
- --x-size-border-radius-top-right-input-group-pill
6209
- );
6210
- --x-size-border-radius-bottom-right-input-group-default: var(
6211
- --x-size-border-radius-bottom-right-input-group-pill
6212
- );
6213
- --x-size-border-radius-bottom-left-input-group-default: var(
6214
- --x-size-border-radius-bottom-left-input-group-pill
6215
- );
6216
- }
6217
- :root {
6218
- --x-size-padding-left-input-group-line: 0;
6219
- --x-size-padding-right-input-group-line: 0;
6220
- --x-size-border-width-input-group-line: var(--x-size-border-width-input-group-default);
6221
- --x-size-border-width-top-input-group-line: 0;
6222
- --x-size-border-width-right-input-group-line: 0;
6223
- --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6224
- --x-size-border-width-left-input-group-line: 0;
6225
- }
6226
6051
  :root {
6227
6052
  --x-size-gap-list-01: var(--x-size-base-01);
6228
6053
  --x-size-gap-list-02: var(--x-size-base-02);
@@ -6745,6 +6570,24 @@
6745
6570
  margin-bottom: var(--x-size-gap-list-20);
6746
6571
  }
6747
6572
  }
6573
+ :root {
6574
+ --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
6575
+ --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6576
+ --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
6577
+ --x-size-border-radius-bottom-right-input-group-pill: var(
6578
+ --x-size-border-radius-input-group-pill
6579
+ );
6580
+ --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6581
+ }
6582
+ :root {
6583
+ --x-size-padding-left-input-group-line: 0;
6584
+ --x-size-padding-right-input-group-line: 0;
6585
+ --x-size-border-width-input-group-line: var(--x-size-border-width-input-group-default);
6586
+ --x-size-border-width-top-input-group-line: 0;
6587
+ --x-size-border-width-right-input-group-line: 0;
6588
+ --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6589
+ --x-size-border-width-left-input-group-line: 0;
6590
+ }
6748
6591
  :root {
6749
6592
  --x-size-padding-left-input-group-line: 0;
6750
6593
  --x-size-padding-right-input-group-line: 0;
@@ -6792,6 +6635,32 @@
6792
6635
  margin-top: calc(var(--x-size-border-width-top-input-group-line) * -1) !important;
6793
6636
  margin-bottom: calc(var(--x-size-border-width-bottom-input-group-line) * -1) !important;
6794
6637
  }
6638
+ :root {
6639
+ --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
6640
+ --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6641
+ --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
6642
+ --x-size-border-radius-bottom-right-input-group-pill: var(
6643
+ --x-size-border-radius-input-group-pill
6644
+ );
6645
+ --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6646
+ }
6647
+
6648
+ .x-input-group--pill.x-input-group,
6649
+ .x-input-group--pill .x-input-group {
6650
+ --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-pill);
6651
+ --x-size-border-radius-top-left-input-group-default: var(
6652
+ --x-size-border-radius-top-left-input-group-pill
6653
+ );
6654
+ --x-size-border-radius-top-right-input-group-default: var(
6655
+ --x-size-border-radius-top-right-input-group-pill
6656
+ );
6657
+ --x-size-border-radius-bottom-right-input-group-default: var(
6658
+ --x-size-border-radius-bottom-right-input-group-pill
6659
+ );
6660
+ --x-size-border-radius-bottom-left-input-group-default: var(
6661
+ --x-size-border-radius-bottom-left-input-group-pill
6662
+ );
6663
+ }
6795
6664
  :root {
6796
6665
  --x-color-background-input-group-default: var(--x-color-background-input-default);
6797
6666
  --x-color-border-input-group-default: var(--x-color-border-input-default);
@@ -6835,6 +6704,15 @@
6835
6704
  );
6836
6705
  --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6837
6706
  }
6707
+ :root {
6708
+ --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
6709
+ --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
6710
+ --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
6711
+ --x-size-border-radius-bottom-right-input-group-card: var(
6712
+ --x-size-border-radius-input-group-card
6713
+ );
6714
+ --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
6715
+ }
6838
6716
  :root {
6839
6717
  --x-color-background-input-group-default: var(--x-color-background-input-default);
6840
6718
  --x-color-border-input-group-default: var(--x-color-border-input-default);
@@ -7021,15 +6899,6 @@
7021
6899
  );
7022
6900
  --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
7023
6901
  }
7024
- :root {
7025
- --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
7026
- --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
7027
- --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
7028
- --x-size-border-radius-bottom-right-input-group-card: var(
7029
- --x-size-border-radius-input-group-card
7030
- );
7031
- --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
7032
- }
7033
6902
 
7034
6903
  .x-input-group--card.x-input-group,
7035
6904
  .x-input-group--card .x-input-group {
@@ -7064,13 +6933,6 @@
7064
6933
  --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7065
6934
  --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7066
6935
  }
7067
- :root {
7068
- --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7069
- --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7070
- --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7071
- --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7072
- --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7073
- }
7074
6936
 
7075
6937
  .x-input--pill.x-input,
7076
6938
  .x-input--pill .x-input {
@@ -7090,6 +6952,13 @@
7090
6952
  --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7091
6953
  --x-size-border-width-left-input-line: 0;
7092
6954
  }
6955
+ :root {
6956
+ --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
6957
+ --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
6958
+ --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
6959
+ --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
6960
+ --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
6961
+ }
7093
6962
  :root {
7094
6963
  --x-size-padding-top-input-line: var(--x-size-base-03);
7095
6964
  --x-size-padding-right-input-line: 0;
@@ -7140,34 +7009,6 @@
7140
7009
  --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
7141
7010
  --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
7142
7011
  }
7143
- :root {
7144
- --x-color-background-input-default: var(--x-color-base-neutral-100);
7145
- --x-color-border-input-default: var(--x-color-base-neutral-70);
7146
- --x-color-border-input-default-focus: var(--x-color-base-lead);
7147
- --x-color-text-input-default: var(--x-color-text-default);
7148
- --x-color-text-input-placeholder-default: var(--x-color-base-neutral-35);
7149
- --x-size-border-width-input-default: var(--x-size-border-width-base);
7150
- --x-size-border-width-top-input-default: var(--x-size-border-width-input-default);
7151
- --x-size-border-width-right-input-default: var(--x-size-border-width-input-default);
7152
- --x-size-border-width-bottom-input-default: var(--x-size-border-width-input-default);
7153
- --x-size-border-width-left-input-default: var(--x-size-border-width-input-default);
7154
- --x-size-border-radius-input-default: var(--x-size-border-radius-base-none);
7155
- --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-default);
7156
- --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-default);
7157
- --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-default);
7158
- --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-default);
7159
- --x-size-height-input-default: var(--x-size-base-07);
7160
- --x-size-padding-right-input-default: var(--x-size-base-04);
7161
- --x-size-padding-left-input-default: var(--x-size-base-04);
7162
- --x-font-family-input-default: var(--x-font-family-text);
7163
- --x-size-font-input-default: var(--x-size-font-text);
7164
- --x-size-line-height-input-default: var(--x-size-line-height-text);
7165
- --x-number-font-weight-input-default: var(--x-number-font-weight-text);
7166
- --x-font-family-input-placeholder-default: var(--x-font-family-input-default);
7167
- --x-size-font-input-placeholder-default: var(--x-size-font-input-default);
7168
- --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
7169
- --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
7170
- }
7171
7012
 
7172
7013
  [dir="ltr"] .x-input {
7173
7014
  padding-left: var(--x-size-padding-left-input-default);
@@ -7255,6 +7096,34 @@
7255
7096
  --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7256
7097
  --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7257
7098
  }
7099
+ :root {
7100
+ --x-color-background-input-default: var(--x-color-base-neutral-100);
7101
+ --x-color-border-input-default: var(--x-color-base-neutral-70);
7102
+ --x-color-border-input-default-focus: var(--x-color-base-lead);
7103
+ --x-color-text-input-default: var(--x-color-text-default);
7104
+ --x-color-text-input-placeholder-default: var(--x-color-base-neutral-35);
7105
+ --x-size-border-width-input-default: var(--x-size-border-width-base);
7106
+ --x-size-border-width-top-input-default: var(--x-size-border-width-input-default);
7107
+ --x-size-border-width-right-input-default: var(--x-size-border-width-input-default);
7108
+ --x-size-border-width-bottom-input-default: var(--x-size-border-width-input-default);
7109
+ --x-size-border-width-left-input-default: var(--x-size-border-width-input-default);
7110
+ --x-size-border-radius-input-default: var(--x-size-border-radius-base-none);
7111
+ --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-default);
7112
+ --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-default);
7113
+ --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-default);
7114
+ --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-default);
7115
+ --x-size-height-input-default: var(--x-size-base-07);
7116
+ --x-size-padding-right-input-default: var(--x-size-base-04);
7117
+ --x-size-padding-left-input-default: var(--x-size-base-04);
7118
+ --x-font-family-input-default: var(--x-font-family-text);
7119
+ --x-size-font-input-default: var(--x-size-font-text);
7120
+ --x-size-line-height-input-default: var(--x-size-line-height-text);
7121
+ --x-number-font-weight-input-default: var(--x-number-font-weight-text);
7122
+ --x-font-family-input-placeholder-default: var(--x-font-family-input-default);
7123
+ --x-size-font-input-placeholder-default: var(--x-size-font-input-default);
7124
+ --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
7125
+ --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
7126
+ }
7258
7127
  :root {
7259
7128
  --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7260
7129
  --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
@@ -7279,28 +7148,150 @@
7279
7148
  --x-size-width-icon-xl: var(--x-size-base-07);
7280
7149
  --x-size-height-icon-xl: var(--x-size-base-07);
7281
7150
  }
7282
- :root {
7283
- --x-size-width-icon-xl: var(--x-size-base-07);
7284
- --x-size-height-icon-xl: var(--x-size-base-07);
7285
- }
7286
7151
 
7287
7152
  .x-icon--xl {
7288
7153
  --x-size-width-icon-default: var(--x-size-width-icon-xl);
7289
7154
  --x-size-height-icon-default: var(--x-size-height-icon-xl);
7290
7155
  }
7291
7156
  :root {
7292
- --x-size-width-icon-s: var(--x-size-base-03);
7293
- --x-size-height-icon-s: var(--x-size-base-03);
7157
+ --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
7158
+ --x-color-text-option-list-button-bottom-selected-hover: var(
7159
+ --x-color-text-option-list-button-bottom-selected
7160
+ );
7161
+ --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
7162
+ --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
7163
+ --x-color-border-option-list-item-bottom: transparent;
7164
+ --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
7165
+ --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
7166
+ --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
7167
+ --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
7168
+ --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
7169
+ --x-color-border-top-option-list-item-bottom-selected: var(
7170
+ --x-color-border-option-list-item-bottom
7171
+ );
7172
+ --x-color-border-right-option-list-item-bottom-selected: var(
7173
+ --x-color-border-option-list-item-bottom
7174
+ );
7175
+ --x-color-border-bottom-option-list-item-bottom-selected: var(
7176
+ --x-color-border-option-list-item-bottom-selected
7177
+ );
7178
+ --x-color-border-left-option-list-item-bottom-selected: var(
7179
+ --x-color-border-option-list-item-bottom
7180
+ );
7181
+ --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
7182
+ --x-size-border-width-top-option-list-item-bottom: 0;
7183
+ --x-size-border-width-right-option-list-item-bottom: 0;
7184
+ --x-size-border-width-bottom-option-list-item-bottom: var(
7185
+ --x-size-border-width-option-list-item-bottom
7186
+ );
7187
+ --x-size-border-width-left-option-list-item-bottom: 0;
7188
+ --x-size-border-width-top-option-list-item-bottom-selected: 0;
7189
+ --x-size-border-width-right-option-list-item-bottom-selected: 0;
7190
+ --x-size-border-width-bottom-option-list-item-bottom-selected: var(
7191
+ --x-size-border-width-option-list-item-bottom
7192
+ );
7193
+ --x-size-border-width-left-option-list-item-bottom-selected: 0;
7194
+ --x-size-font-option-list-button-bottom: var(--x-size-font-text);
7195
+ --x-font-decoration-option-list-button-bottom-hover: none;
7196
+ --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
7197
+ --x-number-font-weight-option-list-button-bottom-selected: var(
7198
+ --x-number-font-weight-base-regular
7199
+ );
7200
+ }
7201
+
7202
+ .x-option-list--bottom.x-option-list,
7203
+ .x-option-list--bottom .x-option-list {
7204
+ --x-color-text-option-list-button-default: var(--x-color-text-option-list-button-bottom);
7205
+ --x-color-text-option-list-button-default-hover: var(
7206
+ --x-color-text-option-list-button-bottom-hover
7207
+ );
7208
+ --x-color-border-option-list-item-default: var(--x-color-border-option-list-item-bottom);
7209
+ --x-color-border-top-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
7210
+ --x-color-border-right-option-list-item-default: var(
7211
+ --x-color-border-top-option-list-item-bottom
7212
+ );
7213
+ --x-color-border-bottom-option-list-item-default: var(
7214
+ --x-color-border-top-option-list-item-bottom
7215
+ );
7216
+ --x-color-border-left-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
7217
+ --x-size-border-width-option-list-item-default: var(
7218
+ --x-size-border-width-option-list-item-bottom
7219
+ );
7220
+ --x-size-border-width-top-option-list-item-default: var(
7221
+ --x-size-border-width-top-option-list-item-bottom
7222
+ );
7223
+ --x-size-border-width-right-option-list-item-default: var(
7224
+ --x-size-border-width-right-option-list-item-bottom
7225
+ );
7226
+ --x-size-border-width-bottom-option-list-item-default: var(
7227
+ --x-size-border-width-bottom-option-list-item-bottom
7228
+ );
7229
+ --x-size-border-width-left-option-list-item-default: var(
7230
+ --x-size-border-width-left-option-list-item-bottom
7231
+ );
7232
+ --x-font-decoration-option-list-button-default-hover: var(
7233
+ --x-font-decoration-option-list-button-bottom-hover
7234
+ );
7235
+ --x-size-font-option-list-button-default: var(--x-size-font-option-list-button-bottom);
7236
+ --x-number-font-weight-option-list-button-default: var(
7237
+ --x-number-font-weight-option-list-button-bottom
7238
+ );
7239
+ }
7240
+ .x-option-list--bottom.x-option-list .x-option-list__item.x-option-list__item--is-selected,
7241
+ .x-option-list--bottom .x-option-list .x-option-list__item.x-option-list__item--is-selected {
7242
+ --x-color-text-option-list-button-default-selected: var(
7243
+ --x-color-text-option-list-button-bottom-selected
7244
+ );
7245
+ --x-color-text-option-list-button-default-selected-hover: var(
7246
+ --x-color-text-option-list-button-bottom-selected-hover
7247
+ );
7248
+ --x-color-border-option-list-item-default-selected: var(
7249
+ --x-color-border-option-list-item-bottom-selected
7250
+ );
7251
+ --x-color-border-top-option-list-item-default-selected: var(
7252
+ --x-color-border-top-option-list-item-bottom-selected
7253
+ );
7254
+ --x-color-border-right-option-list-item-default-selected: var(
7255
+ --x-color-border-top-option-list-item-bottom-selected
7256
+ );
7257
+ --x-color-border-bottom-option-list-item-default-selected: var(
7258
+ --x-color-border-bottom-option-list-item-bottom-selected
7259
+ );
7260
+ --x-color-border-left-option-list-item-default-selected: var(
7261
+ --x-color-border-top-option-list-item-bottom-selected
7262
+ );
7263
+ --x-size-border-width-top-option-list-item-default: var(
7264
+ --x-size-border-width-top-option-list-item-bottom-selected
7265
+ );
7266
+ --x-size-border-width-right-option-list-item-default: var(
7267
+ --x-size-border-width-right-option-list-item-bottom-selected
7268
+ );
7269
+ --x-size-border-width-bottom-option-list-item-default: var(
7270
+ --x-size-border-width-bottom-option-list-item-bottom-selected
7271
+ );
7272
+ --x-size-border-width-left-option-list-item-default: var(
7273
+ --x-size-border-width-left-option-list-item-bottom-selected
7274
+ );
7275
+ --x-number-font-weight-option-list-button-default-selected: var(
7276
+ --x-number-font-weight-option-list-button-bottom-selected
7277
+ );
7278
+ }
7279
+ .x-option-list--bottom.x-option-list .x-option-list__item:last-child,
7280
+ .x-option-list--bottom .x-option-list .x-option-list__item:last-child {
7281
+ --x-size-border-width-option-list-item-default: inherit;
7282
+ --x-size-border-width-top-option-list-item-default: inherit;
7283
+ --x-size-border-width-right-option-list-item-default: inherit;
7284
+ --x-size-border-width-bottom-option-list-item-default: inherit;
7285
+ --x-size-border-width-left-option-list-item-default: inherit;
7286
+ }
7287
+ :root {
7288
+ --x-size-width-icon-xl: var(--x-size-base-07);
7289
+ --x-size-height-icon-xl: var(--x-size-base-07);
7294
7290
  }
7295
7291
  :root {
7296
7292
  --x-size-width-icon-s: var(--x-size-base-03);
7297
7293
  --x-size-height-icon-s: var(--x-size-base-03);
7298
7294
  }
7299
-
7300
- .x-icon--s {
7301
- --x-size-width-icon-default: var(--x-size-width-icon-s);
7302
- --x-size-height-icon-default: var(--x-size-height-icon-s);
7303
- }
7304
7295
  :root {
7305
7296
  --x-size-width-icon-m: var(--x-size-base-05);
7306
7297
  --x-size-height-icon-m: var(--x-size-base-05);
@@ -7315,18 +7306,18 @@
7315
7306
  --x-size-height-icon-default: var(--x-size-height-icon-m);
7316
7307
  }
7317
7308
  :root {
7318
- --x-size-width-icon-l: var(--x-size-base-06);
7319
- --x-size-height-icon-l: var(--x-size-base-06);
7309
+ --x-size-width-icon-s: var(--x-size-base-03);
7310
+ --x-size-height-icon-s: var(--x-size-base-03);
7311
+ }
7312
+
7313
+ .x-icon--s {
7314
+ --x-size-width-icon-default: var(--x-size-width-icon-s);
7315
+ --x-size-height-icon-default: var(--x-size-height-icon-s);
7320
7316
  }
7321
7317
  :root {
7322
7318
  --x-size-width-icon-l: var(--x-size-base-06);
7323
7319
  --x-size-height-icon-l: var(--x-size-base-06);
7324
7320
  }
7325
-
7326
- .x-icon--l {
7327
- --x-size-width-icon-default: var(--x-size-width-icon-l);
7328
- --x-size-height-icon-default: var(--x-size-height-icon-l);
7329
- }
7330
7321
  :root {
7331
7322
  --x-color-stroke-icon-default: currentColor;
7332
7323
  --x-color-fill-icon-default: none;
@@ -7366,11 +7357,26 @@
7366
7357
  stroke: none;
7367
7358
  fill: var(--x-color-stroke-icon-default);
7368
7359
  }
7360
+ :root {
7361
+ --x-size-width-icon-l: var(--x-size-base-06);
7362
+ --x-size-height-icon-l: var(--x-size-base-06);
7363
+ }
7364
+
7365
+ .x-icon--l {
7366
+ --x-size-width-icon-default: var(--x-size-width-icon-l);
7367
+ --x-size-height-icon-default: var(--x-size-height-icon-l);
7368
+ }
7369
7369
  :root {
7370
7370
  --x-size-padding-grid: 0;
7371
7371
  --x-size-gap-grid: var(--x-size-base-03);
7372
7372
  --x-size-min-width-grid-item: 150px;
7373
7373
  }
7374
+ .x-filter--justified.x-filter > *:last-child:not(.x-filter__label),
7375
+ .x-filter--justified.x-facet-filter > *:last-child:not(.x-filter__label),
7376
+ .x-filter--justified .x-filter > *:last-child:not(.x-filter__label),
7377
+ .x-filter--justified .x-facet-filter > *:last-child:not(.x-filter__label) {
7378
+ margin-left: auto;
7379
+ }
7374
7380
  :root {
7375
7381
  --x-size-padding-grid: 0;
7376
7382
  --x-size-gap-grid: var(--x-size-base-03);
@@ -7397,19 +7403,6 @@
7397
7403
  .x-grid-list--cols-auto .x-grid-list__item {
7398
7404
  min-width: var(--x-size-min-width-grid-item);
7399
7405
  }
7400
- .x-filter--justified.x-filter > *:last-child:not(.x-filter__label),
7401
- .x-filter--justified.x-facet-filter > *:last-child:not(.x-filter__label),
7402
- .x-filter--justified .x-filter > *:last-child:not(.x-filter__label),
7403
- .x-filter--justified .x-facet-filter > *:last-child:not(.x-filter__label) {
7404
- margin-left: auto;
7405
- }
7406
- :root {
7407
- --x-size-margin-filter-children: 0;
7408
- --x-size-padding-top-filter-children: 0;
7409
- --x-size-padding-right-filter-children: 0;
7410
- --x-size-padding-bottom-filter-children: 0;
7411
- --x-size-padding-left-filter-children: var(--x-size-base-05);
7412
- }
7413
7406
  :root {
7414
7407
  --x-size-margin-filter-children: 0;
7415
7408
  --x-size-padding-top-filter-children: 0;
@@ -7417,31 +7410,6 @@
7417
7410
  --x-size-padding-bottom-filter-children: 0;
7418
7411
  --x-size-padding-left-filter-children: var(--x-size-base-05);
7419
7412
  }
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);
@@ -7588,17 +7556,36 @@
7588
7556
  );
7589
7557
  }
7590
7558
  :root {
7591
- --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
7592
- --x-size-border-width-facet-outlined: var(--x-size-border-width-base);
7593
- --x-size-border-width-top-facet-outlined: var(--x-size-border-width-facet-outlined);
7594
- --x-size-border-width-right-facet-outlined: var(--x-size-border-width-facet-outlined);
7595
- --x-size-border-width-bottom-facet-outlined: var(--x-size-border-width-facet-outlined);
7596
- --x-size-border-width-left-facet-outlined: var(--x-size-border-width-facet-outlined);
7597
- --x-size-padding-facet-header-outlined: var(--x-size-base-03);
7598
- --x-size-padding-top-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7599
- --x-size-padding-right-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7600
- --x-size-padding-bottom-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7601
- --x-size-padding-left-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7559
+ --x-size-margin-filter-children: 0;
7560
+ --x-size-padding-top-filter-children: 0;
7561
+ --x-size-padding-right-filter-children: 0;
7562
+ --x-size-padding-bottom-filter-children: 0;
7563
+ --x-size-padding-left-filter-children: var(--x-size-base-05);
7564
+ }
7565
+
7566
+ .x-hierarchical-filter-container {
7567
+ list-style: none;
7568
+ }
7569
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7570
+ padding-left: var(--x-size-padding-left-filter-children);
7571
+ }
7572
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7573
+ padding-right: var(--x-size-padding-left-filter-children);
7574
+ }
7575
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7576
+ padding-right: var(--x-size-padding-right-filter-children);
7577
+ }
7578
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7579
+ padding-left: var(--x-size-padding-right-filter-children);
7580
+ }
7581
+ .x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7582
+ margin: var(--x-size-margin-filter-children);
7583
+ padding-top: var(--x-size-padding-top-filter-children);
7584
+ padding-bottom: var(--x-size-padding-bottom-filter-children);
7585
+ }
7586
+ .x-hierarchical-filter-container .x-hierarchical-filter-container,
7587
+ .x-hierarchical-filter-container .x-filter, .x-hierarchical-filter-container .x-facet-filter {
7588
+ width: 100%;
7602
7589
  }
7603
7590
  :root {
7604
7591
  --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
@@ -7660,6 +7647,19 @@
7660
7647
  --x-size-border-width-left-facet-header-line
7661
7648
  );
7662
7649
  }
7650
+ :root {
7651
+ --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
7652
+ --x-size-border-width-facet-outlined: var(--x-size-border-width-base);
7653
+ --x-size-border-width-top-facet-outlined: var(--x-size-border-width-facet-outlined);
7654
+ --x-size-border-width-right-facet-outlined: var(--x-size-border-width-facet-outlined);
7655
+ --x-size-border-width-bottom-facet-outlined: var(--x-size-border-width-facet-outlined);
7656
+ --x-size-border-width-left-facet-outlined: var(--x-size-border-width-facet-outlined);
7657
+ --x-size-padding-facet-header-outlined: var(--x-size-base-03);
7658
+ --x-size-padding-top-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7659
+ --x-size-padding-right-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7660
+ --x-size-padding-bottom-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7661
+ --x-size-padding-left-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7662
+ }
7663
7663
  :root {
7664
7664
  --x-color-background-facet-default: transparent;
7665
7665
  --x-color-border-facet-default: var(--x-color-background-facet-default);
@@ -7693,6 +7693,18 @@
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-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7698
+ --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
7699
+ --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
7700
+ --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
7701
+ --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
7702
+ --x-size-padding-facet-header-card: var(--x-size-base-03);
7703
+ --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
7704
+ --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
7705
+ --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7706
+ --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7707
+ }
7696
7708
  :root {
7697
7709
  --x-color-background-facet-default: transparent;
7698
7710
  --x-color-border-facet-default: var(--x-color-background-facet-default);
@@ -7832,18 +7844,6 @@
7832
7844
  --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7833
7845
  --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7834
7846
  }
7835
- :root {
7836
- --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7837
- --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
7838
- --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
7839
- --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
7840
- --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
7841
- --x-size-padding-facet-header-card: var(--x-size-base-03);
7842
- --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
7843
- --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
7844
- --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7845
- --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7846
- }
7847
7847
 
7848
7848
  .x-facet--card.x-facet,
7849
7849
  .x-facet--card .x-facet {
@@ -7861,9 +7861,6 @@
7861
7861
  :root {
7862
7862
  --x-size-width-dropdown-xl: 282px;
7863
7863
  }
7864
- :root {
7865
- --x-size-width-dropdown-xl: 282px;
7866
- }
7867
7864
 
7868
7865
  .x-dropdown.x-dropdown--xl {
7869
7866
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-xl);
@@ -7871,6 +7868,9 @@
7871
7868
  :root {
7872
7869
  --x-size-width-dropdown-s: 74px;
7873
7870
  }
7871
+ :root {
7872
+ --x-size-width-dropdown-xl: 282px;
7873
+ }
7874
7874
  :root {
7875
7875
  --x-size-width-dropdown-s: 74px;
7876
7876
  }
@@ -7886,14 +7886,6 @@
7886
7886
  --x-size-border-width-bottom-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7887
7887
  --x-size-border-width-left-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7888
7888
  }
7889
- :root {
7890
- --x-size-gap-dropdown-pill: var(--x-size-base-03);
7891
- --x-size-border-width-dropdown-list-pill: var(--x-size-border-width-base);
7892
- --x-size-border-width-top-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7893
- --x-size-border-width-right-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7894
- --x-size-border-width-bottom-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7895
- --x-size-border-width-left-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7896
- }
7897
7889
 
7898
7890
  .x-dropdown--pill {
7899
7891
  --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-pill);
@@ -8352,17 +8344,12 @@
8352
8344
  left: 0;
8353
8345
  }
8354
8346
  :root {
8355
- --x-size-gap-dropdown-card: var(--x-size-base-03);
8356
- --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8357
- --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8358
- --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8359
- --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8360
- --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8361
- --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8362
- --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8363
- --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8364
- --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8365
- --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8347
+ --x-size-gap-dropdown-pill: var(--x-size-base-03);
8348
+ --x-size-border-width-dropdown-list-pill: var(--x-size-border-width-base);
8349
+ --x-size-border-width-top-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
8350
+ --x-size-border-width-right-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
8351
+ --x-size-border-width-bottom-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
8352
+ --x-size-border-width-left-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
8366
8353
  }
8367
8354
  :root {
8368
8355
  --x-size-gap-dropdown-card: var(--x-size-base-03);
@@ -8377,36 +8364,6 @@
8377
8364
  --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8378
8365
  --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8379
8366
  }
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
8367
  :root {
8411
8368
  --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8412
8369
  --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
@@ -8611,6 +8568,49 @@
8611
8568
  --x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
8612
8569
  --x-size-line-height-button-default: var(--x-size-line-height-text);
8613
8570
  }
8571
+ :root {
8572
+ --x-size-gap-dropdown-card: var(--x-size-base-03);
8573
+ --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8574
+ --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8575
+ --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8576
+ --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8577
+ --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8578
+ --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8579
+ --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8580
+ --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8581
+ --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8582
+ --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8583
+ }
8584
+
8585
+ .x-dropdown--card {
8586
+ --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-card);
8587
+ --x-size-border-radius-dropdown-default: var(--x-size-border-radius-dropdown-card);
8588
+ --x-size-border-radius-top-left-dropdown-default: var(
8589
+ --x-size-border-radius-top-left-dropdown-card
8590
+ );
8591
+ --x-size-border-radius-top-right-dropdown-default: var(
8592
+ --x-size-border-radius-top-right-dropdown-card
8593
+ );
8594
+ --x-size-border-radius-bottom-right-dropdown-default: var(
8595
+ --x-size-border-radius-bottom-right-dropdown-card
8596
+ );
8597
+ --x-size-border-radius-bottom-left-dropdown-default: var(
8598
+ --x-size-border-radius-bottom-left-dropdown-card
8599
+ );
8600
+ --x-size-border-width-dropdown-list-default: var(--x-size-border-width-dropdown-list-card);
8601
+ --x-size-border-width-top-dropdown-list-default: var(
8602
+ --x-size-border-width-top-dropdown-list-card
8603
+ );
8604
+ --x-size-border-width-right-dropdown-list-default: var(
8605
+ --x-size-border-width-right-dropdown-list-card
8606
+ );
8607
+ --x-size-border-width-bottom-dropdown-list-default: var(
8608
+ --x-size-border-width-bottom-dropdown-list-card
8609
+ );
8610
+ --x-size-border-width-left-dropdown-list-default: var(
8611
+ --x-size-border-width-left-dropdown-list-card
8612
+ );
8613
+ }
8614
8614
  :root {
8615
8615
  --x-color-background-button-default: var(--x-color-base-lead);
8616
8616
  --x-color-border-button-default: var(--x-color-background-button-default);
@@ -8703,13 +8703,6 @@
8703
8703
  --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8704
8704
  --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8705
8705
  }
8706
- :root {
8707
- --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8708
- --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8709
- --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8710
- --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8711
- --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8712
- }
8713
8706
 
8714
8707
  .x-button--card.x-button,
8715
8708
  .x-button--card .x-button {
@@ -8825,4 +8818,11 @@
8825
8818
  --x-size-border-radius-base-m: var(--x-size-base-06);
8826
8819
  --x-size-border-radius-base-pill: 99999px;
8827
8820
  --x-size-border-width-base: 1px;
8821
+ }
8822
+ :root {
8823
+ --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8824
+ --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8825
+ --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8826
+ --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8827
+ --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8828
8828
  }