@empathyco/x-components 6.0.0-alpha.40 → 6.0.0-alpha.41

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.
@@ -14,6 +14,7 @@
14
14
  .x-normal-case {
15
15
  text-transform: none;
16
16
  }
17
+
17
18
  .x-underline {
18
19
  -webkit-text-decoration-line: underline;
19
20
  text-decoration-line: underline;
@@ -52,7 +53,6 @@
52
53
  .x-sticky {
53
54
  position: sticky !important;
54
55
  }
55
-
56
56
  .x-padding--00 {
57
57
  padding: 0 !important;
58
58
  }
@@ -494,29 +494,6 @@
494
494
  [dir="rtl"] .x-padding--left-20 {
495
495
  padding-right: var(--x-size-base-20) !important;
496
496
  }
497
- .x-line-height--none {
498
- line-height: 1 !important;
499
- }
500
-
501
- .x-line-height--tight {
502
- line-height: 1.25 !important;
503
- }
504
-
505
- .x-line-height--snug {
506
- line-height: 1.375 !important;
507
- }
508
-
509
- .x-line-height--normal {
510
- line-height: 1.5 !important;
511
- }
512
-
513
- .x-line-height--relaxed {
514
- line-height: 1.625 !important;
515
- }
516
-
517
- .x-line-height--loose {
518
- line-height: 2 !important;
519
- }
520
497
  .x-margin--auto {
521
498
  margin: auto !important;
522
499
  }
@@ -979,6 +956,29 @@
979
956
  [dir="rtl"] .x-margin--left-20 {
980
957
  margin-right: var(--x-size-base-20) !important;
981
958
  }
959
+ .x-line-height--none {
960
+ line-height: 1 !important;
961
+ }
962
+
963
+ .x-line-height--tight {
964
+ line-height: 1.25 !important;
965
+ }
966
+
967
+ .x-line-height--snug {
968
+ line-height: 1.375 !important;
969
+ }
970
+
971
+ .x-line-height--normal {
972
+ line-height: 1.5 !important;
973
+ }
974
+
975
+ .x-line-height--relaxed {
976
+ line-height: 1.625 !important;
977
+ }
978
+
979
+ .x-line-height--loose {
980
+ line-height: 2 !important;
981
+ }
982
982
  .x-line-clamp--2 {
983
983
  overflow: hidden !important;
984
984
  display: -webkit-box !important;
@@ -1145,49 +1145,6 @@
1145
1145
  .x-font-color--transparent {
1146
1146
  color: var(--x-color-base-transparent) !important;
1147
1147
  }
1148
- .x-flex-1 {
1149
- flex: 1 1 0% !important;
1150
- }
1151
-
1152
- .x-flex-auto {
1153
- flex: 1 1 auto !important;
1154
- }
1155
-
1156
- .x-flex-initial {
1157
- flex: 0 1 auto !important;
1158
- }
1159
-
1160
- .x-flex-no-shrink {
1161
- flex: 1 0 auto !important;
1162
- }
1163
-
1164
- .x-flex-none {
1165
- flex: none !important;
1166
- }
1167
-
1168
- .x-self-auto {
1169
- align-self: auto !important;
1170
- }
1171
-
1172
- .x-self-start {
1173
- align-self: flex-start !important;
1174
- }
1175
-
1176
- .x-self-end {
1177
- align-self: flex-end !important;
1178
- }
1179
-
1180
- .x-self-center {
1181
- align-self: center !important;
1182
- }
1183
-
1184
- .x-self-stretch {
1185
- align-self: stretch !important;
1186
- }
1187
-
1188
- .x-self-baseline {
1189
- align-self: baseline !important;
1190
- }
1191
1148
  .x-fill--lead {
1192
1149
  fill: var(--x-color-base-lead) !important;
1193
1150
  }
@@ -1231,6 +1188,49 @@
1231
1188
  .x-fill--transparent {
1232
1189
  fill: var(--x-color-base-transparent) !important;
1233
1190
  }
1191
+ .x-flex-1 {
1192
+ flex: 1 1 0% !important;
1193
+ }
1194
+
1195
+ .x-flex-auto {
1196
+ flex: 1 1 auto !important;
1197
+ }
1198
+
1199
+ .x-flex-initial {
1200
+ flex: 0 1 auto !important;
1201
+ }
1202
+
1203
+ .x-flex-no-shrink {
1204
+ flex: 1 0 auto !important;
1205
+ }
1206
+
1207
+ .x-flex-none {
1208
+ flex: none !important;
1209
+ }
1210
+
1211
+ .x-self-auto {
1212
+ align-self: auto !important;
1213
+ }
1214
+
1215
+ .x-self-start {
1216
+ align-self: flex-start !important;
1217
+ }
1218
+
1219
+ .x-self-end {
1220
+ align-self: flex-end !important;
1221
+ }
1222
+
1223
+ .x-self-center {
1224
+ align-self: center !important;
1225
+ }
1226
+
1227
+ .x-self-stretch {
1228
+ align-self: stretch !important;
1229
+ }
1230
+
1231
+ .x-self-baseline {
1232
+ align-self: baseline !important;
1233
+ }
1234
1234
  /* Material Elevations extracted from:
1235
1235
  https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
1236
1236
  */
@@ -1299,6 +1299,71 @@
1299
1299
  --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
1300
1300
  0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1301
1301
  }
1302
+
1303
+ .x-shadow--none {
1304
+ box-shadow: none !important;
1305
+ }
1306
+
1307
+ .x-shadow--01 {
1308
+ box-shadow: var(--x-string-box-shadow-01) !important;
1309
+ }
1310
+ .x-shadow--bottom-01 {
1311
+ box-shadow: var(--x-string-box-shadow-bottom-01) !important;
1312
+ }
1313
+ .x-shadow--02 {
1314
+ box-shadow: var(--x-string-box-shadow-02) !important;
1315
+ }
1316
+ .x-shadow--bottom-02 {
1317
+ box-shadow: var(--x-string-box-shadow-bottom-02) !important;
1318
+ }
1319
+ .x-shadow--03 {
1320
+ box-shadow: var(--x-string-box-shadow-03) !important;
1321
+ }
1322
+ .x-shadow--bottom-03 {
1323
+ box-shadow: var(--x-string-box-shadow-bottom-03) !important;
1324
+ }
1325
+ .x-shadow--04 {
1326
+ box-shadow: var(--x-string-box-shadow-04) !important;
1327
+ }
1328
+ .x-shadow--bottom-04 {
1329
+ box-shadow: var(--x-string-box-shadow-bottom-04) !important;
1330
+ }
1331
+ .x-shadow--05 {
1332
+ box-shadow: var(--x-string-box-shadow-05) !important;
1333
+ }
1334
+ .x-shadow--bottom-05 {
1335
+ box-shadow: var(--x-string-box-shadow-bottom-05) !important;
1336
+ }
1337
+ .x-shadow--06 {
1338
+ box-shadow: var(--x-string-box-shadow-06) !important;
1339
+ }
1340
+ .x-shadow--bottom-06 {
1341
+ box-shadow: var(--x-string-box-shadow-bottom-06) !important;
1342
+ }
1343
+ .x-shadow--07 {
1344
+ box-shadow: var(--x-string-box-shadow-07) !important;
1345
+ }
1346
+ .x-shadow--bottom-07 {
1347
+ box-shadow: var(--x-string-box-shadow-bottom-07) !important;
1348
+ }
1349
+ .x-shadow--08 {
1350
+ box-shadow: var(--x-string-box-shadow-08) !important;
1351
+ }
1352
+ .x-shadow--bottom-08 {
1353
+ box-shadow: var(--x-string-box-shadow-bottom-08) !important;
1354
+ }
1355
+ .x-shadow--09 {
1356
+ box-shadow: var(--x-string-box-shadow-09) !important;
1357
+ }
1358
+ .x-shadow--bottom-09 {
1359
+ box-shadow: var(--x-string-box-shadow-bottom-09) !important;
1360
+ }
1361
+ .x-shadow--10 {
1362
+ box-shadow: var(--x-string-box-shadow-10) !important;
1363
+ }
1364
+ .x-shadow--bottom-10 {
1365
+ box-shadow: var(--x-string-box-shadow-bottom-10) !important;
1366
+ }
1302
1367
  /* Material Elevations extracted from:
1303
1368
  https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
1304
1369
  */
@@ -1367,112 +1432,47 @@
1367
1432
  --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
1368
1433
  0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1369
1434
  }
