@carbon/ibm-products 2.8.1 → 2.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (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 {