@carbon/ibm-products 2.35.0 → 2.36.0-alpha.27

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 (88) hide show
  1. package/css/index-full-carbon.css +957 -567
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +1 -1
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +67 -74
  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 +227 -206
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +1 -1
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +443 -247
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +1 -1
  16. package/css/index.min.css.map +1 -1
  17. package/es/components/Coachmark/utils/enums.d.ts +36 -22
  18. package/es/components/CoachmarkBeacon/CoachmarkBeacon.d.ts +26 -2
  19. package/es/components/CoachmarkBeacon/CoachmarkBeacon.js +1 -3
  20. package/es/components/CoachmarkOverlayElement/CoachmarkOverlayElement.d.ts +28 -2
  21. package/es/components/CoachmarkOverlayElement/CoachmarkOverlayElement.js +0 -1
  22. package/es/components/ConditionBuilder/assets/sampleInput.d.ts +5 -5
  23. package/es/components/CreateFullPage/CreateFullPage.d.ts +121 -4
  24. package/es/components/CreateFullPage/CreateFullPage.js +12 -8
  25. package/es/components/CreateTearsheet/CreateTearsheet.js +2 -0
  26. package/es/components/Datagrid/Datagrid/DatagridRow.js +4 -3
  27. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +2 -1
  28. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +10 -6
  29. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +6 -2
  30. package/es/components/EditFullPage/EditFullPage.d.ts +19 -2
  31. package/es/components/EditFullPage/EditFullPage.js +3 -3
  32. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.d.ts +61 -2
  33. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -3
  34. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.d.ts +61 -2
  35. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -2
  36. package/es/components/FullPageError/FullPageError.d.ts +2 -1
  37. package/es/components/FullPageError/FullPageError.js +24 -49
  38. package/es/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.d.ts +40 -2
  39. package/es/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +1 -1
  40. package/es/components/InlineTip/InlineTipLink.d.ts +19 -2
  41. package/es/components/InterstitialScreenView/InterstitialScreenView.d.ts +23 -2
  42. package/es/components/InterstitialScreenView/InterstitialScreenView.js +0 -1
  43. package/es/components/InterstitialScreenViewModule/InterstitialScreenViewModule.d.ts +23 -2
  44. package/es/components/NonLinearReading/NonLinearReading.d.ts +28 -2
  45. package/es/components/NonLinearReading/NonLinearReading.js +2 -7
  46. package/es/components/SearchBar/SearchBar.d.ts +51 -3
  47. package/es/components/SearchBar/SearchBar.js +5 -6
  48. package/es/components/SidePanel/SidePanel.js +10 -5
  49. package/es/components/TruncatedList/TruncatedList.d.ts +47 -2
  50. package/es/components/TruncatedList/TruncatedList.js +5 -4
  51. package/lib/components/Coachmark/utils/enums.d.ts +36 -22
  52. package/lib/components/CoachmarkBeacon/CoachmarkBeacon.d.ts +26 -2
  53. package/lib/components/CoachmarkBeacon/CoachmarkBeacon.js +1 -3
  54. package/lib/components/CoachmarkOverlayElement/CoachmarkOverlayElement.d.ts +28 -2
  55. package/lib/components/CoachmarkOverlayElement/CoachmarkOverlayElement.js +0 -1
  56. package/lib/components/ConditionBuilder/assets/sampleInput.d.ts +5 -5
  57. package/lib/components/CreateFullPage/CreateFullPage.d.ts +121 -4
  58. package/lib/components/CreateFullPage/CreateFullPage.js +12 -8
  59. package/lib/components/CreateTearsheet/CreateTearsheet.js +2 -0
  60. package/lib/components/Datagrid/Datagrid/DatagridRow.js +4 -3
  61. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +2 -1
  62. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +11 -7
  63. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +6 -2
  64. package/lib/components/EditFullPage/EditFullPage.d.ts +19 -2
  65. package/lib/components/EditFullPage/EditFullPage.js +3 -3
  66. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.d.ts +61 -2
  67. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -3
  68. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.d.ts +61 -2
  69. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -2
  70. package/lib/components/FullPageError/FullPageError.d.ts +2 -1
  71. package/lib/components/FullPageError/FullPageError.js +24 -49
  72. package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.d.ts +40 -2
  73. package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +1 -1
  74. package/lib/components/InlineTip/InlineTipLink.d.ts +19 -2
  75. package/lib/components/InterstitialScreenView/InterstitialScreenView.d.ts +23 -2
  76. package/lib/components/InterstitialScreenView/InterstitialScreenView.js +0 -1
  77. package/lib/components/InterstitialScreenViewModule/InterstitialScreenViewModule.d.ts +23 -2
  78. package/lib/components/NonLinearReading/NonLinearReading.d.ts +28 -2
  79. package/lib/components/NonLinearReading/NonLinearReading.js +2 -7
  80. package/lib/components/SearchBar/SearchBar.d.ts +51 -3
  81. package/lib/components/SearchBar/SearchBar.js +5 -6
  82. package/lib/components/SidePanel/SidePanel.js +10 -5
  83. package/lib/components/TruncatedList/TruncatedList.d.ts +47 -2
  84. package/lib/components/TruncatedList/TruncatedList.js +5 -4
  85. package/package.json +4 -4
  86. package/scss/components/Datagrid/styles/_useSortableColumns.scss +2 -0
  87. package/scss/components/FullPageError/_full-page-error.scss +10 -10
  88. package/scss/components/UserAvatar/_user-avatar.scss +6 -3
package/css/index-without-carbon.css CHANGED
@@ -3093,7 +3093,7 @@ p.c4p--about-modal__copyright-text:first-child {
3093
3093
  }
3094
3094
  .c4p--side-panel.c4p--side-panel.c4p--side-panel--has-slug {
3095
3095
  border-color: transparent;
3096
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
3096
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
3097
3097
  }
3098
3098
  .c4p--side-panel .c4p--side-panel__header {
3099
3099
  --c4p--side-panel--title-padding-bottom: 1rem;
@@ -3257,8 +3257,8 @@ p.c4p--about-modal__copyright-text:first-child {
3257
3257
  padding-top: 0.5rem;
3258
3258
  }
3259
3259
  .c4p--side-panel.c4p--side-panel--has-slug .c4p--side-panel--scrolls {
3260
- background: linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) border-box;
3261
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
3260
+ background: linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) border-box;
3261
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
3262
3262
  }