1370
-
1371
- .x-shadow--none {
1372
- box-shadow: none !important;
1435
+ *[class*=x-border-width--] {
1436
+ border-width: 0;
1373
1437
  }
1374
1438
 
1375
- .x-shadow--01 {
1376
- box-shadow: var(--x-string-box-shadow-01) !important;
1377
- }
1378
- .x-shadow--bottom-01 {
1379
- box-shadow: var(--x-string-box-shadow-bottom-01) !important;
1439
+ .x-border-width--00 {
1440
+ border-width: 0px !important;
1441
+ border-style: solid !important;
1380
1442
  }
1381
- .x-shadow--02 {
1382
- box-shadow: var(--x-string-box-shadow-02) !important;
1443
+ .x-border-width--top-00 {
1444
+ border-top-width: 0px !important;
1445
+ border-style: solid !important;
1383
1446
  }
1384
- .x-shadow--bottom-02 {
1385
- box-shadow: var(--x-string-box-shadow-bottom-02) !important;
1447
+ .x-border-width--bottom-00 {
1448
+ border-bottom-width: 0px !important;
1449
+ border-style: solid !important;
1386
1450
  }
1387
- .x-shadow--03 {
1388
- box-shadow: var(--x-string-box-shadow-03) !important;
1451
+ [dir="ltr"] .x-border-width--right-00 {
1452
+ border-right-width: 0px !important;
1389
1453
  }
1390
- .x-shadow--bottom-03 {
1391
- box-shadow: var(--x-string-box-shadow-bottom-03) !important;
1454
+ [dir="rtl"] .x-border-width--right-00 {
1455
+ border-left-width: 0px !important;
1392
1456
  }
1393
- .x-shadow--04 {
1394
- box-shadow: var(--x-string-box-shadow-04) !important;
1457
+ .x-border-width--right-00 {
1458
+ border-style: solid !important;
1395
1459
  }
1396
- .x-shadow--bottom-04 {
1397
- box-shadow: var(--x-string-box-shadow-bottom-04) !important;
1460
+ [dir="ltr"] .x-border-width--left-00 {
1461
+ border-left-width: 0px !important;
1398
1462
  }
1399
- .x-shadow--05 {
1400
- box-shadow: var(--x-string-box-shadow-05) !important;
1463
+ [dir="rtl"] .x-border-width--left-00 {
1464
+ border-right-width: 0px !important;
1401
1465
  }
1402
- .x-shadow--bottom-05 {
1403
- box-shadow: var(--x-string-box-shadow-bottom-05) !important;
1466
+ .x-border-width--left-00 {
1467
+ border-style: solid !important;
1404
1468
  }
1405
- .x-shadow--06 {
1406
- box-shadow: var(--x-string-box-shadow-06) !important;
1469
+ .x-border-width--01 {
1470
+ border-width: 1px !important;
1471
+ border-style: solid !important;
1407
1472
  }
1408
- .x-shadow--bottom-06 {
1409
- box-shadow: var(--x-string-box-shadow-bottom-06) !important;
1410
- }
1411
- .x-shadow--07 {
1412
- box-shadow: var(--x-string-box-shadow-07) !important;
1413
- }
1414
- .x-shadow--bottom-07 {
1415
- box-shadow: var(--x-string-box-shadow-bottom-07) !important;
1416
- }
1417
- .x-shadow--08 {
1418
- box-shadow: var(--x-string-box-shadow-08) !important;
1419
- }
1420
- .x-shadow--bottom-08 {
1421
- box-shadow: var(--x-string-box-shadow-bottom-08) !important;
1422
- }
1423
- .x-shadow--09 {
1424
- box-shadow: var(--x-string-box-shadow-09) !important;
1425
- }
1426
- .x-shadow--bottom-09 {
1427
- box-shadow: var(--x-string-box-shadow-bottom-09) !important;
1428
- }
1429
- .x-shadow--10 {
1430
- box-shadow: var(--x-string-box-shadow-10) !important;
1431
- }
1432
- .x-shadow--bottom-10 {
1433
- box-shadow: var(--x-string-box-shadow-bottom-10) !important;
1434
- }
1435
- *[class*=x-border-width--] {
1436
- border-width: 0;
1437
- }
1438
-
1439
- .x-border-width--00 {
1440
- border-width: 0px !important;
1441
- border-style: solid !important;
1442
- }
1443
- .x-border-width--top-00 {
1444
- border-top-width: 0px !important;
1445
- border-style: solid !important;
1446
- }
1447
- .x-border-width--bottom-00 {
1448
- border-bottom-width: 0px !important;
1449
- border-style: solid !important;
1450
- }
1451
- [dir="ltr"] .x-border-width--right-00 {
1452
- border-right-width: 0px !important;
1453
- }
1454
- [dir="rtl"] .x-border-width--right-00 {
1455
- border-left-width: 0px !important;
1456
- }
1457
- .x-border-width--right-00 {
1458
- border-style: solid !important;
1459
- }
1460
- [dir="ltr"] .x-border-width--left-00 {
1461
- border-left-width: 0px !important;
1462
- }
1463
- [dir="rtl"] .x-border-width--left-00 {
1464
- border-right-width: 0px !important;
1465
- }
1466
- .x-border-width--left-00 {
1467
- border-style: solid !important;
1468
- }
1469
- .x-border-width--01 {
1470
- border-width: 1px !important;
1471
- border-style: solid !important;
1472
- }
1473
- .x-border-width--top-01 {
1474
- border-top-width: 1px !important;
1475
- border-style: solid !important;
1473
+ .x-border-width--top-01 {
1474
+ border-top-width: 1px !important;
1475
+ border-style: solid !important;
1476
1476
  }
1477
1477
  .x-border-width--bottom-01 {
1478
1478
  border-bottom-width: 1px !important;
@@ -3274,49 +3274,6 @@
3274
3274
  [dir="rtl"] .x-border-radius--bottom-right-20 {
3275
3275
  border-bottom-left-radius: var(--x-size-base-20) !important;
3276
3276
  }
3277
- .x-border-color--lead {
3278
- border-color: var(--x-color-base-lead) !important;
3279
- }
3280
-
3281
- .x-border-color--auxiliary {
3282
- border-color: var(--x-color-base-auxiliary) !important;
3283
- }
3284
-
3285
- .x-border-color--neutral-10 {
3286
- border-color: var(--x-color-base-neutral-10) !important;
3287
- }
3288
-
3289
- .x-border-color--neutral-35 {
3290
- border-color: var(--x-color-base-neutral-35) !important;
3291
- }
3292
-
3293
- .x-border-color--neutral-70 {
3294
- border-color: var(--x-color-base-neutral-70) !important;
3295
- }
3296
-
3297
- .x-border-color--neutral-95 {
3298
- border-color: var(--x-color-base-neutral-95) !important;
3299
- }
3300
-
3301
- .x-border-color--neutral-100 {
3302
- border-color: var(--x-color-base-neutral-100) !important;
3303
- }
3304
-
3305
- .x-border-color--accent {
3306
- border-color: var(--x-color-base-accent) !important;
3307
- }
3308
-
3309
- .x-border-color--enable {
3310
- border-color: var(--x-color-base-enable) !important;
3311
- }
3312
-
3313
- .x-border-color--disable {
3314
- border-color: var(--x-color-base-disable) !important;
3315
- }
3316
-
3317
- .x-border-color--transparent {
3318
- border-color: var(--x-color-base-transparent) !important;
3319
- }
3320
3277
  .x-background--lead {
3321
3278
  background-color: var(--x-color-base-lead) !important;
3322
3279
  }
@@ -3360,6 +3317,49 @@
3360
3317
  .x-background--transparent {
3361
3318
  background-color: var(--x-color-base-transparent) !important;
3362
3319
  }
3320
+ .x-border-color--lead {
3321
+ border-color: var(--x-color-base-lead) !important;
3322
+ }
3323
+
3324
+ .x-border-color--auxiliary {
3325
+ border-color: var(--x-color-base-auxiliary) !important;
3326
+ }
3327
+
3328
+ .x-border-color--neutral-10 {
3329
+ border-color: var(--x-color-base-neutral-10) !important;
3330
+ }
3331
+
3332
+ .x-border-color--neutral-35 {
3333
+ border-color: var(--x-color-base-neutral-35) !important;
3334
+ }
3335
+
3336
+ .x-border-color--neutral-70 {
3337
+ border-color: var(--x-color-base-neutral-70) !important;
3338
+ }
3339
+
3340
+ .x-border-color--neutral-95 {
3341
+ border-color: var(--x-color-base-neutral-95) !important;
3342
+ }
3343
+
3344
+ .x-border-color--neutral-100 {
3345
+ border-color: var(--x-color-base-neutral-100) !important;
3346
+ }
3347
+
3348
+ .x-border-color--accent {
3349
+ border-color: var(--x-color-base-accent) !important;
3350
+ }
3351
+
3352
+ .x-border-color--enable {
3353
+ border-color: var(--x-color-base-enable) !important;
3354
+ }
3355
+
3356
+ .x-border-color--disable {
3357
+ border-color: var(--x-color-base-disable) !important;
3358
+ }
3359
+
3360
+ .x-border-color--transparent {
3361
+ border-color: var(--x-color-base-transparent) !important;
3362
+ }
3363
3363
  .x-text--stroke.x-text {
3364
3364
  --x-string-text-decoration: line-through;
3365
3365
  }
@@ -3378,9 +3378,6 @@
3378
3378
  :root {
3379
3379
  --x-color-text-secondary: var(--x-color-base-neutral-35);
3380
3380
  }
3381
- .x-text--secondary {
3382
- --x-color-text-default: var(--x-color-text-secondary);
3383
- }
3384
3381
  .x-text--light.x-text {
3385
3382
  --x-number-font-weight-text: var(--x-number-font-weight-base-light);
3386
3383
  }
@@ -3396,45 +3393,8 @@
3396
3393
  .x-text--light.x-small {
3397
3394
  --x-number-font-weight-small: var(--x-number-font-weight-base-light);
3398
3395
  }
3399
- :root {
3400
- --x-font-family-base: "Montserrat", sans-serif;
3401
- --x-size-font-base-xs: 12px;
3402
- --x-size-font-base-s: 14px;
3403
- --x-size-font-base-m: 16px;
3404
- --x-size-font-base-l: 18px;
3405
- --x-size-font-base-xl: 32px;
3406
- --x-number-font-weight-base-light: 300;
3407
- --x-number-font-weight-base-regular: 400;
3408
- --x-number-font-weight-base-bold: 600;
3409
- --x-size-line-height-base-s: 16px;
3410
- --x-size-line-height-base-m: 24px;
3411
- --x-size-line-height-base-l: 32px;
3412
- --x-color-text-default: var(--x-color-base-neutral-10);
3413
- --x-font-family-text: var(--x-font-family-base);
3414
- --x-size-font-text: var(--x-size-font-base-s);
3415
- --x-number-font-weight-text: var(--x-number-font-weight-base-regular);
3416
- --x-size-line-height-text: var(--x-size-line-height-base-s);
3417
- --x-string-text-decoration-text: none;
3418
- --x-font-family-title1: var(--x-font-family-base);
3419
- --x-size-font-title1: var(--x-size-font-base-xl);
3420
- --x-number-font-weight-title1: var(--x-number-font-weight-base-regular);
3421
- --x-size-line-height-title1: var(--x-size-line-height-base-l);
3422
- --x-string-text-decoration-title1: none;
3423
- --x-font-family-title2: var(--x-font-family-base);
3424
- --x-size-font-title2: var(--x-size-font-base-l);
3425
- --x-number-font-weight-title2: var(--x-number-font-weight-base-regular);
3426
- --x-size-line-height-title2: var(--x-size-line-height-base-m);
3427
- --x-string-text-decoration-title2: none;
3428
- --x-font-family-title3: var(--x-font-family-base);
3429
- --x-size-font-title3: var(--x-size-font-base-m);
3430
- --x-number-font-weight-title3: var(--x-number-font-weight-base-regular);
3431
- --x-size-line-height-title3: var(--x-size-line-height-base-m);
3432
- --x-string-text-decoration-title3: none;
3433
- --x-font-family-small: var(--x-font-family-base);
3434
- --x-size-font-small: var(--x-size-font-base-xs);
3435
- --x-number-font-weight-small: var(--x-number-font-weight-base-regular);
3436
- --x-size-line-height-small: var(--x-size-line-height-base-s);
3437
- --x-string-text-decoration-small: none;
3396
+ .x-text--secondary {
3397
+ --x-color-text-default: var(--x-color-text-secondary);
3438
3398
  }
3439
3399
  :root {
3440
3400
  --x-font-family-base: "Montserrat", sans-serif;
@@ -3538,6 +3498,49 @@
3538
3498
  overflow: hidden;
3539
3499
  white-space: nowrap;
3540
3500
  }
3501
+ :root {
3502
+ --x-font-family-base: "Montserrat", sans-serif;
3503
+ --x-size-font-base-xs: 12px;
3504
+ --x-size-font-base-s: 14px;
3505
+ --x-size-font-base-m: 16px;
3506
+ --x-size-font-base-l: 18px;
3507
+ --x-size-font-base-xl: 32px;
3508
+ --x-number-font-weight-base-light: 300;
3509
+ --x-number-font-weight-base-regular: 400;
3510
+ --x-number-font-weight-base-bold: 600;
3511
+ --x-size-line-height-base-s: 16px;
3512
+ --x-size-line-height-base-m: 24px;
3513
+ --x-size-line-height-base-l: 32px;
3514
+ --x-color-text-default: var(--x-color-base-neutral-10);
3515
+ --x-font-family-text: var(--x-font-family-base);
3516
+ --x-size-font-text: var(--x-size-font-base-s);
3517
+ --x-number-font-weight-text: var(--x-number-font-weight-base-regular);
3518
+ --x-size-line-height-text: var(--x-size-line-height-base-s);
3519
+ --x-string-text-decoration-text: none;
3520
+ --x-font-family-title1: var(--x-font-family-base);
3521
+ --x-size-font-title1: var(--x-size-font-base-xl);
3522
+ --x-number-font-weight-title1: var(--x-number-font-weight-base-regular);
3523
+ --x-size-line-height-title1: var(--x-size-line-height-base-l);
3524
+ --x-string-text-decoration-title1: none;
3525
+ --x-font-family-title2: var(--x-font-family-base);
3526
+ --x-size-font-title2: var(--x-size-font-base-l);
3527
+ --x-number-font-weight-title2: var(--x-number-font-weight-base-regular);
3528
+ --x-size-line-height-title2: var(--x-size-line-height-base-m);
3529
+ --x-string-text-decoration-title2: none;
3530
+ --x-font-family-title3: var(--x-font-family-base);
3531
+ --x-size-font-title3: var(--x-size-font-base-m);
3532
+ --x-number-font-weight-title3: var(--x-number-font-weight-base-regular);
3533
+ --x-size-line-height-title3: var(--x-size-line-height-base-m);
3534
+ --x-string-text-decoration-title3: none;
3535
+ --x-font-family-small: var(--x-font-family-base);
3536
+ --x-size-font-small: var(--x-size-font-base-xs);
3537
+ --x-number-font-weight-small: var(--x-number-font-weight-base-regular);
3538
+ --x-size-line-height-small: var(--x-size-line-height-base-s);
3539
+ --x-string-text-decoration-small: none;
3540
+ }
3541
+ :root {
3542
+ --x-color-text-accent: var(--x-color-base-accent);
3543
+ }
3541
3544
  .x-text--bold.x-text {
3542
3545
  --x-number-font-weight-text: var(--x-number-font-weight-base-bold);
3543
3546
  }
@@ -3553,9 +3556,6 @@
3553
3556
  .x-text--bold.x-small {
3554
3557
  --x-number-font-weight-small: var(--x-number-font-weight-base-bold);
3555
3558
  }
3556
- :root {
3557
- --x-color-text-accent: var(--x-color-base-accent);
3558
- }
3559
3559
  .x-text--accent {
3560
3560
  --x-color-text-default: var(--x-color-text-accent);
3561
3561
  }
@@ -3566,6 +3566,13 @@
3566
3566
  --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3567
3567
  --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3568
3568
  }
3569
+ :root {
3570
+ --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
3571
+ --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
3572
+ --x-size-border-radius-top-right-tag-pill: var(--x-size-border-radius-tag-pill);
3573
+ --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3574
+ --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3575
+ }
3569
3576
 
3570
3577
  .x-tag--pill.x-tag,
3571
3578
  .x-tag--pill .x-tag {
@@ -3577,13 +3584,6 @@
3577
3584
  );
3578
3585
  --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-pill);
3579
3586
  }
3580
- :root {
3581
- --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
3582
- --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
3583
- --x-size-border-radius-top-right-tag-pill: var(--x-size-border-radius-tag-pill);
3584
- --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3585
- --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3586
- }
3587
3587
  :root {
3588
3588
  --x-color-background-tag-ghost: transparent;
3589
3589
  --x-color-border-tag-ghost: transparent;
@@ -3672,52 +3672,6 @@
3672
3672
  --x-number-font-weight-tag-default-selected
3673
3673
  );
3674
3674
  }
3675
- :root {
3676
- --x-color-background-tag-default: var(--x-color-base-neutral-100);
3677
- --x-color-border-tag-default: var(--x-color-text-tag-default);
3678
- --x-color-text-tag-default: var(--x-color-text-default);
3679
- --x-color-background-tag-default-selected: var(--x-color-base-neutral-95);
3680
- --x-color-border-tag-default-selected: var(--x-color-border-tag-default);
3681
- --x-color-text-tag-default-selected: var(--x-color-text-tag-default);
3682
- --x-color-background-tag-default-curated: var(--x-color-background-tag-default);
3683
- --x-color-border-tag-default-curated: var(--x-color-border-tag-default);
3684
- --x-color-text-tag-default-curated: var(--x-color-text-tag-default);
3685
- --x-color-background-tag-default-curated-selected: var(--x-color-background-tag-default-selected);
3686
- --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-default-selected);
3687
- --x-color-text-tag-default-curated-selected: var(--x-color-text-tag-default-selected);
3688
- --x-size-border-width-tag-default: var(--x-size-border-width-base);
3689
- --x-size-border-width-top-tag-default: var(--x-size-border-width-tag-default);
3690
- --x-size-border-width-right-tag-default: var(--x-size-border-width-tag-default);
3691
- --x-size-border-width-bottom-tag-default: var(--x-size-border-width-tag-default);
3692
- --x-size-border-width-left-tag-default: var(--x-size-border-width-tag-default);
3693
- --x-size-border-radius-tag-default: var(--x-size-border-radius-base-none);
3694
- --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-tag-default);
3695
- --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-tag-default);
3696
- --x-size-border-radius-bottom-right-tag-default: var(--x-size-border-radius-tag-default);
3697
- --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-tag-default);
3698
- --x-size-height-tag-default: var(--x-size-base-07);
3699
- --x-size-padding-right-tag-default: var(--x-size-base-04);
3700
- --x-size-padding-left-tag-default: var(--x-size-base-04);
3701
- --x-size-gap-tag-default: var(--x-size-base-02);
3702
- --x-font-family-tag-default: var(--x-font-family-text);
3703
- --x-size-font-tag-default: var(--x-size-font-text);
3704
- --x-size-line-height-tag-default: var(--x-size-line-height-text);
3705
- --x-number-font-weight-tag-default: var(--x-number-font-weight-text);
3706
- --x-font-family-tag-default-selected: var(--x-font-family-tag-default);
3707
- --x-size-font-tag-default-selected: var(--x-size-font-tag-default);
3708
- --x-size-line-height-tag-default-selected: var(--x-size-line-height-tag-default);
3709
- --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-default);
3710
- --x-font-family-tag-default-curated: var(--x-font-family-tag-default);
3711
- --x-size-font-tag-default-curated: var(--x-size-font-tag-default);
3712
- --x-size-line-height-tag-default-curated: var(--x-size-line-height-tag-default);
3713
- --x-number-font-weight-tag-default-curated: var(--x-number-font-weight-tag-default);
3714
- --x-font-family-tag-default-curated-selected: var(--x-font-family-tag-default-selected);
3715
- --x-size-font-tag-default-curated-selected: var(--x-size-font-tag-default-selected);
3716
- --x-size-line-height-tag-default-curated-selected: var(--x-size-line-height-tag-default-selected);
3717
- --x-number-font-weight-tag-default-curated-selected: var(
3718
- --x-number-font-weight-tag-default-selected
3719
- );
3720
- }
3721
3675
 
3722
3676
  [dir="ltr"] .x-tag {
3723
3677
  border-left-width: var(--x-size-border-width-left-tag-default);
@@ -3893,6 +3847,52 @@
3893
3847
  );
3894
3848
  --x-size-line-height-filter-default-selected: var(--x-size-line-height-tag-default-selected);
3895
3849
  }
3850
+ :root {
3851
+ --x-color-background-tag-default: var(--x-color-base-neutral-100);
3852
+ --x-color-border-tag-default: var(--x-color-text-tag-default);
3853
+ --x-color-text-tag-default: var(--x-color-text-default);
3854
+ --x-color-background-tag-default-selected: var(--x-color-base-neutral-95);
3855
+ --x-color-border-tag-default-selected: var(--x-color-border-tag-default);
3856
+ --x-color-text-tag-default-selected: var(--x-color-text-tag-default);
3857
+ --x-color-background-tag-default-curated: var(--x-color-background-tag-default);
3858
+ --x-color-border-tag-default-curated: var(--x-color-border-tag-default);
3859
+ --x-color-text-tag-default-curated: var(--x-color-text-tag-default);
3860
+ --x-color-background-tag-default-curated-selected: var(--x-color-background-tag-default-selected);
3861
+ --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-default-selected);
3862
+ --x-color-text-tag-default-curated-selected: var(--x-color-text-tag-default-selected);
3863
+ --x-size-border-width-tag-default: var(--x-size-border-width-base);
3864
+ --x-size-border-width-top-tag-default: var(--x-size-border-width-tag-default);
3865
+ --x-size-border-width-right-tag-default: var(--x-size-border-width-tag-default);
3866
+ --x-size-border-width-bottom-tag-default: var(--x-size-border-width-tag-default);
3867
+ --x-size-border-width-left-tag-default: var(--x-size-border-width-tag-default);
3868
+ --x-size-border-radius-tag-default: var(--x-size-border-radius-base-none);
3869
+ --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-tag-default);
3870
+ --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-tag-default);
3871
+ --x-size-border-radius-bottom-right-tag-default: var(--x-size-border-radius-tag-default);
3872
+ --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-tag-default);
3873
+ --x-size-height-tag-default: var(--x-size-base-07);
3874
+ --x-size-padding-right-tag-default: var(--x-size-base-04);
3875
+ --x-size-padding-left-tag-default: var(--x-size-base-04);
3876
+ --x-size-gap-tag-default: var(--x-size-base-02);
3877
+ --x-font-family-tag-default: var(--x-font-family-text);
3878
+ --x-size-font-tag-default: var(--x-size-font-text);
3879
+ --x-size-line-height-tag-default: var(--x-size-line-height-text);
3880
+ --x-number-font-weight-tag-default: var(--x-number-font-weight-text);
3881
+ --x-font-family-tag-default-selected: var(--x-font-family-tag-default);
3882
+ --x-size-font-tag-default-selected: var(--x-size-font-tag-default);
3883
+ --x-size-line-height-tag-default-selected: var(--x-size-line-height-tag-default);
3884
+ --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-default);
3885
+ --x-font-family-tag-default-curated: var(--x-font-family-tag-default);
3886
+ --x-size-font-tag-default-curated: var(--x-size-font-tag-default);
3887
+ --x-size-line-height-tag-default-curated: var(--x-size-line-height-tag-default);
3888
+ --x-number-font-weight-tag-default-curated: var(--x-number-font-weight-tag-default);
3889
+ --x-font-family-tag-default-curated-selected: var(--x-font-family-tag-default-selected);
3890
+ --x-size-font-tag-default-curated-selected: var(--x-size-font-tag-default-selected);
3891
+ --x-size-line-height-tag-default-curated-selected: var(--x-size-line-height-tag-default-selected);
3892
+ --x-number-font-weight-tag-default-curated-selected: var(
3893
+ --x-number-font-weight-tag-default-selected
3894
+ );
3895
+ }
3896
3896
  :root {
3897
3897
  --x-size-border-radius-tag-card: var(--x-size-border-radius-base-s);
3898
3898
  --x-size-border-radius-top-left-tag-card: var(--x-size-border-radius-tag-card);
@@ -4551,28 +4551,6 @@
4551
4551
  --x-size-gap-row-19: var(--x-size-base-19);
4552
4552
  --x-size-gap-row-20: var(--x-size-base-20);
4553
4553
  }
