@carbon/ibm-products 2.35.0 → 2.36.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (101) 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/Carousel/Carousel.d.ts +46 -2
  18. package/es/components/Carousel/Carousel.js +36 -21
  19. package/es/components/Carousel/CarouselItem.d.ts +19 -2
  20. package/es/components/Carousel/CarouselItem.js +0 -1
  21. package/es/components/Coachmark/utils/enums.d.ts +36 -22
  22. package/es/components/CoachmarkBeacon/CoachmarkBeacon.d.ts +26 -2
  23. package/es/components/CoachmarkBeacon/CoachmarkBeacon.js +1 -3
  24. package/es/components/CoachmarkOverlayElement/CoachmarkOverlayElement.d.ts +28 -2
  25. package/es/components/CoachmarkOverlayElement/CoachmarkOverlayElement.js +0 -1
  26. package/es/components/ConditionBuilder/assets/sampleInput.d.ts +5 -5
  27. package/es/components/CreateFullPage/CreateFullPage.d.ts +121 -4
  28. package/es/components/CreateFullPage/CreateFullPage.js +12 -8
  29. package/es/components/CreateTearsheet/CreateTearsheet.js +2 -0
  30. package/es/components/Datagrid/Datagrid/DatagridRow.js +4 -3
  31. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +2 -1
  32. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +10 -6
  33. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +6 -2
  34. package/es/components/EditFullPage/EditFullPage.d.ts +19 -2
  35. package/es/components/EditFullPage/EditFullPage.js +3 -3
  36. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.d.ts +61 -2
  37. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -3
  38. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.d.ts +61 -2
  39. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -2
  40. package/es/components/FullPageError/FullPageError.d.ts +2 -1
  41. package/es/components/FullPageError/FullPageError.js +24 -49
  42. package/es/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.d.ts +40 -2
  43. package/es/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +1 -1
  44. package/es/components/InlineTip/InlineTipLink.d.ts +19 -2
  45. package/es/components/InterstitialScreenView/InterstitialScreenView.d.ts +23 -2
  46. package/es/components/InterstitialScreenView/InterstitialScreenView.js +0 -1
  47. package/es/components/InterstitialScreenViewModule/InterstitialScreenViewModule.d.ts +23 -2
  48. package/es/components/NonLinearReading/NonLinearReading.d.ts +28 -2
  49. package/es/components/NonLinearReading/NonLinearReading.js +2 -7
  50. package/es/components/SearchBar/SearchBar.d.ts +51 -3
  51. package/es/components/SearchBar/SearchBar.js +5 -6
  52. package/es/components/SidePanel/SidePanel.js +10 -5
  53. package/es/components/TruncatedList/TruncatedList.d.ts +47 -2
  54. package/es/components/TruncatedList/TruncatedList.js +5 -4
  55. package/es/components/UserProfileImage/UserProfileImage.d.ts +66 -2
  56. package/es/components/UserProfileImage/UserProfileImage.js +5 -3
  57. package/lib/components/Carousel/Carousel.d.ts +46 -2
  58. package/lib/components/Carousel/Carousel.js +35 -20
  59. package/lib/components/Carousel/CarouselItem.d.ts +19 -2
  60. package/lib/components/Carousel/CarouselItem.js +0 -1
  61. package/lib/components/Coachmark/utils/enums.d.ts +36 -22
  62. package/lib/components/CoachmarkBeacon/CoachmarkBeacon.d.ts +26 -2
  63. package/lib/components/CoachmarkBeacon/CoachmarkBeacon.js +1 -3
  64. package/lib/components/CoachmarkOverlayElement/CoachmarkOverlayElement.d.ts +28 -2
  65. package/lib/components/CoachmarkOverlayElement/CoachmarkOverlayElement.js +0 -1
  66. package/lib/components/ConditionBuilder/assets/sampleInput.d.ts +5 -5
  67. package/lib/components/CreateFullPage/CreateFullPage.d.ts +121 -4
  68. package/lib/components/CreateFullPage/CreateFullPage.js +12 -8
  69. package/lib/components/CreateTearsheet/CreateTearsheet.js +2 -0
  70. package/lib/components/Datagrid/Datagrid/DatagridRow.js +4 -3
  71. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +2 -1
  72. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +11 -7
  73. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +6 -2
  74. package/lib/components/EditFullPage/EditFullPage.d.ts +19 -2
  75. package/lib/components/EditFullPage/EditFullPage.js +3 -3
  76. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.d.ts +61 -2
  77. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -3
  78. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.d.ts +61 -2
  79. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -2
  80. package/lib/components/FullPageError/FullPageError.d.ts +2 -1
  81. package/lib/components/FullPageError/FullPageError.js +24 -49
  82. package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.d.ts +40 -2
  83. package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +1 -1
  84. package/lib/components/InlineTip/InlineTipLink.d.ts +19 -2
  85. package/lib/components/InterstitialScreenView/InterstitialScreenView.d.ts +23 -2
  86. package/lib/components/InterstitialScreenView/InterstitialScreenView.js +0 -1
  87. package/lib/components/InterstitialScreenViewModule/InterstitialScreenViewModule.d.ts +23 -2
  88. package/lib/components/NonLinearReading/NonLinearReading.d.ts +28 -2
  89. package/lib/components/NonLinearReading/NonLinearReading.js +2 -7
  90. package/lib/components/SearchBar/SearchBar.d.ts +51 -3
  91. package/lib/components/SearchBar/SearchBar.js +5 -6
  92. package/lib/components/SidePanel/SidePanel.js +10 -5
  93. package/lib/components/TruncatedList/TruncatedList.d.ts +47 -2
  94. package/lib/components/TruncatedList/TruncatedList.js +5 -4
  95. package/lib/components/UserProfileImage/UserProfileImage.d.ts +66 -2
  96. package/lib/components/UserProfileImage/UserProfileImage.js +5 -3
  97. package/package.json +7 -7
  98. package/scss/components/Datagrid/styles/_useSortableColumns.scss +2 -0
  99. package/scss/components/FullPageError/_full-page-error.scss +10 -10
  100. package/scss/components/UserAvatar/_user-avatar.scss +6 -3
  101. package/telemetry.yml +3 -0
@@ -3094,7 +3094,7 @@ p.c4p--about-modal__copyright-text:first-child {
3094
3094
  }
3095
3095
  .c4p--side-panel.c4p--side-panel.c4p--side-panel--has-slug {
3096
3096
  border-color: transparent;
3097
- 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));
3097
+ 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));
3098
3098
  }
3099
3099
  .c4p--side-panel .c4p--side-panel__header {
3100
3100
  --c4p--side-panel--title-padding-bottom: 1rem;
@@ -3258,8 +3258,8 @@ p.c4p--about-modal__copyright-text:first-child {
3258
3258
  padding-top: 0.5rem;
3259
3259
  }
3260
3260
  .c4p--side-panel.c4p--side-panel--has-slug .c4p--side-panel--scrolls {
3261
- 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;
3262
- 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));
3261
+ 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;
3262
+ 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));
3263
3263
  }
3264
3264
  .c4p--side-panel .c4p--side-panel__action-toolbar {
3265
3265
  position: sticky;
@@ -3497,7 +3497,7 @@ p.c4p--about-modal__copyright-text:first-child {
3497
3497
  border-bottom: 0;
3498
3498
  /* override carbon ai removing background gradient */
3499
3499
  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;
3500
- box-shadow: 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
3500
+ box-shadow: 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
3501
3501
  }
3502
3502
  .c4p--tearsheet.c4p--tearsheet.c4p--tearsheet .c4p--tearsheet__container {
3503
3503
  transition: transform 240ms cubic-bezier(0, 0, 0.3, 1), max-height 240ms cubic-bezier(0, 0, 0.3, 1);
@@ -3664,8 +3664,8 @@ p.c4p--about-modal__copyright-text:first-child {
3664
3664
  flex-grow: 1;
3665
3665
  }
3666
3666
  .c4p--tearsheet.c4p--tearsheet--has-slug .c4p--tearsheet__content {
3667
- 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;
3668
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
3667
+ 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;
3668
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
3669
3669
  }
3670
3670
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination,
3671
3671
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination__control-buttons,
@@ -4141,17 +4141,17 @@ p.c4p--about-modal__copyright-text:first-child {
4141
4141
  }
4142
4142
 
4143
4143
  .c4p--card--has-slug {
4144
- 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;
4144
+ 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;
4145
4145
  border: 1px solid transparent;
4146
- 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));
4146
+ 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));
4147
4147
  }
4148
4148
 
