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

Sign up to get free protection for your applications and to get access to all the features.
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
@@ -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;