4554
- :root {
4555
- --x-size-gap-row-01: var(--x-size-base-01);
4556
- --x-size-gap-row-02: var(--x-size-base-02);
4557
- --x-size-gap-row-03: var(--x-size-base-03);
4558
- --x-size-gap-row-04: var(--x-size-base-04);
4559
- --x-size-gap-row-05: var(--x-size-base-05);
4560
- --x-size-gap-row-06: var(--x-size-base-06);
4561
- --x-size-gap-row-07: var(--x-size-base-07);
4562
- --x-size-gap-row-08: var(--x-size-base-08);
4563
- --x-size-gap-row-09: var(--x-size-base-09);
4564
- --x-size-gap-row-10: var(--x-size-base-10);
4565
- --x-size-gap-row-11: var(--x-size-base-11);
4566
- --x-size-gap-row-12: var(--x-size-base-12);
4567
- --x-size-gap-row-13: var(--x-size-base-13);
4568
- --x-size-gap-row-14: var(--x-size-base-14);
4569
- --x-size-gap-row-15: var(--x-size-base-15);
4570
- --x-size-gap-row-16: var(--x-size-base-16);
4571
- --x-size-gap-row-17: var(--x-size-base-17);
4572
- --x-size-gap-row-18: var(--x-size-base-18);
4573
- --x-size-gap-row-19: var(--x-size-base-19);
4574
- --x-size-gap-row-20: var(--x-size-base-20);
4575
- }
4576
4554
 