3263
3263
  .c4p--side-panel .c4p--side-panel__action-toolbar {
3264
3264
  position: sticky;
@@ -3496,7 +3496,7 @@ p.c4p--about-modal__copyright-text:first-child {
3496
3496
  border-bottom: 0;
3497
3497
  /* override carbon ai removing background gradient */
3498
3498
  background: linear-gradient(to top, var(--cds-layer), var(--cds-layer)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-layer), var(--cds-layer)) border-box;
3499
- box-shadow: 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
3499
+ box-shadow: 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
3500
3500
  }
3501
3501
  .c4p--tearsheet.c4p--tearsheet.c4p--tearsheet .c4p--tearsheet__container {
3502
3502
  transition: transform 240ms cubic-bezier(0, 0, 0.3, 1), max-height 240ms cubic-bezier(0, 0, 0.3, 1);
@@ -3663,8 +3663,8 @@ p.c4p--about-modal__copyright-text:first-child {
3663
3663
  flex-grow: 1;
3664
3664
  }
3665
3665
  .c4p--tearsheet.c4p--tearsheet--has-slug .c4p--tearsheet__content {
3666
- background: linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)), var(--cds-background, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)), var(--cds-background, var(--cds-background, #ffffff))) border-box;
3667
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
3666
+ background: linear-gradient(to top, var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff)), var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff)), var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff))) border-box;
3667
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
3668
3668
  }
3669
3669
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination,
3670
3670
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination__control-buttons,
@@ -4140,17 +4140,17 @@ p.c4p--about-modal__copyright-text:first-child {
4140
4140
  }
4141
4141
 
4142
4142
  .c4p--card--has-slug {
4143
- background: linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) border-box;
4143
+ background: linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) border-box;
4144
4144
  border: 1px solid transparent;
4145
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
4145
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
4146
4146
  }
4147
4147
 
