@empathyco/x-components 6.0.0-alpha.73 → 6.0.0-alpha.74

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/design-system/deprecated-full-theme.css +845 -844
  3. package/package.json +2 -2
package/design-system/deprecated-full-theme.css CHANGED
@@ -1,4 +1,5 @@
1
1
 
2
+
2
3
  .x-uppercase {
3
4
  text-transform: uppercase;
4
5
  }
@@ -52,965 +53,965 @@
52
53
  .x-sticky {
53
54
  position: sticky !important;
54
55
  }
55
- .x-padding--00 {
56
- padding: 0 !important;
57
- }
58
- .x-padding--01 {
59
- padding: var(--x-size-base-01) !important;
56
+ .x-margin--auto {
57
+ margin: auto !important;
60
58
  }
61
- .x-padding--02 {
62
- padding: var(--x-size-base-02) !important;
59
+ .x-margin--00 {
60
+ margin: 0 !important;
63
61
  }
64
- .x-padding--03 {
65
- padding: var(--x-size-base-03) !important;
62
+ .x-margin--01 {
63
+ margin: var(--x-size-base-01) !important;
66
64
  }
67
- .x-padding--04 {
68
- padding: var(--x-size-base-04) !important;
65
+ .x-margin--02 {
66
+ margin: var(--x-size-base-02) !important;
69
67
  }
70
- .x-padding--05 {
71
- padding: var(--x-size-base-05) !important;
68
+ .x-margin--03 {
69
+ margin: var(--x-size-base-03) !important;
72
70
  }
73
- .x-padding--06 {
74
- padding: var(--x-size-base-06) !important;
71
+ .x-margin--04 {
72
+ margin: var(--x-size-base-04) !important;
75
73
  }
76
- .x-padding--07 {
77
- padding: var(--x-size-base-07) !important;
74
+ .x-margin--05 {
75
+ margin: var(--x-size-base-05) !important;
78
76
  }
79
- .x-padding--08 {
80
- padding: var(--x-size-base-08) !important;
77
+ .x-margin--06 {
78
+ margin: var(--x-size-base-06) !important;
81
79
  }
82
- .x-padding--09 {
83
- padding: var(--x-size-base-09) !important;
80
+ .x-margin--07 {
81
+ margin: var(--x-size-base-07) !important;
84
82
  }
85
- .x-padding--10 {
86
- padding: var(--x-size-base-10) !important;
83
+ .x-margin--08 {
84
+ margin: var(--x-size-base-08) !important;
87
85
  }
88
- .x-padding--11 {
89
- padding: var(--x-size-base-11) !important;
86
+ .x-margin--09 {
87
+ margin: var(--x-size-base-09) !important;
90
88
  }
91
- .x-padding--12 {
92
- padding: var(--x-size-base-12) !important;
89
+ .x-margin--10 {
90
+ margin: var(--x-size-base-10) !important;
93
91
  }
94
- .x-padding--13 {
95
- padding: var(--x-size-base-13) !important;
92
+ .x-margin--11 {
93
+ margin: var(--x-size-base-11) !important;
96
94
  }
97
- .x-padding--14 {
98
- padding: var(--x-size-base-14) !important;
95
+ .x-margin--12 {
96
+ margin: var(--x-size-base-12) !important;
99
97
  }
100
- .x-padding--15 {
101
- padding: var(--x-size-base-15) !important;
98
+ .x-margin--13 {
99
+ margin: var(--x-size-base-13) !important;
102
100
  }
103
- .x-padding--16 {
104
- padding: var(--x-size-base-16) !important;
101
+ .x-margin--14 {
102
+ margin: var(--x-size-base-14) !important;
105
103
  }
106
- .x-padding--17 {
107
- padding: var(--x-size-base-17) !important;
104
+ .x-margin--15 {
105
+ margin: var(--x-size-base-15) !important;
108
106
  }
109
- .x-padding--18 {
110
- padding: var(--x-size-base-18) !important;
107
+ .x-margin--16 {
108
+ margin: var(--x-size-base-16) !important;
111
109
  }
112
- .x-padding--19 {
113
- padding: var(--x-size-base-19) !important;
110
+ .x-margin--17 {
111
+ margin: var(--x-size-base-17) !important;
114
112
  }
115
- .x-padding--20 {
116
- padding: var(--x-size-base-20) !important;
113
+ .x-margin--18 {
114
+ margin: var(--x-size-base-18) !important;
117
115
  }
118
- .x-padding--top-00 {
119
- padding-top: 0 !important;
116
+ .x-margin--19 {
117
+ margin: var(--x-size-base-19) !important;
120
118
  }
121
- .x-padding--bottom-00 {
122
- padding-bottom: 0 !important;
119
+ .x-margin--20 {
120
+ margin: var(--x-size-base-20) !important;
123
121
  }
124
- [dir="ltr"] .x-padding--right-00 {
125
- padding-right: 0 !important;
122
+ .x-margin--top-auto {
123
+ margin-top: auto !important;
126
124
  }
127
- [dir="rtl"] .x-padding--right-00 {
128
- padding-left: 0 !important;
125
+ .x-margin--bottom-auto {
126
+ margin-bottom: auto !important;
129
127
  }
130
- [dir="ltr"] .x-padding--left-00 {
131
- padding-left: 0 !important;
128
+ [dir="ltr"] .x-margin--right-auto {
129
+ margin-right: auto !important;
132
130
  }
133
- [dir="rtl"] .x-padding--left-00 {
134
- padding-right: 0 !important;
131
+ [dir="rtl"] .x-margin--right-auto {
132
+ margin-left: auto !important;
135
133
  }
136
- .x-padding--top-01 {
137
- padding-top: var(--x-size-base-01) !important;
134
+ [dir="ltr"] .x-margin--left-auto {
135
+ margin-left: auto !important;
138
136
  }
139
- .x-padding--bottom-01 {
140
- padding-bottom: var(--x-size-base-01) !important;
137
+ [dir="rtl"] .x-margin--left-auto {
138
+ margin-right: auto !important;
141
139
  }
142
- [dir="ltr"] .x-padding--right-01 {
143
- padding-right: var(--x-size-base-01) !important;
140
+ .x-margin--top-00 {
141
+ margin-top: 0 !important;
144
142
  }
145
- [dir="rtl"] .x-padding--right-01 {
146
- padding-left: var(--x-size-base-01) !important;
143
+ .x-margin--bottom-00 {
144
+ margin-bottom: 0 !important;
147
145
  }
148
- [dir="ltr"] .x-padding--left-01 {
149
- padding-left: var(--x-size-base-01) !important;
146
+ [dir="ltr"] .x-margin--right-00 {
147
+ margin-right: 0 !important;
150
148
  }
151
- [dir="rtl"] .x-padding--left-01 {
152
- padding-right: var(--x-size-base-01) !important;
149
+ [dir="rtl"] .x-margin--right-00 {
150
+ margin-left: 0 !important;
153
151
  }
154
- .x-padding--top-02 {
155
- padding-top: var(--x-size-base-02) !important;
152
+ [dir="ltr"] .x-margin--left-00 {
153
+ margin-left: 0 !important;
156
154
  }
157
- .x-padding--bottom-02 {
158
- padding-bottom: var(--x-size-base-02) !important;
155
+ [dir="rtl"] .x-margin--left-00 {
156
+ margin-right: 0 !important;
159
157
  }
160
- [dir="ltr"] .x-padding--right-02 {
161
- padding-right: var(--x-size-base-02) !important;
158
+ .x-margin--top-01 {
159
+ margin-top: var(--x-size-base-01) !important;
162
160
  }
163
- [dir="rtl"] .x-padding--right-02 {
164
- padding-left: var(--x-size-base-02) !important;
161
+ .x-margin--bottom-01 {
162
+ margin-bottom: var(--x-size-base-01) !important;
165
163
  }
166
- [dir="ltr"] .x-padding--left-02 {
167
- padding-left: var(--x-size-base-02) !important;
164
+ [dir="ltr"] .x-margin--right-01 {
165
+ margin-right: var(--x-size-base-01) !important;
168
166
  }
169
- [dir="rtl"] .x-padding--left-02 {
170
- padding-right: var(--x-size-base-02) !important;
167
+ [dir="rtl"] .x-margin--right-01 {
168
+ margin-left: var(--x-size-base-01) !important;
171
169
  }
172
- .x-padding--top-03 {
173
- padding-top: var(--x-size-base-03) !important;
170
+ [dir="ltr"] .x-margin--left-01 {
171
+ margin-left: var(--x-size-base-01) !important;
174
172
  }
175
- .x-padding--bottom-03 {
176
- padding-bottom: var(--x-size-base-03) !important;
173
+ [dir="rtl"] .x-margin--left-01 {
174
+ margin-right: var(--x-size-base-01) !important;
177
175
  }
178
- [dir="ltr"] .x-padding--right-03 {
179
- padding-right: var(--x-size-base-03) !important;
176
+ .x-margin--top-02 {
177
+ margin-top: var(--x-size-base-02) !important;
180
178
  }
181
- [dir="rtl"] .x-padding--right-03 {
182
- padding-left: var(--x-size-base-03) !important;
179
+ .x-margin--bottom-02 {
180
+ margin-bottom: var(--x-size-base-02) !important;
183
181
  }
184
- [dir="ltr"] .x-padding--left-03 {
185
- padding-left: var(--x-size-base-03) !important;
182
+ [dir="ltr"] .x-margin--right-02 {
183
+ margin-right: var(--x-size-base-02) !important;
186
184
  }
187
- [dir="rtl"] .x-padding--left-03 {
188
- padding-right: var(--x-size-base-03) !important;
185
+ [dir="rtl"] .x-margin--right-02 {
186
+ margin-left: var(--x-size-base-02) !important;
189
187
  }
190
- .x-padding--top-04 {
191
- padding-top: var(--x-size-base-04) !important;
188
+ [dir="ltr"] .x-margin--left-02 {
189
+ margin-left: var(--x-size-base-02) !important;
192
190
  }
193
- .x-padding--bottom-04 {
194
- padding-bottom: var(--x-size-base-04) !important;
191
+ [dir="rtl"] .x-margin--left-02 {
192
+ margin-right: var(--x-size-base-02) !important;
195
193
  }
196
- [dir="ltr"] .x-padding--right-04 {
197
- padding-right: var(--x-size-base-04) !important;
194
+ .x-margin--top-03 {
195
+ margin-top: var(--x-size-base-03) !important;
198
196
  }
199
- [dir="rtl"] .x-padding--right-04 {
200
- padding-left: var(--x-size-base-04) !important;
197
+ .x-margin--bottom-03 {
198
+ margin-bottom: var(--x-size-base-03) !important;
201
199
  }
202
- [dir="ltr"] .x-padding--left-04 {
203
- padding-left: var(--x-size-base-04) !important;
200
+ [dir="ltr"] .x-margin--right-03 {
201
+ margin-right: var(--x-size-base-03) !important;
204
202
  }
205
- [dir="rtl"] .x-padding--left-04 {
206
- padding-right: var(--x-size-base-04) !important;
203
+ [dir="rtl"] .x-margin--right-03 {
204
+ margin-left: var(--x-size-base-03) !important;
207
205
  }
208
- .x-padding--top-05 {
209
- padding-top: var(--x-size-base-05) !important;
206
+ [dir="ltr"] .x-margin--left-03 {
207
+ margin-left: var(--x-size-base-03) !important;
210
208
  }
211
- .x-padding--bottom-05 {
212
- padding-bottom: var(--x-size-base-05) !important;
209
+ [dir="rtl"] .x-margin--left-03 {
210
+ margin-right: var(--x-size-base-03) !important;
213
211
  }
214
- [dir="ltr"] .x-padding--right-05 {
215
- padding-right: var(--x-size-base-05) !important;
212
+ .x-margin--top-04 {
213
+ margin-top: var(--x-size-base-04) !important;
216
214
  }
217
- [dir="rtl"] .x-padding--right-05 {
218
- padding-left: var(--x-size-base-05) !important;
215
+ .x-margin--bottom-04 {
216
+ margin-bottom: var(--x-size-base-04) !important;
219
217
  }
220
- [dir="ltr"] .x-padding--left-05 {
221
- padding-left: var(--x-size-base-05) !important;
218
+ [dir="ltr"] .x-margin--right-04 {
219
+ margin-right: var(--x-size-base-04) !important;
222
220
  }
223
- [dir="rtl"] .x-padding--left-05 {
224
- padding-right: var(--x-size-base-05) !important;
221
+ [dir="rtl"] .x-margin--right-04 {
222
+ margin-left: var(--x-size-base-04) !important;
225
223
  }
226
- .x-padding--top-06 {
227
- padding-top: var(--x-size-base-06) !important;
224
+ [dir="ltr"] .x-margin--left-04 {
225
+ margin-left: var(--x-size-base-04) !important;
228
226
  }
229
- .x-padding--bottom-06 {
230
- padding-bottom: var(--x-size-base-06) !important;
227
+ [dir="rtl"] .x-margin--left-04 {
228
+ margin-right: var(--x-size-base-04) !important;
231
229
  }
232
- [dir="ltr"] .x-padding--right-06 {
233
- padding-right: var(--x-size-base-06) !important;
230
+ .x-margin--top-05 {
231
+ margin-top: var(--x-size-base-05) !important;
234
232
  }
235
- [dir="rtl"] .x-padding--right-06 {
236
- padding-left: var(--x-size-base-06) !important;
233
+ .x-margin--bottom-05 {
234
+ margin-bottom: var(--x-size-base-05) !important;
237
235
  }
238
- [dir="ltr"] .x-padding--left-06 {
239
- padding-left: var(--x-size-base-06) !important;
236
+ [dir="ltr"] .x-margin--right-05 {
237
+ margin-right: var(--x-size-base-05) !important;
240
238
  }
241
- [dir="rtl"] .x-padding--left-06 {
242
- padding-right: var(--x-size-base-06) !important;
239
+ [dir="rtl"] .x-margin--right-05 {
240
+ margin-left: var(--x-size-base-05) !important;
243
241
  }
244
- .x-padding--top-07 {
245
- padding-top: var(--x-size-base-07) !important;
242
+ [dir="ltr"] .x-margin--left-05 {
243
+ margin-left: var(--x-size-base-05) !important;
246
244
  }
247
- .x-padding--bottom-07 {
248
- padding-bottom: var(--x-size-base-07) !important;
245
+ [dir="rtl"] .x-margin--left-05 {
246
+ margin-right: var(--x-size-base-05) !important;
249
247
  }
250
- [dir="ltr"] .x-padding--right-07 {
251
- padding-right: var(--x-size-base-07) !important;
248
+ .x-margin--top-06 {
249
+ margin-top: var(--x-size-base-06) !important;
252
250
  }
253
- [dir="rtl"] .x-padding--right-07 {
254
- padding-left: var(--x-size-base-07) !important;
251
+ .x-margin--bottom-06 {
252
+ margin-bottom: var(--x-size-base-06) !important;
255
253
  }
256
- [dir="ltr"] .x-padding--left-07 {
257
- padding-left: var(--x-size-base-07) !important;
254
+ [dir="ltr"] .x-margin--right-06 {
255
+ margin-right: var(--x-size-base-06) !important;
258
256
  }
259
- [dir="rtl"] .x-padding--left-07 {
260
- padding-right: var(--x-size-base-07) !important;
257
+ [dir="rtl"] .x-margin--right-06 {
258
+ margin-left: var(--x-size-base-06) !important;
261
259
  }
262
- .x-padding--top-08 {
263
- padding-top: var(--x-size-base-08) !important;
260
+ [dir="ltr"] .x-margin--left-06 {
261
+ margin-left: var(--x-size-base-06) !important;
264
262
  }
265
- .x-padding--bottom-08 {
266
- padding-bottom: var(--x-size-base-08) !important;
263
+ [dir="rtl"] .x-margin--left-06 {
264
+ margin-right: var(--x-size-base-06) !important;
267
265
  }
268
- [dir="ltr"] .x-padding--right-08 {
269
- padding-right: var(--x-size-base-08) !important;
266
+ .x-margin--top-07 {
267
+ margin-top: var(--x-size-base-07) !important;
270
268
  }
271
- [dir="rtl"] .x-padding--right-08 {
272
- padding-left: var(--x-size-base-08) !important;
269
+ .x-margin--bottom-07 {
270
+ margin-bottom: var(--x-size-base-07) !important;
273
271
  }
274
- [dir="ltr"] .x-padding--left-08 {
275
- padding-left: var(--x-size-base-08) !important;
272
+ [dir="ltr"] .x-margin--right-07 {
273
+ margin-right: var(--x-size-base-07) !important;
276
274
  }
277
- [dir="rtl"] .x-padding--left-08 {
278
- padding-right: var(--x-size-base-08) !important;
275
+ [dir="rtl"] .x-margin--right-07 {
276
+ margin-left: var(--x-size-base-07) !important;
279
277
  }
280
- .x-padding--top-09 {
281
- padding-top: var(--x-size-base-09) !important;
278
+ [dir="ltr"] .x-margin--left-07 {
279
+ margin-left: var(--x-size-base-07) !important;
282
280
  }
283
- .x-padding--bottom-09 {
284
- padding-bottom: var(--x-size-base-09) !important;
281
+ [dir="rtl"] .x-margin--left-07 {
282
+ margin-right: var(--x-size-base-07) !important;
285
283
  }
286
- [dir="ltr"] .x-padding--right-09 {
287
- padding-right: var(--x-size-base-09) !important;
284
+ .x-margin--top-08 {
285
+ margin-top: var(--x-size-base-08) !important;
288
286
  }
289
- [dir="rtl"] .x-padding--right-09 {
290
- padding-left: var(--x-size-base-09) !important;
287
+ .x-margin--bottom-08 {
288
+ margin-bottom: var(--x-size-base-08) !important;
291
289
  }
292
- [dir="ltr"] .x-padding--left-09 {
293
- padding-left: var(--x-size-base-09) !important;
290
+ [dir="ltr"] .x-margin--right-08 {
291
+ margin-right: var(--x-size-base-08) !important;
294
292
  }
295
- [dir="rtl"] .x-padding--left-09 {
296
- padding-right: var(--x-size-base-09) !important;
293
+ [dir="rtl"] .x-margin--right-08 {
294
+ margin-left: var(--x-size-base-08) !important;
297
295
  }
298
- .x-padding--top-10 {
299
- padding-top: var(--x-size-base-10) !important;
296
+ [dir="ltr"] .x-margin--left-08 {
297
+ margin-left: var(--x-size-base-08) !important;
300
298
  }
301
- .x-padding--bottom-10 {
302
- padding-bottom: var(--x-size-base-10) !important;
299
+ [dir="rtl"] .x-margin--left-08 {
300
+ margin-right: var(--x-size-base-08) !important;
303
301
  }
304
- [dir="ltr"] .x-padding--right-10 {
305
- padding-right: var(--x-size-base-10) !important;
302
+ .x-margin--top-09 {
303
+ margin-top: var(--x-size-base-09) !important;
306
304
  }
307
- [dir="rtl"] .x-padding--right-10 {
308
- padding-left: var(--x-size-base-10) !important;
305
+ .x-margin--bottom-09 {
306
+ margin-bottom: var(--x-size-base-09) !important;
309
307
  }
310
- [dir="ltr"] .x-padding--left-10 {
311
- padding-left: var(--x-size-base-10) !important;
308
+ [dir="ltr"] .x-margin--right-09 {
309
+ margin-right: var(--x-size-base-09) !important;
312
310
  }
313
- [dir="rtl"] .x-padding--left-10 {
314
- padding-right: var(--x-size-base-10) !important;
311
+ [dir="rtl"] .x-margin--right-09 {
312
+ margin-left: var(--x-size-base-09) !important;
315
313
  }
316
- .x-padding--top-11 {
317
- padding-top: var(--x-size-base-11) !important;
314
+ [dir="ltr"] .x-margin--left-09 {
315
+ margin-left: var(--x-size-base-09) !important;
318
316
  }
319
- .x-padding--bottom-11 {
320
- padding-bottom: var(--x-size-base-11) !important;
317
+ [dir="rtl"] .x-margin--left-09 {
318
+ margin-right: var(--x-size-base-09) !important;
321
319
  }
322
- [dir="ltr"] .x-padding--right-11 {
323
- padding-right: var(--x-size-base-11) !important;
320
+ .x-margin--top-10 {
321
+ margin-top: var(--x-size-base-10) !important;
324
322
  }
325
- [dir="rtl"] .x-padding--right-11 {
326
- padding-left: var(--x-size-base-11) !important;
323
+ .x-margin--bottom-10 {
324
+ margin-bottom: var(--x-size-base-10) !important;
327
325
  }
328
- [dir="ltr"] .x-padding--left-11 {
329
- padding-left: var(--x-size-base-11) !important;
326
+ [dir="ltr"] .x-margin--right-10 {
327
+ margin-right: var(--x-size-base-10) !important;
330
328
  }
331
- [dir="rtl"] .x-padding--left-11 {
332
- padding-right: var(--x-size-base-11) !important;
329
+ [dir="rtl"] .x-margin--right-10 {
330
+ margin-left: var(--x-size-base-10) !important;
333
331
  }
334
- .x-padding--top-12 {
335
- padding-top: var(--x-size-base-12) !important;
332
+ [dir="ltr"] .x-margin--left-10 {
333
+ margin-left: var(--x-size-base-10) !important;
336
334
  }
337
- .x-padding--bottom-12 {
338
- padding-bottom: var(--x-size-base-12) !important;
335
+ [dir="rtl"] .x-margin--left-10 {
336
+ margin-right: var(--x-size-base-10) !important;
339
337
  }
340
- [dir="ltr"] .x-padding--right-12 {
341
- padding-right: var(--x-size-base-12) !important;
338
+ .x-margin--top-11 {
339
+ margin-top: var(--x-size-base-11) !important;
342
340
  }
343
- [dir="rtl"] .x-padding--right-12 {
344
- padding-left: var(--x-size-base-12) !important;
341
+ .x-margin--bottom-11 {
342
+ margin-bottom: var(--x-size-base-11) !important;
345
343
  }
346
- [dir="ltr"] .x-padding--left-12 {
347
- padding-left: var(--x-size-base-12) !important;
344
+ [dir="ltr"] .x-margin--right-11 {
345
+ margin-right: var(--x-size-base-11) !important;
348
346
  }
349
- [dir="rtl"] .x-padding--left-12 {
350
- padding-right: var(--x-size-base-12) !important;
347
+ [dir="rtl"] .x-margin--right-11 {
348
+ margin-left: var(--x-size-base-11) !important;
351
349
  }
352
- .x-padding--top-13 {
353
- padding-top: var(--x-size-base-13) !important;
350
+ [dir="ltr"] .x-margin--left-11 {
351
+ margin-left: var(--x-size-base-11) !important;
354
352
  }
355
- .x-padding--bottom-13 {
356
- padding-bottom: var(--x-size-base-13) !important;
353
+ [dir="rtl"] .x-margin--left-11 {
354
+ margin-right: var(--x-size-base-11) !important;
357
355
  }
358
- [dir="ltr"] .x-padding--right-13 {
359
- padding-right: var(--x-size-base-13) !important;
356
+ .x-margin--top-12 {
357
+ margin-top: var(--x-size-base-12) !important;
360
358
  }
361
- [dir="rtl"] .x-padding--right-13 {
362
- padding-left: var(--x-size-base-13) !important;
359
+ .x-margin--bottom-12 {
360
+ margin-bottom: var(--x-size-base-12) !important;
363
361
  }
364
- [dir="ltr"] .x-padding--left-13 {
365
- padding-left: var(--x-size-base-13) !important;
362
+ [dir="ltr"] .x-margin--right-12 {
363
+ margin-right: var(--x-size-base-12) !important;
366
364
  }
367
- [dir="rtl"] .x-padding--left-13 {
368
- padding-right: var(--x-size-base-13) !important;
365
+ [dir="rtl"] .x-margin--right-12 {
366
+ margin-left: var(--x-size-base-12) !important;
369
367
  }
370
- .x-padding--top-14 {
371
- padding-top: var(--x-size-base-14) !important;
368
+ [dir="ltr"] .x-margin--left-12 {
369
+ margin-left: var(--x-size-base-12) !important;
372
370
  }
373
- .x-padding--bottom-14 {
374
- padding-bottom: var(--x-size-base-14) !important;
371
+ [dir="rtl"] .x-margin--left-12 {
372
+ margin-right: var(--x-size-base-12) !important;
375
373
  }
376
- [dir="ltr"] .x-padding--right-14 {
377
- padding-right: var(--x-size-base-14) !important;
374
+ .x-margin--top-13 {
375
+ margin-top: var(--x-size-base-13) !important;
378
376
  }
379
- [dir="rtl"] .x-padding--right-14 {
380
- padding-left: var(--x-size-base-14) !important;
377
+ .x-margin--bottom-13 {
378
+ margin-bottom: var(--x-size-base-13) !important;
381
379
  }
382
- [dir="ltr"] .x-padding--left-14 {
383
- padding-left: var(--x-size-base-14) !important;
380
+ [dir="ltr"] .x-margin--right-13 {
381
+ margin-right: var(--x-size-base-13) !important;
384
382
  }
385
- [dir="rtl"] .x-padding--left-14 {
386
- padding-right: var(--x-size-base-14) !important;
383
+ [dir="rtl"] .x-margin--right-13 {
384
+ margin-left: var(--x-size-base-13) !important;
387
385
  }
388
- .x-padding--top-15 {
389
- padding-top: var(--x-size-base-15) !important;
386
+ [dir="ltr"] .x-margin--left-13 {
387
+ margin-left: var(--x-size-base-13) !important;
390
388
  }
391
- .x-padding--bottom-15 {
392
- padding-bottom: var(--x-size-base-15) !important;
389
+ [dir="rtl"] .x-margin--left-13 {
390
+ margin-right: var(--x-size-base-13) !important;
393
391
  }
394
- [dir="ltr"] .x-padding--right-15 {
395
- padding-right: var(--x-size-base-15) !important;
392
+ .x-margin--top-14 {
393
+ margin-top: var(--x-size-base-14) !important;
396
394
  }
397
- [dir="rtl"] .x-padding--right-15 {
398
- padding-left: var(--x-size-base-15) !important;
395
+ .x-margin--bottom-14 {
396
+ margin-bottom: var(--x-size-base-14) !important;
399
397
  }
400
- [dir="ltr"] .x-padding--left-15 {
401
- padding-left: var(--x-size-base-15) !important;
398
+ [dir="ltr"] .x-margin--right-14 {
399
+ margin-right: var(--x-size-base-14) !important;
402
400
  }
403
- [dir="rtl"] .x-padding--left-15 {
404
- padding-right: var(--x-size-base-15) !important;
401
+ [dir="rtl"] .x-margin--right-14 {
402
+ margin-left: var(--x-size-base-14) !important;
405
403
  }
406
- .x-padding--top-16 {
407
- padding-top: var(--x-size-base-16) !important;
404
+ [dir="ltr"] .x-margin--left-14 {
405
+ margin-left: var(--x-size-base-14) !important;
408
406
  }
409
- .x-padding--bottom-16 {
410
- padding-bottom: var(--x-size-base-16) !important;
407
+ [dir="rtl"] .x-margin--left-14 {
408
+ margin-right: var(--x-size-base-14) !important;
411
409
  }
412
- [dir="ltr"] .x-padding--right-16 {
413
- padding-right: var(--x-size-base-16) !important;
410
+ .x-margin--top-15 {
411
+ margin-top: var(--x-size-base-15) !important;
414
412
  }
415
- [dir="rtl"] .x-padding--right-16 {
416
- padding-left: var(--x-size-base-16) !important;
413
+ .x-margin--bottom-15 {
414
+ margin-bottom: var(--x-size-base-15) !important;
417
415
  }
418
- [dir="ltr"] .x-padding--left-16 {
419
- padding-left: var(--x-size-base-16) !important;
416
+ [dir="ltr"] .x-margin--right-15 {
417
+ margin-right: var(--x-size-base-15) !important;
420
418
  }
421
- [dir="rtl"] .x-padding--left-16 {
422
- padding-right: var(--x-size-base-16) !important;
419
+ [dir="rtl"] .x-margin--right-15 {
420
+ margin-left: var(--x-size-base-15) !important;
423
421
  }
424
- .x-padding--top-17 {
425
- padding-top: var(--x-size-base-17) !important;
422
+ [dir="ltr"] .x-margin--left-15 {
423
+ margin-left: var(--x-size-base-15) !important;
426
424
  }
427
- .x-padding--bottom-17 {
428
- padding-bottom: var(--x-size-base-17) !important;
425
+ [dir="rtl"] .x-margin--left-15 {
426
+ margin-right: var(--x-size-base-15) !important;
429
427
  }
430
- [dir="ltr"] .x-padding--right-17 {
431
- padding-right: var(--x-size-base-17) !important;
428
+ .x-margin--top-16 {
429
+ margin-top: var(--x-size-base-16) !important;
432
430
  }
433
- [dir="rtl"] .x-padding--right-17 {
434
- padding-left: var(--x-size-base-17) !important;
431
+ .x-margin--bottom-16 {
432
+ margin-bottom: var(--x-size-base-16) !important;
435
433
  }
436
- [dir="ltr"] .x-padding--left-17 {
437
- padding-left: var(--x-size-base-17) !important;
434
+ [dir="ltr"] .x-margin--right-16 {
435
+ margin-right: var(--x-size-base-16) !important;
438
436
  }
439
- [dir="rtl"] .x-padding--left-17 {
440
- padding-right: var(--x-size-base-17) !important;
437
+ [dir="rtl"] .x-margin--right-16 {
438
+ margin-left: var(--x-size-base-16) !important;
441
439
  }
442
- .x-padding--top-18 {
443
- padding-top: var(--x-size-base-18) !important;
440
+ [dir="ltr"] .x-margin--left-16 {
441
+ margin-left: var(--x-size-base-16) !important;
444
442
  }
445
- .x-padding--bottom-18 {
446
- padding-bottom: var(--x-size-base-18) !important;
443
+ [dir="rtl"] .x-margin--left-16 {
444
+ margin-right: var(--x-size-base-16) !important;
447
445
  }
448
- [dir="ltr"] .x-padding--right-18 {
449
- padding-right: var(--x-size-base-18) !important;
446
+ .x-margin--top-17 {
447
+ margin-top: var(--x-size-base-17) !important;
450
448
  }
451
- [dir="rtl"] .x-padding--right-18 {
452
- padding-left: var(--x-size-base-18) !important;
449
+ .x-margin--bottom-17 {
450
+ margin-bottom: var(--x-size-base-17) !important;
453
451
  }
454
- [dir="ltr"] .x-padding--left-18 {
455
- padding-left: var(--x-size-base-18) !important;
452
+ [dir="ltr"] .x-margin--right-17 {
453
+ margin-right: var(--x-size-base-17) !important;
456
454
  }
457
- [dir="rtl"] .x-padding--left-18 {
458
- padding-right: var(--x-size-base-18) !important;
455
+ [dir="rtl"] .x-margin--right-17 {
456
+ margin-left: var(--x-size-base-17) !important;
459
457
  }
460
- .x-padding--top-19 {
461
- padding-top: var(--x-size-base-19) !important;
458
+ [dir="ltr"] .x-margin--left-17 {
459
+ margin-left: var(--x-size-base-17) !important;
462
460
  }
463
- .x-padding--bottom-19 {
464
- padding-bottom: var(--x-size-base-19) !important;
461
+ [dir="rtl"] .x-margin--left-17 {
462
+ margin-right: var(--x-size-base-17) !important;
465
463
  }
466
- [dir="ltr"] .x-padding--right-19 {
467
- padding-right: var(--x-size-base-19) !important;
464
+ .x-margin--top-18 {
465
+ margin-top: var(--x-size-base-18) !important;
468
466
  }
469
- [dir="rtl"] .x-padding--right-19 {
470
- padding-left: var(--x-size-base-19) !important;
467
+ .x-margin--bottom-18 {
468
+ margin-bottom: var(--x-size-base-18) !important;
471
469
  }
472
- [dir="ltr"] .x-padding--left-19 {
473
- padding-left: var(--x-size-base-19) !important;
470
+ [dir="ltr"] .x-margin--right-18 {
471
+ margin-right: var(--x-size-base-18) !important;
474
472
  }
475
- [dir="rtl"] .x-padding--left-19 {
476
- padding-right: var(--x-size-base-19) !important;
473
+ [dir="rtl"] .x-margin--right-18 {
474
+ margin-left: var(--x-size-base-18) !important;
477
475
  }
478
- .x-padding--top-20 {
479
- padding-top: var(--x-size-base-20) !important;
476
+ [dir="ltr"] .x-margin--left-18 {
477
+ margin-left: var(--x-size-base-18) !important;
480
478
  }
481
- .x-padding--bottom-20 {
482
- padding-bottom: var(--x-size-base-20) !important;
479
+ [dir="rtl"] .x-margin--left-18 {
480
+ margin-right: var(--x-size-base-18) !important;
483
481
  }
484
- [dir="ltr"] .x-padding--right-20 {
485
- padding-right: var(--x-size-base-20) !important;
482
+ .x-margin--top-19 {
483
+ margin-top: var(--x-size-base-19) !important;
486
484
  }
487
- [dir="rtl"] .x-padding--right-20 {
488
- padding-left: var(--x-size-base-20) !important;
485
+ .x-margin--bottom-19 {
486
+ margin-bottom: var(--x-size-base-19) !important;
489
487
  }
490
- [dir="ltr"] .x-padding--left-20 {
491
- padding-left: var(--x-size-base-20) !important;
488
+ [dir="ltr"] .x-margin--right-19 {
489
+ margin-right: var(--x-size-base-19) !important;
492
490
  }
493
- [dir="rtl"] .x-padding--left-20 {
494
- padding-right: var(--x-size-base-20) !important;
491
+ [dir="rtl"] .x-margin--right-19 {
492
+ margin-left: var(--x-size-base-19) !important;
495
493
  }
496
- .x-margin--auto {
497
- margin: auto !important;
494
+ [dir="ltr"] .x-margin--left-19 {
495
+ margin-left: var(--x-size-base-19) !important;
498
496
  }
499
- .x-margin--00 {
500
- margin: 0 !important;
497
+ [dir="rtl"] .x-margin--left-19 {
498
+ margin-right: var(--x-size-base-19) !important;
501
499
  }
502
- .x-margin--01 {
503
- margin: var(--x-size-base-01) !important;
500
+ .x-margin--top-20 {
501
+ margin-top: var(--x-size-base-20) !important;
504
502
  }
505
- .x-margin--02 {
506
- margin: var(--x-size-base-02) !important;
503
+ .x-margin--bottom-20 {
504
+ margin-bottom: var(--x-size-base-20) !important;
507
505
  }
508
- .x-margin--03 {
509
- margin: var(--x-size-base-03) !important;
506
+ [dir="ltr"] .x-margin--right-20 {
507
+ margin-right: var(--x-size-base-20) !important;
510
508
  }
511
- .x-margin--04 {
512
- margin: var(--x-size-base-04) !important;
509
+ [dir="rtl"] .x-margin--right-20 {
510
+ margin-left: var(--x-size-base-20) !important;
513
511
  }
514
- .x-margin--05 {
515
- margin: var(--x-size-base-05) !important;
512
+ [dir="ltr"] .x-margin--left-20 {
513
+ margin-left: var(--x-size-base-20) !important;
516
514
  }
517
- .x-margin--06 {
518
- margin: var(--x-size-base-06) !important;
515
+ [dir="rtl"] .x-margin--left-20 {
516
+ margin-right: var(--x-size-base-20) !important;
519
517
  }
520
- .x-margin--07 {
521
- margin: var(--x-size-base-07) !important;
518
+ .x-line-clamp--2 {
519
+ overflow: hidden !important;
520
+ display: -webkit-box !important;
521
+ -webkit-box-orient: vertical !important;
522
+ -webkit-line-clamp: 2 !important;
522
523
  }
523
- .x-margin--08 {
524
- margin: var(--x-size-base-08) !important;
524
+
525
+ .x-line-clamp--3 {
526
+ overflow: hidden !important;
527
+ display: -webkit-box !important;
528
+ -webkit-box-orient: vertical !important;
529
+ -webkit-line-clamp: 3 !important;
525
530
  }
526
- .x-margin--09 {
527
- margin: var(--x-size-base-09) !important;
531
+
532
+ .x-line-clamp--4 {
533
+ overflow: hidden !important;
534
+ display: -webkit-box !important;
535
+ -webkit-box-orient: vertical !important;
536
+ -webkit-line-clamp: 4 !important;
528
537
  }
529
- .x-margin--10 {
530
- margin: var(--x-size-base-10) !important;
538
+
539
+ .x-line-clamp--5 {
540
+ overflow: hidden !important;
541
+ display: -webkit-box !important;
542
+ -webkit-box-orient: vertical !important;
543
+ -webkit-line-clamp: 5 !important;
531
544
  }
532
- .x-margin--11 {
533
- margin: var(--x-size-base-11) !important;
545
+
546
+ .x-line-clamp--6 {
547
+ overflow: hidden !important;
548
+ display: -webkit-box !important;
549
+ -webkit-box-orient: vertical !important;
550
+ -webkit-line-clamp: 6 !important;
534
551
  }
535
- .x-margin--12 {
536
- margin: var(--x-size-base-12) !important;
552
+ .x-line-height--none {
553
+ line-height: 1 !important;
537
554
  }
538
- .x-margin--13 {
539
- margin: var(--x-size-base-13) !important;
555
+
556
+ .x-line-height--tight {
557
+ line-height: 1.25 !important;
540
558
  }
541
- .x-margin--14 {
542
- margin: var(--x-size-base-14) !important;
559
+
560
+ .x-line-height--snug {
561
+ line-height: 1.375 !important;
543
562
  }
544
- .x-margin--15 {
545
- margin: var(--x-size-base-15) !important;
563
+
564
+ .x-line-height--normal {
565
+ line-height: 1.5 !important;
546
566
  }
547
- .x-margin--16 {
548
- margin: var(--x-size-base-16) !important;
567
+
568
+ .x-line-height--relaxed {
569
+ line-height: 1.625 !important;
549
570
  }
550
- .x-margin--17 {
551
- margin: var(--x-size-base-17) !important;
571
+
572
+ .x-line-height--loose {
573
+ line-height: 2 !important;
552
574
  }
553
- .x-margin--18 {
554
- margin: var(--x-size-base-18) !important;
575
+ .x-padding--00 {
576
+ padding: 0 !important;
555
577
  }
556
- .x-margin--19 {
557
- margin: var(--x-size-base-19) !important;
578
+ .x-padding--01 {
579
+ padding: var(--x-size-base-01) !important;
558
580
  }
559
- .x-margin--20 {
560
- margin: var(--x-size-base-20) !important;
581
+ .x-padding--02 {
582
+ padding: var(--x-size-base-02) !important;
561
583
  }
562
- .x-margin--top-auto {
563
- margin-top: auto !important;
584
+ .x-padding--03 {
585
+ padding: var(--x-size-base-03) !important;
564
586
  }
565
- .x-margin--bottom-auto {
566
- margin-bottom: auto !important;
587
+ .x-padding--04 {
588
+ padding: var(--x-size-base-04) !important;
567
589
  }
568
- [dir="ltr"] .x-margin--right-auto {
569
- margin-right: auto !important;
590
+ .x-padding--05 {
591
+ padding: var(--x-size-base-05) !important;
570
592
  }
571
- [dir="rtl"] .x-margin--right-auto {
572
- margin-left: auto !important;
593
+ .x-padding--06 {
594
+ padding: var(--x-size-base-06) !important;
573
595
  }
574
- [dir="ltr"] .x-margin--left-auto {
575
- margin-left: auto !important;
596
+ .x-padding--07 {
597
+ padding: var(--x-size-base-07) !important;
576
598
  }
577
- [dir="rtl"] .x-margin--left-auto {
578
- margin-right: auto !important;
599
+ .x-padding--08 {
600
+ padding: var(--x-size-base-08) !important;
579
601
  }
580
- .x-margin--top-00 {
581
- margin-top: 0 !important;
602
+ .x-padding--09 {
603
+ padding: var(--x-size-base-09) !important;
582
604
  }
583
- .x-margin--bottom-00 {
584
- margin-bottom: 0 !important;
605
+ .x-padding--10 {
606
+ padding: var(--x-size-base-10) !important;
585
607
  }
586
- [dir="ltr"] .x-margin--right-00 {
587
- margin-right: 0 !important;
608
+ .x-padding--11 {
609
+ padding: var(--x-size-base-11) !important;
588
610
  }
589
- [dir="rtl"] .x-margin--right-00 {
590
- margin-left: 0 !important;
611
+ .x-padding--12 {
612
+ padding: var(--x-size-base-12) !important;
591
613
  }
592
- [dir="ltr"] .x-margin--left-00 {
593
- margin-left: 0 !important;
614
+ .x-padding--13 {
615
+ padding: var(--x-size-base-13) !important;
594
616
  }
595
- [dir="rtl"] .x-margin--left-00 {
596
- margin-right: 0 !important;
617
+ .x-padding--14 {
618
+ padding: var(--x-size-base-14) !important;
597
619
  }
598
- .x-margin--top-01 {
599
- margin-top: var(--x-size-base-01) !important;
620
+ .x-padding--15 {
621
+ padding: var(--x-size-base-15) !important;
600
622
  }
601
- .x-margin--bottom-01 {
602
- margin-bottom: var(--x-size-base-01) !important;
623
+ .x-padding--16 {
624
+ padding: var(--x-size-base-16) !important;
603
625
  }
604
- [dir="ltr"] .x-margin--right-01 {
605
- margin-right: var(--x-size-base-01) !important;
626
+ .x-padding--17 {
627
+ padding: var(--x-size-base-17) !important;
606
628
  }
607
- [dir="rtl"] .x-margin--right-01 {
608
- margin-left: var(--x-size-base-01) !important;
629
+ .x-padding--18 {
630
+ padding: var(--x-size-base-18) !important;
609
631
  }
610
- [dir="ltr"] .x-margin--left-01 {
611
- margin-left: var(--x-size-base-01) !important;
632
+ .x-padding--19 {
633
+ padding: var(--x-size-base-19) !important;
612
634
  }
613
- [dir="rtl"] .x-margin--left-01 {
614
- margin-right: var(--x-size-base-01) !important;
635
+ .x-padding--20 {
636
+ padding: var(--x-size-base-20) !important;
615
637
  }
616
- .x-margin--top-02 {
617
- margin-top: var(--x-size-base-02) !important;
638
+ .x-padding--top-00 {
639
+ padding-top: 0 !important;
618
640
  }
619
- .x-margin--bottom-02 {
620
- margin-bottom: var(--x-size-base-02) !important;
641
+ .x-padding--bottom-00 {
642
+ padding-bottom: 0 !important;
621
643
  }
622
- [dir="ltr"] .x-margin--right-02 {
623
- margin-right: var(--x-size-base-02) !important;
644
+ [dir="ltr"] .x-padding--right-00 {
645
+ padding-right: 0 !important;
624
646
  }
625
- [dir="rtl"] .x-margin--right-02 {
626
- margin-left: var(--x-size-base-02) !important;
647
+ [dir="rtl"] .x-padding--right-00 {
648
+ padding-left: 0 !important;
627
649
  }
628
- [dir="ltr"] .x-margin--left-02 {
629
- margin-left: var(--x-size-base-02) !important;
650
+ [dir="ltr"] .x-padding--left-00 {
651
+ padding-left: 0 !important;
630
652
  }
631
- [dir="rtl"] .x-margin--left-02 {
632
- margin-right: var(--x-size-base-02) !important;
653
+ [dir="rtl"] .x-padding--left-00 {
654
+ padding-right: 0 !important;
633
655
  }
634
- .x-margin--top-03 {
635
- margin-top: var(--x-size-base-03) !important;
656
+ .x-padding--top-01 {
657
+ padding-top: var(--x-size-base-01) !important;
636
658
  }
637
- .x-margin--bottom-03 {
638
- margin-bottom: var(--x-size-base-03) !important;
659
+ .x-padding--bottom-01 {
660
+ padding-bottom: var(--x-size-base-01) !important;
639
661
  }
640
- [dir="ltr"] .x-margin--right-03 {
641
- margin-right: var(--x-size-base-03) !important;
662
+ [dir="ltr"] .x-padding--right-01 {
663
+ padding-right: var(--x-size-base-01) !important;
642
664
  }
643
- [dir="rtl"] .x-margin--right-03 {
644
- margin-left: var(--x-size-base-03) !important;
665
+ [dir="rtl"] .x-padding--right-01 {
666
+ padding-left: var(--x-size-base-01) !important;
645
667
  }
646
- [dir="ltr"] .x-margin--left-03 {
647
- margin-left: var(--x-size-base-03) !important;
668
+ [dir="ltr"] .x-padding--left-01 {
669
+ padding-left: var(--x-size-base-01) !important;
648
670
  }
649
- [dir="rtl"] .x-margin--left-03 {
650
- margin-right: var(--x-size-base-03) !important;
671
+ [dir="rtl"] .x-padding--left-01 {
672
+ padding-right: var(--x-size-base-01) !important;
651
673
  }
652
- .x-margin--top-04 {
653
- margin-top: var(--x-size-base-04) !important;
674
+ .x-padding--top-02 {
675
+ padding-top: var(--x-size-base-02) !important;
654
676
  }
655
- .x-margin--bottom-04 {
656
- margin-bottom: var(--x-size-base-04) !important;
677
+ .x-padding--bottom-02 {
678
+ padding-bottom: var(--x-size-base-02) !important;
657
679
  }
658
- [dir="ltr"] .x-margin--right-04 {
659
- margin-right: var(--x-size-base-04) !important;
680
+ [dir="ltr"] .x-padding--right-02 {
681
+ padding-right: var(--x-size-base-02) !important;
660
682
  }
661
- [dir="rtl"] .x-margin--right-04 {
662
- margin-left: var(--x-size-base-04) !important;
683
+ [dir="rtl"] .x-padding--right-02 {
684
+ padding-left: var(--x-size-base-02) !important;
663
685
  }
664
- [dir="ltr"] .x-margin--left-04 {
665
- margin-left: var(--x-size-base-04) !important;
686
+ [dir="ltr"] .x-padding--left-02 {
687
+ padding-left: var(--x-size-base-02) !important;
666
688
  }
667
- [dir="rtl"] .x-margin--left-04 {
668
- margin-right: var(--x-size-base-04) !important;
689
+ [dir="rtl"] .x-padding--left-02 {
690
+ padding-right: var(--x-size-base-02) !important;
669
691
  }
670
- .x-margin--top-05 {
671
- margin-top: var(--x-size-base-05) !important;
692
+ .x-padding--top-03 {
693
+ padding-top: var(--x-size-base-03) !important;
672
694
  }
673
- .x-margin--bottom-05 {
674
- margin-bottom: var(--x-size-base-05) !important;
695
+ .x-padding--bottom-03 {
696
+ padding-bottom: var(--x-size-base-03) !important;
675
697
  }
676
- [dir="ltr"] .x-margin--right-05 {
677
- margin-right: var(--x-size-base-05) !important;
698
+ [dir="ltr"] .x-padding--right-03 {
699
+ padding-right: var(--x-size-base-03) !important;
678
700
  }
679
- [dir="rtl"] .x-margin--right-05 {
680
- margin-left: var(--x-size-base-05) !important;
701
+ [dir="rtl"] .x-padding--right-03 {
702
+ padding-left: var(--x-size-base-03) !important;
681
703
  }
682
- [dir="ltr"] .x-margin--left-05 {
683
- margin-left: var(--x-size-base-05) !important;
704
+ [dir="ltr"] .x-padding--left-03 {
705
+ padding-left: var(--x-size-base-03) !important;
684
706
  }
685
- [dir="rtl"] .x-margin--left-05 {
686
- margin-right: var(--x-size-base-05) !important;
707
+ [dir="rtl"] .x-padding--left-03 {
708
+ padding-right: var(--x-size-base-03) !important;
687
709
  }
688
- .x-margin--top-06 {
689
- margin-top: var(--x-size-base-06) !important;
710
+ .x-padding--top-04 {
711
+ padding-top: var(--x-size-base-04) !important;
690
712
  }
691
- .x-margin--bottom-06 {
692
- margin-bottom: var(--x-size-base-06) !important;
713
+ .x-padding--bottom-04 {
714
+ padding-bottom: var(--x-size-base-04) !important;
693
715
  }
694
- [dir="ltr"] .x-margin--right-06 {
695
- margin-right: var(--x-size-base-06) !important;
716
+ [dir="ltr"] .x-padding--right-04 {
717
+ padding-right: var(--x-size-base-04) !important;
696
718
  }
697
- [dir="rtl"] .x-margin--right-06 {
698
- margin-left: var(--x-size-base-06) !important;
719
+ [dir="rtl"] .x-padding--right-04 {
720
+ padding-left: var(--x-size-base-04) !important;
699
721
  }
700
- [dir="ltr"] .x-margin--left-06 {
701
- margin-left: var(--x-size-base-06) !important;
722
+ [dir="ltr"] .x-padding--left-04 {
723
+ padding-left: var(--x-size-base-04) !important;
702
724
  }
703
- [dir="rtl"] .x-margin--left-06 {
704
- margin-right: var(--x-size-base-06) !important;
725
+ [dir="rtl"] .x-padding--left-04 {
726
+ padding-right: var(--x-size-base-04) !important;
705
727
  }
706
- .x-margin--top-07 {
707
- margin-top: var(--x-size-base-07) !important;
728
+ .x-padding--top-05 {
729
+ padding-top: var(--x-size-base-05) !important;
708
730
  }
709
- .x-margin--bottom-07 {
710
- margin-bottom: var(--x-size-base-07) !important;
731
+ .x-padding--bottom-05 {
732
+ padding-bottom: var(--x-size-base-05) !important;
711
733
  }
712
- [dir="ltr"] .x-margin--right-07 {
713
- margin-right: var(--x-size-base-07) !important;
734
+ [dir="ltr"] .x-padding--right-05 {
735
+ padding-right: var(--x-size-base-05) !important;
714
736
  }
715
- [dir="rtl"] .x-margin--right-07 {
716
- margin-left: var(--x-size-base-07) !important;
737
+ [dir="rtl"] .x-padding--right-05 {
738
+ padding-left: var(--x-size-base-05) !important;
717
739
  }
718
- [dir="ltr"] .x-margin--left-07 {
719
- margin-left: var(--x-size-base-07) !important;
740
+ [dir="ltr"] .x-padding--left-05 {
741
+ padding-left: var(--x-size-base-05) !important;
720
742
  }
721
- [dir="rtl"] .x-margin--left-07 {
722
- margin-right: var(--x-size-base-07) !important;
743
+ [dir="rtl"] .x-padding--left-05 {
744
+ padding-right: var(--x-size-base-05) !important;
723
745
  }
724
- .x-margin--top-08 {
725
- margin-top: var(--x-size-base-08) !important;
746
+ .x-padding--top-06 {
747
+ padding-top: var(--x-size-base-06) !important;
726
748
  }
727
- .x-margin--bottom-08 {
728
- margin-bottom: var(--x-size-base-08) !important;
749
+ .x-padding--bottom-06 {
750
+ padding-bottom: var(--x-size-base-06) !important;
729
751
  }
730
- [dir="ltr"] .x-margin--right-08 {
731
- margin-right: var(--x-size-base-08) !important;
752
+ [dir="ltr"] .x-padding--right-06 {
753
+ padding-right: var(--x-size-base-06) !important;
732
754
  }
733
- [dir="rtl"] .x-margin--right-08 {
734
- margin-left: var(--x-size-base-08) !important;
755
+ [dir="rtl"] .x-padding--right-06 {
756
+ padding-left: var(--x-size-base-06) !important;
735
757
  }
736
- [dir="ltr"] .x-margin--left-08 {
737
- margin-left: var(--x-size-base-08) !important;
758
+ [dir="ltr"] .x-padding--left-06 {
759
+ padding-left: var(--x-size-base-06) !important;
738
760
  }
739
- [dir="rtl"] .x-margin--left-08 {
740
- margin-right: var(--x-size-base-08) !important;
761
+ [dir="rtl"] .x-padding--left-06 {
762
+ padding-right: var(--x-size-base-06) !important;
741
763
  }
742
- .x-margin--top-09 {
743
- margin-top: var(--x-size-base-09) !important;
764
+ .x-padding--top-07 {
765
+ padding-top: var(--x-size-base-07) !important;
744
766
  }
745
- .x-margin--bottom-09 {
746
- margin-bottom: var(--x-size-base-09) !important;
767
+ .x-padding--bottom-07 {
768
+ padding-bottom: var(--x-size-base-07) !important;
747
769
  }
748
- [dir="ltr"] .x-margin--right-09 {
749
- margin-right: var(--x-size-base-09) !important;
770
+ [dir="ltr"] .x-padding--right-07 {
771
+ padding-right: var(--x-size-base-07) !important;
750
772
  }
751
- [dir="rtl"] .x-margin--right-09 {
752
- margin-left: var(--x-size-base-09) !important;
773
+ [dir="rtl"] .x-padding--right-07 {
774
+ padding-left: var(--x-size-base-07) !important;
753
775
  }
754
- [dir="ltr"] .x-margin--left-09 {
755
- margin-left: var(--x-size-base-09) !important;
776
+ [dir="ltr"] .x-padding--left-07 {
777
+ padding-left: var(--x-size-base-07) !important;
756
778
  }
757
- [dir="rtl"] .x-margin--left-09 {
758
- margin-right: var(--x-size-base-09) !important;
779
+ [dir="rtl"] .x-padding--left-07 {
780
+ padding-right: var(--x-size-base-07) !important;
759
781
  }
760
- .x-margin--top-10 {
761
- margin-top: var(--x-size-base-10) !important;
782
+ .x-padding--top-08 {
783
+ padding-top: var(--x-size-base-08) !important;
762
784
  }
763
- .x-margin--bottom-10 {
764
- margin-bottom: var(--x-size-base-10) !important;
785
+ .x-padding--bottom-08 {
786
+ padding-bottom: var(--x-size-base-08) !important;
765
787
  }
766
- [dir="ltr"] .x-margin--right-10 {
767
- margin-right: var(--x-size-base-10) !important;
788
+ [dir="ltr"] .x-padding--right-08 {
789
+ padding-right: var(--x-size-base-08) !important;
768
790
  }
769
- [dir="rtl"] .x-margin--right-10 {
770
- margin-left: var(--x-size-base-10) !important;
791
+ [dir="rtl"] .x-padding--right-08 {
792
+ padding-left: var(--x-size-base-08) !important;
771
793
  }
772
- [dir="ltr"] .x-margin--left-10 {
773
- margin-left: var(--x-size-base-10) !important;
794
+ [dir="ltr"] .x-padding--left-08 {
795
+ padding-left: var(--x-size-base-08) !important;
774
796
  }
775
- [dir="rtl"] .x-margin--left-10 {
776
- margin-right: var(--x-size-base-10) !important;
797
+ [dir="rtl"] .x-padding--left-08 {
798
+ padding-right: var(--x-size-base-08) !important;
777
799
  }
778
- .x-margin--top-11 {
779
- margin-top: var(--x-size-base-11) !important;
800
+ .x-padding--top-09 {
801
+ padding-top: var(--x-size-base-09) !important;
780
802
  }
781
- .x-margin--bottom-11 {
782
- margin-bottom: var(--x-size-base-11) !important;
803
+ .x-padding--bottom-09 {
804
+ padding-bottom: var(--x-size-base-09) !important;
783
805
  }
784
- [dir="ltr"] .x-margin--right-11 {
785
- margin-right: var(--x-size-base-11) !important;
806
+ [dir="ltr"] .x-padding--right-09 {
807
+ padding-right: var(--x-size-base-09) !important;
786
808
  }
787
- [dir="rtl"] .x-margin--right-11 {
788
- margin-left: var(--x-size-base-11) !important;
809
+ [dir="rtl"] .x-padding--right-09 {
810
+ padding-left: var(--x-size-base-09) !important;
789
811
  }
790
- [dir="ltr"] .x-margin--left-11 {
791
- margin-left: var(--x-size-base-11) !important;
812
+ [dir="ltr"] .x-padding--left-09 {
813
+ padding-left: var(--x-size-base-09) !important;
792
814
  }
793
- [dir="rtl"] .x-margin--left-11 {
794
- margin-right: var(--x-size-base-11) !important;
815
+ [dir="rtl"] .x-padding--left-09 {
816
+ padding-right: var(--x-size-base-09) !important;
795
817
  }
796
- .x-margin--top-12 {
797
- margin-top: var(--x-size-base-12) !important;
818
+ .x-padding--top-10 {
819
+ padding-top: var(--x-size-base-10) !important;
798
820
  }
799
- .x-margin--bottom-12 {
800
- margin-bottom: var(--x-size-base-12) !important;
821
+ .x-padding--bottom-10 {
822
+ padding-bottom: var(--x-size-base-10) !important;
801
823
  }
802
- [dir="ltr"] .x-margin--right-12 {
803
- margin-right: var(--x-size-base-12) !important;
824
+ [dir="ltr"] .x-padding--right-10 {
825
+ padding-right: var(--x-size-base-10) !important;
804
826
  }
805
- [dir="rtl"] .x-margin--right-12 {
806
- margin-left: var(--x-size-base-12) !important;
827
+ [dir="rtl"] .x-padding--right-10 {
828
+ padding-left: var(--x-size-base-10) !important;
807
829
  }
808
- [dir="ltr"] .x-margin--left-12 {
809
- margin-left: var(--x-size-base-12) !important;
830
+ [dir="ltr"] .x-padding--left-10 {
831
+ padding-left: var(--x-size-base-10) !important;
810
832
  }
811
- [dir="rtl"] .x-margin--left-12 {
812
- margin-right: var(--x-size-base-12) !important;
833
+ [dir="rtl"] .x-padding--left-10 {
834
+ padding-right: var(--x-size-base-10) !important;
813
835
  }
814
- .x-margin--top-13 {
815
- margin-top: var(--x-size-base-13) !important;
836
+ .x-padding--top-11 {
837
+ padding-top: var(--x-size-base-11) !important;
816
838
  }
817
- .x-margin--bottom-13 {
818
- margin-bottom: var(--x-size-base-13) !important;
839
+ .x-padding--bottom-11 {
840
+ padding-bottom: var(--x-size-base-11) !important;
819
841
  }
820
- [dir="ltr"] .x-margin--right-13 {
821
- margin-right: var(--x-size-base-13) !important;
842
+ [dir="ltr"] .x-padding--right-11 {
843
+ padding-right: var(--x-size-base-11) !important;
822
844
  }
823
- [dir="rtl"] .x-margin--right-13 {
824
- margin-left: var(--x-size-base-13) !important;
845
+ [dir="rtl"] .x-padding--right-11 {
846
+ padding-left: var(--x-size-base-11) !important;
825
847
  }
826
- [dir="ltr"] .x-margin--left-13 {
827
- margin-left: var(--x-size-base-13) !important;
848
+ [dir="ltr"] .x-padding--left-11 {
849
+ padding-left: var(--x-size-base-11) !important;
828
850
  }
829
- [dir="rtl"] .x-margin--left-13 {
830
- margin-right: var(--x-size-base-13) !important;
851
+ [dir="rtl"] .x-padding--left-11 {
852
+ padding-right: var(--x-size-base-11) !important;
831
853
  }
832
- .x-margin--top-14 {
833
- margin-top: var(--x-size-base-14) !important;
854
+ .x-padding--top-12 {
855
+ padding-top: var(--x-size-base-12) !important;
834
856
  }
835
- .x-margin--bottom-14 {
836
- margin-bottom: var(--x-size-base-14) !important;
857
+ .x-padding--bottom-12 {
858
+ padding-bottom: var(--x-size-base-12) !important;
837
859
  }
838
- [dir="ltr"] .x-margin--right-14 {
839
- margin-right: var(--x-size-base-14) !important;
860
+ [dir="ltr"] .x-padding--right-12 {
861
+ padding-right: var(--x-size-base-12) !important;
840
862
  }
841
- [dir="rtl"] .x-margin--right-14 {
842
- margin-left: var(--x-size-base-14) !important;
863
+ [dir="rtl"] .x-padding--right-12 {
864
+ padding-left: var(--x-size-base-12) !important;
843
865
  }
844
- [dir="ltr"] .x-margin--left-14 {
845
- margin-left: var(--x-size-base-14) !important;
866
+ [dir="ltr"] .x-padding--left-12 {
867
+ padding-left: var(--x-size-base-12) !important;
846
868
  }
847
- [dir="rtl"] .x-margin--left-14 {
848
- margin-right: var(--x-size-base-14) !important;
869
+ [dir="rtl"] .x-padding--left-12 {
870
+ padding-right: var(--x-size-base-12) !important;
849
871
  }
850
- .x-margin--top-15 {
851
- margin-top: var(--x-size-base-15) !important;
872
+ .x-padding--top-13 {
873
+ padding-top: var(--x-size-base-13) !important;
852
874
  }
853
- .x-margin--bottom-15 {
854
- margin-bottom: var(--x-size-base-15) !important;
875
+ .x-padding--bottom-13 {
876
+ padding-bottom: var(--x-size-base-13) !important;
855
877
  }
856
- [dir="ltr"] .x-margin--right-15 {
857
- margin-right: var(--x-size-base-15) !important;
878
+ [dir="ltr"] .x-padding--right-13 {
879
+ padding-right: var(--x-size-base-13) !important;
858
880
  }
859
- [dir="rtl"] .x-margin--right-15 {
860
- margin-left: var(--x-size-base-15) !important;
881
+ [dir="rtl"] .x-padding--right-13 {
882
+ padding-left: var(--x-size-base-13) !important;
861
883
  }
862
- [dir="ltr"] .x-margin--left-15 {
863
- margin-left: var(--x-size-base-15) !important;
884
+ [dir="ltr"] .x-padding--left-13 {
885
+ padding-left: var(--x-size-base-13) !important;
864
886
  }
865
- [dir="rtl"] .x-margin--left-15 {
866
- margin-right: var(--x-size-base-15) !important;
887
+ [dir="rtl"] .x-padding--left-13 {
888
+ padding-right: var(--x-size-base-13) !important;
867
889
  }
868
- .x-margin--top-16 {
869
- margin-top: var(--x-size-base-16) !important;
890
+ .x-padding--top-14 {
891
+ padding-top: var(--x-size-base-14) !important;
870
892
  }
871
- .x-margin--bottom-16 {
872
- margin-bottom: var(--x-size-base-16) !important;
893
+ .x-padding--bottom-14 {
894
+ padding-bottom: var(--x-size-base-14) !important;
873
895
  }
874
- [dir="ltr"] .x-margin--right-16 {
875
- margin-right: var(--x-size-base-16) !important;
896
+ [dir="ltr"] .x-padding--right-14 {
897
+ padding-right: var(--x-size-base-14) !important;
876
898
  }
877
- [dir="rtl"] .x-margin--right-16 {
878
- margin-left: var(--x-size-base-16) !important;
899
+ [dir="rtl"] .x-padding--right-14 {
900
+ padding-left: var(--x-size-base-14) !important;
879
901
  }
880
- [dir="ltr"] .x-margin--left-16 {
881
- margin-left: var(--x-size-base-16) !important;
902
+ [dir="ltr"] .x-padding--left-14 {
903
+ padding-left: var(--x-size-base-14) !important;
882
904
  }
883
- [dir="rtl"] .x-margin--left-16 {
884
- margin-right: var(--x-size-base-16) !important;
905
+ [dir="rtl"] .x-padding--left-14 {
906
+ padding-right: var(--x-size-base-14) !important;
885
907
  }
886
- .x-margin--top-17 {
887
- margin-top: var(--x-size-base-17) !important;
908
+ .x-padding--top-15 {
909
+ padding-top: var(--x-size-base-15) !important;
888
910
  }
889
- .x-margin--bottom-17 {
890
- margin-bottom: var(--x-size-base-17) !important;
911
+ .x-padding--bottom-15 {
912
+ padding-bottom: var(--x-size-base-15) !important;
891
913
  }
892
- [dir="ltr"] .x-margin--right-17 {
893
- margin-right: var(--x-size-base-17) !important;
914
+ [dir="ltr"] .x-padding--right-15 {
915
+ padding-right: var(--x-size-base-15) !important;
894
916
  }
895
- [dir="rtl"] .x-margin--right-17 {
896
- margin-left: var(--x-size-base-17) !important;
917
+ [dir="rtl"] .x-padding--right-15 {
918
+ padding-left: var(--x-size-base-15) !important;
897
919
  }
898
- [dir="ltr"] .x-margin--left-17 {
899
- margin-left: var(--x-size-base-17) !important;
920
+ [dir="ltr"] .x-padding--left-15 {
921
+ padding-left: var(--x-size-base-15) !important;
900
922
  }
901
- [dir="rtl"] .x-margin--left-17 {
902
- margin-right: var(--x-size-base-17) !important;
923
+ [dir="rtl"] .x-padding--left-15 {
924
+ padding-right: var(--x-size-base-15) !important;
903
925
  }
904
- .x-margin--top-18 {
905
- margin-top: var(--x-size-base-18) !important;
926
+ .x-padding--top-16 {
927
+ padding-top: var(--x-size-base-16) !important;
906
928
  }
907
- .x-margin--bottom-18 {
908
- margin-bottom: var(--x-size-base-18) !important;
929
+ .x-padding--bottom-16 {
930
+ padding-bottom: var(--x-size-base-16) !important;
909
931
  }
910
- [dir="ltr"] .x-margin--right-18 {
911
- margin-right: var(--x-size-base-18) !important;
932
+ [dir="ltr"] .x-padding--right-16 {
933
+ padding-right: var(--x-size-base-16) !important;
912
934
  }
913
- [dir="rtl"] .x-margin--right-18 {
914
- margin-left: var(--x-size-base-18) !important;
935
+ [dir="rtl"] .x-padding--right-16 {
936
+ padding-left: var(--x-size-base-16) !important;
915
937
  }
916
- [dir="ltr"] .x-margin--left-18 {
917
- margin-left: var(--x-size-base-18) !important;
938
+ [dir="ltr"] .x-padding--left-16 {
939
+ padding-left: var(--x-size-base-16) !important;
918
940
  }
919
- [dir="rtl"] .x-margin--left-18 {
920
- margin-right: var(--x-size-base-18) !important;
941
+ [dir="rtl"] .x-padding--left-16 {
942
+ padding-right: var(--x-size-base-16) !important;
921
943
  }
922
- .x-margin--top-19 {
923
- margin-top: var(--x-size-base-19) !important;
944
+ .x-padding--top-17 {
945
+ padding-top: var(--x-size-base-17) !important;
924
946
  }
925
- .x-margin--bottom-19 {
926
- margin-bottom: var(--x-size-base-19) !important;
947
+ .x-padding--bottom-17 {
948
+ padding-bottom: var(--x-size-base-17) !important;
927
949
  }
928
- [dir="ltr"] .x-margin--right-19 {
929
- margin-right: var(--x-size-base-19) !important;
950
+ [dir="ltr"] .x-padding--right-17 {
951
+ padding-right: var(--x-size-base-17) !important;
930
952
  }
931
- [dir="rtl"] .x-margin--right-19 {
932
- margin-left: var(--x-size-base-19) !important;
953
+ [dir="rtl"] .x-padding--right-17 {
954
+ padding-left: var(--x-size-base-17) !important;
933
955
  }
934
- [dir="ltr"] .x-margin--left-19 {
935
- margin-left: var(--x-size-base-19) !important;
956
+ [dir="ltr"] .x-padding--left-17 {
957
+ padding-left: var(--x-size-base-17) !important;
936
958
  }
937
- [dir="rtl"] .x-margin--left-19 {
938
- margin-right: var(--x-size-base-19) !important;
959
+ [dir="rtl"] .x-padding--left-17 {
960
+ padding-right: var(--x-size-base-17) !important;
939
961
  }
940
- .x-margin--top-20 {
941
- margin-top: var(--x-size-base-20) !important;
962
+ .x-padding--top-18 {
963
+ padding-top: var(--x-size-base-18) !important;
942
964
  }
943
- .x-margin--bottom-20 {
944
- margin-bottom: var(--x-size-base-20) !important;
965
+ .x-padding--bottom-18 {
966
+ padding-bottom: var(--x-size-base-18) !important;
945
967
  }
946
- [dir="ltr"] .x-margin--right-20 {
947
- margin-right: var(--x-size-base-20) !important;
968
+ [dir="ltr"] .x-padding--right-18 {
969
+ padding-right: var(--x-size-base-18) !important;
948
970
  }
949
- [dir="rtl"] .x-margin--right-20 {
950
- margin-left: var(--x-size-base-20) !important;
971
+ [dir="rtl"] .x-padding--right-18 {
972
+ padding-left: var(--x-size-base-18) !important;
951
973
  }
952
- [dir="ltr"] .x-margin--left-20 {
953
- margin-left: var(--x-size-base-20) !important;
974
+ [dir="ltr"] .x-padding--left-18 {
975
+ padding-left: var(--x-size-base-18) !important;
954
976
  }
955
- [dir="rtl"] .x-margin--left-20 {
956
- margin-right: var(--x-size-base-20) !important;
977
+ [dir="rtl"] .x-padding--left-18 {
978
+ padding-right: var(--x-size-base-18) !important;
957
979
  }
958
- .x-line-height--none {
959
- line-height: 1 !important;
980
+ .x-padding--top-19 {
981
+ padding-top: var(--x-size-base-19) !important;
960
982
  }
961
-
962
- .x-line-height--tight {
963
- line-height: 1.25 !important;
983
+ .x-padding--bottom-19 {
984
+ padding-bottom: var(--x-size-base-19) !important;
964
985
  }
965
-
966
- .x-line-height--snug {
967
- line-height: 1.375 !important;
986
+ [dir="ltr"] .x-padding--right-19 {
987
+ padding-right: var(--x-size-base-19) !important;
968
988
  }
969
-
970
- .x-line-height--normal {
971
- line-height: 1.5 !important;
989
+ [dir="rtl"] .x-padding--right-19 {
990
+ padding-left: var(--x-size-base-19) !important;
972
991
  }
973
-
974
- .x-line-height--relaxed {
975
- line-height: 1.625 !important;
992
+ [dir="ltr"] .x-padding--left-19 {
993
+ padding-left: var(--x-size-base-19) !important;
976
994
  }
977
-
978
- .x-line-height--loose {
979
- line-height: 2 !important;
995
+ [dir="rtl"] .x-padding--left-19 {
996
+ padding-right: var(--x-size-base-19) !important;
980
997
  }
981
- .x-line-clamp--2 {
982
- overflow: hidden !important;
983
- display: -webkit-box !important;
984
- -webkit-box-orient: vertical !important;
985
- -webkit-line-clamp: 2 !important;
998
+ .x-padding--top-20 {
999
+ padding-top: var(--x-size-base-20) !important;
986
1000
  }
987
-
988
- .x-line-clamp--3 {
989
- overflow: hidden !important;
990
- display: -webkit-box !important;
991
- -webkit-box-orient: vertical !important;
992
- -webkit-line-clamp: 3 !important;
1001
+ .x-padding--bottom-20 {
1002
+ padding-bottom: var(--x-size-base-20) !important;
993
1003
  }
994
-
995
- .x-line-clamp--4 {
996
- overflow: hidden !important;
997
- display: -webkit-box !important;
998
- -webkit-box-orient: vertical !important;
999
- -webkit-line-clamp: 4 !important;
1004
+ [dir="ltr"] .x-padding--right-20 {
1005
+ padding-right: var(--x-size-base-20) !important;
1000
1006
  }
1001
-
1002
- .x-line-clamp--5 {
1003
- overflow: hidden !important;
1004
- display: -webkit-box !important;
1005
- -webkit-box-orient: vertical !important;
1006
- -webkit-line-clamp: 5 !important;
1007
+ [dir="rtl"] .x-padding--right-20 {
1008
+ padding-left: var(--x-size-base-20) !important;
1007
1009
  }
1008
-
1009
- .x-line-clamp--6 {
1010
- overflow: hidden !important;
1011
- display: -webkit-box !important;
1012
- -webkit-box-orient: vertical !important;
1013
- -webkit-line-clamp: 6 !important;
1010
+ [dir="ltr"] .x-padding--left-20 {
1011
+ padding-left: var(--x-size-base-20) !important;
1012
+ }
1013
+ [dir="rtl"] .x-padding--left-20 {
1014
+ padding-right: var(--x-size-base-20) !important;
1014
1015
  }
1015
1016
  .x-font-weight--light {
1016
1017
  font-weight: var(--x-number-font-weight-base-light) !important;
@@ -3417,6 +3418,9 @@
3417
3418
  :root {
3418
3419
  --x-color-text-secondary: var(--x-color-base-neutral-35);
3419
3420
  }
3421
+ .x-text--secondary {
3422
+ --x-color-text-default: var(--x-color-text-secondary);
3423
+ }
3420
3424
  .x-text--light.x-text {
3421
3425
  --x-number-font-weight-text: var(--x-number-font-weight-base-light);
3422
3426
  }
@@ -3432,9 +3436,6 @@
3432
3436
  .x-text--light.x-small {
3433
3437
  --x-number-font-weight-small: var(--x-number-font-weight-base-light);
3434
3438
  }
3435
- .x-text--secondary {
3436
- --x-color-text-default: var(--x-color-text-secondary);
3437
- }
3438
3439
  :root {
3439
3440
  --x-font-family-base: "Montserrat", sans-serif;
3440
3441
  --x-size-font-base-xs: 12px;
@@ -3475,6 +3476,24 @@
3475
3476
  --x-size-line-height-small: var(--x-size-line-height-base-s);
3476
3477
  --x-string-text-decoration-small: none;
3477
3478
  }
3479
+ .x-text--bold.x-text {
3480
+ --x-number-font-weight-text: var(--x-number-font-weight-base-bold);
3481
+ }
3482
+ .x-text--bold.x-title1 {
3483
+ --x-number-font-weight-title1: var(--x-number-font-weight-base-bold);
3484
+ }
3485
+ .x-text--bold.x-title2 {
3486
+ --x-number-font-weight-title2: var(--x-number-font-weight-base-bold);
3487
+ }
3488
+ .x-text--bold.x-title3 {
3489
+ --x-number-font-weight-title3: var(--x-number-font-weight-base-bold);
3490
+ }
3491
+ .x-text--bold.x-small {
3492
+ --x-number-font-weight-small: var(--x-number-font-weight-base-bold);
3493
+ }
3494
+ :root {
3495
+ --x-color-text-accent: var(--x-color-base-accent);
3496
+ }
3478
3497
  :root {
3479
3498
  --x-font-family-base: "Montserrat", sans-serif;
3480
3499
  --x-size-font-base-xs: 12px;
@@ -3577,24 +3596,6 @@
3577
3596
  overflow: hidden;
3578
3597
  white-space: nowrap;
3579
3598
  }
3580
- .x-text--bold.x-text {
3581
- --x-number-font-weight-text: var(--x-number-font-weight-base-bold);
3582
- }
3583
- .x-text--bold.x-title1 {
3584
- --x-number-font-weight-title1: var(--x-number-font-weight-base-bold);
3585
- }
3586
- .x-text--bold.x-title2 {
3587
- --x-number-font-weight-title2: var(--x-number-font-weight-base-bold);
3588
- }
3589
- .x-text--bold.x-title3 {
3590
- --x-number-font-weight-title3: var(--x-number-font-weight-base-bold);
3591
- }
3592
- .x-text--bold.x-small {
3593
- --x-number-font-weight-small: var(--x-number-font-weight-base-bold);
3594
- }
3595
- :root {
3596
- --x-color-text-accent: var(--x-color-base-accent);
3597
- }
3598
3599
  .x-text--accent {
3599
3600
  --x-color-text-default: var(--x-color-text-accent);
3600
3601
  }
@@ -4964,9 +4965,6 @@
4964
4965
  --x-number-zoom-scale-picture: 1.1;
4965
4966
  --x-number-zoom-duration-picture: 0.3s;
4966
4967
  }
4967
- :root {
4968
- --x-number-aspect-ratio-picture: 1;
4969
- }
4970
4968
  :root {
4971
4969
  --x-number-zoom-scale-picture: 1.1;
4972
4970
  --x-number-zoom-duration-picture: 0.3s;
@@ -4981,6 +4979,9 @@
4981
4979
  :root {
4982
4980
  --x-number-aspect-ratio-picture: 1;
4983
4981
  }
4982
+ :root {
4983
+ --x-number-aspect-ratio-picture: 1;
4984
+ }
4984
4985
 
4985
4986
  .x-picture--fixed-ratio.x-picture {
4986
4987
  aspect-ratio: var(--x-number-aspect-ratio-picture);
@@ -5090,12 +5091,6 @@
5090
5091
  --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5091
5092
  --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5092
5093
  }
5093
- :root {
5094
- --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5095
- --x-mix-blend-mode-picture-colored: multiply;
5096
- --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5097
- --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5098
- }
5099
5094
 
5100
5095
  .x-picture--colored.x-picture {
5101
5096
  --x-color-background-picture-default: var(--x-color-background-picture-colored);
@@ -5109,6 +5104,12 @@
5109
5104
  .x-picture--colored.x-picture .x-picture--placeholder {
5110
5105
  --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-placeholder-colored);
5111
5106
  }
5107
+ :root {
5108
+ --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5109
+ --x-mix-blend-mode-picture-colored: multiply;
5110
+ --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5111
+ --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5112
+ }
5112
5113
  :root {
5113
5114
  --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5114
5115
  --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
@@ -5700,6 +5701,28 @@
5700
5701
  --x-size-padding-list-12: var(--x-size-base-12);
5701
5702
  --x-size-padding-list-13: var(--x-size-base-13);
5702
5703
  }
5704
+ :root {
5705
+ --x-size-gap-list-01: var(--x-size-base-01);
5706
+ --x-size-gap-list-02: var(--x-size-base-02);
5707
+ --x-size-gap-list-03: var(--x-size-base-03);
5708
+ --x-size-gap-list-04: var(--x-size-base-04);
5709
+ --x-size-gap-list-05: var(--x-size-base-05);
5710
+ --x-size-gap-list-06: var(--x-size-base-06);
5711
+ --x-size-gap-list-07: var(--x-size-base-07);
5712
+ --x-size-gap-list-08: var(--x-size-base-08);
5713
+ --x-size-gap-list-09: var(--x-size-base-09);
5714
+ --x-size-gap-list-10: var(--x-size-base-10);
5715
+ --x-size-gap-list-11: var(--x-size-base-11);
5716
+ --x-size-gap-list-12: var(--x-size-base-12);
5717
+ --x-size-gap-list-13: var(--x-size-base-13);
5718
+ --x-size-gap-list-14: var(--x-size-base-14);
5719
+ --x-size-gap-list-15: var(--x-size-base-15);
5720
+ --x-size-gap-list-16: var(--x-size-base-16);
5721
+ --x-size-gap-list-17: var(--x-size-base-17);
5722
+ --x-size-gap-list-18: var(--x-size-base-18);
5723
+ --x-size-gap-list-19: var(--x-size-base-19);
5724
+ --x-size-gap-list-20: var(--x-size-base-20);
5725
+ }
5703
5726
  /* @deprecated */
5704
5727
  :root {
5705
5728
  --x-size-padding-list-01: var(--x-size-base-01);
@@ -6062,28 +6085,6 @@
6062
6085
  --x-size-gap-list-19: var(--x-size-base-19);
6063
6086
  --x-size-gap-list-20: var(--x-size-base-20);
6064
6087
  }
6065
- :root {
6066
- --x-size-gap-list-01: var(--x-size-base-01);
6067
- --x-size-gap-list-02: var(--x-size-base-02);
6068
- --x-size-gap-list-03: var(--x-size-base-03);
6069
- --x-size-gap-list-04: var(--x-size-base-04);
6070
- --x-size-gap-list-05: var(--x-size-base-05);
6071
- --x-size-gap-list-06: var(--x-size-base-06);
6072
- --x-size-gap-list-07: var(--x-size-base-07);
6073
- --x-size-gap-list-08: var(--x-size-base-08);
6074
- --x-size-gap-list-09: var(--x-size-base-09);
6075
- --x-size-gap-list-10: var(--x-size-base-10);
6076
- --x-size-gap-list-11: var(--x-size-base-11);
6077
- --x-size-gap-list-12: var(--x-size-base-12);
6078
- --x-size-gap-list-13: var(--x-size-base-13);
6079
- --x-size-gap-list-14: var(--x-size-base-14);
6080
- --x-size-gap-list-15: var(--x-size-base-15);
6081
- --x-size-gap-list-16: var(--x-size-base-16);
6082
- --x-size-gap-list-17: var(--x-size-base-17);
6083
- --x-size-gap-list-18: var(--x-size-base-18);
6084
- --x-size-gap-list-19: var(--x-size-base-19);
6085
- --x-size-gap-list-20: var(--x-size-base-20);
6086
- }
6087
6088
 
6088
6089
  .x-list--gap-01.x-list {
6089
6090
  gap: var(--x-size-gap-list-01);
@@ -7121,35 +7122,13 @@
7121
7122
  }
7122
7123
  :root {
7123
7124
  --x-size-padding-top-input-line: var(--x-size-base-03);
7124
- --x-size-padding-right-input-line: 0;
7125
- --x-size-padding-bottom-input-line: var(--x-size-base-03);
7126
- --x-size-padding-left-input-line: 0;
7127
- --x-size-border-width-top-input-line: 0;
7128
- --x-size-border-width-right-input-line: 0;
7129
- --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7130
- --x-size-border-width-left-input-line: 0;
7131
- }
7132
- :root {
7133
- --x-size-padding-top-input-line: var(--x-size-base-03);
7134
- --x-size-padding-right-input-line: 0;
7135
- --x-size-padding-bottom-input-line: var(--x-size-base-03);
7136
- --x-size-padding-left-input-line: 0;
7137
- --x-size-border-width-top-input-line: 0;
7138
- --x-size-border-width-right-input-line: 0;
7139
- --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7140
- --x-size-border-width-left-input-line: 0;
7141
- }
7142
-
7143
- .x-input--line .x-input,
7144
- .x-input--line.x-input {
7145
- --x-size-padding-top-input-default: var(--x-size-padding-top-input-line);
7146
- --x-size-padding-right-input-default: var(--x-size-padding-right-input-line);
7147
- --x-size-padding-bottom-input-default: var(--x-size-padding-bottom-input-line);
7148
- --x-size-padding-left-input-default: var(--x-size-padding-left-input-line);
7149
- --x-size-border-width-top-input-default: var(--x-size-border-width-top-input-line);
7150
- --x-size-border-width-right-input-default: var(--x-size-border-width-right-input-line);
7151
- --x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
7152
- --x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
7125
+ --x-size-padding-right-input-line: 0;
7126
+ --x-size-padding-bottom-input-line: var(--x-size-base-03);
7127
+ --x-size-padding-left-input-line: 0;
7128
+ --x-size-border-width-top-input-line: 0;
7129
+ --x-size-border-width-right-input-line: 0;
7130
+ --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7131
+ --x-size-border-width-left-input-line: 0;
7153
7132
  }
7154
7133
  :root {
7155
7134
  --x-color-background-input-default: var(--x-color-base-neutral-100);
@@ -7179,6 +7158,28 @@
7179
7158
  --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
7180
7159
  --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
7181
7160
  }
7161
+ :root {
7162
+ --x-size-padding-top-input-line: var(--x-size-base-03);
7163
+ --x-size-padding-right-input-line: 0;
7164
+ --x-size-padding-bottom-input-line: var(--x-size-base-03);
7165
+ --x-size-padding-left-input-line: 0;
7166
+ --x-size-border-width-top-input-line: 0;
7167
+ --x-size-border-width-right-input-line: 0;
7168
+ --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7169
+ --x-size-border-width-left-input-line: 0;
7170
+ }
7171
+
7172
+ .x-input--line .x-input,
7173
+ .x-input--line.x-input {
7174
+ --x-size-padding-top-input-default: var(--x-size-padding-top-input-line);
7175
+ --x-size-padding-right-input-default: var(--x-size-padding-right-input-line);
7176
+ --x-size-padding-bottom-input-default: var(--x-size-padding-bottom-input-line);
7177
+ --x-size-padding-left-input-default: var(--x-size-padding-left-input-line);
7178
+ --x-size-border-width-top-input-default: var(--x-size-border-width-top-input-line);
7179
+ --x-size-border-width-right-input-default: var(--x-size-border-width-right-input-line);
7180
+ --x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
7181
+ --x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
7182
+ }
7182
7183
  :root {
7183
7184
  --x-color-background-input-default: var(--x-color-base-neutral-100);
7184
7185
  --x-color-border-input-default: var(--x-color-base-neutral-70);
@@ -7449,6 +7450,38 @@
7449
7450
  --x-size-padding-bottom-filter-children: 0;
7450
7451
  --x-size-padding-left-filter-children: var(--x-size-base-05);
7451
7452
  }
7453
+ :root {
7454
+ --x-color-background-filter-default: transparent;
7455
+ --x-color-border-filter-default: var(--x-color-background-filter-default);
7456
+ --x-color-text-filter-default: var(--x-color-text-default);
7457
+ --x-color-background-filter-default-selected: var(--x-color-background-filter-default);
7458
+ --x-color-border-filter-default-selected: var(--x-color-border-filter-default);
7459
+ --x-color-text-filter-default-selected: var(--x-color-text-filter-default);
7460
+ --x-size-border-width-filter-default: var(--x-size-border-width-base);
7461
+ --x-size-border-width-top-filter-default: var(--x-size-border-width-filter-default);
7462
+ --x-size-border-width-right-filter-default: var(--x-size-border-width-filter-default);
7463
+ --x-size-border-width-bottom-filter-default: var(--x-size-border-width-filter-default);
7464
+ --x-size-border-width-left-filter-default: var(--x-size-border-width-filter-default);
7465
+ --x-size-border-radius-filter-default: var(--x-size-border-radius-base-none);
7466
+ --x-size-border-radius-top-left-filter-default: var(--x-size-border-radius-filter-default);
7467
+ --x-size-border-radius-top-right-filter-default: var(--x-size-border-radius-filter-default);
7468
+ --x-size-border-radius-bottom-right-filter-default: var(--x-size-border-radius-filter-default);
7469
+ --x-size-border-radius-bottom-left-filter-default: var(--x-size-border-radius-filter-default);
7470
+ --x-size-padding-top-filter-default: var(--x-size-base-03);
7471
+ --x-size-padding-right-filter-default: 0;
7472
+ --x-size-padding-bottom-filter-default: var(--x-size-base-03);
7473
+ --x-size-padding-left-filter-default: 0;
7474
+ --x-size-gap-filter-default: var(--x-size-base-03);
7475
+ --x-font-family-filter-default: var(--x-font-family-text);
7476
+ --x-size-font-filter-default: var(--x-size-font-text);
7477
+ --x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
7478
+ --x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
7479
+ --x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
7480
+ --x-number-font-weight-filter-count-default-selected: var(
7481
+ --x-number-font-weight-filter-count-default
7482
+ );
7483
+ --x-size-line-height-filter-default: var(--x-size-line-height-text);
7484
+ }
7452
7485
  :root {
7453
7486
  --x-size-margin-filter-children: 0;
7454
7487
  --x-size-padding-top-filter-children: 0;
@@ -7514,38 +7547,6 @@
7514
7547
  );
7515
7548
  --x-size-line-height-filter-default: var(--x-size-line-height-text);
7516
7549
  }
7517
- :root {
7518
- --x-color-background-filter-default: transparent;
7519
- --x-color-border-filter-default: var(--x-color-background-filter-default);
7520
- --x-color-text-filter-default: var(--x-color-text-default);
7521
- --x-color-background-filter-default-selected: var(--x-color-background-filter-default);
7522
- --x-color-border-filter-default-selected: var(--x-color-border-filter-default);
7523
- --x-color-text-filter-default-selected: var(--x-color-text-filter-default);
7524
- --x-size-border-width-filter-default: var(--x-size-border-width-base);
7525
- --x-size-border-width-top-filter-default: var(--x-size-border-width-filter-default);
7526
- --x-size-border-width-right-filter-default: var(--x-size-border-width-filter-default);
7527
- --x-size-border-width-bottom-filter-default: var(--x-size-border-width-filter-default);
7528
- --x-size-border-width-left-filter-default: var(--x-size-border-width-filter-default);
7529
- --x-size-border-radius-filter-default: var(--x-size-border-radius-base-none);
7530
- --x-size-border-radius-top-left-filter-default: var(--x-size-border-radius-filter-default);
7531
- --x-size-border-radius-top-right-filter-default: var(--x-size-border-radius-filter-default);
7532
- --x-size-border-radius-bottom-right-filter-default: var(--x-size-border-radius-filter-default);
7533
- --x-size-border-radius-bottom-left-filter-default: var(--x-size-border-radius-filter-default);
7534
- --x-size-padding-top-filter-default: var(--x-size-base-03);
7535
- --x-size-padding-right-filter-default: 0;
7536
- --x-size-padding-bottom-filter-default: var(--x-size-base-03);
7537
- --x-size-padding-left-filter-default: 0;
7538
- --x-size-gap-filter-default: var(--x-size-base-03);
7539
- --x-font-family-filter-default: var(--x-font-family-text);
7540
- --x-size-font-filter-default: var(--x-size-font-text);
7541
- --x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
7542
- --x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
7543
- --x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
7544
- --x-number-font-weight-filter-count-default-selected: var(
7545
- --x-number-font-weight-filter-count-default
7546
- );
7547
- --x-size-line-height-filter-default: var(--x-size-line-height-text);
7548
- }
7549
7550
 
7550
7551
  [dir="ltr"] .x-filter,[dir="ltr"]
7551
7552
  .x-facet-filter {
@@ -7656,6 +7657,14 @@
7656
7657
  --x-size-padding-bottom-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7657
7658
  --x-size-padding-left-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7658
7659
  }
7660
+ :root {
7661
+ --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7662
+ --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7663
+ --x-size-border-width-top-facet-header-line: 0;
7664
+ --x-size-border-width-right-facet-header-line: 0;
7665
+ --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7666
+ --x-size-border-width-left-facet-header-line: 0;
7667
+ }
7659
7668
  :root {
7660
7669
  --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
7661
7670
  --x-size-border-width-facet-outlined: var(--x-size-border-width-base);
@@ -7708,14 +7717,6 @@
7708
7717
  --x-size-border-width-left-facet-header-line
7709
7718
  );
7710
7719
  }
7711
- :root {
7712
- --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7713
- --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7714
- --x-size-border-width-top-facet-header-line: 0;
7715
- --x-size-border-width-right-facet-header-line: 0;
7716
- --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7717
- --x-size-border-width-left-facet-header-line: 0;
7718
- }
7719
7720
  :root {
7720
7721
  --x-color-background-facet-default: transparent;
7721
7722
  --x-color-border-facet-default: var(--x-color-background-facet-default);
@@ -7917,13 +7918,13 @@
7917
7918
  :root {
7918
7919
  --x-size-width-dropdown-xl: 282px;
7919
7920
  }
7921
+ :root {
7922
+ --x-size-width-dropdown-xl: 282px;
7923
+ }
7920
7924
 
7921
7925
  .x-dropdown.x-dropdown--xl {
7922
7926
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-xl);
7923
7927
  }
7924
- :root {
7925
- --x-size-width-dropdown-xl: 282px;
7926
- }
7927
7928
  :root {
7928
7929
  --x-size-width-dropdown-s: 74px;
7929
7930
  }
@@ -8021,30 +8022,6 @@
8021
8022
  --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8022
8023
  --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8023
8024
  }
8024
- :root {
8025
- --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
8026
- --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
8027
- --x-size-padding-top-dropdown-item-line: var(--x-size-base-03);
8028
- --x-size-padding-right-dropdown-item-line: 0;
8029
- --x-size-padding-bottom-dropdown-item-line: var(--x-size-base-03);
8030
- --x-size-padding-left-dropdown-item-line: 0;
8031
- --x-size-padding-top-dropdown-toggle-line: var(--x-size-base-03);
8032
- --x-size-padding-right-dropdown-toggle-line: 0;
8033
- --x-size-padding-bottom-dropdown-toggle-line: var(--x-size-base-03);
8034
- --x-size-padding-left-dropdown-toggle-line: 0;
8035
- --x-size-border-width-dropdown-toggle-line: var(--x-size-border-width-base);
8036
- --x-size-border-width-top-dropdown-toggle-line: 0;
8037
- --x-size-border-width-right-dropdown-toggle-line: 0;
8038
- --x-size-border-width-bottom-dropdown-toggle-line: var(
8039
- --x-size-border-width-dropdown-toggle-line
8040
- );
8041
- --x-size-border-width-left-dropdown-toggle-line: 0;
8042
- --x-size-border-width-dropdown-list-line: 0;
8043
- --x-size-border-width-top-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8044
- --x-size-border-width-right-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8045
- --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8046
- --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8047
- }
8048
8025
 
8049
8026
  .x-dropdown--line {
8050
8027
  --x-size-padding-top-dropdown-item-default: var(--x-size-padding-top-dropdown-item-line);
@@ -8085,7 +8062,28 @@
8085
8062
  );
8086
8063
  }
8087
8064
  :root {
8088
- --x-size-width-dropdown-l: 202px;
8065
+ --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
8066
+ --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
8067
+ --x-size-padding-top-dropdown-item-line: var(--x-size-base-03);
8068
+ --x-size-padding-right-dropdown-item-line: 0;
8069
+ --x-size-padding-bottom-dropdown-item-line: var(--x-size-base-03);
8070
+ --x-size-padding-left-dropdown-item-line: 0;
8071
+ --x-size-padding-top-dropdown-toggle-line: var(--x-size-base-03);
8072
+ --x-size-padding-right-dropdown-toggle-line: 0;
8073
+ --x-size-padding-bottom-dropdown-toggle-line: var(--x-size-base-03);
8074
+ --x-size-padding-left-dropdown-toggle-line: 0;
8075
+ --x-size-border-width-dropdown-toggle-line: var(--x-size-border-width-base);
8076
+ --x-size-border-width-top-dropdown-toggle-line: 0;
8077
+ --x-size-border-width-right-dropdown-toggle-line: 0;
8078
+ --x-size-border-width-bottom-dropdown-toggle-line: var(
8079
+ --x-size-border-width-dropdown-toggle-line
8080
+ );
8081
+ --x-size-border-width-left-dropdown-toggle-line: 0;
8082
+ --x-size-border-width-dropdown-list-line: 0;
8083
+ --x-size-border-width-top-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8084
+ --x-size-border-width-right-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8085
+ --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8086
+ --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8089
8087
  }
8090
8088
  :root {
8091
8089
  --x-size-width-dropdown-l: 202px;
@@ -8167,6 +8165,22 @@
8167
8165
  --x-string-overflow-dropdown-toggle-default: hidden;
8168
8166
  --x-string-overflow-dropdown-list-default: hidden;
8169
8167
  }
8168
+ :root {
8169
+ --x-size-width-dropdown-l: 202px;
8170
+ }
8171
+ :root {
8172
+ --x-size-gap-dropdown-card: var(--x-size-base-03);
8173
+ --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8174
+ --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8175
+ --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8176
+ --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8177
+ --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8178
+ --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8179
+ --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8180
+ --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8181
+ --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8182
+ --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8183
+ }
8170
8184
  :root {
8171
8185
  --x-size-border-radius-dropdown-default: var(--x-size-border-radius-base-none);
8172
8186
  --x-size-border-radius-top-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
@@ -8422,19 +8436,6 @@
8422
8436
  --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8423
8437
  --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8424
8438
  }
8425
- :root {
8426
- --x-size-gap-dropdown-card: var(--x-size-base-03);
8427
- --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8428
- --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8429
- --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8430
- --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8431
- --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8432
- --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8433
- --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8434
- --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8435
- --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8436
- --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8437
- }
8438
8439
 
8439
8440
  .x-dropdown--card {
8440
8441
  --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-card);
@@ -8475,6 +8476,16 @@
8475
8476
  --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
8476
8477
  --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
8477
8478
  }
8479
+ :root {
8480
+ --x-color-background-button-secondary: transparent;
8481
+ --x-color-border-button-secondary: var(--x-color-border-button-default);
8482
+ --x-color-text-button-secondary: var(--x-color-border-button-default);
8483
+ --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8484
+ --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8485
+ --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8486
+ --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8487
+ --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8488
+ }
8478
8489
  :root {
8479
8490
  --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8480
8491
  --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
@@ -8506,16 +8517,6 @@
8506
8517
  --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8507
8518
  --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8508
8519
  }
8509
- :root {
8510
- --x-color-background-button-secondary: transparent;
8511
- --x-color-border-button-secondary: var(--x-color-border-button-default);
8512
- --x-color-text-button-secondary: var(--x-color-border-button-default);
8513
- --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8514
- --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8515
- --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8516
- --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8517
- --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8518
- }
8519
8520
 
8520
8521
  .x-button--secondary.x-button,
8521
8522
  .x-button--secondary .x-button {
@@ -8569,16 +8570,6 @@
8569
8570
  --x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
8570
8571
  --x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
8571
8572
  }
8572
- :root {
8573
- --x-color-background-button-primary: var(--x-color-background-button-default);
8574
- --x-color-border-button-primary: var(--x-color-border-button-default);
8575
- --x-color-text-button-primary: var(--x-color-text-button-default);
8576
- --x-size-border-width-button-primary: var(--x-size-border-width-base);
8577
- --x-size-border-width-top-button-primary: var(--x-size-border-width-button-primary);
8578
- --x-size-border-width-right-button-primary: var(--x-size-border-width-button-primary);
8579
- --x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
8580
- --x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
8581
- }
8582
8573
 
8583
8574
  .x-button--primary.x-button,
8584
8575
  .x-button--primary .x-button {
@@ -8590,6 +8581,16 @@
8590
8581
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-primary);
8591
8582
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-primary);
8592
8583
  }
8584
+ :root {
8585
+ --x-color-background-button-primary: var(--x-color-background-button-default);
8586
+ --x-color-border-button-primary: var(--x-color-border-button-default);
8587
+ --x-color-text-button-primary: var(--x-color-text-button-default);
8588
+ --x-size-border-width-button-primary: var(--x-size-border-width-base);
8589
+ --x-size-border-width-top-button-primary: var(--x-size-border-width-button-primary);
8590
+ --x-size-border-width-right-button-primary: var(--x-size-border-width-button-primary);
8591
+ --x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
8592
+ --x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
8593
+ }
8593
8594
  :root {
8594
8595
  --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
8595
8596
  --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
@@ -8624,11 +8625,6 @@
8624
8625
  --x-color-border-button-ghost: transparent;
8625
8626
  --x-color-text-button-ghost: var(--x-color-base-lead);
8626
8627
  }
8627
- :root {
8628
- --x-color-background-button-ghost: transparent;
8629
- --x-color-border-button-ghost: transparent;
8630
- --x-color-text-button-ghost: var(--x-color-base-lead);
8631
- }
8632
8628
 
8633
8629
  .x-button--ghost.x-button,
8634
8630
  .x-button--ghost .x-button {
@@ -8646,6 +8642,11 @@
8646
8642
  .x-button--ghost.x-button--ghost-end .x-button {
8647
8643
  --x-size-padding-right-button-default: 0;
8648
8644
  }
8645
+ :root {
8646
+ --x-color-background-button-ghost: transparent;
8647
+ --x-color-border-button-ghost: transparent;
8648
+ --x-color-text-button-ghost: var(--x-color-base-lead);
8649
+ }
8649
8650
  :root {
8650
8651
  --x-color-background-button-default: var(--x-color-base-lead);
8651
8652
  --x-color-border-button-default: var(--x-color-background-button-default);
@@ -8761,13 +8762,6 @@
8761
8762
  --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8762
8763
  --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8763
8764
  }
8764
- :root {
8765
- --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8766
- --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8767
- --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8768
- --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8769
- --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8770
- }
8771
8765
 
8772
8766
  .x-button--card.x-button,
8773
8767
  .x-button--card .x-button {
@@ -8783,6 +8777,13 @@
8783
8777
  --x-size-border-radius-bottom-left-button-card
8784
8778
  );
8785
8779
  }
8780
+ :root {
8781
+ --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8782
+ --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8783
+ --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8784
+ --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8785
+ --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8786
+ }
8786
8787
  :root {
8787
8788
  --x-color-background-badge-default: var(--x-color-base-neutral-10);
8788
8789
  --x-color-text-badge-default: var(--x-color-base-neutral-100);
@@ -8883,4 +8884,4 @@
8883
8884
  --x-size-border-radius-base-m: var(--x-size-base-06);
8884
8885
  --x-size-border-radius-base-pill: 99999px;
8885
8886
  --x-size-border-width-base: 1px;
8886
- }
8887
+ }