@carbon/ibm-products 2.35.0 → 2.36.0

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