4577
4555
  .x-row--gap-01 {
4578
4556
  --x-size-gap-row: var(--x-size-gap-row-01);
@@ -4653,6 +4631,28 @@
4653
4631
  .x-row--gap-20 {
4654
4632
  --x-size-gap-row: var(--x-size-gap-row-20);
4655
4633
  }
4634
+ :root {
4635
+ --x-size-gap-row-01: var(--x-size-base-01);
4636
+ --x-size-gap-row-02: var(--x-size-base-02);
4637
+ --x-size-gap-row-03: var(--x-size-base-03);
4638
+ --x-size-gap-row-04: var(--x-size-base-04);
4639
+ --x-size-gap-row-05: var(--x-size-base-05);
4640
+ --x-size-gap-row-06: var(--x-size-base-06);
4641
+ --x-size-gap-row-07: var(--x-size-base-07);
4642
+ --x-size-gap-row-08: var(--x-size-base-08);
4643
+ --x-size-gap-row-09: var(--x-size-base-09);
4644
+ --x-size-gap-row-10: var(--x-size-base-10);
4645
+ --x-size-gap-row-11: var(--x-size-base-11);
4646
+ --x-size-gap-row-12: var(--x-size-base-12);
4647
+ --x-size-gap-row-13: var(--x-size-base-13);
4648
+ --x-size-gap-row-14: var(--x-size-base-14);
4649
+ --x-size-gap-row-15: var(--x-size-base-15);
4650
+ --x-size-gap-row-16: var(--x-size-base-16);
4651
+ --x-size-gap-row-17: var(--x-size-base-17);
4652
+ --x-size-gap-row-18: var(--x-size-base-18);
4653
+ --x-size-gap-row-19: var(--x-size-base-19);
4654
+ --x-size-gap-row-20: var(--x-size-base-20);
4655
+ }
4656
4656
  :root {
4657
4657
  --x-size-gap-row: 0;
4658
4658
  --x-size-padding-row: 0;
@@ -4925,10 +4925,6 @@
4925
4925
  --x-number-zoom-scale-picture: 1.1;
4926
4926
  --x-number-zoom-duration-picture: 0.3s;
4927
4927
  }
4928
- :root {
4929
- --x-number-zoom-scale-picture: 1.1;
4930
- --x-number-zoom-duration-picture: 0.3s;
4931
- }
4932
4928
 
4933
4929
  .x-picture--zoom .x-picture-image {
4934
4930
  transition: transform var(--x-number-zoom-duration-picture) ease-out;
@@ -4936,6 +4932,10 @@
4936
4932
  .x-picture--zoom .x-picture-image:hover {
4937
4933
  transform: scale(var(--x-number-zoom-scale-picture));
4938
4934
  }
4935
+ :root {
4936
+ --x-number-zoom-scale-picture: 1.1;
4937
+ --x-number-zoom-duration-picture: 0.3s;
4938
+ }
4939
4939
  :root {
4940
4940
  --x-number-aspect-ratio-picture: 1;
4941
4941
  }
@@ -5077,6 +5077,21 @@
5077
5077
  --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5078
5078
  --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5079
5079
  }
5080
+ :root {
5081
+ --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5082
+ --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);
5094
+ }
5080
5095
  :root {
5081
5096
  --x-color-background-option-list-button-default: transparent;
5082
5097
  --x-color-border-option-list-button-default: transparent;
@@ -5157,21 +5172,6 @@
5157
5172
  --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
5158
5173
  --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
5159
5174
  }