4148
4148
  .c4p--card__clickable.c4p--card--has-slug::before {
4149
- background: linear-gradient(to top, var(--cds-ai-aura-hover-start, rgba(69, 137, 255, 0.4)) 0%, 15%, var(--cds-ai-aura-hover-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-ai-aura-hover-background, #edf5ff), var(--cds-ai-aura-hover-background, #edf5ff)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-ai-aura-hover-background, #edf5ff), var(--cds-ai-aura-hover-background, #edf5ff)) border-box;
4149
+ background: linear-gradient(to top, var(--cds-ai-aura-hover-start, rgba(69, 137, 255, 0.32)) 0%, 15%, var(--cds-ai-aura-hover-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-ai-aura-hover-background, #edf5ff), var(--cds-ai-aura-hover-background, #edf5ff)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-ai-aura-hover-background, #edf5ff), var(--cds-ai-aura-hover-background, #edf5ff)) border-box;
4150
4150
  position: absolute;
4151
4151
  display: block;
4152
4152
  block-size: 100%;
4153
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
4153
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
4154
4154
  content: "";
4155
4155
  inline-size: 100%;
4156
4156
  inset-block-start: 0;
@@ -4773,21 +4773,22 @@ button.c4p--add-select__global-filter-toggle--open {
4773
4773
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
4774
4774
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
4775
4775
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
4776
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
4777
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
4778
- --cds-ai-border-start: #4589ff;
4776
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
4777
+ --cds-ai-border-end: #4589ff;
4778
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
4779
4779
  --cds-ai-border-strong: #78a9ff;
4780
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
4781
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
4782
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
4783
- --cds-ai-popover-caret-bottom: #3d4655;
4784
- --cds-ai-popover-caret-bottom-background: #213250;
4785
- --cds-ai-popover-caret-bottom-background-actions: #192436;
4786
- --cds-ai-popover-caret-center: #3f68af;
4787
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
4788
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
4789
- --cds-ai-skeleton-background: #a6c8ff;
4790
- --cds-ai-skeleton-element-background: #002d9c;
4780
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
4781
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
4782
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
4783
+ --cds-ai-popover-background: #161616;
4784
+ --cds-ai-popover-caret-bottom: #4589ff;
4785
+ --cds-ai-popover-caret-bottom-background: #202d45;
4786
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
4787
+ --cds-ai-popover-caret-center: #4870b5;
4788
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
4789
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
4790
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
4791
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
4791
4792
  --cds-background: #161616;
4792
4793
  --cds-background-active: rgba(141, 141, 141, 0.4);
4793
4794
  --cds-background-brand: #0f62fe;
@@ -4816,7 +4817,7 @@ button.c4p--add-select__global-filter-toggle--open {
4816
4817
  --cds-chat-avatar-bot: #8d8d8d;
4817
4818
  --cds-chat-avatar-user: #4589ff;
4818
4819
  --cds-chat-bubble-agent: #262626;
4819
- --cds-chat-bubble-agent-border: #525252;
4820
+ --cds-chat-bubble-border: #525252;
4820
4821
  --cds-chat-bubble-user: #393939;
4821
4822
  --cds-chat-button: #78a9ff;
4822
4823
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -4884,11 +4885,6 @@ button.c4p--add-select__global-filter-toggle--open {
4884
4885
  --cds-shadow: rgba(0, 0, 0, 0.8);
4885
4886
  --cds-skeleton-background: #292929;
4886
4887
  --cds-skeleton-element: #393939;
4887
- --cds-slug-background: #c6c6c6;
4888
- --cds-slug-background-hover: #e0e0e0;
4889
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
4890
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
4891
- --cds-slug-hollow-hover: #b5b5b5;
4892
4888
  --cds-support-caution-major: #ff832b;
4893
4889
  --cds-support-caution-minor: #f1c21b;
4894
4890
  --cds-support-caution-undefined: #a56eff;
@@ -8452,21 +8448,22 @@ button.c4p--add-select__global-filter-toggle--open {
8452
8448
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
8453
8449
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
8454
8450
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
8455
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
8456
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
8457
- --cds-ai-border-start: #4589ff;
8451
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
8452
+ --cds-ai-border-end: #4589ff;
8453
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
8458
8454
  --cds-ai-border-strong: #78a9ff;
8459
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
8460
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
8461
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
8462
- --cds-ai-popover-caret-bottom: #465060;
8463
- --cds-ai-popover-caret-bottom-background: #2d3f5c;
8464
- --cds-ai-popover-caret-bottom-background-actions: #253042;
8465
- --cds-ai-popover-caret-center: #456fb5;
8466
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
8467
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
8468
- --cds-ai-skeleton-background: #a6c8ff;
8469
- --cds-ai-skeleton-element-background: #002d9c;
8455
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
8456
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
8457
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
8458
+ --cds-ai-popover-background: #161616;
8459
+ --cds-ai-popover-caret-bottom: #4589ff;
8460
+ --cds-ai-popover-caret-bottom-background: #202d45;
8461
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
8462
+ --cds-ai-popover-caret-center: #4870b5;
8463
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
8464
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
8465
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
8466
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
8470
8467
  --cds-background: #262626;
8471
8468
  --cds-background-active: rgba(141, 141, 141, 0.4);
8472
8469
  --cds-background-brand: #0f62fe;
@@ -8495,7 +8492,7 @@ button.c4p--add-select__global-filter-toggle--open {
8495
8492
  --cds-chat-avatar-bot: #8d8d8d;
8496
8493
  --cds-chat-avatar-user: #4589ff;
8497
8494
  --cds-chat-bubble-agent: #262626;
8498
- --cds-chat-bubble-agent-border: #525252;
8495
+ --cds-chat-bubble-border: #525252;
8499
8496
  --cds-chat-bubble-user: #393939;
8500
8497
  --cds-chat-button: #78a9ff;
8501
8498
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -8563,11 +8560,6 @@ button.c4p--add-select__global-filter-toggle--open {
8563
8560
  --cds-shadow: rgba(0, 0, 0, 0.8);
8564
8561
  --cds-skeleton-background: #333333;
8565
8562
  --cds-skeleton-element: #525252;
8566
- --cds-slug-background: #c6c6c6;
8567
- --cds-slug-background-hover: #e0e0e0;
8568
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
8569
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
8570
- --cds-slug-hollow-hover: #b5b5b5;
8571
8563
  --cds-support-caution-major: #ff832b;
8572
8564
  --cds-support-caution-minor: #f1c21b;
8573
8565
  --cds-support-caution-undefined: #a56eff;
@@ -8886,21 +8878,22 @@ button.c4p--add-select__global-filter-toggle--open {
8886
8878
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
8887
8879
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
8888
8880
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
8889
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
8890
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
8891
- --cds-ai-border-start: #4589ff;
8881
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
8882
+ --cds-ai-border-end: #4589ff;
8883
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
8892
8884
  --cds-ai-border-strong: #78a9ff;
8893
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
8894
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
8895
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
8896
- --cds-ai-popover-caret-bottom: #3d4655;
8897
- --cds-ai-popover-caret-bottom-background: #213250;
8898
- --cds-ai-popover-caret-bottom-background-actions: #192436;
8899
- --cds-ai-popover-caret-center: #3f68af;
8900
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
8901
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
8902
- --cds-ai-skeleton-background: #a6c8ff;
8903
- --cds-ai-skeleton-element-background: #002d9c;
8885
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
8886
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
8887
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
8888
+ --cds-ai-popover-background: #161616;
8889
+ --cds-ai-popover-caret-bottom: #4589ff;
8890
+ --cds-ai-popover-caret-bottom-background: #202d45;
8891
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
8892
+ --cds-ai-popover-caret-center: #4870b5;
8893
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
8894
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
8895
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
8896
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
8904
8897
  --cds-background: #161616;
8905
8898
  --cds-background-active: rgba(141, 141, 141, 0.4);
8906
8899
  --cds-background-brand: #0f62fe;
@@ -8929,7 +8922,7 @@ button.c4p--add-select__global-filter-toggle--open {
8929
8922
  --cds-chat-avatar-bot: #8d8d8d;
8930
8923
  --cds-chat-avatar-user: #4589ff;
8931
8924
  --cds-chat-bubble-agent: #262626;
8932
- --cds-chat-bubble-agent-border: #525252;
8925
+ --cds-chat-bubble-border: #525252;
8933
8926
  --cds-chat-bubble-user: #393939;
8934
8927
  --cds-chat-button: #78a9ff;
8935
8928
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -8997,11 +8990,6 @@ button.c4p--add-select__global-filter-toggle--open {
8997
8990
  --cds-shadow: rgba(0, 0, 0, 0.8);
8998
8991
  --cds-skeleton-background: #292929;
8999
8992
  --cds-skeleton-element: #393939;
9000
- --cds-slug-background: #c6c6c6;
9001
- --cds-slug-background-hover: #e0e0e0;
9002
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
9003
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
9004
- --cds-slug-hollow-hover: #b5b5b5;
9005
8993
  --cds-support-caution-major: #ff832b;
9006
8994
  --cds-support-caution-minor: #f1c21b;
9007
8995
  --cds-support-caution-undefined: #a56eff;
@@ -10265,12 +10253,12 @@ button.c4p--add-select__global-filter-toggle--open {
10265
10253
 
10266
10254
  .c4p--datagrid th.c4p--datagrid__with-slug,
10267
10255
  .c4p--datagrid td.c4p--datagrid__slug--cell {
10268
- background: linear-gradient(to right, var(--cds-ai-aura-start-table, rgba(69, 137, 255, 0.15)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
10256
+ background: linear-gradient(to right, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
10269
10257
  }
10270
10258
 
10271
10259
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row,
10272
10260
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row + .c4p--datagrid__expanded-row {
10273
- background: linear-gradient(to right, var(--cds-ai-aura-start-table, rgba(69, 137, 255, 0.15)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
10261
+ background: linear-gradient(to right, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
10274
10262
  background-attachment: fixed;
10275
10263
  }
10276
10264
 
@@ -10283,7 +10271,7 @@ button.c4p--add-select__global-filter-toggle--open {
10283
10271
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row.cds--data-table--selected:hover,
10284
10272
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row.c4p--datagrid__carbon-row-expanded:hover + .c4p--datagrid__expanded-row,
10285
10273
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__expandable-row--hover.c4p--datagrid__slug--row {
10286
- background: linear-gradient(to right, var(--cds-ai-aura-hover-start, rgba(69, 137, 255, 0.4)) 0%, 15%, var(--cds-ai-aura-hover-end, rgba(255, 255, 255, 0)) 50%), var(--cds-ai-aura-hover-background, #edf5ff);
10274
+ background: linear-gradient(to right, var(--cds-ai-aura-hover-start, rgba(69, 137, 255, 0.32)) 0%, 15%, var(--cds-ai-aura-hover-end, rgba(255, 255, 255, 0)) 50%), var(--cds-ai-aura-hover-background, #edf5ff);
10287
10275
  }
10288
10276
 
10289
10277
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__expandable-row--hover.c4p--datagrid__slug--row td {
@@ -10291,7 +10279,7 @@ button.c4p--add-select__global-filter-toggle--open {
10291
10279
  }
10292
10280
 
10293
10281
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row.cds--data-table--selected {
10294
- background: linear-gradient(to right, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%), var(--cds-layer-selected);
10282
+ background: linear-gradient(to right, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%), var(--cds-layer-selected);
10295
10283
  }
10296
10284
 
10297
10285
  .c4p--datagrid th.c4p--datagrid__with-slug .cds--slug {
@@ -11004,6 +10992,11 @@ button.c4p--add-select__global-filter-toggle--open {
11004
10992
  margin: 0 calc(-1 * 1rem);
11005
10993
  }
11006
10994
 
10995
+ .c4p--datagrid__sortableColumn:hover,
10996
+ .c4p--datagrid__sortableColumn:focus-within,
10997
+ .c4p--datagrid__sortableColumn.c4p--datagrid__isSorted {
10998
+ background-color: var(--cds-layer-selected-hover-01, #d1d1d1);
10999
+ }
11007
11000
  .c4p--datagrid__sortableColumn:hover .cds--table-header-label .c4p--datagrid__sortable-icon,
11008
11001
  .c4p--datagrid__sortableColumn:focus-within .cds--table-header-label .c4p--datagrid__sortable-icon,
11009
11002
  .c4p--datagrid__sortableColumn.c4p--datagrid__isSorted .cds--table-header-label .c4p--datagrid__sortable-icon {
@@ -13722,8 +13715,8 @@ th.c4p--datagrid__select-all-toggle-on.button {
13722
13715
  inset-block-start: 0;
13723
13716
  inset-inline-start: 0;
13724
13717
  max-inline-size: 16rem;
13725
- transition: width 0.11s cubic-bezier(0.2, 0, 1, 0.9);
13726
- will-change: width;
13718
+ transition: inline-size 0.11s cubic-bezier(0.2, 0, 1, 0.9), transform 0.11s cubic-bezier(0.2, 0, 1, 0.9);
13719
+ will-change: inline-size;
13727
13720
  }
13728
13721
 
13729
13722
  .cds--side-nav--ux {
@@ -14516,7 +14509,7 @@ a.cds--side-nav__link--current::before {
14516
14509
  border-bottom: 0;
14517
14510
  /* override carbon ai removing background gradient */
14518
14511
  background: linear-gradient(to top, var(--cds-layer), var(--cds-layer)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-layer), var(--cds-layer)) border-box;
14519
- box-shadow: 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
14512
+ box-shadow: 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
14520
14513
  }
14521
14514
 
14522
14515
  .c4p--tearsheet.c4p--tearsheet.c4p--tearsheet .c4p--tearsheet__container {
@@ -14720,8 +14713,8 @@ a.cds--side-nav__link--current::before {
14720
14713
  }
14721
14714
 
14722
14715
  .c4p--tearsheet.c4p--tearsheet--has-slug .c4p--tearsheet__content {
14723
- background: linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)), var(--cds-background, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)), var(--cds-background, var(--cds-background, #ffffff))) border-box;
14724
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
14716
+ background: linear-gradient(to top, var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff)), var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff)), var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff))) border-box;
14717
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
14725
14718
  }
14726
14719
 
14727
14720
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination,
@@ -15287,21 +15280,22 @@ a.cds--side-nav__link--current::before {
15287
15280
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
15288
15281
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
15289
15282
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
15290
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
15291
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
15292
- --cds-ai-border-start: #4589ff;
15283
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
15284
+ --cds-ai-border-end: #4589ff;
15285
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
15293
15286
  --cds-ai-border-strong: #78a9ff;
15294
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
15295
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
15296
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
15297
- --cds-ai-popover-caret-bottom: #3d4655;
15298
- --cds-ai-popover-caret-bottom-background: #213250;
15299
- --cds-ai-popover-caret-bottom-background-actions: #192436;
15300
- --cds-ai-popover-caret-center: #3f68af;
15301
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
15302
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
15303
- --cds-ai-skeleton-background: #a6c8ff;
15304
- --cds-ai-skeleton-element-background: #002d9c;
15287
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
15288
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
15289
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
15290
+ --cds-ai-popover-background: #161616;
15291
+ --cds-ai-popover-caret-bottom: #4589ff;
15292
+ --cds-ai-popover-caret-bottom-background: #202d45;
15293
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
15294
+ --cds-ai-popover-caret-center: #4870b5;
15295
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
15296
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
15297
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
15298
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
15305
15299
  --cds-background: #161616;
15306
15300
  --cds-background-active: rgba(141, 141, 141, 0.4);
15307
15301
  --cds-background-brand: #0f62fe;
@@ -15330,7 +15324,7 @@ a.cds--side-nav__link--current::before {
15330
15324
  --cds-chat-avatar-bot: #8d8d8d;
15331
15325
  --cds-chat-avatar-user: #4589ff;
15332
15326
  --cds-chat-bubble-agent: #262626;
15333
- --cds-chat-bubble-agent-border: #525252;
15327
+ --cds-chat-bubble-border: #525252;
15334
15328
  --cds-chat-bubble-user: #393939;
15335
15329
  --cds-chat-button: #78a9ff;
15336
15330
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -15398,11 +15392,6 @@ a.cds--side-nav__link--current::before {
15398
15392
  --cds-shadow: rgba(0, 0, 0, 0.8);
15399
15393
  --cds-skeleton-background: #292929;
15400
15394
  --cds-skeleton-element: #393939;
15401
- --cds-slug-background: #c6c6c6;
15402
- --cds-slug-background-hover: #e0e0e0;
15403
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
15404
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
15405
- --cds-slug-hollow-hover: #b5b5b5;
15406
15395
  --cds-support-caution-major: #ff832b;
15407
15396
  --cds-support-caution-minor: #f1c21b;
15408
15397
  --cds-support-caution-undefined: #a56eff;
@@ -16095,21 +16084,22 @@ a.cds--side-nav__link--current::before {
16095
16084
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
16096
16085
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
16097
16086
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
16098
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
16099
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
16100
- --cds-ai-border-start: #4589ff;
16087
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
16088
+ --cds-ai-border-end: #4589ff;
16089
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
16101
16090
  --cds-ai-border-strong: #78a9ff;
16102
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
16103
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
16104
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
16105
- --cds-ai-popover-caret-bottom: #3d4655;
16106
- --cds-ai-popover-caret-bottom-background: #213250;
16107
- --cds-ai-popover-caret-bottom-background-actions: #192436;
16108
- --cds-ai-popover-caret-center: #3f68af;
16109
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
16110
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
16111
- --cds-ai-skeleton-background: #a6c8ff;
16112
- --cds-ai-skeleton-element-background: #002d9c;
16091
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
16092
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
16093
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
16094
+ --cds-ai-popover-background: #161616;
16095
+ --cds-ai-popover-caret-bottom: #4589ff;
16096
+ --cds-ai-popover-caret-bottom-background: #202d45;
16097
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
16098
+ --cds-ai-popover-caret-center: #4870b5;
16099
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
16100
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
16101
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
16102
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
16113
16103
  --cds-background: #161616;
16114
16104
  --cds-background-active: rgba(141, 141, 141, 0.4);
16115
16105
  --cds-background-brand: #0f62fe;
@@ -16138,7 +16128,7 @@ a.cds--side-nav__link--current::before {
16138
16128
  --cds-chat-avatar-bot: #8d8d8d;
16139
16129
  --cds-chat-avatar-user: #4589ff;
16140
16130
  --cds-chat-bubble-agent: #262626;
16141
- --cds-chat-bubble-agent-border: #525252;
16131
+ --cds-chat-bubble-border: #525252;
16142
16132
  --cds-chat-bubble-user: #393939;
16143
16133
  --cds-chat-button: #78a9ff;
16144
16134
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -16206,11 +16196,6 @@ a.cds--side-nav__link--current::before {
16206
16196
  --cds-shadow: rgba(0, 0, 0, 0.8);
16207
16197
  --cds-skeleton-background: #292929;
16208
16198
  --cds-skeleton-element: #393939;
16209
- --cds-slug-background: #c6c6c6;
16210
- --cds-slug-background-hover: #e0e0e0;
16211
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
16212
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
16213
- --cds-slug-hollow-hover: #b5b5b5;
16214
16199
  --cds-support-caution-major: #ff832b;
16215
16200
  --cds-support-caution-minor: #f1c21b;
16216
16201
  --cds-support-caution-undefined: #a56eff;
@@ -17011,21 +16996,22 @@ a.cds--side-nav__link--current::before {
17011
16996
  --cds-ai-aura-end: rgba(255, 255, 255, 0);
17012
16997
  --cds-ai-aura-hover-background: #edf5ff;
17013
16998
  --cds-ai-aura-hover-end: rgba(255, 255, 255, 0);
17014
- --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
16999
+ --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.32);
17015
17000
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
17016
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
17017
- --cds-ai-border-end: #d0e2ff;
17018
- --cds-ai-border-start: #78a9ff;
17001
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
17002
+ --cds-ai-border-end: #78a9ff;
17003
+ --cds-ai-border-start: rgba(166, 200, 255, 0.64);
17019
17004
  --cds-ai-border-strong: #4589ff;
17020
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
17021
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
17005
+ --cds-ai-drop-shadow: rgba(15, 98, 254, 0.1);
17006
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.1);
17022
17007
  --cds-ai-overlay: rgba(0, 17, 65, 0.5);
17023
- --cds-ai-popover-caret-bottom: #d0e2ff;
17024
- --cds-ai-popover-caret-bottom-background: #ccdbf8;
17025
- --cds-ai-popover-caret-bottom-background-actions: #d2dcee;
17026
- --cds-ai-popover-caret-center: #a7c7ff;
17027
- --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.25);
17028
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.1);
17008
+ --cds-ai-popover-background: #ffffff;
17009
+ --cds-ai-popover-caret-bottom: #78a9ff;
17010
+ --cds-ai-popover-caret-bottom-background: #eaf1ff;
17011
+ --cds-ai-popover-caret-bottom-background-actions: #e9effa;
17012
+ --cds-ai-popover-caret-center: #a0c3ff;
17013
+ --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.06);
17014
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.04);
17029
17015
  --cds-ai-skeleton-background: #d0e2ff;
17030
17016
  --cds-ai-skeleton-element-background: #4589ff;
17031
17017
  --cds-background: #f4f4f4;
@@ -17056,7 +17042,7 @@ a.cds--side-nav__link--current::before {
17056
17042
  --cds-chat-avatar-bot: #6f6f6f;
17057
17043
  --cds-chat-avatar-user: #0f62fe;
17058
17044
  --cds-chat-bubble-agent: #ffffff;
17059
- --cds-chat-bubble-agent-border: #e0e0e0;
17045
+ --cds-chat-bubble-border: #e0e0e0;
17060
17046
  --cds-chat-bubble-user: #e0e0e0;
17061
17047
  --cds-chat-button: #0f62fe;
17062
17048
  --cds-chat-button-active: rgba(141, 141, 141, 0.5);
@@ -17124,11 +17110,6 @@ a.cds--side-nav__link--current::before {
17124
17110
  --cds-shadow: rgba(0, 0, 0, 0.3);
17125
17111
  --cds-skeleton-background: #e8e8e8;
17126
17112
  --cds-skeleton-element: #c6c6c6;
17127
- --cds-slug-background: #525252;
17128
- --cds-slug-background-hover: #6f6f6f;
17129
- --cds-slug-gradient: #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%);
17130
- --cds-slug-gradient-hover: #161616 linear-gradient(135deg, #d1d1d1 0%, rgba(255, 255, 255, 0) 100%);
17131
- --cds-slug-hollow-hover: #474747;
17132
17113
  --cds-support-caution-major: #ff832b;
17133
17114
  --cds-support-caution-minor: #f1c21b;
17134
17115
  --cds-support-caution-undefined: #8a3ffc;
@@ -17427,21 +17408,22 @@ a.cds--side-nav__link--current::before {
17427
17408
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
17428
17409
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
17429
17410
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
17430
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
17431
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
17432
- --cds-ai-border-start: #4589ff;
17411
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
17412
+ --cds-ai-border-end: #4589ff;
17413
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
17433
17414
  --cds-ai-border-strong: #78a9ff;
17434
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
17435
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
17436
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
17437
- --cds-ai-popover-caret-bottom: #3d4655;
17438
- --cds-ai-popover-caret-bottom-background: #213250;
17439
- --cds-ai-popover-caret-bottom-background-actions: #192436;
17440
- --cds-ai-popover-caret-center: #3f68af;
17441
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
17442
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
17443
- --cds-ai-skeleton-background: #a6c8ff;
17444
- --cds-ai-skeleton-element-background: #002d9c;
17415
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
17416
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
17417
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
17418
+ --cds-ai-popover-background: #161616;
17419
+ --cds-ai-popover-caret-bottom: #4589ff;
17420
+ --cds-ai-popover-caret-bottom-background: #202d45;
17421
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
17422
+ --cds-ai-popover-caret-center: #4870b5;
17423
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
17424
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
17425
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
17426
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
17445
17427
  --cds-background: #161616;
17446
17428
  --cds-background-active: rgba(141, 141, 141, 0.4);
17447
17429
  --cds-background-brand: #0f62fe;
@@ -17470,7 +17452,7 @@ a.cds--side-nav__link--current::before {
17470
17452
  --cds-chat-avatar-bot: #8d8d8d;
17471
17453
  --cds-chat-avatar-user: #4589ff;
17472
17454
  --cds-chat-bubble-agent: #262626;
17473
- --cds-chat-bubble-agent-border: #525252;
17455
+ --cds-chat-bubble-border: #525252;
17474
17456
  --cds-chat-bubble-user: #393939;
17475
17457
  --cds-chat-button: #78a9ff;
17476
17458
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -17538,11 +17520,6 @@ a.cds--side-nav__link--current::before {
17538
17520
  --cds-shadow: rgba(0, 0, 0, 0.8);
17539
17521
  --cds-skeleton-background: #292929;
17540
17522
  --cds-skeleton-element: #393939;
17541
- --cds-slug-background: #c6c6c6;
17542
- --cds-slug-background-hover: #e0e0e0;
17543
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
17544
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
17545
- --cds-slug-hollow-hover: #b5b5b5;
17546
17523
  --cds-support-caution-major: #ff832b;
17547
17524
  --cds-support-caution-minor: #f1c21b;
17548
17525
  --cds-support-caution-undefined: #a56eff;
@@ -18317,44 +18294,44 @@ a.cds--side-nav__link--current::before {
18317
18294
  height: inherit;
18318
18295
  }
18319
18296
 
18320
- .c4p--full-page-error__error-container {
18297
+ .c4p--full-page-error__container {
18321
18298
  height: 100%;
18322
18299
  margin: 0 1.5rem;
18323
18300
  }
18324
18301
  @media (max-width: 41.98rem) {
18325
- .c4p--full-page-error__error-container {
18302
+ .c4p--full-page-error__container {
18326
18303
  margin: 0 0.5rem;
18327
18304
  }
18328
18305
  }
18329
18306
 
18330
- .c4p--full-page-error__error-grid {
18307
+ .c4p--full-page-error__grid {
18331
18308
  height: 100%;
18332
18309
  padding-top: 2rem;
18333
18310
  padding-bottom: 2rem;
18334
18311
  }
18335
18312
 
18336
- .c4p--full-page-error__error-column {
18313
+ .c4p--full-page-error__column {
18337
18314
  padding: 0;
18338
18315
  }
18339
18316
  @media (min-width: 66rem) {
18340
- .c4p--full-page-error__error-column {
18317
+ .c4p--full-page-error__column {
18341
18318
  padding: 0 2rem 0 0;
18342
18319
  }
18343
18320
  }
18344
18321
 
18345
- .c4p--full-page-error__error-svg-container {
18322
+ .c4p--full-page-error__svg-container {
18346
18323
  display: flex;
18347
18324
  height: 100%;
18348
18325
  padding: 0.5rem 0.5rem 5rem 0.5rem;
18349
18326
  }
18350
18327
  @media (min-width: 42rem) {
18351
- .c4p--full-page-error__error-svg-container {
18328
+ .c4p--full-page-error__svg-container {
18352
18329
  padding: auto 0.5rem 5rem 0.5rem;
18353
18330
  }
18354
18331
  }
18355
18332
 
18356
- .c4p--full-page-error__error-label,
18357
- .c4p--full-page-error__error-title {
18333
+ .c4p--full-page-error__label,
18334
+ .c4p--full-page-error__title {
18358
18335
  font-size: 2rem;
18359
18336
  font-weight: 400;
18360
18337
  line-height: 1.25;
@@ -18362,8 +18339,8 @@ a.cds--side-nav__link--current::before {
18362
18339
  font-size: calc(2rem + 0.25 * (100vw - 20rem) / 22);
18363
18340
  }
18364
18341
  @media (min-width: 42rem) {
18365
- .c4p--full-page-error__error-label,
18366
- .c4p--full-page-error__error-title {
18342
+ .c4p--full-page-error__label,
18343
+ .c4p--full-page-error__title {
18367
18344
  font-size: 2.25rem;
18368
18345
  font-weight: 300;
18369
18346
  line-height: 1.22;
@@ -18371,35 +18348,35 @@ a.cds--side-nav__link--current::before {
18371
18348
  }
18372
18349
  }
18373
18350
  @media (min-width: 66rem) {
18374
- .c4p--full-page-error__error-label,
18375
- .c4p--full-page-error__error-title {
18351
+ .c4p--full-page-error__label,
18352
+ .c4p--full-page-error__title {
18376
18353
  font-size: 2.625rem;
18377
18354
  line-height: 1.19;
18378
18355
  font-size: calc(2.625rem + 0.375 * (100vw - 66rem) / 16);
18379
18356
  }
18380
18357
  }
18381
18358
  @media (min-width: 82rem) {
18382
- .c4p--full-page-error__error-label,
18383
- .c4p--full-page-error__error-title {
18359
+ .c4p--full-page-error__label,
18360
+ .c4p--full-page-error__title {
18384
18361
  font-size: 3rem;
18385
18362
  line-height: 1.17;
18386
18363
  font-size: calc(3rem + 0.75 * (100vw - 82rem) / 17);
18387
18364
  }
18388
18365
  }
18389
18366
  @media (min-width: 99rem) {
18390
- .c4p--full-page-error__error-label,
18391
- .c4p--full-page-error__error-title {
18367
+ .c4p--full-page-error__label,
18368
+ .c4p--full-page-error__title {
18392
18369
  font-size: 3.75rem;
18393
18370
  font-size: 3.75rem;
18394
18371
  }
18395
18372
  }
18396
18373
 
18397
- .c4p--full-page-error__error-label {
18374
+ .c4p--full-page-error__label {
18398
18375
  display: block;
18399
18376
  color: var(--cds-text-error, #da1e28);
18400
18377
  }
18401
18378
 
18402
- .c4p--full-page-error__error-title {
18379
+ .c4p--full-page-error__title {
18403
18380
  margin-bottom: 3rem;
18404
18381
  }
18405
18382
 
@@ -18411,11 +18388,11 @@ a.cds--side-nav__link--current::before {
18411
18388
  margin-bottom: 2rem;
18412
18389
  }
18413
18390
 
18414
- .c4p--full-page-error__error-svg-container svg.c4p--full-page-error__error-svg {
18391
+ .c4p--full-page-error__svg-container svg.c4p--full-page-error__svg {
18415
18392
  width: 100%;
18416
18393
  }
18417
18394
 
18418
- .c4p--full-page-error__error-svg-container svg.c4p--full-page-error__error-svg path {
18395
+ .c4p--full-page-error__svg-container svg.c4p--full-page-error__svg path {
18419
18396
  fill: var(--cds-background, #ffffff);
18420
18397
  stroke: var(--cds-border-inverse, #161616);
18421
18398
  }
@@ -18733,133 +18710,181 @@ a.cds--side-nav__link--current::before {
18733
18710
 
18734
18711
  :root .c4p--user-avatar--order-1-cyan,
18735
18712
  .cds--g10 .c4p--user-avatar--order-1-cyan,
18736
- .cds--white .c4p--user-avatar--order-1-cyan {
18713
+ .cds--white .c4p--user-avatar--order-1-cyan,
18714
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-1-cyan,
18715
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-1-cyan {
18737
18716
  background-color: #0072c3;
18738
18717
  }
18739
18718
 
18740
18719
  :root .c4p--user-avatar--order-2-gray,
18741
18720
  .cds--g10 .c4p--user-avatar--order-2-gray,
18742
- .cds--white .c4p--user-avatar--order-2-gray {
18721
+ .cds--white .c4p--user-avatar--order-2-gray,
18722
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-2-gray,
18723
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-2-gray {
18743
18724
  background-color: #6f6f6f;
18744
18725
  }
18745
18726
 
18746
18727
  :root .c4p--user-avatar--order-3-green,
18747
18728
  .cds--g10 .c4p--user-avatar--order-3-green,
18748
- .cds--white .c4p--user-avatar--order-3-green {
18729
+ .cds--white .c4p--user-avatar--order-3-green,
18730
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-3-green,
18731
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-3-green {
18749
18732
  background-color: #198038;
18750
18733
  }
18751
18734
 
18752
18735
  :root .c4p--user-avatar--order-4-magenta,
18753
18736
  .cds--g10 .c4p--user-avatar--order-4-magenta,
18754
- .cds--white .c4p--user-avatar--order-4-magenta {
18737
+ .cds--white .c4p--user-avatar--order-4-magenta,
18738
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-4-magenta,
18739
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-4-magenta {
18755
18740
  background-color: #d02670;
18756
18741
  }
18757
18742
 
18758
18743
  :root .c4p--user-avatar--order-5-purple,
18759
18744
  .cds--g10 .c4p--user-avatar--order-5-purple,
18760
- .cds--white .c4p--user-avatar--order-5-purple {
18745
+ .cds--white .c4p--user-avatar--order-5-purple,
18746
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-5-purple,
18747
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-5-purple {
18761
18748
  background-color: #8a3ffc;
18762
18749
  }
18763
18750
 
18764
18751
  :root .c4p--user-avatar--order-6-teal,
18765
18752
  .cds--g10 .c4p--user-avatar--order-6-teal,
18766
- .cds--white .c4p--user-avatar--order-6-teal {
18753
+ .cds--white .c4p--user-avatar--order-6-teal,
18754
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-6-teal,
18755
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-6-teal {
18767
18756
  background-color: #007d79;
18768
18757
  }
18769
18758
 
18770
18759
  :root .c4p--user-avatar--order-7-cyan,
18771
18760
  .cds--g10 .c4p--user-avatar--order-7-cyan,
18772
- .cds--white .c4p--user-avatar--order-7-cyan {
18761
+ .cds--white .c4p--user-avatar--order-7-cyan,
18762
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-7-cyan,
18763
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-7-cyan {
18773
18764
  background-color: #003a6d;
18774
18765
  }
18775
18766
 
18776
18767
  :root .c4p--user-avatar--order-8-gray,
18777
18768
  .cds--g10 .c4p--user-avatar--order-8-gray,
18778
- .cds--white .c4p--user-avatar--order-8-gray {
18769
+ .cds--white .c4p--user-avatar--order-8-gray,
18770
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-8-gray,
18771
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-8-gray {
18779
18772
  background-color: #393939;
18780
18773
  }
18781
18774
 
18782
18775
  :root .c4p--user-avatar--order-9-green,
18783
18776
  .cds--g10 .c4p--user-avatar--order-9-green,
18784
- .cds--white .c4p--user-avatar--order-9-green {
18777
+ .cds--white .c4p--user-avatar--order-9-green,
18778
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-9-green,
18779
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-9-green {
18785
18780
  background-color: #044317;
18786
18781
  }
18787
18782
 
18788
18783
  :root .c4p--user-avatar--order-10-magenta,
18789
18784
  .cds--g10 .c4p--user-avatar--order-10-magenta,
18790
- .cds--white .c4p--user-avatar--order-10-magenta {
18785
+ .cds--white .c4p--user-avatar--order-10-magenta,
18786
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-10-magenta,
18787
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-10-magenta {
18791
18788
  background-color: #740937;
18792
18789
  }
18793
18790
 
18794
18791
  :root .c4p--user-avatar--order-11-purple,
18795
18792
  .cds--g10 .c4p--user-avatar--order-11-purple,
18796
- .cds--white .c4p--user-avatar--order-11-purple {
18793
+ .cds--white .c4p--user-avatar--order-11-purple,
18794
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-11-purple,
18795
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-11-purple {
18797
18796
  background-color: #491d8b;
18798
18797
  }
18799
18798
 
18800
18799
  :root .c4p--user-avatar--order-12-teal,
18801
18800
  .cds--g10 .c4p--user-avatar--order-12-teal,
18802
- .cds--white .c4p--user-avatar--order-12-teal {
18801
+ .cds--white .c4p--user-avatar--order-12-teal,
18802
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-12-teal,
18803
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-12-teal {
18803
18804
  background-color: #004144;
18804
18805
  }
18805
18806
 
18806
18807
  .cds--g90 .c4p--user-avatar--order-1-cyan,
18807
- .cds--g100 .c4p--user-avatar--order-1-cyan {
18808
+ .cds--g100 .c4p--user-avatar--order-1-cyan,
18809
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-1-cyan,
18810
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-1-cyan {
18808
18811
  background-color: #1192e8;
18809
18812
  }
18810
18813
 
18811
18814
  .cds--g90 .c4p--user-avatar--order-2-gray,
18812
- .cds--g100 .c4p--user-avatar--order-2-gray {
18815
+ .cds--g100 .c4p--user-avatar--order-2-gray,
18816
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-2-gray,
18817
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-2-gray {
18813
18818
  background-color: #8d8d8d;
18814
18819
  }
18815
18820
 
18816
18821
  .cds--g90 .c4p--user-avatar--order-3-green,
18817
- .cds--g100 .c4p--user-avatar--order-3-green {
18822
+ .cds--g100 .c4p--user-avatar--order-3-green,
18823
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-3-green,
18824
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-3-green {
18818
18825
  background-color: #24a148;
18819
18826
  }
18820
18827
 
18821
18828
  .cds--g90 .c4p--user-avatar--order-4-magenta,
18822
- .cds--g100 .c4p--user-avatar--order-4-magenta {
18829
+ .cds--g100 .c4p--user-avatar--order-4-magenta,
18830
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-4-magenta,
18831
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-4-magenta {
18823
18832
  background-color: #ee5396;
18824
18833
  }
18825
18834
 
18826
18835
  .cds--g90 .c4p--user-avatar--order-5-purple,
18827
- .cds--g100 .c4p--user-avatar--order-5-purple {
18836
+ .cds--g100 .c4p--user-avatar--order-5-purple,
18837
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-5-purple,
18838
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-5-purple {
18828
18839
  background-color: #a56eff;
18829
18840
  }
18830
18841
 
18831
18842
  .cds--g90 .c4p--user-avatar--order-6-teal,
18832
- .cds--g100 .c4p--user-avatar--order-6-teal {
18843
+ .cds--g100 .c4p--user-avatar--order-6-teal,
18844
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-6-teal,
18845
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-6-teal {
18833
18846
  background-color: #009d9a;
18834
18847
  }
18835
18848
 
18836
18849
  .cds--g90 .c4p--user-avatar--order-7-cyan,
18837
- .cds--g100 .c4p--user-avatar--order-7-cyan {
18850
+ .cds--g100 .c4p--user-avatar--order-7-cyan,
18851
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-7-cyan,
18852
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-7-cyan {
18838
18853
  background-color: #82cfff;
18839
18854
  }
18840
18855
 
18841
18856
  .cds--g90 .c4p--user-avatar--order-8-gray,
18842
- .cds--g100 .c4p--user-avatar--order-8-gray {
18857
+ .cds--g100 .c4p--user-avatar--order-8-gray,
18858
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-8-gray,
18859
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-8-gray {
18843
18860
  background-color: #c6c6c6;
18844
18861
  }
18845
18862
 
18846
18863
  .cds--g90 .c4p--user-avatar--order-9-green,
18847
- .cds--g100 .c4p--user-avatar--order-9-green {
18864
+ .cds--g100 .c4p--user-avatar--order-9-green,
18865
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-9-green,
18866
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-9-green {
18848
18867
  background-color: #6fdc8c;
18849
18868
  }
18850
18869
 
18851
18870
  .cds--g90 .c4p--user-avatar--order-10-magenta,
18852
- .cds--g100 .c4p--user-avatar--order-10-magenta {
18871
+ .cds--g100 .c4p--user-avatar--order-10-magenta,
18872
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-10-magenta,
18873
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-10-magenta {
18853
18874
  background-color: #ffafd2;
18854
18875
  }
18855
18876
 
18856
18877
  .cds--g90 .c4p--user-avatar--order-11-purple,
18857
- .cds--g100 .c4p--user-avatar--order-11-purple {
18878
+ .cds--g100 .c4p--user-avatar--order-11-purple,
18879
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-11-purple,
18880
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-11-purple {
18858
18881
  background-color: #d4bbff;
18859
18882
  }
18860
18883
 
18861
18884
  .cds--g90 .c4p--user-avatar--order-12-teal,
18862
- .cds--g100 .c4p--user-avatar--order-12-teal {
18885
+ .cds--g100 .c4p--user-avatar--order-12-teal,
18886
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-12-teal,
18887
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-12-teal {
18863
18888
  background-color: #3ddbd9;
18864
18889
  }
18865
18890
 
@@ -18905,7 +18930,6 @@ a.cds--side-nav__link--current::before {
18905
18930
  }
18906
18931
 
18907
18932
  .c4p--user-avatar__photo--xl {
18908
- position: fixed;
18909
18933
  border-radius: 100%;
18910
18934
  object-fit: fill;
18911
18935
  width: 4rem;
@@ -18913,7 +18937,6 @@ a.cds--side-nav__link--current::before {
18913
18937
  }
18914
18938
 
18915
18939
  .c4p--user-avatar__photo--lg {
18916
- position: fixed;
18917
18940
  border-radius: 100%;
18918
18941
  object-fit: fill;
18919
18942
  width: 3rem;
@@ -18921,7 +18944,6 @@ a.cds--side-nav__link--current::before {
18921
18944
  }
18922
18945
 
18923
18946
  .c4p--user-avatar__photo--md {
18924
- position: fixed;
18925
18947
  border-radius: 100%;
18926
18948
  object-fit: fill;
18927
18949
  width: 2rem;
@@ -18929,7 +18951,6 @@ a.cds--side-nav__link--current::before {
18929
18951
  }
18930
18952
 
18931
18953
  .c4p--user-avatar__photo--sm {
18932
- position: fixed;
18933
18954
  border-radius: 100%;
18934
18955
  object-fit: fill;
18935
18956
  width: 1.5rem;