4149
4149
  .c4p--card__clickable.c4p--card--has-slug::before {
4150
- 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;
4150
+ 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;
4151
4151
  position: absolute;
4152
4152
  display: block;
4153
4153
  block-size: 100%;
4154
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
4154
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
4155
4155
  content: "";
4156
4156
  inline-size: 100%;
4157
4157
  inset-block-start: 0;
@@ -4774,21 +4774,22 @@ button.c4p--add-select__global-filter-toggle--open {
4774
4774
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
4775
4775
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
4776
4776
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
4777
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
4778
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
4779
- --cds-ai-border-start: #4589ff;
4777
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
4778
+ --cds-ai-border-end: #4589ff;
4779
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
4780
4780
  --cds-ai-border-strong: #78a9ff;
4781
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
4782
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
4783
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
4784
- --cds-ai-popover-caret-bottom: #3d4655;
4785
- --cds-ai-popover-caret-bottom-background: #213250;
4786
- --cds-ai-popover-caret-bottom-background-actions: #192436;
4787
- --cds-ai-popover-caret-center: #3f68af;
4788
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
4789
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
4790
- --cds-ai-skeleton-background: #a6c8ff;
4791
- --cds-ai-skeleton-element-background: #002d9c;
4781
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
4782
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
4783
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
4784
+ --cds-ai-popover-background: #161616;
4785
+ --cds-ai-popover-caret-bottom: #4589ff;
4786
+ --cds-ai-popover-caret-bottom-background: #202d45;
4787
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
4788
+ --cds-ai-popover-caret-center: #4870b5;
4789
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
4790
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
4791
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
4792
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
4792
4793
  --cds-background: #161616;
4793
4794
  --cds-background-active: rgba(141, 141, 141, 0.4);
4794
4795
  --cds-background-brand: #0f62fe;
@@ -4817,7 +4818,7 @@ button.c4p--add-select__global-filter-toggle--open {
4817
4818
  --cds-chat-avatar-bot: #8d8d8d;
4818
4819
  --cds-chat-avatar-user: #4589ff;
4819
4820
  --cds-chat-bubble-agent: #262626;
4820
- --cds-chat-bubble-agent-border: #525252;
4821
+ --cds-chat-bubble-border: #525252;
4821
4822
  --cds-chat-bubble-user: #393939;
4822
4823
  --cds-chat-button: #78a9ff;
4823
4824
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -4885,11 +4886,6 @@ button.c4p--add-select__global-filter-toggle--open {
4885
4886
  --cds-shadow: rgba(0, 0, 0, 0.8);
4886
4887
  --cds-skeleton-background: #292929;
4887
4888
  --cds-skeleton-element: #393939;
4888
- --cds-slug-background: #c6c6c6;
4889
- --cds-slug-background-hover: #e0e0e0;
4890
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
4891
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
4892
- --cds-slug-hollow-hover: #b5b5b5;
4893
4889
  --cds-support-caution-major: #ff832b;
4894
4890
  --cds-support-caution-minor: #f1c21b;
4895
4891
  --cds-support-caution-undefined: #a56eff;
@@ -8453,21 +8449,22 @@ button.c4p--add-select__global-filter-toggle--open {
8453
8449
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
8454
8450
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
8455
8451
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
8456
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
8457
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
8458
- --cds-ai-border-start: #4589ff;
8452
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
8453
+ --cds-ai-border-end: #4589ff;
8454
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
8459
8455
  --cds-ai-border-strong: #78a9ff;
8460
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
8461
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
8462
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
8463
- --cds-ai-popover-caret-bottom: #465060;
8464
- --cds-ai-popover-caret-bottom-background: #2d3f5c;
8465
- --cds-ai-popover-caret-bottom-background-actions: #253042;
8466
- --cds-ai-popover-caret-center: #456fb5;
8467
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
8468
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
8469
- --cds-ai-skeleton-background: #a6c8ff;
8470
- --cds-ai-skeleton-element-background: #002d9c;
8456
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
8457
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
8458
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
8459
+ --cds-ai-popover-background: #161616;
8460
+ --cds-ai-popover-caret-bottom: #4589ff;
8461
+ --cds-ai-popover-caret-bottom-background: #202d45;
8462
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
8463
+ --cds-ai-popover-caret-center: #4870b5;
8464
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
8465
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
8466
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
8467
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
8471
8468
  --cds-background: #262626;
8472
8469
  --cds-background-active: rgba(141, 141, 141, 0.4);
8473
8470
  --cds-background-brand: #0f62fe;
@@ -8496,7 +8493,7 @@ button.c4p--add-select__global-filter-toggle--open {
8496
8493
  --cds-chat-avatar-bot: #8d8d8d;
8497
8494
  --cds-chat-avatar-user: #4589ff;
8498
8495
  --cds-chat-bubble-agent: #262626;
8499
- --cds-chat-bubble-agent-border: #525252;
8496
+ --cds-chat-bubble-border: #525252;
8500
8497
  --cds-chat-bubble-user: #393939;
8501
8498
  --cds-chat-button: #78a9ff;
8502
8499
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -8564,11 +8561,6 @@ button.c4p--add-select__global-filter-toggle--open {
8564
8561
  --cds-shadow: rgba(0, 0, 0, 0.8);
8565
8562
  --cds-skeleton-background: #333333;
8566
8563
  --cds-skeleton-element: #525252;
8567
- --cds-slug-background: #c6c6c6;
8568
- --cds-slug-background-hover: #e0e0e0;
8569
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
8570
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
8571
- --cds-slug-hollow-hover: #b5b5b5;
8572
8564
  --cds-support-caution-major: #ff832b;
8573
8565
  --cds-support-caution-minor: #f1c21b;
8574
8566
  --cds-support-caution-undefined: #a56eff;
@@ -8887,21 +8879,22 @@ button.c4p--add-select__global-filter-toggle--open {
8887
8879
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
8888
8880
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
8889
8881
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
8890
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
8891
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
8892
- --cds-ai-border-start: #4589ff;
8882
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
8883
+ --cds-ai-border-end: #4589ff;
8884
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
8893
8885
  --cds-ai-border-strong: #78a9ff;
8894
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
8895
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
8896
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
8897
- --cds-ai-popover-caret-bottom: #3d4655;
8898
- --cds-ai-popover-caret-bottom-background: #213250;
8899
- --cds-ai-popover-caret-bottom-background-actions: #192436;
8900
- --cds-ai-popover-caret-center: #3f68af;
8901
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
8902
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
8903
- --cds-ai-skeleton-background: #a6c8ff;
8904
- --cds-ai-skeleton-element-background: #002d9c;
8886
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
8887
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
8888
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
8889
+ --cds-ai-popover-background: #161616;
8890
+ --cds-ai-popover-caret-bottom: #4589ff;
8891
+ --cds-ai-popover-caret-bottom-background: #202d45;
8892
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
8893
+ --cds-ai-popover-caret-center: #4870b5;
8894
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
8895
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
8896
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
8897
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
8905
8898
  --cds-background: #161616;
8906
8899
  --cds-background-active: rgba(141, 141, 141, 0.4);
8907
8900
  --cds-background-brand: #0f62fe;
@@ -8930,7 +8923,7 @@ button.c4p--add-select__global-filter-toggle--open {
8930
8923
  --cds-chat-avatar-bot: #8d8d8d;
8931
8924
  --cds-chat-avatar-user: #4589ff;
8932
8925
  --cds-chat-bubble-agent: #262626;
8933
- --cds-chat-bubble-agent-border: #525252;
8926
+ --cds-chat-bubble-border: #525252;
8934
8927
  --cds-chat-bubble-user: #393939;
8935
8928
  --cds-chat-button: #78a9ff;
8936
8929
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -8998,11 +8991,6 @@ button.c4p--add-select__global-filter-toggle--open {
8998
8991
  --cds-shadow: rgba(0, 0, 0, 0.8);
8999
8992
  --cds-skeleton-background: #292929;
9000
8993
  --cds-skeleton-element: #393939;
9001
- --cds-slug-background: #c6c6c6;
9002
- --cds-slug-background-hover: #e0e0e0;
9003
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
9004
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
9005
- --cds-slug-hollow-hover: #b5b5b5;
9006
8994
  --cds-support-caution-major: #ff832b;
9007
8995
  --cds-support-caution-minor: #f1c21b;
9008
8996
  --cds-support-caution-undefined: #a56eff;
@@ -10266,12 +10254,12 @@ button.c4p--add-select__global-filter-toggle--open {
10266
10254
 
10267
10255
  .c4p--datagrid th.c4p--datagrid__with-slug,
10268
10256
  .c4p--datagrid td.c4p--datagrid__slug--cell {
10269
- 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%);
10257
+ 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%);
10270
10258
  }
10271
10259
 
10272
10260
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row,
10273
10261
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row + .c4p--datagrid__expanded-row {
10274
- 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%);
10262
+ 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%);
10275
10263
  background-attachment: fixed;
10276
10264
  }
10277
10265
 
@@ -10284,7 +10272,7 @@ button.c4p--add-select__global-filter-toggle--open {
10284
10272
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row.cds--data-table--selected:hover,
10285
10273
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row.c4p--datagrid__carbon-row-expanded:hover + .c4p--datagrid__expanded-row,
10286
10274
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__expandable-row--hover.c4p--datagrid__slug--row {
10287
- 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);
10275
+ 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);
10288
10276
  }
10289
10277
 
10290
10278
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__expandable-row--hover.c4p--datagrid__slug--row td {
@@ -10292,7 +10280,7 @@ button.c4p--add-select__global-filter-toggle--open {
10292
10280
  }
10293
10281
 
10294
10282
  .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row.cds--data-table--selected {
10295
- 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);
10283
+ 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);
10296
10284
  }
10297
10285
 
10298
10286
  .c4p--datagrid th.c4p--datagrid__with-slug .cds--slug {
@@ -11005,6 +10993,11 @@ button.c4p--add-select__global-filter-toggle--open {
11005
10993
  margin: 0 calc(-1 * 1rem);
11006
10994
  }
11007
10995
 
10996
+ .c4p--datagrid__sortableColumn:hover,
10997
+ .c4p--datagrid__sortableColumn:focus-within,
10998
+ .c4p--datagrid__sortableColumn.c4p--datagrid__isSorted {
10999
+ background-color: var(--cds-layer-selected-hover-01, #d1d1d1);
11000
+ }
11008
11001
  .c4p--datagrid__sortableColumn:hover .cds--table-header-label .c4p--datagrid__sortable-icon,
11009
11002
  .c4p--datagrid__sortableColumn:focus-within .cds--table-header-label .c4p--datagrid__sortable-icon,
11010
11003
  .c4p--datagrid__sortableColumn.c4p--datagrid__isSorted .cds--table-header-label .c4p--datagrid__sortable-icon {
@@ -13723,8 +13716,8 @@ th.c4p--datagrid__select-all-toggle-on.button {
13723
13716
  inset-block-start: 0;
13724
13717
  inset-inline-start: 0;
13725
13718
  max-inline-size: 16rem;
13726
- transition: width 0.11s cubic-bezier(0.2, 0, 1, 0.9);
13727
- will-change: width;
13719
+ transition: inline-size 0.11s cubic-bezier(0.2, 0, 1, 0.9), transform 0.11s cubic-bezier(0.2, 0, 1, 0.9);
13720
+ will-change: inline-size;
13728
13721
  }
13729
13722
 
13730
13723
  .cds--side-nav--ux {
@@ -14517,7 +14510,7 @@ a.cds--side-nav__link--current::before {
14517
14510
  border-bottom: 0;
14518
14511
  /* override carbon ai removing background gradient */
14519
14512
  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;
14520
- box-shadow: 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
14513
+ box-shadow: 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
14521
14514
  }
14522
14515
 
14523
14516
  .c4p--tearsheet.c4p--tearsheet.c4p--tearsheet .c4p--tearsheet__container {
@@ -14721,8 +14714,8 @@ a.cds--side-nav__link--current::before {
14721
14714
  }
14722
14715
 
14723
14716
  .c4p--tearsheet.c4p--tearsheet--has-slug .c4p--tearsheet__content {
14724
- 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;
14725
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
14717
+ 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;
14718
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
14726
14719
  }
14727
14720
 
14728
14721
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination,
@@ -15288,21 +15281,22 @@ a.cds--side-nav__link--current::before {
15288
15281
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
15289
15282
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
15290
15283
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
15291
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
15292
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
15293
- --cds-ai-border-start: #4589ff;
15284
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
15285
+ --cds-ai-border-end: #4589ff;
15286
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
15294
15287
  --cds-ai-border-strong: #78a9ff;
15295
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
15296
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
15297
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
15298
- --cds-ai-popover-caret-bottom: #3d4655;
15299
- --cds-ai-popover-caret-bottom-background: #213250;
15300
- --cds-ai-popover-caret-bottom-background-actions: #192436;
15301
- --cds-ai-popover-caret-center: #3f68af;
15302
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
15303
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
15304
- --cds-ai-skeleton-background: #a6c8ff;
15305
- --cds-ai-skeleton-element-background: #002d9c;
15288
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
15289
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
15290
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
15291
+ --cds-ai-popover-background: #161616;
15292
+ --cds-ai-popover-caret-bottom: #4589ff;
15293
+ --cds-ai-popover-caret-bottom-background: #202d45;
15294
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
15295
+ --cds-ai-popover-caret-center: #4870b5;
15296
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
15297
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
15298
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
15299
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
15306
15300
  --cds-background: #161616;
15307
15301
  --cds-background-active: rgba(141, 141, 141, 0.4);
15308
15302
  --cds-background-brand: #0f62fe;
@@ -15331,7 +15325,7 @@ a.cds--side-nav__link--current::before {
15331
15325
  --cds-chat-avatar-bot: #8d8d8d;
15332
15326
  --cds-chat-avatar-user: #4589ff;
15333
15327
  --cds-chat-bubble-agent: #262626;
15334
- --cds-chat-bubble-agent-border: #525252;
15328
+ --cds-chat-bubble-border: #525252;
15335
15329
  --cds-chat-bubble-user: #393939;
15336
15330
  --cds-chat-button: #78a9ff;
15337
15331
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -15399,11 +15393,6 @@ a.cds--side-nav__link--current::before {
15399
15393
  --cds-shadow: rgba(0, 0, 0, 0.8);
15400
15394
  --cds-skeleton-background: #292929;
15401
15395
  --cds-skeleton-element: #393939;
15402
- --cds-slug-background: #c6c6c6;
15403
- --cds-slug-background-hover: #e0e0e0;
15404
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
15405
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
15406
- --cds-slug-hollow-hover: #b5b5b5;
15407
15396
  --cds-support-caution-major: #ff832b;
15408
15397
  --cds-support-caution-minor: #f1c21b;
15409
15398
  --cds-support-caution-undefined: #a56eff;
@@ -16096,21 +16085,22 @@ a.cds--side-nav__link--current::before {
16096
16085
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
16097
16086
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
16098
16087
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
16099
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
16100
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
16101
- --cds-ai-border-start: #4589ff;
16088
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
16089
+ --cds-ai-border-end: #4589ff;
16090
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
16102
16091
  --cds-ai-border-strong: #78a9ff;
16103
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
16104
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
16105
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
16106
- --cds-ai-popover-caret-bottom: #3d4655;
16107
- --cds-ai-popover-caret-bottom-background: #213250;
16108
- --cds-ai-popover-caret-bottom-background-actions: #192436;
16109
- --cds-ai-popover-caret-center: #3f68af;
16110
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
16111
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
16112
- --cds-ai-skeleton-background: #a6c8ff;
16113
- --cds-ai-skeleton-element-background: #002d9c;
16092
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
16093
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
16094
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
16095
+ --cds-ai-popover-background: #161616;
16096
+ --cds-ai-popover-caret-bottom: #4589ff;
16097
+ --cds-ai-popover-caret-bottom-background: #202d45;
16098
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
16099
+ --cds-ai-popover-caret-center: #4870b5;
16100
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
16101
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
16102
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
16103
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
16114
16104
  --cds-background: #161616;
16115
16105
  --cds-background-active: rgba(141, 141, 141, 0.4);
16116
16106
  --cds-background-brand: #0f62fe;
@@ -16139,7 +16129,7 @@ a.cds--side-nav__link--current::before {
16139
16129
  --cds-chat-avatar-bot: #8d8d8d;
16140
16130
  --cds-chat-avatar-user: #4589ff;
16141
16131
  --cds-chat-bubble-agent: #262626;
16142
- --cds-chat-bubble-agent-border: #525252;
16132
+ --cds-chat-bubble-border: #525252;
16143
16133
  --cds-chat-bubble-user: #393939;
16144
16134
  --cds-chat-button: #78a9ff;
16145
16135
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -16207,11 +16197,6 @@ a.cds--side-nav__link--current::before {
16207
16197
  --cds-shadow: rgba(0, 0, 0, 0.8);
16208
16198
  --cds-skeleton-background: #292929;
16209
16199
  --cds-skeleton-element: #393939;
16210
- --cds-slug-background: #c6c6c6;
16211
- --cds-slug-background-hover: #e0e0e0;
16212
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
16213
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
16214
- --cds-slug-hollow-hover: #b5b5b5;
16215
16200
  --cds-support-caution-major: #ff832b;
16216
16201
  --cds-support-caution-minor: #f1c21b;
16217
16202
  --cds-support-caution-undefined: #a56eff;
@@ -17012,21 +16997,22 @@ a.cds--side-nav__link--current::before {
17012
16997
  --cds-ai-aura-end: rgba(255, 255, 255, 0);
17013
16998
  --cds-ai-aura-hover-background: #edf5ff;
17014
16999
  --cds-ai-aura-hover-end: rgba(255, 255, 255, 0);
17015
- --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
17000
+ --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.32);
17016
17001
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
17017
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
17018
- --cds-ai-border-end: #d0e2ff;
17019
- --cds-ai-border-start: #78a9ff;
17002
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
17003
+ --cds-ai-border-end: #78a9ff;
17004
+ --cds-ai-border-start: rgba(166, 200, 255, 0.64);
17020
17005
  --cds-ai-border-strong: #4589ff;
17021
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
17022
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
17006
+ --cds-ai-drop-shadow: rgba(15, 98, 254, 0.1);
17007
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.1);
17023
17008
  --cds-ai-overlay: rgba(0, 17, 65, 0.5);
17024
- --cds-ai-popover-caret-bottom: #d0e2ff;
17025
- --cds-ai-popover-caret-bottom-background: #ccdbf8;
17026
- --cds-ai-popover-caret-bottom-background-actions: #d2dcee;
17027
- --cds-ai-popover-caret-center: #a7c7ff;
17028
- --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.25);
17029
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.1);
17009
+ --cds-ai-popover-background: #ffffff;
17010
+ --cds-ai-popover-caret-bottom: #78a9ff;
17011
+ --cds-ai-popover-caret-bottom-background: #eaf1ff;
17012
+ --cds-ai-popover-caret-bottom-background-actions: #e9effa;
17013
+ --cds-ai-popover-caret-center: #a0c3ff;
17014
+ --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.06);
17015
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.04);
17030
17016
  --cds-ai-skeleton-background: #d0e2ff;
17031
17017
  --cds-ai-skeleton-element-background: #4589ff;
17032
17018
  --cds-background: #f4f4f4;
@@ -17057,7 +17043,7 @@ a.cds--side-nav__link--current::before {
17057
17043
  --cds-chat-avatar-bot: #6f6f6f;
17058
17044
  --cds-chat-avatar-user: #0f62fe;
17059
17045
  --cds-chat-bubble-agent: #ffffff;
17060
- --cds-chat-bubble-agent-border: #e0e0e0;
17046
+ --cds-chat-bubble-border: #e0e0e0;
17061
17047
  --cds-chat-bubble-user: #e0e0e0;
17062
17048
  --cds-chat-button: #0f62fe;
17063
17049
  --cds-chat-button-active: rgba(141, 141, 141, 0.5);
@@ -17125,11 +17111,6 @@ a.cds--side-nav__link--current::before {
17125
17111
  --cds-shadow: rgba(0, 0, 0, 0.3);
17126
17112
  --cds-skeleton-background: #e8e8e8;
17127
17113
  --cds-skeleton-element: #c6c6c6;
17128
- --cds-slug-background: #525252;
17129
- --cds-slug-background-hover: #6f6f6f;
17130
- --cds-slug-gradient: #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%);
17131
- --cds-slug-gradient-hover: #161616 linear-gradient(135deg, #d1d1d1 0%, rgba(255, 255, 255, 0) 100%);
17132
- --cds-slug-hollow-hover: #474747;
17133
17114
  --cds-support-caution-major: #ff832b;
17134
17115
  --cds-support-caution-minor: #f1c21b;
17135
17116
  --cds-support-caution-undefined: #8a3ffc;
@@ -17428,21 +17409,22 @@ a.cds--side-nav__link--current::before {
17428
17409
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
17429
17410
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
17430
17411
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
17431
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
17432
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
17433
- --cds-ai-border-start: #4589ff;
17412
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
17413
+ --cds-ai-border-end: #4589ff;
17414
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
17434
17415
  --cds-ai-border-strong: #78a9ff;
17435
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
17436
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
17437
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
17438
- --cds-ai-popover-caret-bottom: #3d4655;
17439
- --cds-ai-popover-caret-bottom-background: #213250;
17440
- --cds-ai-popover-caret-bottom-background-actions: #192436;
17441
- --cds-ai-popover-caret-center: #3f68af;
17442
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
17443
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
17444
- --cds-ai-skeleton-background: #a6c8ff;
17445
- --cds-ai-skeleton-element-background: #002d9c;
17416
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
17417
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
17418
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
17419
+ --cds-ai-popover-background: #161616;
17420
+ --cds-ai-popover-caret-bottom: #4589ff;
17421
+ --cds-ai-popover-caret-bottom-background: #202d45;
17422
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
17423
+ --cds-ai-popover-caret-center: #4870b5;
17424
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
17425
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
17426
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
17427
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
17446
17428
  --cds-background: #161616;
17447
17429
  --cds-background-active: rgba(141, 141, 141, 0.4);
17448
17430
  --cds-background-brand: #0f62fe;
@@ -17471,7 +17453,7 @@ a.cds--side-nav__link--current::before {
17471
17453
  --cds-chat-avatar-bot: #8d8d8d;
17472
17454
  --cds-chat-avatar-user: #4589ff;
17473
17455
  --cds-chat-bubble-agent: #262626;
17474
- --cds-chat-bubble-agent-border: #525252;
17456
+ --cds-chat-bubble-border: #525252;
17475
17457
  --cds-chat-bubble-user: #393939;
17476
17458
  --cds-chat-button: #78a9ff;
17477
17459
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -17539,11 +17521,6 @@ a.cds--side-nav__link--current::before {
17539
17521
  --cds-shadow: rgba(0, 0, 0, 0.8);
17540
17522
  --cds-skeleton-background: #292929;
17541
17523
  --cds-skeleton-element: #393939;
17542
- --cds-slug-background: #c6c6c6;
17543
- --cds-slug-background-hover: #e0e0e0;
17544
- --cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
17545
- --cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
17546
- --cds-slug-hollow-hover: #b5b5b5;
17547
17524
  --cds-support-caution-major: #ff832b;
17548
17525
  --cds-support-caution-minor: #f1c21b;
17549
17526
  --cds-support-caution-undefined: #a56eff;
@@ -18318,44 +18295,44 @@ a.cds--side-nav__link--current::before {
18318
18295
  height: inherit;
18319
18296
  }
18320
18297
 
18321
- .c4p--full-page-error__error-container {
18298
+ .c4p--full-page-error__container {
18322
18299
  height: 100%;
18323
18300
  margin: 0 1.5rem;
18324
18301
  }
18325
18302
  @media (max-width: 41.98rem) {
18326
- .c4p--full-page-error__error-container {
18303
+ .c4p--full-page-error__container {
18327
18304
  margin: 0 0.5rem;
18328
18305
  }
18329
18306
  }
18330
18307
 
18331
- .c4p--full-page-error__error-grid {
18308
+ .c4p--full-page-error__grid {
18332
18309
  height: 100%;
18333
18310
  padding-top: 2rem;
18334
18311
  padding-bottom: 2rem;
18335
18312
  }
18336
18313
 
18337
- .c4p--full-page-error__error-column {
18314
+ .c4p--full-page-error__column {
18338
18315
  padding: 0;
18339
18316
  }
18340
18317
  @media (min-width: 66rem) {
18341
- .c4p--full-page-error__error-column {
18318
+ .c4p--full-page-error__column {
18342
18319
  padding: 0 2rem 0 0;
18343
18320
  }
18344
18321
  }
18345
18322
 
18346
- .c4p--full-page-error__error-svg-container {
18323
+ .c4p--full-page-error__svg-container {
18347
18324
  display: flex;
18348
18325
  height: 100%;
18349
18326
  padding: 0.5rem 0.5rem 5rem 0.5rem;
18350
18327
  }
18351
18328
  @media (min-width: 42rem) {
18352
- .c4p--full-page-error__error-svg-container {
18329
+ .c4p--full-page-error__svg-container {
18353
18330
  padding: auto 0.5rem 5rem 0.5rem;
18354
18331
  }
18355
18332
  }
18356
18333
 
18357
- .c4p--full-page-error__error-label,
18358
- .c4p--full-page-error__error-title {
18334
+ .c4p--full-page-error__label,
18335
+ .c4p--full-page-error__title {
18359
18336
  font-size: 2rem;
18360
18337
  font-weight: 400;
18361
18338
  line-height: 1.25;
@@ -18363,8 +18340,8 @@ a.cds--side-nav__link--current::before {
18363
18340
  font-size: calc(2rem + 0.25 * (100vw - 20rem) / 22);
18364
18341
  }
18365
18342
  @media (min-width: 42rem) {
18366
- .c4p--full-page-error__error-label,
18367
- .c4p--full-page-error__error-title {
18343
+ .c4p--full-page-error__label,
18344
+ .c4p--full-page-error__title {
18368
18345
  font-size: 2.25rem;
18369
18346
  font-weight: 300;
18370
18347
  line-height: 1.22;
@@ -18372,35 +18349,35 @@ a.cds--side-nav__link--current::before {
18372
18349
  }
18373
18350
  }
18374
18351
  @media (min-width: 66rem) {
18375
- .c4p--full-page-error__error-label,
18376
- .c4p--full-page-error__error-title {
18352
+ .c4p--full-page-error__label,
18353
+ .c4p--full-page-error__title {
18377
18354
  font-size: 2.625rem;
18378
18355
  line-height: 1.19;
18379
18356
  font-size: calc(2.625rem + 0.375 * (100vw - 66rem) / 16);
18380
18357
  }
18381
18358
  }
18382
18359
  @media (min-width: 82rem) {
18383
- .c4p--full-page-error__error-label,
18384
- .c4p--full-page-error__error-title {
18360
+ .c4p--full-page-error__label,
18361
+ .c4p--full-page-error__title {
18385
18362
  font-size: 3rem;
18386
18363
  line-height: 1.17;
18387
18364
  font-size: calc(3rem + 0.75 * (100vw - 82rem) / 17);
18388
18365
  }
18389
18366
  }
18390
18367
  @media (min-width: 99rem) {
18391
- .c4p--full-page-error__error-label,
18392
- .c4p--full-page-error__error-title {
18368
+ .c4p--full-page-error__label,
18369
+ .c4p--full-page-error__title {
18393
18370
  font-size: 3.75rem;
18394
18371
  font-size: 3.75rem;
18395
18372
  }
18396
18373
  }
18397
18374
 
18398
- .c4p--full-page-error__error-label {
18375
+ .c4p--full-page-error__label {
18399
18376
  display: block;
18400
18377
  color: var(--cds-text-error, #da1e28);
18401
18378
  }
18402
18379
 
18403
- .c4p--full-page-error__error-title {
18380
+ .c4p--full-page-error__title {
18404
18381
  margin-bottom: 3rem;
18405
18382
  }
18406
18383
 
@@ -18412,11 +18389,11 @@ a.cds--side-nav__link--current::before {
18412
18389
  margin-bottom: 2rem;
18413
18390
  }
18414
18391
 
18415
- .c4p--full-page-error__error-svg-container svg.c4p--full-page-error__error-svg {
18392
+ .c4p--full-page-error__svg-container svg.c4p--full-page-error__svg {
18416
18393
  width: 100%;
18417
18394
  }
18418
18395
 
18419
- .c4p--full-page-error__error-svg-container svg.c4p--full-page-error__error-svg path {
18396
+ .c4p--full-page-error__svg-container svg.c4p--full-page-error__svg path {
18420
18397
  fill: var(--cds-background, #ffffff);
18421
18398
  stroke: var(--cds-border-inverse, #161616);
18422
18399
  }
@@ -18734,133 +18711,181 @@ a.cds--side-nav__link--current::before {
18734
18711
 
18735
18712
  :root .c4p--user-avatar--order-1-cyan,
18736
18713
  .cds--g10 .c4p--user-avatar--order-1-cyan,
18737
- .cds--white .c4p--user-avatar--order-1-cyan {
18714
+ .cds--white .c4p--user-avatar--order-1-cyan,
18715
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-1-cyan,
18716
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-1-cyan {
18738
18717
  background-color: #0072c3;
18739
18718
  }
18740
18719
 
18741
18720
  :root .c4p--user-avatar--order-2-gray,
18742
18721
  .cds--g10 .c4p--user-avatar--order-2-gray,
18743
- .cds--white .c4p--user-avatar--order-2-gray {
18722
+ .cds--white .c4p--user-avatar--order-2-gray,
18723
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-2-gray,
18724
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-2-gray {
18744
18725
  background-color: #6f6f6f;
18745
18726
  }
18746
18727
 
18747
18728
  :root .c4p--user-avatar--order-3-green,
18748
18729
  .cds--g10 .c4p--user-avatar--order-3-green,
18749
- .cds--white .c4p--user-avatar--order-3-green {
18730
+ .cds--white .c4p--user-avatar--order-3-green,
18731
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-3-green,
18732
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-3-green {
18750
18733
  background-color: #198038;
18751
18734
  }
18752
18735
 
18753
18736
  :root .c4p--user-avatar--order-4-magenta,
18754
18737
  .cds--g10 .c4p--user-avatar--order-4-magenta,
18755
- .cds--white .c4p--user-avatar--order-4-magenta {
18738
+ .cds--white .c4p--user-avatar--order-4-magenta,
18739
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-4-magenta,
18740
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-4-magenta {
18756
18741
  background-color: #d02670;
18757
18742
  }
18758
18743
 
18759
18744
  :root .c4p--user-avatar--order-5-purple,
18760
18745
  .cds--g10 .c4p--user-avatar--order-5-purple,
18761
- .cds--white .c4p--user-avatar--order-5-purple {
18746
+ .cds--white .c4p--user-avatar--order-5-purple,
18747
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-5-purple,
18748
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-5-purple {
18762
18749
  background-color: #8a3ffc;
18763
18750
  }
18764
18751
 
18765
18752
  :root .c4p--user-avatar--order-6-teal,
18766
18753
  .cds--g10 .c4p--user-avatar--order-6-teal,
18767
- .cds--white .c4p--user-avatar--order-6-teal {
18754
+ .cds--white .c4p--user-avatar--order-6-teal,
18755
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-6-teal,
18756
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-6-teal {
18768
18757
  background-color: #007d79;
18769
18758
  }
18770
18759
 
18771
18760
  :root .c4p--user-avatar--order-7-cyan,
18772
18761
  .cds--g10 .c4p--user-avatar--order-7-cyan,
18773
- .cds--white .c4p--user-avatar--order-7-cyan {
18762
+ .cds--white .c4p--user-avatar--order-7-cyan,
18763
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-7-cyan,
18764
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-7-cyan {
18774
18765
  background-color: #003a6d;
18775
18766
  }
18776
18767
 
18777
18768
  :root .c4p--user-avatar--order-8-gray,
18778
18769
  .cds--g10 .c4p--user-avatar--order-8-gray,
18779
- .cds--white .c4p--user-avatar--order-8-gray {
18770
+ .cds--white .c4p--user-avatar--order-8-gray,
18771
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-8-gray,
18772
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-8-gray {
18780
18773
  background-color: #393939;
18781
18774
  }
18782
18775
 
18783
18776
  :root .c4p--user-avatar--order-9-green,
18784
18777
  .cds--g10 .c4p--user-avatar--order-9-green,
18785
- .cds--white .c4p--user-avatar--order-9-green {
18778
+ .cds--white .c4p--user-avatar--order-9-green,
18779
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-9-green,
18780
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-9-green {
18786
18781
  background-color: #044317;
18787
18782
  }
18788
18783
 
18789
18784
  :root .c4p--user-avatar--order-10-magenta,
18790
18785
  .cds--g10 .c4p--user-avatar--order-10-magenta,
18791
- .cds--white .c4p--user-avatar--order-10-magenta {
18786
+ .cds--white .c4p--user-avatar--order-10-magenta,
18787
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-10-magenta,
18788
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-10-magenta {
18792
18789
  background-color: #740937;
18793
18790
  }
18794
18791
 
18795
18792
  :root .c4p--user-avatar--order-11-purple,
18796
18793
  .cds--g10 .c4p--user-avatar--order-11-purple,
18797
- .cds--white .c4p--user-avatar--order-11-purple {
18794
+ .cds--white .c4p--user-avatar--order-11-purple,
18795
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-11-purple,
18796
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-11-purple {
18798
18797
  background-color: #491d8b;
18799
18798
  }
18800
18799
 
18801
18800
  :root .c4p--user-avatar--order-12-teal,
18802
18801
  .cds--g10 .c4p--user-avatar--order-12-teal,
18803
- .cds--white .c4p--user-avatar--order-12-teal {
18802
+ .cds--white .c4p--user-avatar--order-12-teal,
18803
+ [storybook-carbon-theme=g10] .c4p--user-avatar--order-12-teal,
18804
+ [storybook-carbon-theme=white] .c4p--user-avatar--order-12-teal {
18804
18805
  background-color: #004144;
18805
18806
  }
18806
18807
 
18807
18808
  .cds--g90 .c4p--user-avatar--order-1-cyan,
18808
- .cds--g100 .c4p--user-avatar--order-1-cyan {
18809
+ .cds--g100 .c4p--user-avatar--order-1-cyan,
18810
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-1-cyan,
18811
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-1-cyan {
18809
18812
  background-color: #1192e8;
18810
18813
  }
18811
18814
 
18812
18815
  .cds--g90 .c4p--user-avatar--order-2-gray,
18813
- .cds--g100 .c4p--user-avatar--order-2-gray {
18816
+ .cds--g100 .c4p--user-avatar--order-2-gray,
18817
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-2-gray,
18818
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-2-gray {
18814
18819
  background-color: #8d8d8d;
18815
18820
  }
18816
18821
 
18817
18822
  .cds--g90 .c4p--user-avatar--order-3-green,
18818
- .cds--g100 .c4p--user-avatar--order-3-green {
18823
+ .cds--g100 .c4p--user-avatar--order-3-green,
18824
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-3-green,
18825
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-3-green {
18819
18826
  background-color: #24a148;
18820
18827
  }
18821
18828
 
18822
18829
  .cds--g90 .c4p--user-avatar--order-4-magenta,
18823
- .cds--g100 .c4p--user-avatar--order-4-magenta {
18830
+ .cds--g100 .c4p--user-avatar--order-4-magenta,
18831
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-4-magenta,
18832
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-4-magenta {
18824
18833
  background-color: #ee5396;
18825
18834
  }
18826
18835
 
18827
18836
  .cds--g90 .c4p--user-avatar--order-5-purple,
18828
- .cds--g100 .c4p--user-avatar--order-5-purple {
18837
+ .cds--g100 .c4p--user-avatar--order-5-purple,
18838
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-5-purple,
18839
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-5-purple {
18829
18840
  background-color: #a56eff;
18830
18841
  }
18831
18842
 
18832
18843
  .cds--g90 .c4p--user-avatar--order-6-teal,
18833
- .cds--g100 .c4p--user-avatar--order-6-teal {
18844
+ .cds--g100 .c4p--user-avatar--order-6-teal,
18845
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-6-teal,
18846
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-6-teal {
18834
18847
  background-color: #009d9a;
18835
18848
  }
18836
18849
 
18837
18850
  .cds--g90 .c4p--user-avatar--order-7-cyan,
18838
- .cds--g100 .c4p--user-avatar--order-7-cyan {
18851
+ .cds--g100 .c4p--user-avatar--order-7-cyan,
18852
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-7-cyan,
18853
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-7-cyan {
18839
18854
  background-color: #82cfff;
18840
18855
  }
18841
18856
 
18842
18857
  .cds--g90 .c4p--user-avatar--order-8-gray,
18843
- .cds--g100 .c4p--user-avatar--order-8-gray {
18858
+ .cds--g100 .c4p--user-avatar--order-8-gray,
18859
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-8-gray,
18860
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-8-gray {
18844
18861
  background-color: #c6c6c6;
18845
18862
  }
18846
18863
 
18847
18864
  .cds--g90 .c4p--user-avatar--order-9-green,
18848
- .cds--g100 .c4p--user-avatar--order-9-green {
18865
+ .cds--g100 .c4p--user-avatar--order-9-green,
18866
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-9-green,
18867
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-9-green {
18849
18868
  background-color: #6fdc8c;
18850
18869
  }
18851
18870
 
18852
18871
  .cds--g90 .c4p--user-avatar--order-10-magenta,
18853
- .cds--g100 .c4p--user-avatar--order-10-magenta {
18872
+ .cds--g100 .c4p--user-avatar--order-10-magenta,
18873
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-10-magenta,
18874
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-10-magenta {
18854
18875
  background-color: #ffafd2;
18855
18876
  }
18856
18877
 
18857
18878
  .cds--g90 .c4p--user-avatar--order-11-purple,
18858
- .cds--g100 .c4p--user-avatar--order-11-purple {
18879
+ .cds--g100 .c4p--user-avatar--order-11-purple,
18880
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-11-purple,
18881
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-11-purple {
18859
18882
  background-color: #d4bbff;
18860
18883
  }
18861
18884
 
18862
18885
  .cds--g90 .c4p--user-avatar--order-12-teal,
18863
- .cds--g100 .c4p--user-avatar--order-12-teal {
18886
+ .cds--g100 .c4p--user-avatar--order-12-teal,
18887
+ [storybook-carbon-theme=g90] .c4p--user-avatar--order-12-teal,
18888
+ [storybook-carbon-theme=g100] .c4p--user-avatar--order-12-teal {
18864
18889
  background-color: #3ddbd9;
18865
18890
  }
18866
18891
 
@@ -18906,7 +18931,6 @@ a.cds--side-nav__link--current::before {
18906
18931
  }
18907
18932
 
18908
18933
  .c4p--user-avatar__photo--xl {
18909
- position: fixed;
18910
18934
  border-radius: 100%;
18911
18935
  object-fit: fill;
18912
18936
  width: 4rem;
@@ -18914,7 +18938,6 @@ a.cds--side-nav__link--current::before {
18914
18938
  }
18915
18939
 
18916
18940
  .c4p--user-avatar__photo--lg {
18917
- position: fixed;
18918
18941
  border-radius: 100%;
18919
18942
  object-fit: fill;
18920
18943
  width: 3rem;
@@ -18922,7 +18945,6 @@ a.cds--side-nav__link--current::before {
18922
18945
  }
18923
18946
 
18924
18947
  .c4p--user-avatar__photo--md {
18925
- position: fixed;
18926
18948
  border-radius: 100%;
18927
18949
  object-fit: fill;
18928
18950
  width: 2rem;
@@ -18930,7 +18952,6 @@ a.cds--side-nav__link--current::before {
18930
18952
  }
18931
18953
 
18932
18954
  .c4p--user-avatar__photo--sm {
18933
- position: fixed;
18934
18955
  border-radius: 100%;
18935
18956
  object-fit: fill;
18936
18957
  width: 1.5rem;
@@ -20327,21 +20348,22 @@ em {
20327
20348
  --cds-ai-aura-end: rgba(255, 255, 255, 0);
20328
20349
  --cds-ai-aura-hover-background: #edf5ff;
20329
20350
  --cds-ai-aura-hover-end: rgba(255, 255, 255, 0);
20330
- --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
20351
+ --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.32);
20331
20352
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
20332
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
20333
- --cds-ai-border-end: #d0e2ff;
20334
- --cds-ai-border-start: #78a9ff;
20353
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
20354
+ --cds-ai-border-end: #78a9ff;
20355
+ --cds-ai-border-start: rgba(166, 200, 255, 0.64);
20335
20356
  --cds-ai-border-strong: #4589ff;
20336
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
20337
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
20357
+ --cds-ai-drop-shadow: rgba(15, 98, 254, 0.1);
20358
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.1);
20338
20359
  --cds-ai-overlay: rgba(0, 17, 65, 0.5);
20339
- --cds-ai-popover-caret-bottom: #d0e2ff;
20340
- --cds-ai-popover-caret-bottom-background: #d5e5ff;
20341
- --cds-ai-popover-caret-bottom-background-actions: #dae5f8;
20342
- --cds-ai-popover-caret-center: #a7c7ff;
20343
- --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.25);
20344
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.1);
20360
+ --cds-ai-popover-background: #ffffff;
20361
+ --cds-ai-popover-caret-bottom: #78a9ff;
20362
+ --cds-ai-popover-caret-bottom-background: #eaf1ff;
20363
+ --cds-ai-popover-caret-bottom-background-actions: #e9effa;
20364
+ --cds-ai-popover-caret-center: #a0c3ff;
20365
+ --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.06);
20366
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.04);
20345
20367
  --cds-ai-skeleton-background: #d0e2ff;
20346
20368
  --cds-ai-skeleton-element-background: #4589ff;
20347
20369
  --cds-background: #ffffff;
@@ -20372,7 +20394,7 @@ em {
20372
20394
  --cds-chat-avatar-bot: #6f6f6f;
20373
20395
  --cds-chat-avatar-user: #0f62fe;
20374
20396
  --cds-chat-bubble-agent: #ffffff;
20375
- --cds-chat-bubble-agent-border: #e0e0e0;
20397
+ --cds-chat-bubble-border: #e0e0e0;
20376
20398
  --cds-chat-bubble-user: #e0e0e0;
20377
20399
  --cds-chat-button: #0f62fe;
20378
20400
  --cds-chat-button-active: rgba(141, 141, 141, 0.5);
@@ -20440,9 +20462,6 @@ em {
20440
20462
  --cds-shadow: rgba(0, 0, 0, 0.3);
20441
20463
  --cds-skeleton-background: #e8e8e8;
20442
20464
  --cds-skeleton-element: #c6c6c6;
20443
- --cds-slug-background: #525252;
20444
- --cds-slug-background-hover: #6f6f6f;
20445
- --cds-slug-hollow-hover: #474747;
20446
20465
  --cds-support-caution-major: #ff832b;
20447
20466
  --cds-support-caution-minor: #f1c21b;
20448
20467
  --cds-support-caution-undefined: #8a3ffc;
@@ -20551,21 +20570,22 @@ em {
20551
20570
  --cds-ai-aura-end: rgba(255, 255, 255, 0);
20552
20571
  --cds-ai-aura-hover-background: #edf5ff;
20553
20572
  --cds-ai-aura-hover-end: rgba(255, 255, 255, 0);
20554
- --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
20573
+ --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.32);
20555
20574
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
20556
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
20557
- --cds-ai-border-end: #d0e2ff;
20558
- --cds-ai-border-start: #78a9ff;
20575
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
20576
+ --cds-ai-border-end: #78a9ff;
20577
+ --cds-ai-border-start: rgba(166, 200, 255, 0.64);
20559
20578
  --cds-ai-border-strong: #4589ff;
20560
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
20561
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
20579
+ --cds-ai-drop-shadow: rgba(15, 98, 254, 0.1);
20580
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.1);
20562
20581
  --cds-ai-overlay: rgba(0, 17, 65, 0.5);
20563
- --cds-ai-popover-caret-bottom: #d0e2ff;
20564
- --cds-ai-popover-caret-bottom-background: #ccdbf8;
20565
- --cds-ai-popover-caret-bottom-background-actions: #d2dcee;
20566
- --cds-ai-popover-caret-center: #a7c7ff;
20567
- --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.25);
20568
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.1);
20582
+ --cds-ai-popover-background: #ffffff;
20583
+ --cds-ai-popover-caret-bottom: #78a9ff;
20584
+ --cds-ai-popover-caret-bottom-background: #eaf1ff;
20585
+ --cds-ai-popover-caret-bottom-background-actions: #e9effa;
20586
+ --cds-ai-popover-caret-center: #a0c3ff;
20587
+ --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.06);
20588
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.04);
20569
20589
  --cds-ai-skeleton-background: #d0e2ff;
20570
20590
  --cds-ai-skeleton-element-background: #4589ff;
20571
20591
  --cds-background: #f4f4f4;
@@ -20596,7 +20616,7 @@ em {
20596
20616
  --cds-chat-avatar-bot: #6f6f6f;
20597
20617
  --cds-chat-avatar-user: #0f62fe;
20598
20618
  --cds-chat-bubble-agent: #ffffff;
20599
- --cds-chat-bubble-agent-border: #e0e0e0;
20619
+ --cds-chat-bubble-border: #e0e0e0;
20600
20620
  --cds-chat-bubble-user: #e0e0e0;
20601
20621
  --cds-chat-button: #0f62fe;
20602
20622
  --cds-chat-button-active: rgba(141, 141, 141, 0.5);
@@ -20664,9 +20684,6 @@ em {
20664
20684
  --cds-shadow: rgba(0, 0, 0, 0.3);
20665
20685
  --cds-skeleton-background: #e8e8e8;
20666
20686
  --cds-skeleton-element: #c6c6c6;
20667
- --cds-slug-background: #525252;
20668
- --cds-slug-background-hover: #6f6f6f;
20669
- --cds-slug-hollow-hover: #474747;
20670
20687
  --cds-support-caution-major: #ff832b;
20671
20688
  --cds-support-caution-minor: #f1c21b;
20672
20689
  --cds-support-caution-undefined: #8a3ffc;
@@ -20777,21 +20794,22 @@ em {
20777
20794
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
20778
20795
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
20779
20796
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
20780
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
20781
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
20782
- --cds-ai-border-start: #4589ff;
20797
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
20798
+ --cds-ai-border-end: #4589ff;
20799
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
20783
20800
  --cds-ai-border-strong: #78a9ff;
20784
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
20785
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
20786
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
20787
- --cds-ai-popover-caret-bottom: #465060;
20788
- --cds-ai-popover-caret-bottom-background: #2d3f5c;
20789
- --cds-ai-popover-caret-bottom-background-actions: #253042;
20790
- --cds-ai-popover-caret-center: #456fb5;
20791
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
20792
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
20793
- --cds-ai-skeleton-background: #a6c8ff;
20794
- --cds-ai-skeleton-element-background: #002d9c;
20801
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
20802
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
20803
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
20804
+ --cds-ai-popover-background: #161616;
20805
+ --cds-ai-popover-caret-bottom: #4589ff;
20806
+ --cds-ai-popover-caret-bottom-background: #202d45;
20807
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
20808
+ --cds-ai-popover-caret-center: #4870b5;
20809
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
20810
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
20811
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
20812
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
20795
20813
  --cds-background: #262626;
20796
20814
  --cds-background-active: rgba(141, 141, 141, 0.4);
20797
20815
  --cds-background-brand: #0f62fe;
@@ -20820,7 +20838,7 @@ em {
20820
20838
  --cds-chat-avatar-bot: #8d8d8d;
20821
20839
  --cds-chat-avatar-user: #4589ff;
20822
20840
  --cds-chat-bubble-agent: #262626;
20823
- --cds-chat-bubble-agent-border: #525252;
20841
+ --cds-chat-bubble-border: #525252;
20824
20842
  --cds-chat-bubble-user: #393939;
20825
20843
  --cds-chat-button: #78a9ff;
20826
20844
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -20888,9 +20906,6 @@ em {
20888
20906
  --cds-shadow: rgba(0, 0, 0, 0.8);
20889
20907
  --cds-skeleton-background: #333333;
20890
20908
  --cds-skeleton-element: #525252;
20891
- --cds-slug-background: #c6c6c6;
20892
- --cds-slug-background-hover: #e0e0e0;
20893
- --cds-slug-hollow-hover: #b5b5b5;
20894
20909
  --cds-support-caution-major: #ff832b;
20895
20910
  --cds-support-caution-minor: #f1c21b;
20896
20911
  --cds-support-caution-undefined: #a56eff;
@@ -21000,21 +21015,22 @@ em {
21000
21015
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
21001
21016
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
21002
21017
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
21003
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
21004
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
21005
- --cds-ai-border-start: #4589ff;
21018
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
21019
+ --cds-ai-border-end: #4589ff;
21020
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
21006
21021
  --cds-ai-border-strong: #78a9ff;
21007
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
21008
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
21009
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
21010
- --cds-ai-popover-caret-bottom: #3d4655;
21011
- --cds-ai-popover-caret-bottom-background: #213250;
21012
- --cds-ai-popover-caret-bottom-background-actions: #192436;
21013
- --cds-ai-popover-caret-center: #3f68af;
21014
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
21015
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
21016
- --cds-ai-skeleton-background: #a6c8ff;
21017
- --cds-ai-skeleton-element-background: #002d9c;
21022
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
21023
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
21024
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
21025
+ --cds-ai-popover-background: #161616;
21026
+ --cds-ai-popover-caret-bottom: #4589ff;
21027
+ --cds-ai-popover-caret-bottom-background: #202d45;
21028
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
21029
+ --cds-ai-popover-caret-center: #4870b5;
21030
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
21031
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
21032
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
21033
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
21018
21034
  --cds-background: #161616;
21019
21035
  --cds-background-active: rgba(141, 141, 141, 0.4);
21020
21036
  --cds-background-brand: #0f62fe;
@@ -21043,7 +21059,7 @@ em {
21043
21059
  --cds-chat-avatar-bot: #8d8d8d;
21044
21060
  --cds-chat-avatar-user: #4589ff;
21045
21061
  --cds-chat-bubble-agent: #262626;
21046
- --cds-chat-bubble-agent-border: #525252;
21062
+ --cds-chat-bubble-border: #525252;
21047
21063
  --cds-chat-bubble-user: #393939;
21048
21064
  --cds-chat-button: #78a9ff;
21049
21065
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -21111,9 +21127,6 @@ em {
21111
21127
  --cds-shadow: rgba(0, 0, 0, 0.8);
21112
21128
  --cds-skeleton-background: #292929;
21113
21129
  --cds-skeleton-element: #393939;
21114
- --cds-slug-background: #c6c6c6;
21115
- --cds-slug-background-hover: #e0e0e0;
21116
- --cds-slug-hollow-hover: #b5b5b5;
21117
21130
  --cds-support-caution-major: #ff832b;
21118
21131
  --cds-support-caution-minor: #f1c21b;
21119
21132
  --cds-support-caution-undefined: #a56eff;
@@ -21521,10 +21534,13 @@ li.cds--accordion__item--disabled:last-of-type {
21521
21534
  }
21522
21535
 
21523
21536
  .cds--popover-container {
21524
- position: relative;
21525
21537
  display: inline-block;
21526
21538
  }
21527
21539
 
21540
+ .cds--popover-container:not(.cds--popover--auto-align) {
21541
+ position: relative;
21542
+ }
21543
+
21528
21544
  .cds--popover--high-contrast .cds--popover {
21529
21545
  --cds-popover-background-color: var(--cds-background-inverse, #393939);
21530
21546
  --cds-popover-text-color: var(--cds-text-inverse, #ffffff);
@@ -21596,7 +21612,8 @@ li.cds--accordion__item--disabled:last-of-type {
21596
21612
  display: block;
21597
21613
  }
21598
21614
 
21599
- .cds--popover-caret {
21615
+ .cds--popover-caret,
21616
+ .cds--popover--auto-align.cds--popover-caret {
21600
21617
  position: absolute;
21601
21618
  z-index: 6000;
21602
21619
  display: none;
@@ -21608,44 +21625,54 @@ li.cds--accordion__item--disabled:last-of-type {
21608
21625
  display: block;
21609
21626
  }
21610
21627
 
21628
+ .cds--popover--auto-align.cds--popover--caret.cds--popover--open > .cds--popover > .cds--popover-content > .cds--popover-caret {
21629
+ display: block;
21630
+ }
21631
+
21611
21632
  .cds--popover--tab-tip > .cds--popover > .cds--popover-caret {
21612
21633
  display: none;
21613
21634
  }
21614
21635
 
21615
- .cds--popover--bottom > .cds--popover > .cds--popover-content {
21636
+ .cds--popover--bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21616
21637
  inset-block-end: 0;
21617
21638
  inset-inline-start: 50%;
21618
21639
  transform: translate(-50%, calc(100% + var(--cds-popover-offset, 0rem)));
21619
21640
  }
21620
21641
 
21621
- [dir=rtl] .cds--popover--bottom > .cds--popover > .cds--popover-content {
21642
+ [dir=rtl] .cds--popover--bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21622
21643
  transform: translate(50%, calc(100% + var(--cds-popover-offset, 0rem)));
21623
21644
  }
21624
21645
 
21625
- .cds--popover--bottom-left > .cds--popover > .cds--popover-content {
21646
+ .cds--popover--bottom-left:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21647
+ .cds--popover--bottom-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21626
21648
  inset-block-end: 0;
21627
21649
  inset-inline-start: 0;
21628
21650
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(100% + var(--cds-popover-offset, 0rem)));
21629
21651
  }
21630
21652
 
21631
- [dir=rtl] .cds--popover--bottom-left > .cds--popover > .cds--popover-content {
21653
+ [dir=rtl] .cds--popover--bottom-left:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21654
+ [dir=rtl] .cds--popover--bottom-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21632
21655
  inset-inline-end: 0;
21633
21656
  inset-inline-start: initial;
21634
21657
  }
21635
21658
 
21636
- .cds--popover--bottom-right > .cds--popover > .cds--popover-content {
21659
+ .cds--popover--bottom-right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21660
+ .cds--popover--bottom-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21637
21661
  inset-block-end: 0;
21638
21662
  inset-inline-end: 0;
21639
21663
  transform: translate(var(--cds-popover-offset, 0rem), calc(100% + var(--cds-popover-offset, 0rem)));
21640
21664
  }
21641
21665
 
21642
- [dir=rtl] .cds--popover--bottom-right > .cds--popover > .cds--popover-content {
21666
+ [dir=rtl] .cds--popover--bottom-right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21667
+ [dir=rtl] .cds--popover--bottom-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21643
21668
  inset-inline-start: 0;
21644
21669
  }
21645
21670
 
21646
21671
  .cds--popover--bottom > .cds--popover > .cds--popover-content::before,
21647
21672
  .cds--popover--bottom-left > .cds--popover > .cds--popover-content::before,
21648
- .cds--popover--bottom-right > .cds--popover > .cds--popover-content::before {
21673
+ .cds--popover--bottom-start > .cds--popover > .cds--popover-content::before,
21674
+ .cds--popover--bottom-right > .cds--popover > .cds--popover-content::before,
21675
+ .cds--popover--bottom-end > .cds--popover > .cds--popover-content::before {
21649
21676
  block-size: var(--cds-popover-offset, 0rem);
21650
21677
  inset-block-start: 0;
21651
21678
  inset-inline-end: 0;
@@ -21655,7 +21682,9 @@ li.cds--accordion__item--disabled:last-of-type {
21655
21682
 
21656
21683
  .cds--popover--bottom > .cds--popover > .cds--popover-caret,
21657
21684
  .cds--popover--bottom-left > .cds--popover > .cds--popover-caret,
21658
- .cds--popover--bottom-right > .cds--popover > .cds--popover-caret {
21685
+ .cds--popover--bottom-start > .cds--popover > .cds--popover-caret,
21686
+ .cds--popover--bottom-right > .cds--popover > .cds--popover-caret,
21687
+ .cds--popover--bottom-end > .cds--popover > .cds--popover-caret {
21659
21688
  block-size: var(--cds-popover-caret-height, 0.375rem);
21660
21689
  clip-path: polygon(0% 100%, 50% 0%, 100% 100%);
21661
21690
  inline-size: var(--cds-popover-caret-width, 0.75rem);
@@ -21666,44 +21695,62 @@ li.cds--accordion__item--disabled:last-of-type {
21666
21695
 
21667
21696
  [dir=rtl] .cds--popover--bottom > .cds--popover > .cds--popover-caret,
21668
21697
  [dir=rtl] .cds--popover--bottom-left > .cds--popover > .cds--popover-caret,
21669
- [dir=rtl] .cds--popover--bottom-right > .cds--popover > .cds--popover-caret {
21698
+ [dir=rtl] .cds--popover--bottom-start > .cds--popover > .cds--popover-caret,
21699
+ [dir=rtl] .cds--popover--bottom-right > .cds--popover > .cds--popover-caret,
21700
+ [dir=rtl] .cds--popover--bottom-end > .cds--popover > .cds--popover-caret {
21670
21701
  transform: translate(50%, var(--cds-popover-offset, 0rem));
21671
21702
  }
21672
21703
 
21673
- .cds--popover--top > .cds--popover > .cds--popover-content {
21704
+ .cds--popover--bottom.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21705
+ .cds--popover--bottom-left.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21706
+ .cds--popover--bottom-start.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21707
+ .cds--popover--bottom-right.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21708
+ .cds--popover--bottom-end.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret {
21709
+ block-size: var(--cds-popover-caret-height, 0.375rem);
21710
+ clip-path: polygon(0% 100%, 50% 0%, 100% 100%);
21711
+ inline-size: var(--cds-popover-caret-width, 0.75rem);
21712
+ }
21713
+
21714
+ .cds--popover--top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21674
21715
  inset-block-start: 0;
21675
21716
  inset-inline-start: 50%;
21676
21717
  transform: translate(-50%, calc(-100% - var(--cds-popover-offset, 0rem)));
21677
21718
  }
21678
21719
 
21679
- [dir=rtl] .cds--popover--top > .cds--popover > .cds--popover-content {
21720
+ [dir=rtl] .cds--popover--top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21680
21721
  transform: translate(50%, calc(-100% - var(--cds-popover-offset, 0rem)));
21681
21722
  }
21682
21723
 
21683
- .cds--popover--top-left > .cds--popover > .cds--popover-content {
21724
+ .cds--popover--top-left:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21725
+ .cds--popover--top-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21684
21726
  inset-block-start: 0;
21685
21727
  inset-inline-start: 0;
21686
21728
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-100% - var(--cds-popover-offset, 0rem)));
21687
21729
  }
21688
21730
 
21689
- [dir=rtl] .cds--popover--top-left > .cds--popover > .cds--popover-content {
21731
+ [dir=rtl] .cds--popover--top-left:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21732
+ [dir=rtl] .cds--popover--top-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21690
21733
  inset-inline-end: 0;
21691
21734
  inset-inline-start: initial;
21692
21735
  }
21693
21736
 
21694
- .cds--popover--top-right > .cds--popover > .cds--popover-content {
21737
+ .cds--popover--top-right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21738
+ .cds--popover--top-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21695
21739
  inset-block-start: 0;
21696
21740
  inset-inline-end: 0;
21697
21741
  transform: translate(var(--cds-popover-offset, 0rem), calc(-100% - var(--cds-popover-offset, 0rem)));
21698
21742
  }
21699
21743
 
21700
- [dir=rtl] .cds--popover--top-right > .cds--popover > .cds--popover-content {
21744
+ [dir=rtl] .cds--popover--top-right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21745
+ [dir=rtl] .cds--popover--top-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21701
21746
  inset-inline-start: 0;
21702
21747
  }
21703
21748
 
21704
21749
  .cds--popover--top > .cds--popover > .cds--popover-content::before,
21705
21750
  .cds--popover--top-left > .cds--popover > .cds--popover-content::before,
21706
- .cds--popover--top-right > .cds--popover > .cds--popover-content::before {
21751
+ .cds--popover--top-start > .cds--popover > .cds--popover-content::before,
21752
+ .cds--popover--top-right > .cds--popover > .cds--popover-content::before,
21753
+ .cds--popover--top-end > .cds--popover > .cds--popover-content::before {
21707
21754
  block-size: var(--cds-popover-offset, 0rem);
21708
21755
  inset-block-end: 0;
21709
21756
  inset-inline-end: 0;
@@ -21713,7 +21760,9 @@ li.cds--accordion__item--disabled:last-of-type {
21713
21760
 
21714
21761
  .cds--popover--top > .cds--popover > .cds--popover-caret,
21715
21762
  .cds--popover--top-left > .cds--popover > .cds--popover-caret,
21716
- .cds--popover--top-right > .cds--popover > .cds--popover-caret {
21763
+ .cds--popover--top-start > .cds--popover > .cds--popover-caret,
21764
+ .cds--popover--top-right > .cds--popover > .cds--popover-caret,
21765
+ .cds--popover--top-end > .cds--popover > .cds--popover-caret {
21717
21766
  block-size: var(--cds-popover-caret-height, 0.375rem);
21718
21767
  clip-path: polygon(0% 0%, 50% 100%, 100% 0%);
21719
21768
  inline-size: var(--cds-popover-caret-width, 0.75rem);
@@ -21722,40 +21771,58 @@ li.cds--accordion__item--disabled:last-of-type {
21722
21771
  transform: translate(-50%, calc(-1 * var(--cds-popover-offset, 0rem)));
21723
21772
  }
21724
21773
 
21725
- [dir=rtl] .cds--popover--top > .cds--popover > .cds--popover-caret,
21726
- [dir=rtl] .cds--popover--top-left > .cds--popover > .cds--popover-caret,
21727
- [dir=rtl] .cds--popover--top-right > .cds--popover > .cds--popover-caret {
21774
+ [dir=rtl] .cds--popover--top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21775
+ [dir=rtl] .cds--popover--top-left:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21776
+ [dir=rtl] .cds--popover--top-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21777
+ [dir=rtl] .cds--popover--top-right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21778
+ [dir=rtl] .cds--popover--top-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret {
21728
21779
  transform: translate(50%, calc(-1 * var(--cds-popover-offset, 0rem)));
21729
21780
  }
21730
21781
 
21731
- .cds--popover--right > .cds--popover > .cds--popover-content {
21782
+ .cds--popover--top.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21783
+ .cds--popover--top-left.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21784
+ .cds--popover--top-start.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21785
+ .cds--popover--top-right.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21786
+ .cds--popover--top-end.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret {
21787
+ block-size: var(--cds-popover-caret-height, 0.375rem);
21788
+ clip-path: polygon(0% 0%, 50% 100%, 100% 0%);
21789
+ inline-size: var(--cds-popover-caret-width, 0.75rem);
21790
+ }
21791
+
21792
+ .cds--popover--right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21732
21793
  inset-block-start: 50%;
21733
21794
  inset-inline-start: 100%;
21734
21795
  transform: translate(var(--cds-popover-offset, 0rem), -50%);
21735
21796
  }
21736
21797
 
21737
- .cds--popover--right-top > .cds--popover > .cds--popover-content {
21798
+ .cds--popover--right-top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21799
+ .cds--popover--right-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21738
21800
  inset-block-start: 50%;
21739
21801
  inset-inline-start: 100%;
21740
21802
  transform: translate(var(--cds-popover-offset, 0rem), calc(0.5 * var(--cds-popover-offset, 0rem) * -1 - 16px));
21741
21803
  }
21742
21804
 
21743
- .cds--popover--right-bottom > .cds--popover > .cds--popover-content {
21805
+ .cds--popover--right-bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21806
+ .cds--popover--right-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21744
21807
  inset-block-end: 50%;
21745
21808
  inset-inline-start: 100%;
21746
21809
  transform: translate(var(--cds-popover-offset, 0rem), calc(0.5 * var(--cds-popover-offset, 0rem) + 16px));
21747
21810
  }
21748
21811
 
21749
- [dir=rtl] .cds--popover--right > .cds--popover > .cds--popover-content,
21750
- [dir=rtl] .cds--popover--right-bottom > .cds--popover > .cds--popover-content,
21751
- [dir=rtl] .cds--popover--right-top > .cds--popover > .cds--popover-content {
21812
+ [dir=rtl] .cds--popover--right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21813
+ [dir=rtl] .cds--popover--right-bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21814
+ [dir=rtl] .cds--popover--right-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21815
+ [dir=rtl] .cds--popover--right-top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21816
+ [dir=rtl] .cds--popover--right-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21752
21817
  inset-inline-end: 100%;
21753
21818
  inset-inline-start: initial;
21754
21819
  }
21755
21820
 
21756
21821
  .cds--popover--right > .cds--popover > .cds--popover-content::before,
21757
21822
  .cds--popover--right-top > .cds--popover > .cds--popover-content::before,
21758
- .cds--popover--right-bottom > .cds--popover > .cds--popover-content::before {
21823
+ .cds--popover--right-start > .cds--popover > .cds--popover-content::before,
21824
+ .cds--popover--right-bottom > .cds--popover > .cds--popover-content::before,
21825
+ .cds--popover--right-end > .cds--popover > .cds--popover-content::before {
21759
21826
  inline-size: var(--cds-popover-offset, 0rem);
21760
21827
  inset-block-end: 0;
21761
21828
  inset-block-start: 0;
@@ -21763,9 +21830,11 @@ li.cds--accordion__item--disabled:last-of-type {
21763
21830
  transform: translateX(-100%);
21764
21831
  }
21765
21832
 
21766
- .cds--popover--right > .cds--popover > .cds--popover-caret,
21767
- .cds--popover--right-top > .cds--popover > .cds--popover-caret,
21768
- .cds--popover--right-bottom > .cds--popover > .cds--popover-caret {
21833
+ .cds--popover--right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21834
+ .cds--popover--right-top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21835
+ .cds--popover--right-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21836
+ .cds--popover--right-bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21837
+ .cds--popover--right-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret {
21769
21838
  block-size: var(--cds-popover-caret-width, 0.75rem);
21770
21839
  clip-path: polygon(0% 50%, 100% 0%, 100% 100%);
21771
21840
  inline-size: var(--cds-popover-caret-height, 0.375rem);
@@ -21774,41 +21843,59 @@ li.cds--accordion__item--disabled:last-of-type {
21774
21843
  transform: translate(calc(var(--cds-popover-offset, 0rem) - 100%), -50%);
21775
21844
  }
21776
21845
 
21777
- [dir=rtl] .cds--popover--right > .cds--popover > .cds--popover-caret,
21778
- [dir=rtl] .cds--popover--right-top > .cds--popover > .cds--popover-caret,
21779
- [dir=rtl] .cds--popover--right-bottom > .cds--popover > .cds--popover-caret {
21846
+ [dir=rtl] .cds--popover--right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21847
+ [dir=rtl] .cds--popover--right-top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21848
+ [dir=rtl] .cds--popover--right-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21849
+ [dir=rtl] .cds--popover--right-bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21850
+ [dir=rtl] .cds--popover--right-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret {
21780
21851
  inset-inline-end: 100%;
21781
21852
  inset-inline-start: initial;
21782
21853
  }
21783
21854
 
21784
- .cds--popover--left > .cds--popover > .cds--popover-content {
21855
+ .cds--popover--right.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21856
+ .cds--popover--right-top.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21857
+ .cds--popover--right-start.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21858
+ .cds--popover--right-bottom.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21859
+ .cds--popover--right-end.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret {
21860
+ block-size: var(--cds-popover-caret-width, 0.75rem);
21861
+ clip-path: polygon(0% 50%, 100% 0%, 100% 100%);
21862
+ inline-size: var(--cds-popover-caret-height, 0.375rem);
21863
+ }
21864
+
21865
+ .cds--popover--left:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21785
21866
  inset-block-start: 50%;
21786
21867
  inset-inline-end: 100%;
21787
21868
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem) + 0.1px), -50%);
21788
21869
  }
21789
21870
 
21790
- .cds--popover--left-top > .cds--popover > .cds--popover-content {
21871
+ .cds--popover--left-top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21872
+ .cds--popover--left-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21791
21873
  inset-block-start: 50%;
21792
21874
  inset-inline-end: 100%;
21793
21875
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-0.5 * var(--cds-popover-offset, 0rem) - 16px));
21794
21876
  }
21795
21877
 
21796
- .cds--popover--left-bottom > .cds--popover > .cds--popover-content {
21878
+ .cds--popover--left-bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21879
+ .cds--popover--left-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21797
21880
  inset-block-end: 50%;
21798
21881
  inset-inline-end: 100%;
21799
21882
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(0.5 * var(--cds-popover-offset, 0rem) + 16px));
21800
21883
  }
21801
21884
 
21802
- [dir=rtl] .cds--popover--left > .cds--popover > .cds--popover-content,
21803
- [dir=rtl] .cds--popover--left-bottom > .cds--popover > .cds--popover-content,
21804
- [dir=rtl] .cds--popover--left-top > .cds--popover > .cds--popover-content {
21885
+ [dir=rtl] .cds--popover--left:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21886
+ [dir=rtl] .cds--popover--left-bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21887
+ [dir=rtl] .cds--popover--left-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21888
+ [dir=rtl] .cds--popover--left-top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
21889
+ [dir=rtl] .cds--popover--left-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
21805
21890
  inset-inline-end: initial;
21806
21891
  inset-inline-start: 100%;
21807
21892
  }
21808
21893
 
21809
21894
  .cds--popover--left > .cds--popover > .cds--popover-content::before,
21810
21895
  .cds--popover--left-top > .cds--popover > .cds--popover-content::before,
21811
- .cds--popover--left-bottom > .cds--popover > .cds--popover-content::before {
21896
+ .cds--popover--left-start > .cds--popover > .cds--popover-content::before,
21897
+ .cds--popover--left-bottom > .cds--popover > .cds--popover-content::before,
21898
+ .cds--popover--left-end > .cds--popover > .cds--popover-content::before {
21812
21899
  inline-size: var(--cds-popover-offset, 0rem);
21813
21900
  inset-block-end: 0;
21814
21901
  inset-block-start: 0;
@@ -21816,9 +21903,11 @@ li.cds--accordion__item--disabled:last-of-type {
21816
21903
  transform: translateX(100%);
21817
21904
  }
21818
21905
 
21819
- .cds--popover--left > .cds--popover > .cds--popover-caret,
21820
- .cds--popover--left-top > .cds--popover > .cds--popover-caret,
21821
- .cds--popover--left-bottom > .cds--popover > .cds--popover-caret {
21906
+ .cds--popover--left:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21907
+ .cds--popover--left-top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21908
+ .cds--popover--left-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21909
+ .cds--popover--left-bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21910
+ .cds--popover--left-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret {
21822
21911
  block-size: var(--cds-popover-caret-width, 0.75rem);
21823
21912
  clip-path: polygon(0% 0%, 100% 50%, 0% 100%);
21824
21913
  inline-size: var(--cds-popover-caret-height, 0.375rem);
@@ -21827,13 +21916,25 @@ li.cds--accordion__item--disabled:last-of-type {
21827
21916
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem) + 100%), -50%);
21828
21917
  }
21829
21918
 
21830
- [dir=rtl] .cds--popover--left > .cds--popover > .cds--popover-caret,
21831
- [dir=rtl] .cds--popover--left-top > .cds--popover > .cds--popover-caret,
21832
- [dir=rtl] .cds--popover--left-bottom > .cds--popover > .cds--popover-caret {
21919
+ [dir=rtl] .cds--popover--left:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21920
+ [dir=rtl] .cds--popover--left-top:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21921
+ [dir=rtl] .cds--popover--left-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21922
+ [dir=rtl] .cds--popover--left-bottom:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
21923
+ [dir=rtl] .cds--popover--left-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret {
21833
21924
  inset-inline-end: initial;
21834
21925
  inset-inline-start: 100%;
21835
21926
  }
21836
21927
 
21928
+ .cds--popover--left.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21929
+ .cds--popover--left-top.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21930
+ .cds--popover--left-start.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21931
+ .cds--popover--left-bottom.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret,
21932
+ .cds--popover--left-end.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret {
21933
+ block-size: var(--cds-popover-caret-width, 0.75rem);
21934
+ clip-path: polygon(0% 0%, 100% 50%, 0% 100%);
21935
+ inline-size: var(--cds-popover-caret-height, 0.375rem);
21936
+ }
21937
+
21837
21938
  .cds--popover--tab-tip > .cds--popover > .cds--popover-content {
21838
21939
  border-radius: 0;
21839
21940
  }
@@ -23078,10 +23179,10 @@ a.cds--overflow-menu-options__btn::before {
23078
23179
  }
23079
23180
  }
23080
23181
  .cds--link:visited {
23081
- color: var(--cds-link-visited-text-color, var(--cds-link-visited, #8a3ffc));
23182
+ color: var(--cds-link-text-color, var(--cds-link-primary, #0f62fe));
23082
23183
  }
23083
23184
  .cds--link:visited:hover {
23084
- color: var(--cds-link-visited-text-color, var(--cds-link-visited, #8a3ffc));
23185
+ color: var(--cds-link-hover-text-color, var(--cds-link-primary-hover, #0043ce));
23085
23186
  }
23086
23187
 
23087
23188
  .cds--link--disabled,
@@ -25151,7 +25252,7 @@ fieldset[disabled] .cds--form__helper-text {
25151
25252
  }
25152
25253
 
25153
25254
  .cds--text-input__field-wrapper--slug .cds--text-input:not(:has(~ .cds--slug--revert)) {
25154
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
25255
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
25155
25256
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
25156
25257
  padding-inline-end: 2.5rem;
25157
25258
  }
@@ -25483,29 +25584,30 @@ fieldset[disabled] .cds--form__helper-text {
25483
25584
  background-color: var(--cds-layer-hover);
25484
25585
  }
25485
25586
 
25486
- .cds--tag--disabled,
25587
+ .cds--tag--disabled:not(.cds--tag--operational),
25487
25588
  .cds--tag--filter.cds--tag--disabled,
25488
25589
  .cds--tag--interactive.cds--tag--disabled {
25489
25590
  background-color: var(--cds-layer);
25490
25591
  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
25491
25592
  box-shadow: none;
25593
+ outline: none;
25492
25594
  }
25493
- .cds--tag--disabled.cds--tag--operational,
25595
+ .cds--tag--disabled:not(.cds--tag--operational).cds--tag--operational,
25494
25596
  .cds--tag--filter.cds--tag--disabled.cds--tag--operational,
25495
25597
  .cds--tag--interactive.cds--tag--disabled.cds--tag--operational {
25496
25598
  border: 1px solid var(--cds-layer);
25497
25599
  }
25498
- .cds--tag--disabled.cds--tag--operational:hover,
25600
+ .cds--tag--disabled:not(.cds--tag--operational).cds--tag--operational:hover,
25499
25601
  .cds--tag--filter.cds--tag--disabled.cds--tag--operational:hover,
25500
25602
  .cds--tag--interactive.cds--tag--disabled.cds--tag--operational:hover {
25501
25603
  background-color: var(--cds-layer);
25502
25604
  }
25503
- .cds--tag--disabled .cds--tag__close-icon:hover,
25605
+ .cds--tag--disabled:not(.cds--tag--operational) .cds--tag__close-icon:hover,
25504
25606
  .cds--tag--filter.cds--tag--disabled .cds--tag__close-icon:hover,
25505
25607
  .cds--tag--interactive.cds--tag--disabled .cds--tag__close-icon:hover {
25506
25608
  background-color: var(--cds-layer);
25507
25609
  }
25508
- .cds--tag--disabled:hover,
25610
+ .cds--tag--disabled:not(.cds--tag--operational):hover,
25509
25611
  .cds--tag--filter.cds--tag--disabled:hover,
25510
25612
  .cds--tag--interactive.cds--tag--disabled:hover {
25511
25613
  cursor: not-allowed;
@@ -26528,7 +26630,7 @@ fieldset[disabled] .cds--form__helper-text {
26528
26630
  }
26529
26631
 
26530
26632
  .cds--list-box__wrapper--slug .cds--list-box:not(:has(.cds--slug--revert)) {
26531
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
26633
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
26532
26634
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
26533
26635
  }
26534
26636
 
@@ -26623,11 +26725,11 @@ fieldset[disabled] .cds--form__helper-text {
26623
26725
  }
26624
26726
 
26625
26727
  .cds--list-box__wrapper--slug:has(.cds--multi-select) .cds--list-box__menu-icon {
26626
- inset-inline-end: calc(0.75rem - 4px);
26728
+ inset-inline-end: 0.75rem;
26627
26729
  }
26628
26730
 
26629
26731
  .cds--list-box__wrapper--slug:has(.cds--dropdown) .cds--list-box__menu-icon {
26630
- inset-inline-end: calc(0.75rem - 4px);
26732
+ inset-inline-end: 0.75rem;
26631
26733
  }
26632
26734
 
26633
26735
  .cds--combo-box:hover {
@@ -26656,6 +26758,11 @@ fieldset[disabled] .cds--form__helper-text {
26656
26758
  }
26657
26759
  }
26658
26760
 
26761
+ .cds--list-box--expanded .cds--combo-box--input--focus.cds--text-input {
26762
+ outline-offset: -0.0625rem;
26763
+ outline-width: 0.0625rem;
26764
+ }
26765
+
26659
26766
  .cds--combo-box .cds--list-box__field,
26660
26767
  .cds--combo-box.cds--list-box[data-invalid] .cds--list-box__field,
26661
26768
  .cds--combo-box.cds--list-box--warning .cds--list-box__field,
@@ -27828,11 +27935,11 @@ fieldset[disabled] .cds--form__helper-text {
27828
27935
  color: var(--cds-text-primary, #161616);
27829
27936
  }
27830
27937
 
27831
- .cds--data-table tr:hover .cds--link {
27938
+ .cds--data-table tr + :not(.cds--popover-container):hover .cds--link {
27832
27939
  color: var(--cds-link-secondary, #0043ce);
27833
27940
  }
27834
27941
 
27835
- .cds--data-table tr:hover .cds--link--disabled {
27942
+ .cds--data-table tr + :not(.cds--popover-container):hover .cds--link--disabled {
27836
27943
  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
27837
27944
  }
27838
27945
 
@@ -28449,7 +28556,7 @@ tr.cds--data-table--selected:last-of-type td {
28449
28556
 
28450
28557
  tr.cds--data-table--slug-row,
28451
28558
  tr.cds--data-table--slug-row + .cds--expandable-row {
28452
- 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%);
28559
+ 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%);
28453
28560
  background-attachment: fixed;
28454
28561
  }
28455
28562
 
@@ -28473,17 +28580,17 @@ tr.cds--data-table--slug-row.cds--parent-row.cds--data-table--selected.cds--expa
28473
28580
 
28474
28581
  .cds--data-table tbody tr.cds--data-table--slug-row:hover,
28475
28582
  tr.cds--data-table--slug-row:hover + .cds--expandable-row[data-child-row],
28476
- tr.cds--expandable-row--hover + .cds--expandable-row[data-child-row]:hover,
28583
+ tr.cds--data-table--slug-row.cds--expandable-row--hover + .cds--expandable-row[data-child-row]:hover,
28477
28584
  tr.cds--expandable-row--hover.cds--data-table--slug-row,
28478
28585
  tr.cds--data-table--selected.cds--parent-row.cds--expandable-row--hover.cds--data-table--slug-row {
28479
- 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);
28586
+ 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);
28480
28587
  background-attachment: fixed;
28481
28588
  }
28482
28589
 
28483
28590
  tr.cds--parent-row.cds--data-table--selected.cds--data-table--slug-row,
28484
28591
  .cds--data-table--selected.cds--data-table--slug-row,
28485
28592
  tr.cds--data-table--selected.cds--data-table--slug-row + .cds--expandable-row {
28486
- 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);
28593
+ 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);
28487
28594
  background-attachment: fixed;
28488
28595
  }
28489
28596
 
@@ -28504,7 +28611,7 @@ tr.cds--parent-row.cds--data-table--slug-row.cds--expandable-row:hover td:first-
28504
28611
 
28505
28612
  .cds--data-table thead th.cds--table-sort__header--slug .cds--table-sort,
28506
28613
  .cds--data-table thead th:has(> .cds--table-header-label--slug) {
28507
- 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%);
28614
+ 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%);
28508
28615
  }
28509
28616
 
28510
28617
  .cds--table-column-slug .cds--slug {
@@ -28532,11 +28639,11 @@ th:has(.cds--table-header-label--slug) {
28532
28639
  }
28533
28640
 
28534
28641
  td.cds--table-cell--column-slug {
28535
- 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%);
28642
+ 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%);
28536
28643
  }
28537
28644
 
28538
28645
  tr.cds--parent-row:not(.cds--expandable-row):not(:first-of-type) td.cds--table-cell--column-slug {
28539
- border-block-start: 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%);
28646
+ border-block-start: 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%);
28540
28647
  }
28541
28648
 
28542
28649
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
@@ -29201,8 +29308,9 @@ tr.cds--parent-row:not(.cds--expandable-row):not(:first-of-type) td.cds--table-c
29201
29308
  background-color: var(--cds-field-hover);
29202
29309
  }
29203
29310
 
29311
+ .cds--toolbar-action[aria-expanded=true],
29204
29312
  .cds--toolbar-action:hover[aria-expanded=true] {
29205
- background-color: var(--cds-layer);
29313
+ background-color: var(--cds-layer-02, #ffffff);
29206
29314
  }
29207
29315
 
29208
29316
  .cds--toolbar-action[disabled] {
@@ -29247,6 +29355,11 @@ tr.cds--parent-row:not(.cds--expandable-row):not(:first-of-type) td.cds--table-c
29247
29355
  max-inline-size: 1rem;
29248
29356
  }
29249
29357
 
29358
+ .cds--toolbar-action__menu,
29359
+ .cds--toolbar-action__menu.cds--overflow-menu-options::after {
29360
+ background-color: var(--cds-layer-02, #ffffff);
29361
+ }
29362
+
29250
29363
  .cds--toolbar-search-container-persistent {
29251
29364
  position: relative;
29252
29365
  block-size: 3rem;
@@ -30952,6 +31065,7 @@ th .cds--table-sort__flex {
30952
31065
 
30953
31066
  .cds--date-picker__input:disabled ~ .cds--date-picker__icon {
30954
31067
  cursor: not-allowed;
31068
+ fill: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
30955
31069
  }
30956
31070
 
30957
31071
  .cds--date-picker--range > .cds--date-picker-container:first-child {
@@ -30971,7 +31085,7 @@ th .cds--table-sort__flex {
30971
31085
  }
30972
31086
 
30973
31087
  .cds--date-picker-input__wrapper--slug .cds--date-picker__input:not(:has(~ .cds--slug--revert)) {
30974
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
31088
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
30975
31089
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
30976
31090
  padding-inline-end: 4rem;
30977
31091
  }
@@ -31144,6 +31258,10 @@ th .cds--table-sort__flex {
31144
31258
  border-block-end-color: var(--cds-border-subtle);
31145
31259
  }
31146
31260
 
31261
+ .cds--dropdown--open .cds--list-box__field {
31262
+ outline: none;
31263
+ }
31264
+
31147
31265
  .cds--dropdown--invalid {
31148
31266
  outline: 2px solid var(--cds-support-error, #da1e28);
31149
31267
  outline-offset: -2px;
@@ -32242,13 +32360,17 @@ button.cds--dropdown-text:focus {
32242
32360
  }
32243
32361
  }
32244
32362
 
32363
+ .cds--list-box__wrapper--fluid.cds--list-box__wrapper--fluid--focus:has(.cds--list-box--expanded) {
32364
+ outline-width: 0.0625rem;
32365
+ }
32366
+
32245
32367
  .cds--list-box__wrapper--fluid .cds--list-box__field:focus {
32246
32368
  outline: none;
32247
32369
  outline-offset: 0;
32248
32370
  }
32249
32371
 
32250
- .cds--list-box__wrapper--fluid :not(.cds--list-box--up) .cds--list-box__menu {
32251
- inset-block-start: calc(100% + 0.0625rem);
32372
+ .cds--list-box__wrapper--fluid:not(.cds--list-box--up) .cds--list-box__menu {
32373
+ inset-block-start: 100%;
32252
32374
  }
32253
32375
 
32254
32376
  .cds--list-box__wrapper--fluid.cds--list-box__wrapper--fluid--invalid:not(.cds--list-box__wrapper--fluid--focus) {
@@ -32329,7 +32451,7 @@ button.cds--dropdown-text:focus {
32329
32451
  border-color: transparent;
32330
32452
  }
32331
32453
 
32332
- .cds--list-box__wrapper--fluid .cds--list-box--up .cds--list-box__menu {
32454
+ .cds--list-box__wrapper--fluid.cds--list-box--up .cds--list-box__menu {
32333
32455
  inset-block-end: 4rem;
32334
32456
  }
32335
32457
 
@@ -32444,6 +32566,10 @@ button.cds--dropdown-text:focus {
32444
32566
  inset-inline-end: 1rem;
32445
32567
  }
32446
32568
 
32569
+ .cds--list-box__wrapper--fluid :not(.cds--list-box--up) .cds--combo-box .cds--list-box__menu {
32570
+ inset-block-start: calc(100% + 0.0625rem);
32571
+ }
32572
+
32447
32573
  .cds--date-picker--fluid {
32448
32574
  display: inline-flex;
32449
32575
  background: var(--cds-field);
@@ -32719,7 +32845,7 @@ button.cds--dropdown-text:focus {
32719
32845
  }
32720
32846
 
32721
32847
  .cds--date-picker--fluid .cds--date-picker-input__wrapper--slug:not(:has(~ .cds--slug--revert)) {
32722
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
32848
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
32723
32849
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
32724
32850
  }
32725
32851
 
@@ -32805,6 +32931,12 @@ button.cds--dropdown-text:focus {
32805
32931
  }
32806
32932
  }
32807
32933
 
32934
+ .cds--multi-select.cds--list-box--expanded .cds--list-box__field--wrapper:has(button[aria-activedescendant]:not([aria-activedescendant=""])),
32935
+ .cds--multi-select--filterable.cds--list-box--expanded:has(input[aria-activedescendant]:not([aria-activedescendant=""])) {
32936
+ outline-offset: -0.0625rem;
32937
+ outline-width: 0.0625rem;
32938
+ }
32939
+
32808
32940
  .cds--multi-select--filterable.cds--multi-select--selected .cds--text-input,
32809
32941
  .cds--multi-select.cds--multi-select--selected .cds--list-box__field {
32810
32942
  padding-inline-start: 0;
@@ -32879,6 +33011,26 @@ button.cds--dropdown-text:focus {
32879
33011
  align-items: baseline;
32880
33012
  }
32881
33013
 
33014
+ .cds--list-box__wrapper--fluid.cds--multi-select--filterable__wrapper:not(.cds--list-box--up) .cds--list-box__menu {
33015
+ inset-block-start: calc(100% + 0.0625rem);
33016
+ }
33017
+
33018
+ .cds--number__controls:hover .cds--number__control-btn::after {
33019
+ display: none;
33020
+ }
33021
+
33022
+ .cds--number__input-wrapper--slug .cds--number__rule-divider {
33023
+ display: none;
33024
+ }
33025
+
33026
+ .cds--number__input-wrapper--slug .cds--number__control-btn:hover {
33027
+ box-shadow: 0 -1px 0 var(--cds-ai-border-strong, #4589ff) inset;
33028
+ }
33029
+
33030
+ .cds--number__controls:focus-within .cds--number__control-btn::after {
33031
+ display: none;
33032
+ }
33033
+
32882
33034
  .cds--number {
32883
33035
  position: relative;
32884
33036
  display: flex;
@@ -33040,7 +33192,6 @@ button.cds--dropdown-text:focus {
33040
33192
  align-items: center;
33041
33193
  justify-content: center;
33042
33194
  block-size: 100%;
33043
- border-block-end: 0.0625rem solid var(--cds-border-strong);
33044
33195
  color: var(--cds-icon-primary, #161616);
33045
33196
  }
33046
33197
  .cds--number__control-btn *,
@@ -33067,6 +33218,7 @@ button.cds--dropdown-text:focus {
33067
33218
  }
33068
33219
  .cds--number__control-btn:hover {
33069
33220
  background-color: var(--cds-field-hover);
33221
+ box-shadow: 0 -1px 0 var(--cds-border-strong) inset;
33070
33222
  color: var(--cds-icon-primary, #161616);
33071
33223
  cursor: pointer;
33072
33224
  }
@@ -33089,20 +33241,27 @@ button.cds--dropdown-text:focus {
33089
33241
  }
33090
33242
 
33091
33243
  .cds--number input[type=number]:focus ~ .cds--number__controls .cds--number__control-btn {
33092
- border-block-end-color: var(--cds-focus, #0f62fe);
33093
- box-shadow: inset 0 2px var(--cds-focus, #0f62fe), inset 0 -1px var(--cds-focus, #0f62fe);
33244
+ border-width: 2px 0;
33245
+ border-style: solid;
33246
+ border-color: var(--cds-focus, #0f62fe);
33247
+ box-shadow: none;
33248
+ outline-offset: -2px;
33094
33249
  }
33095
33250
 
33096
- .cds--number input[type=number]:focus ~ .cds--number__controls .cds--number__control-btn:last-of-type {
33097
- box-shadow: inset 0 2px var(--cds-focus, #0f62fe), inset 0 -1px var(--cds-focus, #0f62fe), inset -2px 0 var(--cds-focus, #0f62fe);
33251
+ .cds--number input[type=number]:focus ~ .cds--number__controls .cds--number__control-btn:last-of-type:hover {
33252
+ box-shadow: -4px 0 0 -2px var(--cds-focus, #0f62fe) inset;
33098
33253
  }
33099
33254
 
33100
33255
  .cds--number input[type=number][data-invalid]:not(:focus) ~ .cds--number__controls .cds--number__control-btn:last-of-type:hover {
33101
- box-shadow: inset 0 2px var(--cds-support-error, #da1e28), inset 0 -1px var(--cds-support-error, #da1e28), inset -2px 0 var(--cds-support-error, #da1e28);
33256
+ box-shadow: -4px 0 0 -2px var(--cds-support-error, #da1e28) inset;
33102
33257
  }
33103
33258
 
33104
33259
  .cds--number input[type=number][data-invalid]:not(:focus) ~ .cds--number__controls .cds--number__control-btn:hover {
33105
- box-shadow: inset 0 2px var(--cds-support-error, #da1e28), inset 0 -1px var(--cds-support-error, #da1e28);
33260
+ border-width: 2px 0;
33261
+ border-style: solid;
33262
+ border-color: var(--cds-support-error, #da1e28);
33263
+ box-shadow: none;
33264
+ outline-offset: -2px;
33106
33265
  }
33107
33266
 
33108
33267
  .cds--number input[type=number][data-invalid]:not(:focus) ~ .cds--number__controls .cds--number__control-btn:focus:hover {
@@ -33261,13 +33420,60 @@ button.cds--dropdown-text:focus {
33261
33420
  .cds--number__input-wrapper--slug .cds--slug {
33262
33421
  position: absolute;
33263
33422
  inset-block-start: 50%;
33264
- inset-inline-end: 5.5rem;
33423
+ inset-inline-end: 6rem;
33265
33424
  transform: translateY(-50%);
33266
33425
  }
33267
33426
 
33268
- .cds--number__input-wrapper--slug input[data-invalid] ~ .cds--slug,
33269
- .cds--number__input-wrapper--slug.cds--number__input-wrapper--warning .cds--slug {
33270
- inset-inline-end: 7.5rem;
33427
+ .cds--number__input-wrapper--slug .cds--slug::before,
33428
+ .cds--number__input-wrapper--slug .cds--number__control-btn::before,
33429
+ .cds--number__input-wrapper--slug .cds--number__control-btn::after {
33430
+ position: absolute;
33431
+ background-color: var(--cds-border-subtle);
33432
+ block-size: 1rem;
33433
+ content: "";
33434
+ inline-size: 0.0625rem;
33435
+ }
33436
+
33437
+ .cds--number__input-wrapper--slug .cds--slug::before {
33438
+ display: none;
33439
+ inset-inline-start: -1rem;
33440
+ }
33441
+
33442
+ .cds--number__control-btn::after {
33443
+ display: block;
33444
+ inset-inline-end: 0;
33445
+ }
33446
+
33447
+ .cds--number__input-wrapper--slug .cds--number__control-btn::before {
33448
+ display: block;
33449
+ inset-inline-end: 2.5rem;
33450
+ }
33451
+
33452
+ .cds--number__input-wrapper--slug .cds--number__control-btn:focus::before {
33453
+ display: none;
33454
+ }
33455
+
33456
+ .cds--number__control-btn:hover::after,
33457
+ .cds--number__control-btn:hover::before {
33458
+ display: none;
33459
+ inset-inline-end: 0;
33460
+ }
33461
+
33462
+ .cds--number__input-wrapper:has(.cds--number__control-btn:hover) ~ .cds--number__input-wrapper--slug::after {
33463
+ display: none;
33464
+ }
33465
+
33466
+ .cds--number__control-btn:has(.up-icon)::after,
33467
+ .cds--number__control-btn:has(.up-icon)::before {
33468
+ display: none;
33469
+ }
33470
+
33471
+ .cds--number__input-wrapper--slug .cds--number__invalid {
33472
+ inset-inline-end: 9rem;
33473
+ }
33474
+
33475
+ .cds--number__input-wrapper--slug:has(.cds--number__invalid) .cds--slug::before {
33476
+ display: block;
33271
33477
  }
33272
33478
 
33273
33479
  .cds--number .cds--number__input-wrapper--slug input[data-invalid],
@@ -33277,13 +33483,9 @@ button.cds--dropdown-text:focus {
33277
33483
 
33278
33484
  .cds--number__input-wrapper--slug input[type=number]:not(:has(~ .cds--slug--revert)),
33279
33485
  .cds--number__input-wrapper--slug input[type=number]:disabled {
33280
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
33281
- border-block-end-color: var(--cds-ai-border-strong, #4589ff);
33282
- padding-inline-end: 7rem;
33283
- }
33284
-
33285
- .cds--number__input-wrapper--slug input[type=number]:not([data-invalid]):not(:has(~ .cds--slug--revert)) ~ .cds--number__controls .cds--number__control-btn {
33486
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
33286
33487
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
33488
+ padding-inline-end: 9.0625rem;
33287
33489
  }
33288
33490
 
33289
33491
  .cds--number.cds--skeleton {
@@ -33538,7 +33740,7 @@ button.cds--dropdown-text:focus {
33538
33740
  }
33539
33741
 
33540
33742
  .cds--number-input--fluid .cds--number__input-wrapper--slug:not(:has(~ .cds--slug--revert)) {
33541
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
33743
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
33542
33744
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
33543
33745
  }
33544
33746
 
@@ -33901,24 +34103,47 @@ optgroup.cds--select-optgroup:disabled,
33901
34103
  .cds--select--slug .cds--slug {
33902
34104
  position: absolute;
33903
34105
  inset-block-start: 50%;
33904
- inset-inline-end: 2.5rem;
34106
+ inset-inline-end: calc(2.5rem + 8px + 1px);
34107
+ margin-block-start: 0.03125rem;
33905
34108
  transform: translateY(-50%);
33906
34109
  }
33907
34110
 
34111
+ .cds--select--slug .cds--slug::after,
34112
+ .cds--select--slug .cds--slug::before {
34113
+ position: absolute;
34114
+ background-color: var(--cds-border-subtle-01, #c6c6c6);
34115
+ block-size: 1rem;
34116
+ content: "";
34117
+ inline-size: 0.0625rem;
34118
+ }
34119
+
34120
+ .cds--select--slug .cds--slug::before {
34121
+ display: none;
34122
+ inset-inline-start: calc(-0.5rem - 1px);
34123
+ }
34124
+
34125
+ .cds--select--slug .cds--slug::after {
34126
+ display: block;
34127
+ inset-inline-end: calc(-0.5rem - 1px);
34128
+ }
34129
+
33908
34130
  .cds--select--slug .cds--select-input:not(:has(~ .cds--slug--revert)) {
33909
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
34131
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
33910
34132
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
33911
34133
  padding-inline-end: 4rem;
33912
34134
  }
33913
34135
 
33914
- .cds--select--slug.cds--select--invalid .cds--select-input,
33915
- .cds--select--slug.cds--select--warning .cds--select-input {
34136
+ .cds--select--slug:has(.cds--select__invalid-icon) .cds--select-input:not(:has(~ .cds--slug--revert)) {
33916
34137
  padding-inline-end: 6rem;
33917
34138
  }
33918
34139
 
33919
- .cds--select--slug.cds--select--invalid .cds--slug,
33920
- .cds--select--slug.cds--select--warning .cds--slug {
33921
- inset-inline-end: 4rem;
34140
+ .cds--select--slug:has(.cds--select__invalid-icon) .cds--slug::before {
34141
+ display: block;
34142
+ }
34143
+
34144
+ .cds--select--slug .cds--select-input__wrapper[data-invalid] .cds--select-input ~ .cds--select__invalid-icon,
34145
+ .cds--select--slug .cds--select-input__wrapper .cds--select-input ~ .cds--select__invalid-icon {
34146
+ inset-inline-end: 5rem;
33922
34147
  }
33923
34148
 
33924
34149
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
@@ -34205,7 +34430,7 @@ optgroup.cds--select-optgroup:disabled,
34205
34430
  }
34206
34431
 
34207
34432
  .cds--text-area__wrapper--slug .cds--text-area:not(:has(~ .cds--slug--revert)) {
34208
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
34433
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
34209
34434
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
34210
34435
  padding-inline-end: 2.5rem;
34211
34436
  }
@@ -34428,7 +34653,7 @@ optgroup.cds--select-optgroup:disabled,
34428
34653
  }
34429
34654
 
34430
34655
  .cds--text-area--fluid .cds--text-area__wrapper--slug:not(:has(~ .cds--slug--revert)) {
34431
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
34656
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
34432
34657
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
34433
34658
  }
34434
34659
 
@@ -35374,21 +35599,15 @@ optgroup.cds--select-optgroup:disabled,
35374
35599
  }
35375
35600
 
35376
35601
  .cds--modal--slug .cds--modal-container {
35377
- 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;
35602
+ 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;
35378
35603
  border: 1px solid transparent;
35379
35604
  background-color: var(--cds-layer);
35380
- 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));
35605
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), 0 24px 40px -24px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
35381
35606
  }
35382
35607
 
35383
35608
  .cds--modal--slug .cds--modal-container:has(.cds--modal-footer) {
35384
- background: linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)) calc(0% + 64px), var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) calc(0% + 64px), 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;
35385
- box-shadow: inset 0 -80px 0 -16px var(--cds-layer), inset 0 -160px 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));
35386
- }
35387
-
35388
- .cds--modal--slug .cds--slug {
35389
- position: absolute;
35390
- inset-block-start: 0;
35391
- inset-inline-end: 0;
35609
+ background: linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)) calc(0% + 64px), var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) calc(0% + 64px), 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;
35610
+ box-shadow: inset 0 -80px 0 -16px var(--cds-layer), inset 0 -160px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), 0 24px 40px -24px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
35392
35611
  }
35393
35612
 
35394
35613
  .cds--modal--slug .cds--modal-content.cds--modal-scroll-content {
@@ -35398,6 +35617,8 @@ optgroup.cds--select-optgroup:disabled,
35398
35617
  .cds--modal-header > .cds--slug:has(+ .cds--modal-close-button),
35399
35618
  .cds--modal-header > .cds--modal-close-button ~ .cds--slug,
35400
35619
  .cds--modal--slug .cds--modal-container-body > .cds--slug {
35620
+ position: absolute;
35621
+ inset-block-start: 0.625rem;
35401
35622
  inset-inline-end: 3rem;
35402
35623
  }
35403
35624
 
@@ -36263,6 +36484,12 @@ optgroup.cds--select-optgroup:disabled,
36263
36484
  opacity: 1;
36264
36485
  }
36265
36486
 
36487
+ .cds--actionable-notification--warning .cds--inline-notification__icon path[opacity="0"],
36488
+ .cds--actionable-notification--warning-alt .cds--inline-notification__icon path:first-of-type {
36489
+ fill: #000000;
36490
+ opacity: 1;
36491
+ }
36492
+
36266
36493
  .cds--actionable-notification__details {
36267
36494
  display: flex;
36268
36495
  flex-grow: 1;
@@ -38354,142 +38581,85 @@ span.cds--pagination__text.cds--pagination__items-count {
38354
38581
  display: flex;
38355
38582
  align-items: center;
38356
38583
  justify-content: center;
38357
- color: var(--cds-text-inverse, #ffffff);
38584
+ border: 1px solid var(--cds-border-inverse, #161616);
38585
+ background: transparent;
38586
+ color: var(--cds-text-primary, #161616);
38358
38587
  font-weight: 600;
38359
- transition: color 70ms cubic-bezier(0, 0, 0.38, 0.9), border-color 70ms cubic-bezier(0, 0, 0.38, 0.9), box-shadow 70ms cubic-bezier(0, 0, 0.38, 0.9);
38588
+ outline: none;
38589
+ transition: color 70ms cubic-bezier(0, 0, 0.38, 0.9), border-color 70ms cubic-bezier(0, 0, 0.38, 0.9), box-shadow 70ms cubic-bezier(0, 0, 0.38, 0.9), background 70ms cubic-bezier(0, 0, 0.38, 0.9);
38360
38590
  }
38361
38591
  .cds--slug .cds--slug__button--mini {
38362
38592
  height: 1rem;
38363
38593
  width: 1rem;
38364
38594
  font-size: 0.5625rem;
38365
38595
  line-height: 0.75rem;
38366
- background: var(--cds-slug-background, #525252);
38367
38596
  }
38368
38597
  .cds--slug .cds--slug__button--2xs {
38369
38598
  height: 1.25rem;
38370
38599
  width: 1.25rem;
38371
38600
  font-size: 0.75rem;
38372
38601
  line-height: 1rem;
38373
- background: var(--cds-slug-background, #525252);
38374
38602
  }
38375
38603
  .cds--slug .cds--slug__button--xs {
38376
38604
  height: 1.5rem;
38377
38605
  width: 1.5rem;
38378
38606
  font-size: 0.75rem;
38379
38607
  line-height: 1rem;
38380
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
38381
38608
  }
38382
38609
  .cds--slug .cds--slug__button--sm {
38383
38610
  height: 2rem;
38384
38611
  width: 2rem;
38385
38612
  font-size: 1rem;
38386
38613
  line-height: 1.3125rem;
38387
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
38388
38614
  }
38389
38615
  .cds--slug .cds--slug__button--md {
38390
38616
  height: 2.5rem;
38391
38617
  width: 2.5rem;
38392
38618
  font-size: 1rem;
38393
38619
  line-height: 1.3125rem;
38394
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
38395
38620
  }
38396
38621
  .cds--slug .cds--slug__button--lg {
38397
38622
  height: 3rem;
38398
38623
  width: 3rem;
38399
38624
  font-size: 1rem;
38400
38625
  line-height: 1.3125rem;
38401
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
38402
38626
  }
38403
38627
  .cds--slug .cds--slug__button--xl {
38404
38628
  height: 4rem;
38405
38629
  width: 4rem;
38406
38630
  font-size: 1.25rem;
38407
38631
  line-height: 1.625rem;
38408
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
38409
38632
  }
38410
38633
 
38411
38634
  .cds--slug .cds--slug__button:focus {
38412
- box-shadow: inset 0 0 0 2px var(--cds-focus, #0f62fe), inset 0 0 0 3px var(--cds-focus-inset, #ffffff);
38413
- outline: none;
38414
- }
38415
-
38416
- .cds--slug__text {
38417
- position: relative;
38418
- z-index: 1;
38419
- }
38420
-
38421
- .cds--slug__button::before {
38422
- position: absolute;
38423
- background: var(--cds-slug-gradient-hover, #161616 linear-gradient(135deg, #d1d1d1 0%, rgba(255, 255, 255, 0) 100%));
38424
- block-size: 100%;
38425
- content: "";
38426
- inline-size: 100%;
38427
- opacity: 0;
38428
- transition: opacity 70ms cubic-bezier(0, 0, 0.38, 0.9);
38429
- }
38430
-
38431
- .cds--slug__button.cds--slug__button--mini::after,
38432
- .cds--slug__button.cds--slug__button--2xs::after {
38433
- position: absolute;
38434
- block-size: 1.5rem;
38435
- content: "";
38436
- inline-size: 1.5rem;
38437
- opacity: 0;
38438
- }
38439
-
38440
- .cds--slug__button:hover::before {
38441
- opacity: 1;
38635
+ border: 1px solid var(--cds-focus, #0f62fe);
38636
+ box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
38442
38637
  }
38443
38638
 
38444
- .cds--slug .cds--slug__button:focus::before {
38445
- block-size: calc(100% - 6px);
38446
- inline-size: calc(100% - 6px);
38639
+ .cds--slug .cds--slug__button.cds--slug__button--mini:focus,
38640
+ .cds--slug .cds--slug__button.cds--slug__button--2xs:focus {
38641
+ box-shadow: none;
38447
38642
  }
38448
38643
 
38449
- .cds--slug__button.cds--slug__button--mini::before,
38450
- .cds--slug__button.cds--slug__button--2xs::before {
38451
- background: var(--cds-slug-background-hover, #6f6f6f);
38644
+ .cds--slug .cds--slug__button:hover {
38645
+ background: var(--cds-border-inverse, #161616);
38646
+ color: var(--cds-text-inverse, #ffffff);
38452
38647
  }
38453
38648
 
38454
- .cds--slug__button.cds--slug__button--mini:focus,
38455
- .cds--slug__button.cds--slug__button--2xs:focus {
38649
+ .cds--slug .cds--slug__button:hover:active {
38650
+ background: var(--cds-border-inverse, #161616);
38456
38651
  box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe), inset 0 0 0 2px var(--cds-focus-inset, #ffffff);
38652
+ color: var(--cds-text-inverse, #ffffff);
38457
38653
  }
38458
38654
 
38459
- .cds--slug__button.cds--slug__button--mini:focus::before,
38460
- .cds--slug__button.cds--slug__button--2xs:focus::before {
38461
- block-size: calc(100% - 4px);
38462
- inline-size: calc(100% - 4px);
38463
- }
38464
-
38465
- .cds--slug__button--hollow.cds--slug__button--sm,
38466
- .cds--slug__button--hollow.cds--slug__button--md,
38467
- .cds--slug__button--hollow.cds--slug__button--lg,
38468
- .cds--slug__button--hollow.cds--slug__button--xl {
38469
- block-size: 1.5rem;
38470
- font-size: 0.75rem;
38471
- inline-size: 1.5rem;
38472
- line-height: 1rem;
38473
- }
38474
-
38475
- .cds--slug__button--hollow::before {
38476
- display: none;
38477
- }
38478
-
38479
- .cds--slug .cds--slug__button--hollow {
38480
- border: 1px solid var(--cds-border-inverse, #161616);
38481
- background: transparent;
38482
- color: var(--cds-text-primary, #161616);
38483
- }
38484
-
38485
- .cds--slug__button--hollow:hover {
38486
- border-color: var(--cds-slug-hollow-hover, #474747);
38487
- color: var(--cds-slug-hollow-hover, #474747);
38655
+ .cds--slug .cds--slug__button.cds--slug__button--mini:hover:active,
38656
+ .cds--slug .cds--slug__button.cds--slug__button--2xs:hover:active {
38657
+ box-shadow: inset 0 0 0 1px var(--cds-focus-inset, #ffffff);
38488
38658
  }
38489
38659
 
38490
- .cds--slug__button--hollow:focus {
38491
- border-color: var(--cds-focus, #0f62fe);
38492
- box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
38660
+ .cds--slug__text {
38661
+ position: relative;
38662
+ z-index: 1;
38493
38663
  }
38494
38664
 
38495
38665
  .cds--slug .cds--slug__button--inline {
@@ -38513,8 +38683,11 @@ span.cds--pagination__text.cds--pagination__items-count {
38513
38683
  box-shadow: none;
38514
38684
  }
38515
38685
 
38516
- .cds--slug .cds--slug__button--inline:hover {
38686
+ .cds--slug .cds--slug__button--inline:hover,
38687
+ .cds--slug .cds--slug__button--inline:hover:active {
38517
38688
  border-color: var(--cds-icon-secondary, #525252);
38689
+ background: transparent;
38690
+ box-shadow: none;
38518
38691
  color: var(--cds-text-secondary, #525252);
38519
38692
  }
38520
38693
 
@@ -38526,16 +38699,12 @@ span.cds--pagination__text.cds--pagination__items-count {
38526
38699
  background: var(--cds-icon-secondary, #525252);
38527
38700
  }
38528
38701
 
38529
- .cds--slug--hollow .cds--slug__button--inline:hover .cds--slug__text::before {
38530
- background: transparent;
38531
- box-shadow: inset 0 0 0 1px var(--cds-icon-secondary, #525252);
38532
- }
38533
-
38534
38702
  .cds--slug__button--inline .cds--slug__text {
38535
38703
  padding-inline-start: 0.5rem;
38536
38704
  }
38537
38705
 
38538
- .cds--slug__button--inline.cds--slug__button--lg .cds--slug__text {
38706
+ .cds--slug__button--inline.cds--slug__button--lg .cds--slug__text,
38707
+ .cds--slug__button--inline.cds--slug__button--xl .cds--slug__text {
38539
38708
  padding-inline-start: 0.75rem;
38540
38709
  }
38541
38710
 
@@ -38553,20 +38722,8 @@ span.cds--pagination__text.cds--pagination__items-count {
38553
38722
  transition: background 70ms cubic-bezier(0, 0, 0.38, 0.9), box-shadow 70ms cubic-bezier(0, 0, 0.38, 0.9);
38554
38723
  }
38555
38724
 
38556
- .cds--slug--hollow .cds--slug__text::before {
38557
- background: transparent;
38558
- block-size: 0.375rem;
38559
- box-shadow: inset 0 0 0 1px var(--cds-icon-primary, #161616);
38560
- inline-size: 0.375rem;
38561
- }
38562
-
38563
- .cds--slug--hollow .cds--slug__button--sm .cds--slug__text,
38564
- .cds--slug--hollow .cds--slug__button--md .cds--slug__text {
38565
- padding-inline-start: 0.5625rem;
38566
- }
38567
-
38568
38725
  .cds--slug__button--lg .cds--slug__text::before,
38569
- .cds--slug--hollow .cds--slug__button--lg .cds--slug__text::before {
38726
+ .cds--slug__button--xl .cds--slug__text::before {
38570
38727
  block-size: 0.5rem;
38571
38728
  inline-size: 0.5rem;
38572
38729
  }
@@ -38605,43 +38762,69 @@ span.cds--pagination__text.cds--pagination__items-count {
38605
38762
  font-size: 0.875rem;
38606
38763
  }
38607
38764
 
38608
- .cds--slug .cds--slug__button--inline-with-content:focus {
38765
+ .cds--slug .cds--slug__button--inline-with-content:focus,
38766
+ .cds--slug .cds--slug__button--inline-with-content:hover:focus {
38609
38767
  box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
38610
38768
  }
38611
38769
 
38612
- .cds--slug.cds--slug--hollow .cds--toggletip-content {
38613
- row-gap: 0;
38614
- }
38615
-
38616
- .cds--slug.cds--slug--enabled .cds--slug-content {
38617
- 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;
38770
+ .cds--slug .cds--slug-content {
38771
+ 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;
38618
38772
  border: 1px solid transparent;
38619
38773
  border-radius: 0.5rem;
38620
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), -40px 30px 100px -25px var(--cds-ai-popover-shadow-outer-01, rgba(0, 67, 206, 0.25)), -60px 80px 60px -45px var(--cds-ai-popover-shadow-outer-02, rgba(0, 0, 0, 0.1));
38774
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), -40px 44px 60px -24px var(--cds-ai-popover-shadow-outer-01, rgba(0, 67, 206, 0.06)), -56px 64px 64px -24px var(--cds-ai-popover-shadow-outer-02, rgba(0, 0, 0, 0.04));
38621
38775
  color: var(--cds-text-primary, #161616);
38622
38776
  min-inline-size: 17.5rem;
38623
38777
  }
38624
38778
 
38625
- .cds--slug.cds--slug--enabled > .cds--toggletip > .cds--popover > .cds--popover-caret {
38779
+ .cds--slug > .cds--toggletip > .cds--popover > .cds--popover-caret,
38780
+ .cds--slug > .cds--toggletip.cds--popover--auto-align > .cds--popover > .cds--popover-content > .cds--popover-caret {
38626
38781
  background: transparent;
38627
38782
  clip-path: none;
38628
38783
  }
38629
38784
 
38630
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
38785
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
38631
38786
  .cds--popover--top-right,
38632
38787
  .cds--popover--top-left,
38788
+ .cds--popover--top-end,
38789
+ .cds--popover--top-start,
38633
38790
  .cds--popover--bottom,
38634
38791
  .cds--popover--bottom-right,
38635
38792
  .cds--popover--bottom-left,
38793
+ .cds--popover--bottom-start,
38794
+ .cds--popover--bottom-end,
38636
38795
  .cds--popover--left,
38637
38796
  .cds--popover--left-top,
38638
38797
  .cds--popover--left-bottom,
38798
+ .cds--popover--left-start,
38799
+ .cds--popover--left-end,
38639
38800
  .cds--popover--right,
38640
38801
  .cds--popover--right-top,
38641
- .cds--popover--right-bottom) > .cds--popover > .cds--popover-caret::before {
38802
+ .cds--popover--right-bottom,
38803
+ .cds--popover--right-start,
38804
+ .cds--popover--right-end) > .cds--popover > .cds--popover-caret::before,
38805
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--top,
38806
+ .cds--popover--top-right,
38807
+ .cds--popover--top-left,
38808
+ .cds--popover--top-end,
38809
+ .cds--popover--top-start,
38810
+ .cds--popover--bottom,
38811
+ .cds--popover--bottom-right,
38812
+ .cds--popover--bottom-left,
38813
+ .cds--popover--bottom-start,
38814
+ .cds--popover--bottom-end,
38815
+ .cds--popover--left,
38816
+ .cds--popover--left-top,
38817
+ .cds--popover--left-bottom,
38818
+ .cds--popover--left-start,
38819
+ .cds--popover--left-end,
38820
+ .cds--popover--right,
38821
+ .cds--popover--right-top,
38822
+ .cds--popover--right-bottom,
38823
+ .cds--popover--right-start,
38824
+ .cds--popover--right-end) > .cds--popover > .cds--popover-content > .cds--popover-caret::before {
38642
38825
  position: absolute;
38643
38826
  display: block;
38644
- border: 1px solid var(--cds-ai-border-start, #78a9ff);
38827
+ border: 1px solid var(--cds-ai-border-start, rgba(166, 200, 255, 0.64));
38645
38828
  background: var(--cds-background, #ffffff);
38646
38829
  block-size: 0.75rem;
38647
38830
  clip-path: polygon(98% 0, 0 0, -52% 150%) border-box;
@@ -38650,18 +38833,46 @@ span.cds--pagination__text.cds--pagination__items-count {
38650
38833
  transform: rotate(45deg);
38651
38834
  }
38652
38835
 
38653
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
38836
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
38837
+ .cds--popover--top-right,
38838
+ .cds--popover--top-left,
38839
+ .cds--popover--top-end,
38840
+ .cds--popover--top-start,
38841
+ .cds--popover--bottom,
38842
+ .cds--popover--bottom-right,
38843
+ .cds--popover--bottom-left,
38844
+ .cds--popover--bottom-start,
38845
+ .cds--popover--bottom-end,
38846
+ .cds--popover--left,
38847
+ .cds--popover--left-top,
38848
+ .cds--popover--left-bottom,
38849
+ .cds--popover--left-start,
38850
+ .cds--popover--left-end,
38851
+ .cds--popover--right,
38852
+ .cds--popover--right-top,
38853
+ .cds--popover--right-bottom,
38854
+ .cds--popover--right-start,
38855
+ .cds--popover--right-end) > .cds--popover > .cds--popover-caret::after,
38856
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--top,
38654
38857
  .cds--popover--top-right,
38655
38858
  .cds--popover--top-left,
38859
+ .cds--popover--top-end,
38860
+ .cds--popover--top-start,
38656
38861
  .cds--popover--bottom,
38657
38862
  .cds--popover--bottom-right,
38658
38863
  .cds--popover--bottom-left,
38864
+ .cds--popover--bottom-start,
38865
+ .cds--popover--bottom-end,
38659
38866
  .cds--popover--left,
38660
38867
  .cds--popover--left-top,
38661
38868
  .cds--popover--left-bottom,
38869
+ .cds--popover--left-start,
38870
+ .cds--popover--left-end,
38662
38871
  .cds--popover--right,
38663
38872
  .cds--popover--right-top,
38664
- .cds--popover--right-bottom) > .cds--popover > .cds--popover-caret::after {
38873
+ .cds--popover--right-bottom,
38874
+ .cds--popover--right-start,
38875
+ .cds--popover--right-end) > .cds--popover > .cds--popover-content > .cds--popover-caret::after {
38665
38876
  position: absolute;
38666
38877
  display: block;
38667
38878
  background: var(--cds-background, #ffffff);
@@ -38670,16 +38881,30 @@ span.cds--pagination__text.cds--pagination__items-count {
38670
38881
  inline-size: 0.125rem;
38671
38882
  }
38672
38883
 
38673
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
38884
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
38674
38885
  .cds--popover--top-right,
38675
- .cds--popover--top-left) > .cds--popover > .cds--popover-caret::before {
38886
+ .cds--popover--top-left,
38887
+ .cds--popover--top-end,
38888
+ .cds--popover--top-start) > .cds--popover > .cds--popover-caret::before,
38889
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--top,
38890
+ .cds--popover--top-right,
38891
+ .cds--popover--top-left,
38892
+ .cds--popover--top-end,
38893
+ .cds--popover--top-start) > .cds--popover > .cds--popover-content > .cds--popover-caret::before {
38676
38894
  inset-block-end: 0.0625rem;
38677
38895
  transform: rotate(-135deg);
38678
38896
  }
38679
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
38897
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
38680
38898
  .cds--popover--top-right,
38681
- .cds--popover--top-left) > .cds--popover > .cds--popover-caret::after {
38682
- background: var(--cds-ai-popover-caret-bottom-background, #d5e5ff);
38899
+ .cds--popover--top-left,
38900
+ .cds--popover--top-end,
38901
+ .cds--popover--top-start) > .cds--popover > .cds--popover-caret::after,
38902
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--top,
38903
+ .cds--popover--top-right,
38904
+ .cds--popover--top-left,
38905
+ .cds--popover--top-end,
38906
+ .cds--popover--top-start) > .cds--popover > .cds--popover-content > .cds--popover-caret::after {
38907
+ background: var(--cds-ai-popover-caret-bottom-background, #eaf1ff);
38683
38908
  block-size: 0.125rem;
38684
38909
  border-end-end-radius: 50%;
38685
38910
  border-end-start-radius: 50%;
@@ -38688,36 +38913,66 @@ span.cds--pagination__text.cds--pagination__items-count {
38688
38913
  inset-inline-start: -0.0625rem;
38689
38914
  }
38690
38915
 
38691
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
38916
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
38692
38917
  .cds--popover--top-right,
38693
- .cds--popover--top-left) > .cds--popover > .cds--slug-content--with-actions + .cds--popover-caret::after {
38918
+ .cds--popover--top-left,
38919
+ .cds--popover--top-end,
38920
+ .cds--popover--top-start) > .cds--popover > .cds--slug-content--with-actions + .cds--popover-caret::after {
38694
38921
  display: none;
38695
38922
  }
38696
38923
 
38697
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--right,
38924
+ .cds--slug > .cds--toggletip:is(.cds--popover--right,
38925
+ .cds--popover--right-bottom,
38926
+ .cds--popover--right-top,
38927
+ .cds--popover--right-start,
38928
+ .cds--popover--right-end) > .cds--popover > .cds--popover-caret::before,
38929
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--right,
38698
38930
  .cds--popover--right-bottom,
38699
- .cds--popover--right-top) > .cds--popover > .cds--popover-caret::before {
38931
+ .cds--popover--right-top,
38932
+ .cds--popover--right-start,
38933
+ .cds--popover--right-end) > .cds--popover > .cds--popover-content > .cds--popover-caret::before {
38700
38934
  inset-inline-start: 0.0625rem;
38701
38935
  transform: rotate(-45deg);
38702
38936
  }
38703
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--right,
38937
+ .cds--slug > .cds--toggletip:is(.cds--popover--right,
38938
+ .cds--popover--right-bottom,
38939
+ .cds--popover--right-top,
38940
+ .cds--popover--right-start,
38941
+ .cds--popover--right-end) > .cds--popover > .cds--popover-caret::after,
38942
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--right,
38704
38943
  .cds--popover--right-bottom,
38705
- .cds--popover--right-top) > .cds--popover > .cds--popover-caret::after {
38944
+ .cds--popover--right-top,
38945
+ .cds--popover--right-start,
38946
+ .cds--popover--right-end) > .cds--popover > .cds--popover-content > .cds--popover-caret::after {
38706
38947
  border-end-start-radius: 50%;
38707
38948
  border-start-start-radius: 50%;
38708
38949
  inset-block-start: -0.0625rem;
38709
38950
  inset-inline-start: 0.375rem;
38710
38951
  }
38711
38952
 
38712
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--bottom,
38953
+ .cds--slug > .cds--toggletip:is(.cds--popover--bottom,
38954
+ .cds--popover--bottom-left,
38955
+ .cds--popover--bottom-right,
38956
+ .cds--popover--bottom-start,
38957
+ .cds--popover--bottom-end) > .cds--popover > .cds--popover-caret::before,
38958
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--bottom,
38713
38959
  .cds--popover--bottom-left,
38714
- .cds--popover--bottom-right) > .cds--popover > .cds--popover-caret::before {
38960
+ .cds--popover--bottom-right,
38961
+ .cds--popover--bottom-start,
38962
+ .cds--popover--bottom-end) > .cds--popover > .cds--popover-content > .cds--popover-caret::before {
38715
38963
  inset-block-start: 0.0625rem;
38716
38964
  transform: rotate(45deg);
38717
38965
  }
38718
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--bottom,
38966
+ .cds--slug > .cds--toggletip:is(.cds--popover--bottom,
38967
+ .cds--popover--bottom-left,
38968
+ .cds--popover--bottom-right,
38969
+ .cds--popover--bottom-start,
38970
+ .cds--popover--bottom-end) > .cds--popover > .cds--popover-caret::after,
38971
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--bottom,
38719
38972
  .cds--popover--bottom-left,
38720
- .cds--popover--bottom-right) > .cds--popover > .cds--popover-caret::after {
38973
+ .cds--popover--bottom-right,
38974
+ .cds--popover--bottom-start,
38975
+ .cds--popover--bottom-end) > .cds--popover > .cds--popover-content > .cds--popover-caret::after {
38721
38976
  block-size: 0.125rem;
38722
38977
  border-start-end-radius: 50%;
38723
38978
  border-start-start-radius: 50%;
@@ -38726,59 +38981,107 @@ span.cds--pagination__text.cds--pagination__items-count {
38726
38981
  inset-inline-start: -0.0625rem;
38727
38982
  }
38728
38983
 
38729
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left,
38984
+ .cds--slug > .cds--toggletip:is(.cds--popover--left,
38985
+ .cds--popover--left-bottom,
38986
+ .cds--popover--left-top,
38987
+ .cds--popover--left-start,
38988
+ .cds--popover--left-end) > .cds--popover > .cds--popover-caret::before,
38989
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--left,
38730
38990
  .cds--popover--left-bottom,
38731
- .cds--popover--left-top) > .cds--popover > .cds--popover-caret::before {
38991
+ .cds--popover--left-top,
38992
+ .cds--popover--left-start,
38993
+ .cds--popover--left-end) > .cds--popover > .cds--popover-content > .cds--popover-caret::before {
38732
38994
  inset-inline-end: 0.0625rem;
38733
38995
  transform: rotate(135deg);
38734
38996
  }
38735
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left,
38997
+ .cds--slug > .cds--toggletip:is(.cds--popover--left,
38998
+ .cds--popover--left-bottom,
38999
+ .cds--popover--left-top,
39000
+ .cds--popover--left-start,
39001
+ .cds--popover--left-end) > .cds--popover > .cds--popover-caret::after,
39002
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--left,
38736
39003
  .cds--popover--left-bottom,
38737
- .cds--popover--left-top) > .cds--popover > .cds--popover-caret::after {
39004
+ .cds--popover--left-top,
39005
+ .cds--popover--left-start,
39006
+ .cds--popover--left-end) > .cds--popover > .cds--popover-content > .cds--popover-caret::after {
38738
39007
  border-end-end-radius: 50%;
38739
39008
  border-start-end-radius: 50%;
38740
39009
  inset-block-start: -0.0625rem;
38741
39010
  inset-inline-start: -0.125rem;
38742
39011
  }
38743
39012
 
38744
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left-bottom,
38745
- .cds--popover--right-bottom) > .cds--popover > .cds--popover-caret::after {
39013
+ .cds--slug > .cds--toggletip:is(.cds--popover--left-bottom,
39014
+ .cds--popover--right-bottom,
39015
+ .cds--popover--left-end,
39016
+ .cds--popover--right-end) > .cds--popover > .cds--popover-caret::after,
39017
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--left-bottom,
39018
+ .cds--popover--right-bottom,
39019
+ .cds--popover--left-end,
39020
+ .cds--popover--right-end) > .cds--popover > .cds--popover-content > .cds--popover-caret::after {
38746
39021
  background: transparent;
38747
39022
  }
38748
39023
 
38749
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left-bottom,
39024
+ .cds--slug > .cds--toggletip:is(.cds--popover--left-bottom,
39025
+ .cds--popover--right-bottom,
39026
+ .cds--popover--left-end,
39027
+ .cds--popover--right-end,
39028
+ .cds--popover--top,
39029
+ .cds--popover--top-right,
39030
+ .cds--popover--top-left,
39031
+ .cds--popover--top-end,
39032
+ .cds--popover--top-start) > .cds--popover > .cds--popover-caret::before,
39033
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--left-bottom,
38750
39034
  .cds--popover--right-bottom,
39035
+ .cds--popover--left-end,
39036
+ .cds--popover--right-end,
38751
39037
  .cds--popover--top,
38752
39038
  .cds--popover--top-right,
38753
- .cds--popover--top-left) > .cds--popover > .cds--popover-caret::before {
38754
- border-color: var(--cds-ai-popover-caret-bottom, #d0e2ff);
38755
- background: var(--cds-ai-popover-caret-bottom-background, #d5e5ff);
39039
+ .cds--popover--top-left,
39040
+ .cds--popover--top-end,
39041
+ .cds--popover--top-start) > .cds--popover > .cds--popover-content > .cds--popover-caret::before {
39042
+ border-color: var(--cds-ai-popover-caret-bottom, #78a9ff);
39043
+ background: var(--cds-ai-popover-caret-bottom-background, #eaf1ff);
38756
39044
  }
38757
39045
 
38758
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left-bottom,
39046
+ .cds--slug > .cds--toggletip:is(.cds--popover--left-bottom,
38759
39047
  .cds--popover--right-bottom,
39048
+ .cds--popover--left-end,
39049
+ .cds--popover--right-end,
38760
39050
  .cds--popover--top,
38761
39051
  .cds--popover--top-right,
38762
- .cds--popover--top-left) > .cds--popover:has(.cds--slug-content--with-actions) > .cds--popover-caret::before {
38763
- background: var(--cds-ai-popover-caret-bottom-background-actions, #dae5f8);
39052
+ .cds--popover--top-left,
39053
+ .cds--popover--top-end,
39054
+ .cds--popover--top-start) > .cds--popover:has(.cds--slug-content--with-actions) > .cds--popover-caret::before,
39055
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--left-bottom,
39056
+ .cds--popover--right-bottom,
39057
+ .cds--popover--left-end,
39058
+ .cds--popover--right-end,
39059
+ .cds--popover--top,
39060
+ .cds--popover--top-right,
39061
+ .cds--popover--top-left,
39062
+ .cds--popover--top-start,
39063
+ .cds--popover--top-end) > .cds--popover:has(.cds--slug-content--with-actions) > .cds--popover-content > .cds--popover-caret::before {
39064
+ background: var(--cds-ai-popover-caret-bottom-background-actions, #e9effa);
38764
39065
  }
38765
39066
 
38766
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left,
38767
- .cds--popover--right) > .cds--popover > .cds--popover-caret::before {
38768
- border-color: var(--cds-ai-popover-caret-center, #a7c7ff);
39067
+ .cds--slug > .cds--toggletip:is(.cds--popover--left,
39068
+ .cds--popover--right) > .cds--popover > .cds--popover-caret::before,
39069
+ .cds--slug > .cds--toggletip.cds--popover--auto-align:is(.cds--popover--left,
39070
+ .cds--popover--right) > .cds--popover > .cds--popover-content > .cds--popover-caret::before {
39071
+ border-color: var(--cds-ai-popover-caret-center, #a0c3ff);
38769
39072
  }
38770
39073
 
38771
- .cds--slug.cds--slug--enabled .cds--toggletip-content {
39074
+ .cds--slug .cds--toggletip-content {
38772
39075
  padding-block-end: 5rem;
38773
39076
  padding-block-start: 1.5rem;
38774
39077
  padding-inline: 1.5rem;
38775
39078
  }
38776
39079
 
38777
- .cds--slug.cds--slug--enabled .cds--slug-content .cds--toggletip-content {
39080
+ .cds--slug .cds--slug-content .cds--toggletip-content {
38778
39081
  max-inline-size: 20rem;
38779
39082
  }
38780
39083
 
38781
- .cds--slug.cds--slug--enabled .cds--slug-actions {
39084
+ .cds--slug .cds--slug-actions {
38782
39085
  position: absolute;
38783
39086
  justify-content: flex-end;
38784
39087
  backdrop-filter: blur(85px);
@@ -38791,12 +39094,12 @@ span.cds--pagination__text.cds--pagination__items-count {
38791
39094
  inset-inline-end: 0;
38792
39095
  }
38793
39096
 
38794
- .cds--slug.cds--slug--enabled .cds--slug-actions .cds--btn:focus {
39097
+ .cds--slug .cds--slug-actions .cds--btn:focus {
38795
39098
  border-color: var(--cds-focus, #0f62fe);
38796
39099
  box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe), inset 0 0 0 2px var(--cds-background, #ffffff);
38797
39100
  }
38798
39101
 
38799
- .cds--slug.cds--slug--enabled .cds--slug-actions .cds--btn--primary {
39102
+ .cds--slug .cds--slug-actions .cds--btn--primary {
38800
39103
  order: 1;
38801
39104
  border-end-end-radius: 0.4375rem;
38802
39105
  }
@@ -39049,7 +39352,6 @@ span.cds--pagination__text.cds--pagination__items-count {
39049
39352
 
39050
39353
  .cds--structured-list-svg {
39051
39354
  display: inline-block;
39052
- fill: transparent;
39053
39355
  transition: all 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
39054
39356
  vertical-align: top;
39055
39357
  }
@@ -39059,6 +39361,10 @@ span.cds--pagination__text.cds--pagination__items-count {
39059
39361
  fill: var(--cds-icon-primary, #161616);
39060
39362
  }
39061
39363
 
39364
+ .cds--structured-list-svg {
39365
+ fill: transparent;
39366
+ }
39367
+
39062
39368
  .cds--structured-list.cds--skeleton .cds--structured-list-th:first-child {
39063
39369
  inline-size: 8%;
39064
39370
  }
@@ -39345,43 +39651,125 @@ span.cds--pagination__text.cds--pagination__items-count {
39345
39651
  }
39346
39652
  .cds--tabs.cds--tabs--contained .cds--tabs__nav-item {
39347
39653
  background-color: var(--cds-layer-accent);
39348
- }
39349
- .cds--tabs.cds--tabs--contained .cds--tabs__nav-item + .cds--tabs__nav-item {
39350
39654
  box-shadow: -0.0625rem 0 0 0 var(--cds-border-strong);
39351
39655
  margin-inline-start: 0;
39352
39656
  }
39657
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--selected + div + .cds--tabs__nav-item {
39658
+ box-shadow: -0.0625rem 0 0 0 transparent;
39659
+ }
39353
39660
  .cds--tabs .cds--tabs__nav-item .cds--tabs__nav-link {
39354
39661
  transition: color 70ms cubic-bezier(0.2, 0, 0.38, 0.9), border-bottom-color 70ms cubic-bezier(0.2, 0, 0.38, 0.9), outline 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
39355
39662
  }
39356
- .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon:hover {
39357
- background-color: inherit;
39663
+ .cds--tabs.cds--tabs--dismissable .cds--tabs__nav-link {
39664
+ padding-inline-end: 2.5rem;
39358
39665
  }
39359
- .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon svg {
39360
- padding: 0.25rem;
39361
- margin: -0.25rem;
39362
- block-size: 24px;
39363
- inline-size: 24px;
39666
+ .cds--tabs.cds--tabs--dismissable.cds--tabs--contained .cds--tabs__nav-link {
39667
+ padding-inline-end: calc(3rem - 1px);
39364
39668
  }
39365
- .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon svg:hover {
39366
- background-color: var(--cds-layer-accent-hover);
39669
+ .cds--tabs .cds--tabs__nav-item--close {
39670
+ position: relative;
39671
+ display: flex;
39672
+ align-items: center;
39673
+ inset-inline-start: calc(-0.75rem - 1px);
39674
+ margin-inline-start: calc(-1.5rem + 1px);
39675
+ }
39676
+ .cds--tabs:not(.cds--tabs--contained) .cds--tabs__nav-item--close--hidden {
39677
+ position: absolute;
39678
+ overflow: hidden;
39679
+ padding: 0;
39680
+ border: 0;
39681
+ margin: -1px;
39682
+ block-size: 1px;
39683
+ clip: rect(0, 0, 0, 0);
39684
+ inline-size: 1px;
39685
+ visibility: inherit;
39686
+ white-space: nowrap;
39687
+ position: static;
39688
+ inline-size: 0.1875rem;
39689
+ }
39690
+ .cds--tabs.cds--tabs--contained.cds--tabs--full-width .cds--tabs__nav-item--close--hidden {
39691
+ display: none;
39692
+ }
39693
+ .cds--tabs .cds--tabs__nav-item--close-icon {
39694
+ box-sizing: border-box;
39695
+ padding: 0;
39696
+ border: 0;
39697
+ margin: 0;
39698
+ font-family: inherit;
39699
+ font-size: 100%;
39700
+ vertical-align: baseline;
39701
+ display: inline-block;
39702
+ padding: 0;
39703
+ border: 0;
39704
+ appearance: none;
39705
+ background: none;
39706
+ cursor: pointer;
39707
+ text-align: start;
39708
+ inline-size: 100%;
39709
+ block-size: 1.5rem;
39710
+ inline-size: 1.5rem;
39711
+ padding-block: 0.25rem;
39712
+ padding-inline: 0.25rem;
39713
+ pointer-events: auto;
39714
+ }
39715
+ .cds--tabs .cds--tabs__nav-item--close-icon *,
39716
+ .cds--tabs .cds--tabs__nav-item--close-icon *::before,
39717
+ .cds--tabs .cds--tabs__nav-item--close-icon *::after {
39718
+ box-sizing: inherit;
39719
+ }
39720
+ .cds--tabs .cds--tabs__nav-item--close-icon::-moz-focus-inner {
39721
+ border: 0;
39722
+ }
39723
+ .cds--tabs .cds--tabs__nav-item--close-icon svg {
39724
+ block-size: 1rem;
39725
+ fill: var(--cds-text-secondary, #525252);
39726
+ inline-size: 1rem;
39367
39727
  }
39368
- .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled).cds--tabs__nav-item--selected .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon svg:hover {
39728
+ .cds--tabs .cds--tabs__nav-item--close-icon svg:hover {
39729
+ fill: var(--cds-text-primary, #161616);
39730
+ }
39731
+ .cds--tabs .cds--tabs__nav-item--close-icon:hover {
39369
39732
  background-color: var(--cds-layer-hover);
39370
39733
  }
39371
- .cds--tabs .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon:hover {
39372
- background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
39734
+ .cds--tabs .cds--tabs__nav-item--close-icon:focus, .cds--tabs .cds--tabs__nav-item--close-icon:active {
39735
+ outline: 2px solid var(--cds-focus, #0f62fe);
39736
+ outline-offset: -2px;
39737
+ }
39738
+ @media screen and (prefers-contrast) {
39739
+ .cds--tabs .cds--tabs__nav-item--close-icon:focus, .cds--tabs .cds--tabs__nav-item--close-icon:active {
39740
+ outline-style: dotted;
39741
+ }
39742
+ }
39743
+ .cds--tabs .cds--tabs__nav-item:hover + .cds--tabs__nav-item--close .cds--tabs__nav-item--close-icon svg {
39744
+ fill: var(--cds-text-primary, #161616);
39745
+ }
39746
+ .cds--tabs .cds--tabs__nav-item--close-icon--selected svg {
39747
+ fill: var(--cds-text-primary, #161616);
39748
+ }
39749
+ .cds--tabs .cds--tabs__nav-item:hover + .cds--tabs__nav-item--close .cds--tabs__nav-item--close-icon--disabled,
39750
+ .cds--tabs .cds--tabs__nav-item--close-icon--disabled,
39751
+ .cds--tabs .cds--tabs__nav-item--close-icon--disabled:hover {
39752
+ background-color: inherit;
39753
+ cursor: not-allowed;
39754
+ }
39755
+ .cds--tabs .cds--tabs__nav-item:hover + .cds--tabs__nav-item--close .cds--tabs__nav-item--close-icon--disabled svg,
39756
+ .cds--tabs .cds--tabs__nav-item--close-icon--disabled svg,
39757
+ .cds--tabs .cds--tabs__nav-item--close-icon--disabled:hover svg {
39758
+ fill: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
39759
+ }
39760
+ .cds--tabs .cds--tabs__nav-item:hover + .cds--tabs__nav-item--close .cds--tabs__nav-item--close-icon--disabled:focus, .cds--tabs .cds--tabs__nav-item:hover + .cds--tabs__nav-item--close .cds--tabs__nav-item--close-icon--disabled:active,
39761
+ .cds--tabs .cds--tabs__nav-item--close-icon--disabled:focus,
39762
+ .cds--tabs .cds--tabs__nav-item--close-icon--disabled:active,
39763
+ .cds--tabs .cds--tabs__nav-item--close-icon--disabled:hover:focus,
39764
+ .cds--tabs .cds--tabs__nav-item--close-icon--disabled:hover:active {
39765
+ outline: 2px solid transparent;
39766
+ outline-offset: -2px;
39373
39767
  }
39374
39768
  .cds--tabs .cds--tabs__nav-item--icon {
39375
39769
  display: flex;
39376
39770
  align-items: center;
39377
39771
  padding-inline-start: 0.5rem;
39378
39772
  }
39379
- .cds--tabs .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon {
39380
- padding: 0.25rem;
39381
- margin: -0.25rem;
39382
- line-height: 0;
39383
- pointer-events: auto;
39384
- }
39385
39773
  .cds--tabs .cds--tabs__nav-item--icon-left {
39386
39774
  display: flex;
39387
39775
  align-items: center;
@@ -40009,13 +40397,13 @@ span.cds--pagination__text.cds--pagination__items-count {
40009
40397
  }
40010
40398
 
40011
40399
  .cds--tile--slug.cds--tile {
40012
- 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;
40400
+ 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;
40013
40401
  border: 1px solid transparent;
40014
- 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));
40402
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), 0 24px 40px -24px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
40015
40403
  }
40016
40404
 
40017
40405
  .cds--tile--slug.cds--tile--expandable:hover {
40018
- 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;
40406
+ 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;
40019
40407
  }
40020
40408
 
40021
40409
  .cds--tile--slug.cds--tile--selectable::before,
@@ -40034,8 +40422,8 @@ span.cds--pagination__text.cds--pagination__items-count {
40034
40422
 
40035
40423
  .cds--tile--slug.cds--tile--selectable::before,
40036
40424
  .cds--tile--slug.cds--tile--clickable::before {
40037
- 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;
40038
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
40425
+ 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;
40426
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
40039
40427
  }
40040
40428
 
40041
40429
  .cds--tile--slug.cds--tile--selectable:hover::before,
@@ -40045,7 +40433,7 @@ span.cds--pagination__text.cds--pagination__items-count {
40045
40433
 
40046
40434
  .cds--tile--slug.cds--tile--selectable::after {
40047
40435
  background: linear-gradient(to top, 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-layer)) padding-box, linear-gradient(to bottom, var(--cds-border-inverse, #161616), var(--cds-border-inverse, #161616)) border-box, linear-gradient(to top, var(--cds-layer), var(--cds-layer)) border-box;
40048
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
40436
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
40049
40437
  }
40050
40438
 
40051
40439
  .cds--tile--slug.cds--tile--selectable:hover::after {
@@ -40662,7 +41050,8 @@ span.cds--pagination__text.cds--pagination__items-count {
40662
41050
  will-change: margin-left;
40663
41051
  }
40664
41052
 
40665
- .cds--header ~ .cds--content {
41053
+ .cds--header ~ .cds--content,
41054
+ div:has(.cds--header) ~ .cds--content {
40666
41055
  margin-block-start: 3rem;
40667
41056
  }
40668
41057
 
@@ -41114,8 +41503,8 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
41114
41503
  inset-block-start: 0;
41115
41504
  inset-inline-start: 0;
41116
41505
  max-inline-size: 16rem;
41117
- transition: width 0.11s cubic-bezier(0.2, 0, 1, 0.9);
41118
- will-change: width;
41506
+ transition: inline-size 0.11s cubic-bezier(0.2, 0, 1, 0.9), transform 0.11s cubic-bezier(0.2, 0, 1, 0.9);
41507
+ will-change: inline-size;
41119
41508
  }
41120
41509
 
41121
41510
  .cds--side-nav--ux {
@@ -41678,7 +42067,8 @@ a.cds--side-nav__link--current::before {
41678
42067
  will-change: margin-left;
41679
42068
  }
41680
42069
 
41681
- .cds--header ~ .cds--content {
42070
+ .cds--header ~ .cds--content,
42071
+ div:has(.cds--header) ~ .cds--content {
41682
42072
  margin-block-start: 3rem;
41683
42073
  }
41684
42074
 
@@ -42130,8 +42520,8 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
42130
42520
  inset-block-start: 0;
42131
42521
  inset-inline-start: 0;
42132
42522
  max-inline-size: 16rem;
42133
- transition: width 0.11s cubic-bezier(0.2, 0, 1, 0.9);
42134
- will-change: width;
42523
+ transition: inline-size 0.11s cubic-bezier(0.2, 0, 1, 0.9), transform 0.11s cubic-bezier(0.2, 0, 1, 0.9);
42524
+ will-change: inline-size;
42135
42525
  }
42136
42526
 
42137
42527
  .cds--side-nav--ux {