5160
- :root {
5161
- --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5162
- --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5163
- --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5164
- --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5165
- --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5166
- }
5167
-
5168
- .x-picture--card.x-picture {
5169
- --x-size-border-radius-picture-default: var(--x-size-border-radius-picture-card);
5170
- --x-size-border-radius-top-picture-default: var(--x-size-border-radius-top-picture-card);
5171
- --x-size-border-radius-right-picture-default: var(--x-size-border-radius-right-picture-card);
5172
- --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-bottom-picture-card);
5173
- --x-size-border-radius-left-picture-default: var(--x-size-border-radius-left-picture-card);
5174
- }
5175
5175
  :root {
5176
5176
  --x-color-background-option-list-button-default: transparent;
5177
5177
  --x-color-border-option-list-button-default: transparent;
@@ -5574,6 +5574,77 @@
5574
5574
  --x-size-font-message-default: var(--x-size-font-title3);
5575
5575
  --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5576
5576
  }
5577
+ :root {
5578
+ --x-string-justify-message-default: center;
5579
+ --x-size-gap-message-default: var(--x-size-base-03);
5580
+ --x-size-padding-message-default: var(--x-size-base-06);
5581
+ --x-color-background-message-default: var(--x-color-base-neutral-95);
5582
+ --x-color-border-message-default: var(--x-color-background-message-default);
5583
+ --x-color-text-message-default: var(--x-color-text-default);
5584
+ --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
5585
+ --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
5586
+ --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
5587
+ --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
5588
+ --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
5589
+ --x-size-border-width-message-default: var(--x-size-border-width-base);
5590
+ --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
5591
+ --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
5592
+ --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
5593
+ --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
5594
+ --x-font-family-message-default: var(--x-font-family-title3);
5595
+ --x-size-font-message-default: var(--x-size-font-title3);
5596
+ --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5597
+ }
5598
+
5599
+ [dir="ltr"] .x-message {
5600
+ border-left-width: var(--x-size-border-width-left-message-default);
5601
+ }
5602
+
5603
+ [dir="rtl"] .x-message {
5604
+ border-right-width: var(--x-size-border-width-left-message-default);
5605
+ }
5606
+
5607
+ [dir="ltr"] .x-message {
5608
+ border-right-width: var(--x-size-border-width-right-message-default);
5609
+ }
5610
+
5611
+ [dir="rtl"] .x-message {
5612
+ border-left-width: var(--x-size-border-width-right-message-default);
5613
+ }
5614
+
5615
+ .x-message {
5616
+ display: flex;
5617
+ flex-flow: column nowrap;
5618
+ justify-content: var(--x-string-justify-message-default);
5619
+ align-items: center;
5620
+ box-sizing: border-box;
5621
+ gap: var(--x-size-gap-message-default);
5622
+ padding: var(--x-size-padding-message-default);
5623
+ background-color: var(--x-color-background-message-default);
5624
+ border-color: var(--x-color-border-message-default);
5625
+ border-style: solid;
5626
+ border-top-width: var(--x-size-border-width-top-message-default);
5627
+ border-bottom-width: var(--x-size-border-width-bottom-message-default);
5628
+ border-radius: var(--x-size-border-radius-top-left-message-default) var(--x-size-border-radius-top-right-message-default) var(--x-size-border-radius-bottom-right-message-default) var(--x-size-border-radius-bottom-left-message-default);
5629
+ font-family: var(--x-font-family-message-default);
5630
+ font-size: var(--x-size-font-message-default);
5631
+ font-weight: var(--x-number-font-weight-message-default);
5632
+ }
5633
+ @media not all and (min-resolution: 0.001dpcm) {
5634
+ .x-message {
5635
+ gap: 0;
5636
+ }
5637
+ .x-message > *:not(:last-child) {
5638
+ margin-right: var(--x-size-gap-message-default);
5639
+ }
5640
+ }
5641
+ .x-message,
5642
+ .x-message > a {
5643
+ color: var(--x-color-text-message-default);
5644
+ }
5645
+ .x-message > p {
5646
+ margin: 0;
5647
+ }
5577
5648
  /* @deprecated */
5578
5649
  :root {
5579
5650
  --x-size-padding-list-01: var(--x-size-base-01);
@@ -5590,29 +5661,7 @@
5590
5661
  --x-size-padding-list-12: var(--x-size-base-12);
5591
5662
  --x-size-padding-list-13: var(--x-size-base-13);
5592
5663
  }
5593
- :root {
5594
- --x-size-gap-list-01: var(--x-size-base-01);
5595
- --x-size-gap-list-02: var(--x-size-base-02);
5596
- --x-size-gap-list-03: var(--x-size-base-03);
5597
- --x-size-gap-list-04: var(--x-size-base-04);
5598
- --x-size-gap-list-05: var(--x-size-base-05);
5599
- --x-size-gap-list-06: var(--x-size-base-06);
5600
- --x-size-gap-list-07: var(--x-size-base-07);
5601
- --x-size-gap-list-08: var(--x-size-base-08);
5602
- --x-size-gap-list-09: var(--x-size-base-09);
5603
- --x-size-gap-list-10: var(--x-size-base-10);
5604
- --x-size-gap-list-11: var(--x-size-base-11);
5605
- --x-size-gap-list-12: var(--x-size-base-12);
5606
- --x-size-gap-list-13: var(--x-size-base-13);
5607
- --x-size-gap-list-14: var(--x-size-base-14);
5608
- --x-size-gap-list-15: var(--x-size-base-15);
5609
- --x-size-gap-list-16: var(--x-size-base-16);
5610
- --x-size-gap-list-17: var(--x-size-base-17);
5611
- --x-size-gap-list-18: var(--x-size-base-18);
5612
- --x-size-gap-list-19: var(--x-size-base-19);
5613
- --x-size-gap-list-20: var(--x-size-base-20);
5614
- }
5615
- /* @deprecated */
5664
+ /* @deprecated */
5616
5665
  :root {
5617
5666
  --x-size-padding-list-01: var(--x-size-base-01);
5618
5667
  --x-size-padding-list-02: var(--x-size-base-02);
@@ -5953,75 +6002,26 @@
5953
6002
  }
5954
6003
  }
5955
6004
  :root {
5956
- --x-string-justify-message-default: center;
5957
- --x-size-gap-message-default: var(--x-size-base-03);
5958
- --x-size-padding-message-default: var(--x-size-base-06);
5959
- --x-color-background-message-default: var(--x-color-base-neutral-95);
5960
- --x-color-border-message-default: var(--x-color-background-message-default);
5961
- --x-color-text-message-default: var(--x-color-text-default);
5962
- --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
5963
- --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
5964
- --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
5965
- --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
5966
- --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
5967
- --x-size-border-width-message-default: var(--x-size-border-width-base);
5968
- --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
5969
- --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
5970
- --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
5971
- --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
5972
- --x-font-family-message-default: var(--x-font-family-title3);
5973
- --x-size-font-message-default: var(--x-size-font-title3);
5974
- --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5975
- }
5976
-
5977
- [dir="ltr"] .x-message {
5978
- border-left-width: var(--x-size-border-width-left-message-default);
5979
- }
5980
-
5981
- [dir="rtl"] .x-message {
5982
- border-right-width: var(--x-size-border-width-left-message-default);
5983
- }
5984
-
5985
- [dir="ltr"] .x-message {
5986
- border-right-width: var(--x-size-border-width-right-message-default);
5987
- }
5988
-
5989
- [dir="rtl"] .x-message {
5990
- border-left-width: var(--x-size-border-width-right-message-default);
5991
- }
5992
-
5993
- .x-message {
5994
- display: flex;
5995
- flex-flow: column nowrap;
5996
- justify-content: var(--x-string-justify-message-default);
5997
- align-items: center;
5998
- box-sizing: border-box;
5999
- gap: var(--x-size-gap-message-default);
6000
- padding: var(--x-size-padding-message-default);
6001
- background-color: var(--x-color-background-message-default);
6002
- border-color: var(--x-color-border-message-default);
6003
- border-style: solid;
6004
- border-top-width: var(--x-size-border-width-top-message-default);
6005
- border-bottom-width: var(--x-size-border-width-bottom-message-default);
6006
- border-radius: var(--x-size-border-radius-top-left-message-default) var(--x-size-border-radius-top-right-message-default) var(--x-size-border-radius-bottom-right-message-default) var(--x-size-border-radius-bottom-left-message-default);
6007
- font-family: var(--x-font-family-message-default);
6008
- font-size: var(--x-size-font-message-default);
6009
- font-weight: var(--x-number-font-weight-message-default);
6010
- }
6011
- @media not all and (min-resolution: 0.001dpcm) {
6012
- .x-message {
6013
- gap: 0;
6014
- }
6015
- .x-message > *:not(:last-child) {
6016
- margin-right: var(--x-size-gap-message-default);
6017
- }
6018
- }
6019
- .x-message,
6020
- .x-message > a {
6021
- color: var(--x-color-text-message-default);
6022
- }
6023
- .x-message > p {
6024
- margin: 0;
6005
+ --x-size-gap-list-01: var(--x-size-base-01);
6006
+ --x-size-gap-list-02: var(--x-size-base-02);
6007
+ --x-size-gap-list-03: var(--x-size-base-03);
6008
+ --x-size-gap-list-04: var(--x-size-base-04);
6009
+ --x-size-gap-list-05: var(--x-size-base-05);
6010
+ --x-size-gap-list-06: var(--x-size-base-06);
6011
+ --x-size-gap-list-07: var(--x-size-base-07);
6012
+ --x-size-gap-list-08: var(--x-size-base-08);
6013
+ --x-size-gap-list-09: var(--x-size-base-09);
6014
+ --x-size-gap-list-10: var(--x-size-base-10);
6015
+ --x-size-gap-list-11: var(--x-size-base-11);
6016
+ --x-size-gap-list-12: var(--x-size-base-12);
6017
+ --x-size-gap-list-13: var(--x-size-base-13);
6018
+ --x-size-gap-list-14: var(--x-size-base-14);
6019
+ --x-size-gap-list-15: var(--x-size-base-15);
6020
+ --x-size-gap-list-16: var(--x-size-base-16);
6021
+ --x-size-gap-list-17: var(--x-size-base-17);
6022
+ --x-size-gap-list-18: var(--x-size-base-18);
6023
+ --x-size-gap-list-19: var(--x-size-base-19);
6024
+ --x-size-gap-list-20: var(--x-size-base-20);
6025
6025
  }
