@carbon/ibm-products 2.8.1 → 2.10.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (39) hide show
  1. package/css/index-full-carbon.css +198 -174
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +5 -3
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +2 -1
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +1 -1
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +150 -149
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +2 -2
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +61 -44
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +2 -2
  16. package/css/index.min.css.map +1 -1
  17. package/es/components/CreateFullPage/CreateFullPage.js +25 -3
  18. package/es/components/Datagrid/Datagrid/DatagridToolbar.js +8 -2
  19. package/es/components/Datagrid/Datagrid/DraggableElement.js +61 -68
  20. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +23 -15
  21. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +5 -5
  22. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +2 -2
  23. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +24 -11
  24. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +4 -7
  25. package/es/components/OptionsTile/OptionsTile.js +1 -1
  26. package/es/global/js/hooks/useClickOutside.js +6 -6
  27. package/lib/components/CreateFullPage/CreateFullPage.js +24 -2
  28. package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +8 -2
  29. package/lib/components/Datagrid/Datagrid/DraggableElement.js +62 -68
  30. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +23 -15
  31. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +5 -5
  32. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +2 -2
  33. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +24 -11
  34. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +4 -7
  35. package/lib/components/OptionsTile/OptionsTile.js +1 -1
  36. package/lib/global/js/hooks/useClickOutside.js +6 -6
  37. package/package.json +13 -15
  38. package/scss/components/Datagrid/_storybook-styles.scss +5 -0
  39. package/scss/components/EmptyStates/_empty-state.scss +2 -1
@@ -369,31 +369,31 @@
369
369
  display: block;
370
370
  }
371
371
 