6026
6026
  :root {
6027
6027
  --x-size-gap-list-01: var(--x-size-base-01);
@@ -6745,49 +6745,6 @@
6745
6745
  --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6746
6746
  --x-size-border-width-left-input-group-line: 0;
6747
6747
  }
6748
- :root {
6749
- --x-color-background-input-group-default: var(--x-color-background-input-default);
6750
- --x-color-border-input-group-default: var(--x-color-border-input-default);
6751
- --x-color-border-input-group-default-focus: var(--x-color-border-input-default-focus);
6752
- --x-color-text-input-group-default: var(--x-color-text-input-default);
6753
- --x-color-text-input-group-placeholder-default: var(--x-color-text-input-placeholder-default);
6754
- --x-size-height-input-group-default: var(--x-size-height-input-default);
6755
- --x-size-gap-input-group-default: var(--x-size-base-03);
6756
- --x-size-padding-left-input-group-default: var(--x-size-base-06);
6757
- --x-size-padding-right-input-group-default: var(--x-size-padding-left-input-group-default);
6758
- --x-size-padding-input-group-default-action: var(--x-size-base-03);
6759
- --x-size-border-width-input-group-default: var(--x-size-border-width-input-default);
6760
- --x-size-border-width-top-input-group-default: var(--x-size-border-width-input-group-default);
6761
- --x-size-border-width-right-input-group-default: var(--x-size-border-width-input-group-default);
6762
- --x-size-border-width-bottom-input-group-default: var(--x-size-border-width-input-group-default);
6763
- --x-size-border-width-left-input-group-default: var(--x-size-border-width-input-group-default);
6764
- --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-default);
6765
- --x-size-border-radius-top-left-input-group-default: var(
6766
- --x-size-border-radius-input-group-default
6767
- );
6768
- --x-size-border-radius-top-right-input-group-default: var(
6769
- --x-size-border-radius-input-group-default
6770
- );
6771
- --x-size-border-radius-bottom-right-input-group-default: var(
6772
- --x-size-border-radius-input-group-default
6773
- );
6774
- --x-size-border-radius-bottom-left-input-group-default: var(
6775
- --x-size-border-radius-input-group-default
6776
- );
6777
- --x-font-family-input-group-default: var(--x-font-family-input-default);
6778
- --x-size-font-input-group-default: var(--x-size-font-input-default);
6779
- --x-size-line-height-input-group-default: var(--x-size-line-height-input-default);
6780
- --x-number-font-weight-input-group-default: var(--x-number-font-weight-input-default);
6781
- --x-font-family-input-group-placeholder-default: var(--x-font-family-input-group-default);
6782
- --x-size-font-input-group-placeholder-default: var(--x-size-font-input-group-default);
6783
- --x-size-line-height-input-group-placeholder-default: var(
6784
- --x-size-line-height-input-group-default
6785
- );
6786
- --x-number-font-weight-input-group-placeholder-default: var(
6787
- --x-number-font-weight-input-group-default
6788
- );
6789
- --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6790
- }
6791
6748
  :root {
6792
6749
  --x-size-padding-left-input-group-line: 0;
6793
6750
  --x-size-padding-right-input-group-line: 0;
@@ -6878,6 +6835,49 @@
6878
6835
  );
6879
6836
  --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6880
6837
  }
6838
+ :root {
6839
+ --x-color-background-input-group-default: var(--x-color-background-input-default);
6840
+ --x-color-border-input-group-default: var(--x-color-border-input-default);
6841
+ --x-color-border-input-group-default-focus: var(--x-color-border-input-default-focus);
6842
+ --x-color-text-input-group-default: var(--x-color-text-input-default);
6843
+ --x-color-text-input-group-placeholder-default: var(--x-color-text-input-placeholder-default);
6844
+ --x-size-height-input-group-default: var(--x-size-height-input-default);
6845
+ --x-size-gap-input-group-default: var(--x-size-base-03);
6846
+ --x-size-padding-left-input-group-default: var(--x-size-base-06);
6847
+ --x-size-padding-right-input-group-default: var(--x-size-padding-left-input-group-default);
6848
+ --x-size-padding-input-group-default-action: var(--x-size-base-03);
6849
+ --x-size-border-width-input-group-default: var(--x-size-border-width-input-default);
6850
+ --x-size-border-width-top-input-group-default: var(--x-size-border-width-input-group-default);
6851
+ --x-size-border-width-right-input-group-default: var(--x-size-border-width-input-group-default);
6852
+ --x-size-border-width-bottom-input-group-default: var(--x-size-border-width-input-group-default);
6853
+ --x-size-border-width-left-input-group-default: var(--x-size-border-width-input-group-default);
6854
+ --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-default);
6855
+ --x-size-border-radius-top-left-input-group-default: var(
6856
+ --x-size-border-radius-input-group-default
6857
+ );
6858
+ --x-size-border-radius-top-right-input-group-default: var(
6859
+ --x-size-border-radius-input-group-default
6860
+ );
6861
+ --x-size-border-radius-bottom-right-input-group-default: var(
6862
+ --x-size-border-radius-input-group-default
6863
+ );
6864
+ --x-size-border-radius-bottom-left-input-group-default: var(
6865
+ --x-size-border-radius-input-group-default
6866
+ );
6867
+ --x-font-family-input-group-default: var(--x-font-family-input-default);
6868
+ --x-size-font-input-group-default: var(--x-size-font-input-default);
6869
+ --x-size-line-height-input-group-default: var(--x-size-line-height-input-default);
6870
+ --x-number-font-weight-input-group-default: var(--x-number-font-weight-input-default);
6871
+ --x-font-family-input-group-placeholder-default: var(--x-font-family-input-group-default);
6872
+ --x-size-font-input-group-placeholder-default: var(--x-size-font-input-group-default);
6873
+ --x-size-line-height-input-group-placeholder-default: var(
6874
+ --x-size-line-height-input-group-default
6875
+ );
6876
+ --x-number-font-weight-input-group-placeholder-default: var(
6877
+ --x-number-font-weight-input-group-default
6878
+ );
6879
+ --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6880
+ }
6881
6881
 
6882
6882
  [dir="ltr"] .x-input-group {
6883
6883
  border-right-width: var(--x-size-border-width-right-input-group-default);
@@ -7064,6 +7064,13 @@
7064
7064
  --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7065
7065
  --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7066
7066
  }
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
+ }
7067
7074
 
7068
7075
  .x-input--pill.x-input,
7069
7076
  .x-input--pill .x-input {
@@ -7073,13 +7080,6 @@
7073
7080
  --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-pill);
7074
7081
  --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-pill);
7075
7082
  }
7076
- :root {
7077
- --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7078
- --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7079
- --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7080
- --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7081
- --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7082
- }
7083
7083
  :root {
7084
7084
  --x-size-padding-top-input-line: var(--x-size-base-03);
7085
7085
  --x-size-padding-right-input-line: 0;
@@ -7140,34 +7140,6 @@
7140
7140
  --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
7141
7141
  --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
7142
7142
  }
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
7143
 
7172
7144
  [dir="ltr"] .x-input {
7173
7145
  padding-left: var(--x-size-padding-left-input-default);
@@ -7249,35 +7221,59 @@
7249
7221
  line-height: var(--x-size-line-height-input-placeholder-default);
7250
7222
  }
7251
7223
  :root {
7252
- --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7253
- --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7254
- --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7255
- --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7256
- --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7257
- }
7258
- :root {
7259
- --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7260
- --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7261
- --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7262
- --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7263
- --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7264
- }
7265
-
7266
- .x-input--card.x-input,
7267
- .x-input--card .x-input {
7268
- --x-size-border-radius-input-default: var(--x-size-border-radius-input-card);
7269
- --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-top-left-input-card);
7270
- --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-top-right-input-card);
7271
- --x-size-border-radius-bottom-right-input-default: var(
7272
- --x-size-border-radius-bottom-right-input-card
7273
- );
7274
- --x-size-border-radius-bottom-left-input-default: var(
7275
- --x-size-border-radius-bottom-left-input-card
7276
- );
7277
- }
7224
+ --x-color-background-input-default: var(--x-color-base-neutral-100);
7225
+ --x-color-border-input-default: var(--x-color-base-neutral-70);
7226
+ --x-color-border-input-default-focus: var(--x-color-base-lead);
7227
+ --x-color-text-input-default: var(--x-color-text-default);
7228
+ --x-color-text-input-placeholder-default: var(--x-color-base-neutral-35);
7229
+ --x-size-border-width-input-default: var(--x-size-border-width-base);
7230
+ --x-size-border-width-top-input-default: var(--x-size-border-width-input-default);
7231
+ --x-size-border-width-right-input-default: var(--x-size-border-width-input-default);
7232
+ --x-size-border-width-bottom-input-default: var(--x-size-border-width-input-default);
7233
+ --x-size-border-width-left-input-default: var(--x-size-border-width-input-default);
7234
+ --x-size-border-radius-input-default: var(--x-size-border-radius-base-none);
7235
+ --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-default);
7236
+ --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-default);
7237
+ --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-default);
7238
+ --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-default);
7239
+ --x-size-height-input-default: var(--x-size-base-07);
7240
+ --x-size-padding-right-input-default: var(--x-size-base-04);
7241
+ --x-size-padding-left-input-default: var(--x-size-base-04);
7242
+ --x-font-family-input-default: var(--x-font-family-text);
7243
+ --x-size-font-input-default: var(--x-size-font-text);
7244
+ --x-size-line-height-input-default: var(--x-size-line-height-text);
7245
+ --x-number-font-weight-input-default: var(--x-number-font-weight-text);
7246
+ --x-font-family-input-placeholder-default: var(--x-font-family-input-default);
7247
+ --x-size-font-input-placeholder-default: var(--x-size-font-input-default);
7248
+ --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
7249
+ --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
7250
+ }
7278
7251
  :root {
7279
- --x-size-width-icon-xl: var(--x-size-base-07);
7280
- --x-size-height-icon-xl: var(--x-size-base-07);
7252
+ --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7253
+ --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7254
+ --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7255
+ --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7256
+ --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7257
+ }
7258
+ :root {
7259
+ --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7260
+ --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7261
+ --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7262
+ --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7263
+ --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7264
+ }
7265
+
7266
+ .x-input--card.x-input,
7267
+ .x-input--card .x-input {
7268
+ --x-size-border-radius-input-default: var(--x-size-border-radius-input-card);
7269
+ --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-top-left-input-card);
7270
+ --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-top-right-input-card);
7271
+ --x-size-border-radius-bottom-right-input-default: var(
7272
+ --x-size-border-radius-bottom-right-input-card
7273
+ );
7274
+ --x-size-border-radius-bottom-left-input-default: var(
7275
+ --x-size-border-radius-bottom-left-input-card
7276
+ );
7281
7277
  }
7282
7278
  :root {
7283
7279
  --x-size-width-icon-xl: var(--x-size-base-07);
@@ -7289,8 +7285,8 @@
7289
7285
  --x-size-height-icon-default: var(--x-size-height-icon-xl);
7290
7286
  }
7291
7287
  :root {
7292
- --x-size-width-icon-s: var(--x-size-base-03);
7293
- --x-size-height-icon-s: var(--x-size-base-03);
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);
@@ -7301,6 +7297,10 @@
7301
7297
  --x-size-width-icon-default: var(--x-size-width-icon-s);
7302
7298
  --x-size-height-icon-default: var(--x-size-height-icon-s);
7303
7299
  }
7300
+ :root {
7301
+ --x-size-width-icon-s: var(--x-size-base-03);
7302
+ --x-size-height-icon-s: var(--x-size-base-03);
7303
+ }
7304
7304
  :root {
7305
7305
  --x-size-width-icon-m: var(--x-size-base-05);
7306
7306
  --x-size-height-icon-m: var(--x-size-base-05);
@@ -7474,6 +7474,38 @@
7474
7474
  );
7475
7475
  --x-size-line-height-filter-default: var(--x-size-line-height-text);
7476
7476
  }
7477
+ :root {
7478
+ --x-color-background-filter-default: transparent;
7479
+ --x-color-border-filter-default: var(--x-color-background-filter-default);
7480
+ --x-color-text-filter-default: var(--x-color-text-default);
7481
+ --x-color-background-filter-default-selected: var(--x-color-background-filter-default);
7482
+ --x-color-border-filter-default-selected: var(--x-color-border-filter-default);
7483
+ --x-color-text-filter-default-selected: var(--x-color-text-filter-default);
7484
+ --x-size-border-width-filter-default: var(--x-size-border-width-base);
7485
+ --x-size-border-width-top-filter-default: var(--x-size-border-width-filter-default);
7486
+ --x-size-border-width-right-filter-default: var(--x-size-border-width-filter-default);
7487
+ --x-size-border-width-bottom-filter-default: var(--x-size-border-width-filter-default);
7488
+ --x-size-border-width-left-filter-default: var(--x-size-border-width-filter-default);
7489
+ --x-size-border-radius-filter-default: var(--x-size-border-radius-base-none);
7490
+ --x-size-border-radius-top-left-filter-default: var(--x-size-border-radius-filter-default);
7491
+ --x-size-border-radius-top-right-filter-default: var(--x-size-border-radius-filter-default);
7492
+ --x-size-border-radius-bottom-right-filter-default: var(--x-size-border-radius-filter-default);
7493
+ --x-size-border-radius-bottom-left-filter-default: var(--x-size-border-radius-filter-default);
7494
+ --x-size-padding-top-filter-default: var(--x-size-base-03);
7495
+ --x-size-padding-right-filter-default: 0;
7496
+ --x-size-padding-bottom-filter-default: var(--x-size-base-03);
7497
+ --x-size-padding-left-filter-default: 0;
7498
+ --x-size-gap-filter-default: var(--x-size-base-03);
7499
+ --x-font-family-filter-default: var(--x-font-family-text);
7500
+ --x-size-font-filter-default: var(--x-size-font-text);
7501
+ --x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
7502
+ --x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
7503
+ --x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
7504
+ --x-number-font-weight-filter-count-default-selected: var(
7505
+ --x-number-font-weight-filter-count-default
7506
+ );
7507
+ --x-size-line-height-filter-default: var(--x-size-line-height-text);
7508
+ }
7477
7509
 
7478
7510
  [dir="ltr"] .x-filter,[dir="ltr"] .x-facet-filter {
7479
7511
  padding-left: var(--x-size-padding-left-filter-default);
@@ -7556,36 +7588,17 @@
7556
7588
  );
7557
7589
  }
7558
7590
  :root {
7559
- --x-color-background-filter-default: transparent;
7560
- --x-color-border-filter-default: var(--x-color-background-filter-default);
7561
- --x-color-text-filter-default: var(--x-color-text-default);
7562
- --x-color-background-filter-default-selected: var(--x-color-background-filter-default);
7563
- --x-color-border-filter-default-selected: var(--x-color-border-filter-default);
7564
- --x-color-text-filter-default-selected: var(--x-color-text-filter-default);
7565
- --x-size-border-width-filter-default: var(--x-size-border-width-base);
7566
- --x-size-border-width-top-filter-default: var(--x-size-border-width-filter-default);
7567
- --x-size-border-width-right-filter-default: var(--x-size-border-width-filter-default);
7568
- --x-size-border-width-bottom-filter-default: var(--x-size-border-width-filter-default);
7569
- --x-size-border-width-left-filter-default: var(--x-size-border-width-filter-default);
7570
- --x-size-border-radius-filter-default: var(--x-size-border-radius-base-none);
7571
- --x-size-border-radius-top-left-filter-default: var(--x-size-border-radius-filter-default);
7572
- --x-size-border-radius-top-right-filter-default: var(--x-size-border-radius-filter-default);
7573
- --x-size-border-radius-bottom-right-filter-default: var(--x-size-border-radius-filter-default);
7574
- --x-size-border-radius-bottom-left-filter-default: var(--x-size-border-radius-filter-default);
7575
- --x-size-padding-top-filter-default: var(--x-size-base-03);
7576
- --x-size-padding-right-filter-default: 0;
7577
- --x-size-padding-bottom-filter-default: var(--x-size-base-03);
7578
- --x-size-padding-left-filter-default: 0;
7579
- --x-size-gap-filter-default: var(--x-size-base-03);
7580
- --x-font-family-filter-default: var(--x-font-family-text);
7581
- --x-size-font-filter-default: var(--x-size-font-text);
7582
- --x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
7583
- --x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
7584
- --x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
7585
- --x-number-font-weight-filter-count-default-selected: var(
7586
- --x-number-font-weight-filter-count-default
7587
- );
7588
- --x-size-line-height-filter-default: var(--x-size-line-height-text);
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);
7589
7602
  }
7590
7603
  :root {
7591
7604
  --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
@@ -7616,17 +7629,12 @@
7616
7629
  --x-size-padding-left-facet-header-default: var(--x-size-padding-left-facet-header-outlined);
7617
7630
  }
7618
7631
  :root {
7619
- --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
7620
- --x-size-border-width-facet-outlined: var(--x-size-border-width-base);
7621
- --x-size-border-width-top-facet-outlined: var(--x-size-border-width-facet-outlined);
7622
- --x-size-border-width-right-facet-outlined: var(--x-size-border-width-facet-outlined);
7623
- --x-size-border-width-bottom-facet-outlined: var(--x-size-border-width-facet-outlined);
7624
- --x-size-border-width-left-facet-outlined: var(--x-size-border-width-facet-outlined);
7625
- --x-size-padding-facet-header-outlined: var(--x-size-base-03);
7626
- --x-size-padding-top-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7627
- --x-size-padding-right-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7628
- --x-size-padding-bottom-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7629
- --x-size-padding-left-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7632
+ --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7633
+ --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7634
+ --x-size-border-width-top-facet-header-line: 0;
7635
+ --x-size-border-width-right-facet-header-line: 0;
7636
+ --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7637
+ --x-size-border-width-left-facet-header-line: 0;
7630
7638
  }
7631
7639
  :root {
7632
7640
  --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
@@ -7652,14 +7660,6 @@
7652
7660
  --x-size-border-width-left-facet-header-line
7653
7661
  );
7654
7662
  }
7655
- :root {
7656
- --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7657
- --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7658
- --x-size-border-width-top-facet-header-line: 0;
7659
- --x-size-border-width-right-facet-header-line: 0;
7660
- --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7661
- --x-size-border-width-left-facet-header-line: 0;
7662
- }
7663
7663
  :root {
7664
7664
  --x-color-background-facet-default: transparent;
7665
7665
  --x-color-border-facet-default: var(--x-color-background-facet-default);
@@ -7832,6 +7832,18 @@
7832
7832
  --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7833
7833
  --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7834
7834
  }
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
+ }
7835
7847
 
7836
7848
  .x-facet--card.x-facet,