372
- .cds--popover--tab-tip > .cds--popover .cds--popover-caret {
372
+ .cds--popover--tab-tip > .cds--popover > .cds--popover-caret {
373
373
  display: none;
374
374
  }
375
375
 
376
- .cds--popover--bottom > .cds--popover .cds--popover-content {
376
+ .cds--popover--bottom > .cds--popover > .cds--popover-content {
377
377
  bottom: 0;
378
378
  left: 50%;
379
379
  transform: translate(-50%, calc(100% + var(--cds-popover-offset, 0rem)));
380
380
  }
381
381
 
382
- .cds--popover--bottom-left > .cds--popover .cds--popover-content {
382
+ .cds--popover--bottom-left > .cds--popover > .cds--popover-content {
383
383
  bottom: 0;
384
384
  left: 0;
385
385
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(100% + var(--cds-popover-offset, 0rem)));
386
386
  }
387
387
 
388
- .cds--popover--bottom-right > .cds--popover .cds--popover-content {
388
+ .cds--popover--bottom-right > .cds--popover > .cds--popover-content {
389
389
  right: 0;
390
390
  bottom: 0;
391
391
  transform: translate(var(--cds-popover-offset, 0rem), calc(100% + var(--cds-popover-offset, 0rem)));
392
392
  }
393
393
 
394
- .cds--popover--bottom > .cds--popover .cds--popover-content::before,
395
- .cds--popover--bottom-left > .cds--popover .cds--popover-content::before,
396
- .cds--popover--bottom-right > .cds--popover .cds--popover-content::before {
394
+ .cds--popover--bottom > .cds--popover > .cds--popover-content::before,
395
+ .cds--popover--bottom-left > .cds--popover > .cds--popover-content::before,
396
+ .cds--popover--bottom-right > .cds--popover > .cds--popover-content::before {
397
397
  top: 0;
398
398
  right: 0;
399
399
  left: 0;
@@ -401,9 +401,9 @@
401
401
  transform: translateY(-100%);
402
402
  }
403
403
 
404
- .cds--popover--bottom > .cds--popover .cds--popover-caret,
405
- .cds--popover--bottom-left > .cds--popover .cds--popover-caret,
406
- .cds--popover--bottom-right > .cds--popover .cds--popover-caret {
404
+ .cds--popover--bottom > .cds--popover > .cds--popover-caret,
405
+ .cds--popover--bottom-left > .cds--popover > .cds--popover-caret,
406
+ .cds--popover--bottom-right > .cds--popover > .cds--popover-caret {
407
407
  bottom: 0;
408
408
  left: 50%;
409
409
  width: var(--cds-popover-caret-width, 0.75rem);
@@ -412,27 +412,27 @@
412
412
  transform: translate(-50%, var(--cds-popover-offset, 0rem));
413
413
  }
414
414
 
415
- .cds--popover--top > .cds--popover .cds--popover-content {
415
+ .cds--popover--top > .cds--popover > .cds--popover-content {
416
416
  top: 0;
417
417
  left: 50%;
418
418
  transform: translate(-50%, calc(-100% - var(--cds-popover-offset, 0rem)));
419
419
  }
420
420
 
421
- .cds--popover--top-left > .cds--popover .cds--popover-content {
421
+ .cds--popover--top-left > .cds--popover > .cds--popover-content {
422
422
  top: 0;
423
423
  left: 0;
424
424
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-100% - var(--cds-popover-offset, 0rem)));
425
425
  }
426
426
 
427
- .cds--popover--top-right > .cds--popover .cds--popover-content {
427
+ .cds--popover--top-right > .cds--popover > .cds--popover-content {
428
428
  top: 0;
429
429
  right: 0;
430
430
  transform: translate(var(--cds-popover-offset, 0rem), calc(-100% - var(--cds-popover-offset, 0rem)));
431
431
  }
432
432
 
433
- .cds--popover--top > .cds--popover .cds--popover-content::before,
434
- .cds--popover--top-left > .cds--popover .cds--popover-content::before,
435
- .cds--popover--top-right > .cds--popover .cds--popover-content::before {
433
+ .cds--popover--top > .cds--popover > .cds--popover-content::before,
434
+ .cds--popover--top-left > .cds--popover > .cds--popover-content::before,
435
+ .cds--popover--top-right > .cds--popover > .cds--popover-content::before {
436
436
  right: 0;
437
437
  bottom: 0;
438
438
  left: 0;
@@ -440,9 +440,9 @@
440
440
  transform: translateY(100%);
441
441
  }
442
442
 
443
- .cds--popover--top > .cds--popover .cds--popover-caret,
444
- .cds--popover--top-left > .cds--popover .cds--popover-caret,
445
- .cds--popover--top-right > .cds--popover .cds--popover-caret {
443
+ .cds--popover--top > .cds--popover > .cds--popover-caret,
444
+ .cds--popover--top-left > .cds--popover > .cds--popover-caret,
445
+ .cds--popover--top-right > .cds--popover > .cds--popover-caret {
446
446
  top: 0;
447
447
  left: 50%;
448
448
  width: var(--cds-popover-caret-width, 0.75rem);
@@ -451,27 +451,27 @@
451
451
  transform: translate(-50%, calc(-1 * var(--cds-popover-offset, 0rem)));
452
452
  }
453
453
 
454
- .cds--popover--right > .cds--popover .cds--popover-content {
454
+ .cds--popover--right > .cds--popover > .cds--popover-content {
455
455
  top: 50%;
456
456
  left: 100%;
457
457
  transform: translate(var(--cds-popover-offset, 0rem), -50%);
458
458
  }
459
459
 
460
- .cds--popover--right-top > .cds--popover .cds--popover-content {
460
+ .cds--popover--right-top > .cds--popover > .cds--popover-content {
461
461
  top: 50%;
462
462
  left: 100%;
463
463
  transform: translate(var(--cds-popover-offset, 0rem), calc(0.5 * var(--cds-popover-offset, 0rem) * -1 - 16px));
464
464
  }
465
465
 
466
- .cds--popover--right-bottom > .cds--popover .cds--popover-content {
466
+ .cds--popover--right-bottom > .cds--popover > .cds--popover-content {
467
467
  bottom: 50%;
468
468
  left: 100%;
469
469
  transform: translate(var(--cds-popover-offset, 0rem), calc(0.5 * var(--cds-popover-offset, 0rem) + 16px));
470
470
  }
471
471
 
472
- .cds--popover--right > .cds--popover .cds--popover-content::before,
473
- .cds--popover--right-top > .cds--popover .cds--popover-content::before,
474
- .cds--popover--right-bottom > .cds--popover .cds--popover-content::before {
472
+ .cds--popover--right > .cds--popover > .cds--popover-content::before,
473
+ .cds--popover--right-top > .cds--popover > .cds--popover-content::before,
474
+ .cds--popover--right-bottom > .cds--popover > .cds--popover-content::before {
475
475
  top: 0;
476
476
  bottom: 0;
477
477
  left: 0;
@@ -479,9 +479,9 @@
479
479
  transform: translateX(-100%);
480
480
  }
481
481
 
482
- .cds--popover--right > .cds--popover .cds--popover-caret,
483
- .cds--popover--right-top > .cds--popover .cds--popover-caret,
484
- .cds--popover--right-bottom > .cds--popover .cds--popover-caret {
482
+ .cds--popover--right > .cds--popover > .cds--popover-caret,
483
+ .cds--popover--right-top > .cds--popover > .cds--popover-caret,
484
+ .cds--popover--right-bottom > .cds--popover > .cds--popover-caret {
485
485
  top: 50%;
486
486
  left: 100%;
487
487
  width: var(--cds-popover-caret-height, 0.375rem);
@@ -490,27 +490,27 @@
490
490
  transform: translate(calc(var(--cds-popover-offset, 0rem) - 100%), -50%);
491
491
  }
492
492
 
493
- .cds--popover--left > .cds--popover .cds--popover-content {
493
+ .cds--popover--left > .cds--popover > .cds--popover-content {
494
494
  top: 50%;
495
495
  right: 100%;
496
496
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem) + 0.1px), -50%);
497
497
  }
498
498
 
499
- .cds--popover--left-top > .cds--popover .cds--popover-content {
499
+ .cds--popover--left-top > .cds--popover > .cds--popover-content {
500
500
  top: -50%;
501
501
  right: 100%;
502
502
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-0.5 * var(--cds-popover-offset, 0rem) + 16px));
503
503
  }
504
504
 
505
- .cds--popover--left-bottom > .cds--popover .cds--popover-content {
505
+ .cds--popover--left-bottom > .cds--popover > .cds--popover-content {
506
506
  right: 100%;
507
507
  bottom: -50%;
508
508
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(0.5 * var(--cds-popover-offset, 0rem) - 16px));
509
509
  }
510
510
 
511
- .cds--popover--left > .cds--popover .cds--popover-content::before,
512
- .cds--popover--left-top > .cds--popover .cds--popover-content::before,
513
- .cds--popover--left-bottom > .cds--popover .cds--popover-content::before {
511
+ .cds--popover--left > .cds--popover > .cds--popover-content::before,
512
+ .cds--popover--left-top > .cds--popover > .cds--popover-content::before,
513
+ .cds--popover--left-bottom > .cds--popover > .cds--popover-content::before {
514
514
  top: 0;
515
515
  right: 0;
516
516
  bottom: 0;
@@ -518,9 +518,9 @@
518
518
  transform: translateX(100%);
519
519
  }
520
520
 
521
- .cds--popover--left > .cds--popover .cds--popover-caret,
522
- .cds--popover--left-top > .cds--popover .cds--popover-caret,
523
- .cds--popover--left-bottom > .cds--popover .cds--popover-caret {
521
+ .cds--popover--left > .cds--popover > .cds--popover-caret,
522
+ .cds--popover--left-top > .cds--popover > .cds--popover-caret,
523
+ .cds--popover--left-bottom > .cds--popover > .cds--popover-caret {
524
524
  top: 50%;
525
525
  right: 100%;
526
526
  width: var(--cds-popover-caret-height, 0.375rem);
@@ -529,7 +529,7 @@
529
529
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem) + 100%), -50%);
530
530
  }
531
531
 
532
- .cds--popover--tab-tip > .cds--popover .cds--popover-content {
532
+ .cds--popover--tab-tip > .cds--popover > .cds--popover-content {
533
533
  border-radius: 0;
534
534
  }
535
535
 
@@ -848,14 +848,14 @@
848
848
  padding-inline-end: calc(var(--cds-layout-density-padding-inline-local) - 0.0625rem);
849
849
  }
850
850
  .cds--btn--ghost:hover {
851
- background-color: var(--cds-layer-hover);
851
+ background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
852
852
  }
853
853
  .cds--btn--ghost:focus {
854
854
  border-color: var(--cds-button-focus-color, var(--cds-focus, #0f62fe));
855
855
  box-shadow: inset 0 0 0 1px var(--cds-button-focus-color, var(--cds-focus, #0f62fe)), inset 0 0 0 2px var(--cds-background, #ffffff);
856
856
  }
857
857
  .cds--btn--ghost:active {
858
- background-color: var(--cds-layer-active);
858
+ background-color: var(--cds-background-active, rgba(141, 141, 141, 0.5));
859
859
  }
860
860
  .cds--btn--ghost .cds--btn__icon,
861
861
  .cds--btn--ghost .cds--btn__icon path:not([data-icon-path]):not([fill=none]) {
@@ -4956,6 +4956,7 @@ p.c4p--about-modal__copyright-text:first-child {
4956
4956
  line-height: var(--cds-body-01-line-height, 1.42857);
4957
4957
  letter-spacing: var(--cds-body-01-letter-spacing, 0.16px);
4958
4958
  padding-bottom: 1rem;
4959
+ color: var(--cds-text-secondary, #525252);
4959
4960
  }
4960
4961
  .c4p--empty-state .c4p--empty-state__header--small {
4961
4962
  font-size: var(--cds-body-compact-02-font-size, 1rem);
@@ -5006,7 +5007,7 @@ p.c4p--about-modal__copyright-text:first-child {
5006
5007
  }
5007
5008
 
5008
5009
  .c4p--empty-state .c4p--empty-state__link {
5009
- display: block;
5010
+ display: inline-block;
5010
5011
  }
5011
5012
 
5012
5013
  .c4p--export-modal .cds--modal-footer .cds--btn {
@@ -14532,71 +14533,71 @@ th.c4p--datagrid__select-all-toggle-on.button {
14532
14533
  }
14533
14534
  }
14534
14535
  :root {
14535
- --cds-layer:var(--cds-layer-01, #f4f4f4);
14536
- --cds-layer-active:var(--cds-layer-active-01, #c6c6c6);
14537
- --cds-layer-hover:var(--cds-layer-hover-01, #e8e8e8);
14538
- --cds-layer-selected:var(--cds-layer-selected-01, #e0e0e0);
14539
- --cds-layer-selected-hover:var(--cds-layer-selected-hover-01, #d1d1d1);
14540
- --cds-layer-accent:var(--cds-layer-accent-01, #e0e0e0);
14541
- --cds-layer-accent-hover:var(--cds-layer-accent-hover-01, #d1d1d1);
14542
- --cds-layer-accent-active:var(--cds-layer-accent-active-01, #a8a8a8);
14543
- --cds-field:var(--cds-field-01, #f4f4f4);
14544
- --cds-field-hover:var(--cds-field-hover-01, #e8e8e8);
14545
- --cds-border-subtle:var(--cds-border-subtle-00, #e0e0e0);
14546
- --cds-border-subtle-selected:var(--cds-border-subtle-selected-01, #c6c6c6);
14547
- --cds-border-strong:var(--cds-border-strong-01, #8d8d8d);
14548
- --cds-border-tile:var(--cds-border-tile-01, #c6c6c6);
14536
+ --cds-layer: var(--cds-layer-01, #f4f4f4);
14537
+ --cds-layer-active: var(--cds-layer-active-01, #c6c6c6);
14538
+ --cds-layer-hover: var(--cds-layer-hover-01, #e8e8e8);
14539
+ --cds-layer-selected: var(--cds-layer-selected-01, #e0e0e0);
14540
+ --cds-layer-selected-hover: var(--cds-layer-selected-hover-01, #d1d1d1);
14541
+ --cds-layer-accent: var(--cds-layer-accent-01, #e0e0e0);
14542
+ --cds-layer-accent-hover: var(--cds-layer-accent-hover-01, #d1d1d1);
14543
+ --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
14544
+ --cds-field: var(--cds-field-01, #f4f4f4);
14545
+ --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
14546
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
14547
+ --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
14548
+ --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
14549
+ --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
14549
14550
  }
14550
14551
 
14551
14552
  .cds--layer-one {
14552
- --cds-layer:var(--cds-layer-01, #f4f4f4);
14553
- --cds-layer-active:var(--cds-layer-active-01, #c6c6c6);
14554
- --cds-layer-hover:var(--cds-layer-hover-01, #e8e8e8);
14555
- --cds-layer-selected:var(--cds-layer-selected-01, #e0e0e0);
14556
- --cds-layer-selected-hover:var(--cds-layer-selected-hover-01, #d1d1d1);
14557
- --cds-layer-accent:var(--cds-layer-accent-01, #e0e0e0);
14558
- --cds-layer-accent-hover:var(--cds-layer-accent-hover-01, #d1d1d1);
14559
- --cds-layer-accent-active:var(--cds-layer-accent-active-01, #a8a8a8);
14560
- --cds-field:var(--cds-field-01, #f4f4f4);
14561
- --cds-field-hover:var(--cds-field-hover-01, #e8e8e8);
14562
- --cds-border-subtle:var(--cds-border-subtle-00, #e0e0e0);
14563
- --cds-border-subtle-selected:var(--cds-border-subtle-selected-01, #c6c6c6);
14564
- --cds-border-strong:var(--cds-border-strong-01, #8d8d8d);
14565
- --cds-border-tile:var(--cds-border-tile-01, #c6c6c6);
14553
+ --cds-layer: var(--cds-layer-01, #f4f4f4);
14554
+ --cds-layer-active: var(--cds-layer-active-01, #c6c6c6);
14555
+ --cds-layer-hover: var(--cds-layer-hover-01, #e8e8e8);
14556
+ --cds-layer-selected: var(--cds-layer-selected-01, #e0e0e0);
14557
+ --cds-layer-selected-hover: var(--cds-layer-selected-hover-01, #d1d1d1);
14558
+ --cds-layer-accent: var(--cds-layer-accent-01, #e0e0e0);
14559
+ --cds-layer-accent-hover: var(--cds-layer-accent-hover-01, #d1d1d1);
14560
+ --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
14561
+ --cds-field: var(--cds-field-01, #f4f4f4);
14562
+ --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
14563
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
14564
+ --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
14565
+ --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
14566
+ --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
14566
14567
  }
14567
14568
 
14568
14569
  .cds--layer-two {
14569
- --cds-layer:var(--cds-layer-02, #ffffff);
14570
- --cds-layer-active:var(--cds-layer-active-02, #c6c6c6);
14571
- --cds-layer-hover:var(--cds-layer-hover-02, #e8e8e8);
14572
- --cds-layer-selected:var(--cds-layer-selected-02, #e0e0e0);
14573
- --cds-layer-selected-hover:var(--cds-layer-selected-hover-02, #d1d1d1);
14574
- --cds-layer-accent:var(--cds-layer-accent-02, #e0e0e0);
14575
- --cds-layer-accent-hover:var(--cds-layer-accent-hover-02, #d1d1d1);
14576
- --cds-layer-accent-active:var(--cds-layer-accent-active-02, #a8a8a8);
14577
- --cds-field:var(--cds-field-02, #ffffff);
14578
- --cds-field-hover:var(--cds-field-hover-02, #e8e8e8);
14579
- --cds-border-subtle:var(--cds-border-subtle-01, #c6c6c6);
14580
- --cds-border-subtle-selected:var(--cds-border-subtle-selected-02, #c6c6c6);
14581
- --cds-border-strong:var(--cds-border-strong-02, #8d8d8d);
14582
- --cds-border-tile:var(--cds-border-tile-02, #a8a8a8);
14570
+ --cds-layer: var(--cds-layer-02, #ffffff);
14571
+ --cds-layer-active: var(--cds-layer-active-02, #c6c6c6);
14572
+ --cds-layer-hover: var(--cds-layer-hover-02, #e8e8e8);
14573
+ --cds-layer-selected: var(--cds-layer-selected-02, #e0e0e0);
14574
+ --cds-layer-selected-hover: var(--cds-layer-selected-hover-02, #d1d1d1);
14575
+ --cds-layer-accent: var(--cds-layer-accent-02, #e0e0e0);
14576
+ --cds-layer-accent-hover: var(--cds-layer-accent-hover-02, #d1d1d1);
14577
+ --cds-layer-accent-active: var(--cds-layer-accent-active-02, #a8a8a8);
14578
+ --cds-field: var(--cds-field-02, #ffffff);
14579
+ --cds-field-hover: var(--cds-field-hover-02, #e8e8e8);
14580
+ --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
14581
+ --cds-border-subtle-selected: var(--cds-border-subtle-selected-02, #c6c6c6);
14582
+ --cds-border-strong: var(--cds-border-strong-02, #8d8d8d);
14583
+ --cds-border-tile: var(--cds-border-tile-02, #a8a8a8);
14583
14584
  }
14584
14585
 
14585
14586
  .cds--layer-three {
14586
- --cds-layer:var(--cds-layer-03, #f4f4f4);
14587
- --cds-layer-active:var(--cds-layer-active-03, #c6c6c6);
14588
- --cds-layer-hover:var(--cds-layer-hover-03, #e8e8e8);
14589
- --cds-layer-selected:var(--cds-layer-selected-03, #e0e0e0);
14590
- --cds-layer-selected-hover:var(--cds-layer-selected-hover-03, #d1d1d1);
14591
- --cds-layer-accent:var(--cds-layer-accent-03, #e0e0e0);
14592
- --cds-layer-accent-hover:var(--cds-layer-accent-hover-03, #d1d1d1);
14593
- --cds-layer-accent-active:var(--cds-layer-accent-active-03, #a8a8a8);
14594
- --cds-field:var(--cds-field-03, #f4f4f4);
14595
- --cds-field-hover:var(--cds-field-hover-03, #e8e8e8);
14596
- --cds-border-subtle:var(--cds-border-subtle-02, #e0e0e0);
14597
- --cds-border-subtle-selected:var(--cds-border-subtle-selected-03, #c6c6c6);
14598
- --cds-border-strong:var(--cds-border-strong-03, #8d8d8d);
14599
- --cds-border-tile:var(--cds-border-tile-03, #c6c6c6);
14587
+ --cds-layer: var(--cds-layer-03, #f4f4f4);
14588
+ --cds-layer-active: var(--cds-layer-active-03, #c6c6c6);
14589
+ --cds-layer-hover: var(--cds-layer-hover-03, #e8e8e8);
14590
+ --cds-layer-selected: var(--cds-layer-selected-03, #e0e0e0);
14591
+ --cds-layer-selected-hover: var(--cds-layer-selected-hover-03, #d1d1d1);
14592
+ --cds-layer-accent: var(--cds-layer-accent-03, #e0e0e0);
14593
+ --cds-layer-accent-hover: var(--cds-layer-accent-hover-03, #d1d1d1);
14594
+ --cds-layer-accent-active: var(--cds-layer-accent-active-03, #a8a8a8);
14595
+ --cds-field: var(--cds-field-03, #f4f4f4);
14596
+ --cds-field-hover: var(--cds-field-hover-03, #e8e8e8);
14597
+ --cds-border-subtle: var(--cds-border-subtle-02, #e0e0e0);
14598
+ --cds-border-subtle-selected: var(--cds-border-subtle-selected-03, #c6c6c6);
14599
+ --cds-border-strong: var(--cds-border-strong-03, #8d8d8d);
14600
+ --cds-border-tile: var(--cds-border-tile-03, #c6c6c6);
14600
14601
  }
14601
14602
 
14602
14603
  .cds--side-nav {
@@ -15107,154 +15108,154 @@ a.cds--side-nav__link--current::before {
15107
15108
  }
15108
15109
  }
15109
15110
  .cds--layout--size-xs {
15110
- --cds-layout-size-height-context:var(--cds-layout-size-height-xs, 1.5rem);
15111
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15111
+ --cds-layout-size-height-context: var(--cds-layout-size-height-xs, 1.5rem);
15112
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15112
15113
  }
15113
15114
 
15114
15115
  .cds--layout-constraint--size__default-xs {
15115
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-xs, 1.5rem));
15116
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-xs, 1.5rem));
15116
15117
  }
15117
15118
 
15118
15119
  .cds--layout-constraint--size__min-xs {
15119
- --cds-layout-size-height-min:var(--cds-layout-size-height-xs, 1.5rem);
15120
+ --cds-layout-size-height-min: var(--cds-layout-size-height-xs, 1.5rem);
15120
15121
  }
15121
15122
 
15122
15123
  .cds--layout-constraint--size__max-xs {
15123
- --cds-layout-size-height-max:var(--cds-layout-size-height-xs, 1.5rem);
15124
+ --cds-layout-size-height-max: var(--cds-layout-size-height-xs, 1.5rem);
15124
15125
  }
15125
15126
 
15126
15127
  .cds--layout--size-sm {
15127
- --cds-layout-size-height-context:var(--cds-layout-size-height-sm, 2rem);
15128
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15128
+ --cds-layout-size-height-context: var(--cds-layout-size-height-sm, 2rem);
15129
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15129
15130
  }
15130
15131
 
15131
15132
  .cds--layout-constraint--size__default-sm {
15132
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-sm, 2rem));
15133
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-sm, 2rem));
15133
15134
  }
15134
15135
 
15135
15136
  .cds--layout-constraint--size__min-sm {
15136
- --cds-layout-size-height-min:var(--cds-layout-size-height-sm, 2rem);
15137
+ --cds-layout-size-height-min: var(--cds-layout-size-height-sm, 2rem);
15137
15138
  }
15138
15139
 
15139
15140
  .cds--layout-constraint--size__max-sm {
15140
- --cds-layout-size-height-max:var(--cds-layout-size-height-sm, 2rem);
15141
+ --cds-layout-size-height-max: var(--cds-layout-size-height-sm, 2rem);
15141
15142
  }
15142
15143
 
15143
15144
  .cds--layout--size-md {
15144
- --cds-layout-size-height-context:var(--cds-layout-size-height-md, 2.5rem);
15145
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15145
+ --cds-layout-size-height-context: var(--cds-layout-size-height-md, 2.5rem);
15146
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15146
15147
  }
15147
15148
 
15148
15149
  .cds--layout-constraint--size__default-md {
15149
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-md, 2.5rem));
15150
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-md, 2.5rem));
15150
15151
  }
15151
15152
 
15152
15153
  .cds--layout-constraint--size__min-md {
15153
- --cds-layout-size-height-min:var(--cds-layout-size-height-md, 2.5rem);
15154
+ --cds-layout-size-height-min: var(--cds-layout-size-height-md, 2.5rem);
15154
15155
  }
15155
15156
 
15156
15157
  .cds--layout-constraint--size__max-md {
15157
- --cds-layout-size-height-max:var(--cds-layout-size-height-md, 2.5rem);
15158
+ --cds-layout-size-height-max: var(--cds-layout-size-height-md, 2.5rem);
15158
15159
  }
15159
15160
 
15160
15161
  .cds--layout--size-lg {
15161
- --cds-layout-size-height-context:var(--cds-layout-size-height-lg, 3rem);
15162
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15162
+ --cds-layout-size-height-context: var(--cds-layout-size-height-lg, 3rem);
15163
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15163
15164
  }
15164
15165
 
15165
15166
  .cds--layout-constraint--size__default-lg {
15166
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-lg, 3rem));
15167
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-lg, 3rem));
15167
15168
  }
15168
15169
 
15169
15170
  .cds--layout-constraint--size__min-lg {
15170
- --cds-layout-size-height-min:var(--cds-layout-size-height-lg, 3rem);
15171
+ --cds-layout-size-height-min: var(--cds-layout-size-height-lg, 3rem);
15171
15172
  }
15172
15173
 
15173
15174
  .cds--layout-constraint--size__max-lg {
15174
- --cds-layout-size-height-max:var(--cds-layout-size-height-lg, 3rem);
15175
+ --cds-layout-size-height-max: var(--cds-layout-size-height-lg, 3rem);
15175
15176
  }
15176
15177
 
15177
15178
  .cds--layout--size-xl {
15178
- --cds-layout-size-height-context:var(--cds-layout-size-height-xl, 4rem);
15179
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15179
+ --cds-layout-size-height-context: var(--cds-layout-size-height-xl, 4rem);
15180
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15180
15181
  }
15181
15182
 
15182
15183
  .cds--layout-constraint--size__default-xl {
15183
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-xl, 4rem));
15184
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-xl, 4rem));
15184
15185
  }
15185
15186
 
15186
15187
  .cds--layout-constraint--size__min-xl {
15187
- --cds-layout-size-height-min:var(--cds-layout-size-height-xl, 4rem);
15188
+ --cds-layout-size-height-min: var(--cds-layout-size-height-xl, 4rem);
15188
15189
  }
15189
15190
 
15190
15191
  .cds--layout-constraint--size__max-xl {
15191
- --cds-layout-size-height-max:var(--cds-layout-size-height-xl, 4rem);
15192
+ --cds-layout-size-height-max: var(--cds-layout-size-height-xl, 4rem);
15192
15193
  }
15193
15194
 
15194
15195
  .cds--layout--size-2xl {
15195
- --cds-layout-size-height-context:var(--cds-layout-size-height-2xl, 5rem);
15196
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15196
+ --cds-layout-size-height-context: var(--cds-layout-size-height-2xl, 5rem);
15197
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15197
15198
  }
15198
15199
 
15199
15200
  .cds--layout-constraint--size__default-2xl {
15200
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-2xl, 5rem));
15201
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-2xl, 5rem));
15201
15202
  }
15202
15203
 
15203
15204
  .cds--layout-constraint--size__min-2xl {
15204
- --cds-layout-size-height-min:var(--cds-layout-size-height-2xl, 5rem);
15205
+ --cds-layout-size-height-min: var(--cds-layout-size-height-2xl, 5rem);
15205
15206
  }
15206
15207
 
15207
15208
  .cds--layout-constraint--size__max-2xl {
15208
- --cds-layout-size-height-max:var(--cds-layout-size-height-2xl, 5rem);
15209
+ --cds-layout-size-height-max: var(--cds-layout-size-height-2xl, 5rem);
15209
15210
  }
15210
15211
 
15211
15212
  .cds--layout--density-condensed {
15212
- --cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15213
- --cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context);
15213
+ --cds-layout-density-padding-inline-context: var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15214
+ --cds-layout-density-padding-inline: var(--cds-layout-density-padding-inline-context);
15214
15215
  }
15215
15216
 
15216
15217
  .cds--layout-constraint--density__default-condensed {
15217
- --cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context, var(--cds-layout-density-padding-inline-condensed, 0.5rem));
15218
+ --cds-layout-density-padding-inline: var(--cds-layout-density-padding-inline-context, var(--cds-layout-density-padding-inline-condensed, 0.5rem));
15218
15219
  }
15219
15220
 
15220
15221
  .cds--layout-constraint--density__min-condensed {
15221
- --cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15222
+ --cds-layout-density-padding-inline-min: var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15222
15223
  }
15223
15224
 
15224
15225
  .cds--layout-constraint--density__max-condensed {
15225
- --cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15226
+ --cds-layout-density-padding-inline-max: var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15226
15227
  }
15227
15228
 
15228
15229
  .cds--layout--density-normal {
15229
- --cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-normal, 1rem);
15230
- --cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context);
15230
+ --cds-layout-density-padding-inline-context: var(--cds-layout-density-padding-inline-normal, 1rem);
15231
+ --cds-layout-density-padding-inline: var(--cds-layout-density-padding-inline-context);
15231
15232
  }
15232
15233
 
15233
15234
  .cds--layout-constraint--density__default-normal {
15234
- --cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context, var(--cds-layout-density-padding-inline-normal, 1rem));
15235
+ --cds-layout-density-padding-inline: var(--cds-layout-density-padding-inline-context, var(--cds-layout-density-padding-inline-normal, 1rem));
15235
15236
  }
15236
15237
 
15237
15238
  .cds--layout-constraint--density__min-normal {
15238
- --cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-normal, 1rem);
15239
+ --cds-layout-density-padding-inline-min: var(--cds-layout-density-padding-inline-normal, 1rem);
15239
15240
  }
15240
15241
 
15241
15242
  .cds--layout-constraint--density__max-normal {
15242
- --cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-normal, 1rem);
15243
+ --cds-layout-density-padding-inline-max: var(--cds-layout-density-padding-inline-normal, 1rem);
15243
15244
  }
15244
15245
 
15245
15246
  :root {
15246
- --cds-layout-size-height-xs:1.5rem;
15247
- --cds-layout-size-height-sm:2rem;
15248
- --cds-layout-size-height-md:2.5rem;
15249
- --cds-layout-size-height-lg:3rem;
15250
- --cds-layout-size-height-xl:4rem;
15251
- --cds-layout-size-height-2xl:5rem;
15252
- --cds-layout-size-height-min:0px;
15253
- --cds-layout-size-height-max:999999999px;
15254
- --cds-layout-density-padding-inline-condensed:0.5rem;
15255
- --cds-layout-density-padding-inline-normal:1rem;
15256
- --cds-layout-density-padding-inline-min:0px;
15257
- --cds-layout-density-padding-inline-max:999999999px;
15247
+ --cds-layout-size-height-xs: 1.5rem;
15248
+ --cds-layout-size-height-sm: 2rem;
15249
+ --cds-layout-size-height-md: 2.5rem;
15250
+ --cds-layout-size-height-lg: 3rem;
15251
+ --cds-layout-size-height-xl: 4rem;
15252
+ --cds-layout-size-height-2xl: 5rem;
15253
+ --cds-layout-size-height-min: 0px;
15254
+ --cds-layout-size-height-max: 999999999px;
15255
+ --cds-layout-density-padding-inline-condensed: 0.5rem;
15256
+ --cds-layout-density-padding-inline-normal: 1rem;
15257
+ --cds-layout-density-padding-inline-min: 0px;
15258
+ --cds-layout-density-padding-inline-max: 999999999px;
15258
15259
  }
15259
15260
 
15260
15261
  .c4p--action-set {
@@ -16907,7 +16908,7 @@ em {
16907
16908
  --cds-notification-background-success: #defbe6;
16908
16909
  --cds-notification-background-info: #edf5ff;
16909
16910
  --cds-notification-background-warning: #fdf6dd;
16910
- --cds-notification-action-hover: #edf5ff;
16911
+ --cds-notification-action-hover: #ffffff;
16911
16912
  --cds-notification-action-tertiary-inverse: #ffffff;
16912
16913
  --cds-notification-action-tertiary-inverse-active: #c6c6c6;
16913
16914
  --cds-notification-action-tertiary-inverse-hover: #f4f4f4;
@@ -17081,7 +17082,7 @@ em {
17081
17082
  --cds-notification-background-success: #defbe6;
17082
17083
  --cds-notification-background-info: #edf5ff;
17083
17084
  --cds-notification-background-warning: #fdf6dd;
17084
- --cds-notification-action-hover: #edf5ff;
17085
+ --cds-notification-action-hover: #ffffff;
17085
17086
  --cds-notification-action-tertiary-inverse: #ffffff;
17086
17087
  --cds-notification-action-tertiary-inverse-active: #c6c6c6;
17087
17088
  --cds-notification-action-tertiary-inverse-hover: #f4f4f4;
@@ -18949,12 +18950,13 @@ fieldset[disabled] .cds--form__helper-text {
18949
18950
  .cds--checkbox-group__validation-msg,
18950
18951
  .cds--checkbox__validation-msg {
18951
18952
  display: none;
18952
- align-items: flex-end;
18953
+ align-items: flex-start;
18953
18954
  margin-top: 0.25rem;
18954
18955
  }
18955
18956
 
18956
18957
  .cds--checkbox__invalid-icon {
18957
- margin: 0 0.0625rem 0 0.1875rem;
18958
+ min-width: 1rem;
18959
+ margin: 0.0625rem 0.0625rem 0 0.1875rem;
18958
18960
  fill: var(--cds-support-error, #da1e28);
18959
18961
  }
18960
18962
 
@@ -22468,7 +22470,7 @@ tr.cds--data-table--selected:last-of-type td {
22468
22470
  }
22469
22471
 
22470
22472
  .cds--data-table--sticky-header {
22471
- max-height: rem(300px);
22473
+ max-height: 18.75rem;
22472
22474
  }
22473
22475
 
22474
22476
  .cds--data-table .cds--form-item.cds--checkbox-wrapper:last-of-type {
@@ -23370,6 +23372,10 @@ tr.cds--data-table--selected:last-of-type td {
23370
23372
  letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
23371
23373
  }
23372
23374
 
23375
+ .cds--batch-summary__divider {
23376
+ padding-left: 0.5rem;
23377
+ }
23378
+
23373
23379
  .cds--table-toolbar--sm {
23374
23380
  height: 2rem;
23375
23381
  min-height: 2rem;
@@ -23460,8 +23466,8 @@ tr.cds--data-table--selected:last-of-type td {
23460
23466
  .cds--table-toolbar--sm .cds--btn--primary {
23461
23467
  height: 2rem;
23462
23468
  min-height: auto;
23463
- padding-top: calc(0.375rem - 3px);
23464
- padding-bottom: calc(0.375rem - 3px);
23469
+ padding-top: 0.375rem;
23470
+ padding-bottom: 0.375rem;
23465
23471
  }
23466
23472
 
23467
23473
  .cds--table-toolbar--sm .cds--btn--primary.cds--batch-summary__cancel::before {
@@ -26654,6 +26660,7 @@ button.cds--dropdown-text:focus {
26654
26660
  border: 0;
26655
26661
  border-bottom: 0.0625rem solid var(--cds-border-strong);
26656
26662
  -moz-appearance: textfield;
26663
+ appearance: textfield;
26657
26664
  background-color: var(--cds-field);
26658
26665
  border-radius: 0;
26659
26666
  color: var(--cds-text-primary, #161616);
@@ -28675,9 +28682,13 @@ optgroup.cds--select-optgroup:disabled,
28675
28682
  .cds--modal .cds--date-picker__input,
28676
28683
  .cds--modal .cds--multi-select,
28677
28684
  .cds--modal .cds--number__control-btn::before,
28678
- .cds--modal .cds--number__control-btn::after {
28685
+ .cds--modal .cds--number__control-btn::after,
28686
+ .cds--modal .cds--list-box input[role=combobox] {
28679
28687
  background-color: var(--cds-field-02, #ffffff);
28680
28688
  }
28689
+ .cds--modal .cds--list-box__menu {
28690
+ background-color: var(--cds-layer-02, #ffffff);
28691
+ }
28681
28692
  .cds--modal .cds--number__rule-divider {
28682
28693
  background-color: var(--cds-border-subtle-02, #e0e0e0);
28683
28694
  }
@@ -28685,10 +28696,10 @@ optgroup.cds--select-optgroup:disabled,
28685
28696
  border-top-color: var(--cds-border-subtle-02, #e0e0e0);
28686
28697
  }
28687
28698
  .cds--modal .cds--list-box__menu-item:hover .cds--list-box__menu-item__option {
28688
- border-top-color: var(--cds-layer-hover);
28699
+ border-top-color: var(--cds-layer-hover-02, #e8e8e8);
28689
28700
  }
28690
28701
  .cds--modal .cds--list-box__menu-item--active:hover .cds--list-box__menu-item__option {
28691
- border-top-color: var(--cds-layer-selected-hover);
28702
+ border-top-color: var(--cds-layer-selected-hover-02, #d1d1d1);
28692
28703
  }
28693
28704
  .cds--modal .cds--text-input--fluid .cds--text-input,
28694
28705
  .cds--modal .cds--text-area--fluid .cds--text-area__wrapper,
@@ -28704,6 +28715,18 @@ optgroup.cds--select-optgroup:disabled,
28704
28715
  .cds--modal .cds--date-picker--fluid .ccdsds--date-picker-input__wrapper .cds--date-picker__input {
28705
28716
  background-color: var(--cds-field-01, #f4f4f4);
28706
28717
  }
28718
+ .cds--modal .cds--list-box__wrapper--fluid .cds--list-box__menu {
28719
+ background-color: var(--cds-layer-01, #f4f4f4);
28720
+ }
28721
+ .cds--modal .cds--list-box__menu-item:hover {
28722
+ background-color: var(--cds-layer-hover-02, #e8e8e8);
28723
+ }
28724
+ .cds--modal .cds--list-box__menu-item--active {
28725
+ background-color: var(--cds-layer-selected-02, #e0e0e0);
28726
+ }
28727
+ .cds--modal .cds--list-box__menu-item--active:hover {
28728
+ background-color: var(--cds-layer-selected-hover-02, #d1d1d1);
28729
+ }
28707
28730
  .cds--modal .cds--number-input--fluid .cds--number__control-btn:hover::before,
28708
28731
  .cds--modal .cds--number-input--fluid .cds--number__control-btn:hover::after {
28709
28732
  background-color: var(--cds-field-hover);
@@ -29305,7 +29328,7 @@ optgroup.cds--select-optgroup:disabled,
29305
29328
 
29306
29329
  .cds--inline-notification--low-contrast .cds--inline-notification__action-button.cds--btn--ghost:active,
29307
29330
  .cds--inline-notification--low-contrast .cds--inline-notification__action-button.cds--btn--ghost:hover {
29308
- background-color: var(--cds-notification-action-hover, #edf5ff);
29331
+ background-color: var(--cds-notification-action-hover, #ffffff);
29309
29332
  }
29310
29333
 
29311
29334
  .cds--inline-notification__action-button.cds--btn--ghost:focus {
@@ -29984,7 +30007,7 @@ optgroup.cds--select-optgroup:disabled,
29984
30007
 
29985
30008
  .cds--actionable-notification--low-contrast .cds--actionable-notification__action-button.cds--btn--ghost:active,
29986
30009
  .cds--actionable-notification--low-contrast .cds--actionable-notification__action-button.cds--btn--ghost:hover {
29987
- background-color: var(--cds-notification-action-hover, #edf5ff);
30010
+ background-color: var(--cds-notification-action-hover, #ffffff);
29988
30011
  }
29989
30012
 
29990
30013
  .cds--actionable-notification__action-button.cds--btn--ghost:focus {
@@ -30007,7 +30030,9 @@ optgroup.cds--select-optgroup:disabled,
30007
30030
  padding-right: 1rem;
30008
30031
  padding-left: 1rem;
30009
30032
  margin-bottom: 1rem;
30010
- margin-left: calc(2rem + 1.25rem - 0.125rem);
30033
+ margin-left: calc(
30034
+ 2rem + 1.25rem - 0.125rem
30035
+ );
30011
30036
  }
30012
30037
 
30013
30038
  .cds--actionable-notification:not(.cds--actionable-notification--low-contrast) .cds--actionable-notification__action-button.cds--btn--tertiary {
@@ -31471,6 +31496,7 @@ span.cds--pagination__text.cds--pagination__items-count {
31471
31496
  width: 4rem;
31472
31497
  height: 2.5rem;
31473
31498
  -moz-appearance: textfield;
31499
+ appearance: textfield;
31474
31500
  }
31475
31501
  .cds--slider-text-input::-webkit-outer-spin-button, .cds--slider-text-input::-webkit-inner-spin-button,
31476
31502
  .cds-slider-text-input::-webkit-outer-spin-button,
@@ -32569,8 +32595,8 @@ span.cds--pagination__text.cds--pagination__items-count {
32569
32595
  .cds--tile--clickable .cds--tile--icon,
32570
32596
  .cds--tile--clickable.cds--link--disabled .cds--tile--disabled-icon {
32571
32597
  position: absolute;
32572
- right: var(--cds-layout-density-padding-inline-local);
32573
- bottom: var(--cds-layout-density-padding-inline-local);
32598
+ inset-block-end: var(--cds-layout-density-padding-inline-local);
32599
+ inset-inline-end: var(--cds-layout-density-padding-inline-local);
32574
32600
  }
32575
32601
 
32576
32602
  .cds--tile--clickable .cds--tile--icon {
@@ -32592,11 +32618,11 @@ span.cds--pagination__text.cds--pagination__items-count {
32592
32618
 
32593
32619
  .cds--tile__checkmark {
32594
32620
  position: absolute;
32595
- top: var(--cds-layout-density-padding-inline-local);
32596
- right: var(--cds-layout-density-padding-inline-local);
32597
32621
  height: 1rem;
32598
32622
  border: none;
32599
32623
  background: transparent;
32624
+ inset-block-start: var(--cds-layout-density-padding-inline-local);
32625
+ inset-inline-end: var(--cds-layout-density-padding-inline-local);
32600
32626
  opacity: 0;
32601
32627
  transition: 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
32602
32628
  }
@@ -32620,13 +32646,13 @@ span.cds--pagination__text.cds--pagination__items-count {
32620
32646
 
32621
32647
  .cds--tile__chevron {
32622
32648
  position: absolute;
32623
- right: 0;
32624
- bottom: 0;
32625
32649
  display: flex;
32626
32650
  width: calc(var(--cds-layout-density-padding-inline-local) * 2 + 1rem);
32627
32651
  height: calc(var(--cds-layout-density-padding-inline-local) * 2 + 1rem);
32628
32652
  align-items: center;
32629
32653
  justify-content: center;
32654
+ inset-block-end: 0;
32655
+ inset-inline-end: 0;
32630
32656
  }
32631
32657
  .cds--tile__chevron svg {
32632
32658
  fill: var(--cds-icon-primary, #161616);
@@ -32661,13 +32687,13 @@ span.cds--pagination__text.cds--pagination__items-count {
32661
32687
  text-align: start;
32662
32688
  width: 100%;
32663
32689
  position: absolute;
32664
- right: 0;
32665
- bottom: 0;
32666
32690
  display: flex;
32667
32691
  width: calc(var(--cds-layout-density-padding-inline-local) * 2 + 1rem);
32668
32692
  height: calc(var(--cds-layout-density-padding-inline-local) * 2 + 1rem);
32669
32693
  align-items: center;
32670
32694
  justify-content: center;
32695
+ inset-block-end: 0;
32696
+ inset-inline-end: 0;
32671
32697
  }
32672
32698
  .cds--tile__chevron--interactive *,
32673
32699
  .cds--tile__chevron--interactive *::before,
@@ -32695,7 +32721,7 @@ span.cds--pagination__text.cds--pagination__items-count {
32695
32721
  cursor: pointer;
32696
32722
  font-family: inherit;
32697
32723
  font-size: inherit;
32698
- text-align: left;
32724
+ text-align: start;
32699
32725
  transition: max-height 150ms cubic-bezier(0.2, 0, 0.38, 0.9);
32700
32726
  font-size: var(--cds-body-compact-01-font-size, 0.875rem);
32701
32727
  font-weight: var(--cds-body-compact-01-font-weight, 400);
@@ -32836,9 +32862,7 @@ span.cds--pagination__text.cds--pagination__items-count {
32836
32862
 
32837
32863
  .cds--time-picker__select {
32838
32864
  justify-content: center;
32839
- }
32840
- .cds--time-picker__select:not(:last-of-type) {
32841
- margin: 0 0.125rem;
32865
+ margin-left: 0.125rem;
32842
32866
  }
32843
32867
 
32844
32868
  .cds--time-picker__input {