7837
7849
  .x-facet--card .x-facet {
@@ -7846,18 +7858,6 @@
7846
7858
  --x-size-padding-bottom-facet-header-default: var(--x-size-padding-bottom-facet-header-card);
7847
7859
  --x-size-padding-left-facet-header-default: var(--x-size-padding-left-facet-header-card);
7848
7860
  }
7849
- :root {
7850
- --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7851
- --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
7852
- --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
7853
- --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
7854
- --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
7855
- --x-size-padding-facet-header-card: var(--x-size-base-03);
7856
- --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
7857
- --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
7858
- --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7859
- --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7860
- }
7861
7861
  :root {
7862
7862
  --x-size-width-dropdown-xl: 282px;
7863
7863
  }
@@ -7886,6 +7886,14 @@
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
+ }
7889
7897
 
7890
7898
  .x-dropdown--pill {
7891
7899
  --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-pill);
@@ -7921,14 +7929,6 @@
7921
7929
  --x-size-border-width-left-dropdown-list-pill
7922
7930
  );
7923
7931
  }
7924
- :root {
7925
- --x-size-gap-dropdown-pill: var(--x-size-base-03);
7926
- --x-size-border-width-dropdown-list-pill: var(--x-size-border-width-base);
7927
- --x-size-border-width-top-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7928
- --x-size-border-width-right-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7929
- --x-size-border-width-bottom-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7930
- --x-size-border-width-left-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
7931
- }
7932
7932
  :root {
7933
7933
  --x-size-width-dropdown-m: 130px;
7934
7934
  }
@@ -8364,19 +8364,6 @@
8364
8364
  --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8365
8365
  --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8366
8366
  }
8367
- :root {
8368
- --x-size-gap-dropdown-card: var(--x-size-base-03);
8369
- --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8370
- --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8371
- --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8372
- --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8373
- --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8374
- --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8375
- --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8376
- --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8377
- --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8378
- --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8379
- }
8380
8367
 
8381
8368
  .x-dropdown--card {
8382
8369
  --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-card);
@@ -8407,6 +8394,19 @@
8407
8394
  --x-size-border-width-left-dropdown-list-card
8408
8395
  );
8409
8396
  }
8397
+ :root {
8398
+ --x-size-gap-dropdown-card: var(--x-size-base-03);
8399
+ --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8400
+ --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8401
+ --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8402
+ --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8403
+ --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8404
+ --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8405
+ --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8406
+ --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8407
+ --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8408
+ --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8409
+ }
8410
8410
  :root {
8411
8411
  --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8412
8412
  --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
@@ -8448,16 +8448,6 @@
8448
8448
  --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8449
8449
  --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8450
8450
  }
8451
- :root {
8452
- --x-color-background-button-secondary: transparent;
8453
- --x-color-border-button-secondary: var(--x-color-border-button-default);
8454
- --x-color-text-button-secondary: var(--x-color-border-button-default);
8455
- --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8456
- --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8457
- --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8458
- --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8459
- --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8460
- }
8461
8451
 
8462
8452
  .x-button--secondary.x-button,
8463
8453
  .x-button--secondary .x-button {
@@ -8470,21 +8460,14 @@
8470
8460
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-secondary);
8471
8461
  }
8472
8462
  :root {
8473
- --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
8474
- --x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
8475
- --x-size-border-radius-top-right-button-round: var(--x-size-border-radius-button-round);
8476
- --x-size-border-radius-bottom-right-button-round: var(--x-size-border-radius-button-round);
8477
- --x-size-border-radius-bottom-left-button-round: var(--x-size-border-radius-button-round);
8478
- }
8479
- :root {
8480
- --x-color-background-button-primary: var(--x-color-background-button-default);
8481
- --x-color-border-button-primary: var(--x-color-border-button-default);
8482
- --x-color-text-button-primary: var(--x-color-text-button-default);
8483
- --x-size-border-width-button-primary: var(--x-size-border-width-base);
8484
- --x-size-border-width-top-button-primary: var(--x-size-border-width-button-primary);
8485
- --x-size-border-width-right-button-primary: var(--x-size-border-width-button-primary);
8486
- --x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
8487
- --x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
8463
+ --x-color-background-button-secondary: transparent;
8464
+ --x-color-border-button-secondary: var(--x-color-border-button-default);
8465
+ --x-color-text-button-secondary: var(--x-color-border-button-default);
8466
+ --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8467
+ --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8468
+ --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8469
+ --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8470
+ --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8488
8471
  }
8489
8472
  :root {
8490
8473
  --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
@@ -8532,6 +8515,16 @@
8532
8515
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-primary);
8533
8516
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-primary);
8534
8517
  }
8518
+ :root {
8519
+ --x-color-background-button-primary: var(--x-color-background-button-default);
8520
+ --x-color-border-button-primary: var(--x-color-border-button-default);
8521
+ --x-color-text-button-primary: var(--x-color-text-button-default);
8522
+ --x-size-border-width-button-primary: var(--x-size-border-width-base);
8523
+ --x-size-border-width-top-button-primary: var(--x-size-border-width-button-primary);
8524
+ --x-size-border-width-right-button-primary: var(--x-size-border-width-button-primary);
8525
+ --x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
8526
+ --x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
8527
+ }
8535
8528
  :root {
8536
8529
  --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
8537
8530
  --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
@@ -8703,6 +8696,13 @@
8703
8696
  --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8704
8697
  --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8705
8698
  }
8699
+ :root {
8700
+ --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8701
+ --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8702
+ --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8703
+ --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8704
+ --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8705
+ }
8706
8706
 
8707
8707
  .x-button--card.x-button,
8708
8708
  .x-button--card .x-button {
@@ -8718,23 +8718,6 @@
8718
8718
  --x-size-border-radius-bottom-left-button-card
8719
8719
  );
8720
8720
  }
8721
- :root {
8722
- --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8723
- --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8724
- --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8725
- --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8726
- --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8727
- }
8728
- :root {
8729
- --x-color-background-badge-default: var(--x-color-base-neutral-10);
8730
- --x-color-text-badge-default: var(--x-color-base-neutral-100);
8731
- --x-color-border-badge-default: var(--x-color-base-neutral-10);
8732
- --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
8733
- --x-size-border-width-badge-default: 0;
8734
- --x-size-width-badge-default: 1.5em;
8735
- --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
8736
- --x-size-font-badge-default: var(--x-size-font-base-xs);
8737
- }
8738
8721
  :root {
8739
8722
  --x-color-background-badge-default: var(--x-color-base-neutral-10);
8740
8723
  --x-color-text-badge-default: var(--x-color-base-neutral-100);
@@ -8784,6 +8767,29 @@
8784
8767
  .x-badge-container {
8785
8768
  position: relative;
8786
8769
  }
8770
+ :root {
8771
+ --x-color-background-badge-default: var(--x-color-base-neutral-10);
8772
+ --x-color-text-badge-default: var(--x-color-base-neutral-100);
8773
+ --x-color-border-badge-default: var(--x-color-base-neutral-10);
8774
+ --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
8775
+ --x-size-border-width-badge-default: 0;
8776
+ --x-size-width-badge-default: 1.5em;
8777
+ --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
8778
+ --x-size-font-badge-default: var(--x-size-font-base-xs);
8779
+ }
8780
+ :root {
8781
+ --x-color-base-lead: #243d48;
8782
+ --x-color-base-auxiliary: #bfe1ec;
8783
+ --x-color-base-neutral-10: #1a1a1a;
8784
+ --x-color-base-neutral-35: #595959;
8785
+ --x-color-base-neutral-70: #b3b3b3;
8786
+ --x-color-base-neutral-95: #f2f2f2;
8787
+ --x-color-base-neutral-100: #ffffff;
8788
+ --x-color-base-accent: #0086b2;
8789
+ --x-color-base-enable: #00705c;
8790
+ --x-color-base-disable: #e11f26;
8791
+ --x-color-base-transparent: transparent;
8792
+ }
8787
8793
  :root {
8788
8794
  --x-size-base-01: 2px;
8789
8795
  --x-size-base-02: 4px;
@@ -8806,23 +8812,17 @@
8806
8812
  --x-size-base-19: 280px;
8807
8813
  --x-size-base-20: 344px;
8808
8814
  }
8815
+ :root {
8816
+ --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
8817
+ --x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
8818
+ --x-size-border-radius-top-right-button-round: var(--x-size-border-radius-button-round);
8819
+ --x-size-border-radius-bottom-right-button-round: var(--x-size-border-radius-button-round);
8820
+ --x-size-border-radius-bottom-left-button-round: var(--x-size-border-radius-button-round);
8821
+ }
8809
8822
  :root {
8810
8823
  --x-size-border-radius-base-none: 0;
8811
8824
  --x-size-border-radius-base-s: var(--x-size-base-02);
8812
8825
  --x-size-border-radius-base-m: var(--x-size-base-06);
8813
8826
  --x-size-border-radius-base-pill: 99999px;
8814
8827
  --x-size-border-width-base: 1px;
8815
- }
8816
- :root {
8817
- --x-color-base-lead: #243d48;
8818
- --x-color-base-auxiliary: #bfe1ec;
8819
- --x-color-base-neutral-10: #1a1a1a;
8820
- --x-color-base-neutral-35: #595959;
8821
- --x-color-base-neutral-70: #b3b3b3;
8822
- --x-color-base-neutral-95: #f2f2f2;
8823
- --x-color-base-neutral-100: #ffffff;
8824
- --x-color-base-accent: #0086b2;
8825
- --x-color-base-enable: #00705c;
8826
- --x-color-base-disable: #e11f26;
8827
- --x-color-base-transparent: transparent;
8828
8828
  }