@carbon/ibm-products-styles 2.61.0 → 2.62.0-rc.0

package/css/index-full-carbon.css

@@ -3775,6 +3775,7 @@ p.c4p--about-modal__copyright-text:first-child {
   letter-spacing: var(--cds-heading-04-letter-spacing, 0);
 }
 .c4p--tearsheet .c4p--tearsheet__header-description {
+  display: inline-flex;
   margin-block-start: 1rem;
   max-inline-size: 100%;
   font-size: var(--cds-body-compact-01-font-size, 0.875rem);
@@ -3787,24 +3788,6 @@ p.c4p--about-modal__copyright-text:first-child {
     max-inline-size: 60%;
   }
 }
-.c4p--tearsheet .c4p--tearsheet__description-tooltip .cds--definition-term {
-  border-block-end: 0;
-  letter-spacing: inherit;
-  word-break: break-word;
-}
-.c4p--tearsheet .c4p--tearsheet__description-tooltip {
-  display: inline-flex;
-}
-.c4p--tearsheet .c4p--tearsheet__description-tooltip .cds--popover-content.cds--definition-tooltip {
-  max-inline-size: fit-content;
-}
-.c4p--tearsheet .c4p--tearsheet__description-text {
-  display: -webkit-box;
-  overflow: hidden;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-  line-clamp: 2;
-}
 .c4p--tearsheet.c4p--tearsheet--narrow .c4p--tearsheet__header-description {
   margin-block-start: 0.5rem;
 }
@@ -5182,7 +5165,7 @@ button.c4p--add-select__global-filter-toggle--open {
 .c4p--notifications-panel__container .c4p--notifications-panel__header-container {
   position: sticky;
   z-index: 2;
-  padding: 0.5rem 1rem 1rem;
+  padding: 0.5rem 1rem;
   background-color: var(--cds-layer-01, #f4f4f4);
   border-block-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
   inset-block-start: 0;
@@ -5192,6 +5175,9 @@ button.c4p--add-select__global-filter-toggle--open {
   align-items: center;
   justify-content: space-between;
 }
+.c4p--notifications-panel__container .c4p--notifications-panel__header-container .c4p--notifications-panel__do-not-disturb-toggle {
+  padding-block-end: 0.5rem;
+}
 .c4p--notifications-panel__container .c4p--notifications-panel__header-container .c4p--notifications-panel__do-not-disturb-toggle .cds--toggle__label-text {
   position: absolute;
   overflow: hidden;
@@ -5225,7 +5211,7 @@ button.c4p--add-select__global-filter-toggle--open {
   padding: 0.5rem 1rem;
   background-color: var(--cds-layer-01, #f4f4f4);
   color: var(--cds-text-secondary, #525252);
-  inset-block-start: 4.8125rem;
+  inset-block-start: 3.0625rem;
 }
 .c4p--notifications-panel__container .c4p--notifications-panel__notification:hover,
 .c4p--notifications-panel__container .c4p--notifications-panel__notification:focus {
@@ -5431,6 +5417,10 @@ button.c4p--add-select__global-filter-toggle--open {
   margin: 0;
 }
 
+.c4p--notifications-panel__header-container:has(.c4p--notifications-panel__do-not-disturb-toggle) + .c4p--notifications-panel__main-section .c4p--notifications-panel__time-section-label {
+  inset-block-start: 4.8125rem;
+}
+
 .cds--grid {
   margin-inline: auto;
   max-inline-size: 99rem;
@@ -11064,6 +11054,10 @@ button.c4p--add-select__global-filter-toggle--open {
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
+.c4p--datagrid__sortableColumn {
+  /* stylelint-disable-next-line declaration-no-important */
+  padding-inline: 1rem !important;
+}
 .c4p--datagrid__sortableColumn .cds--table-header-label .header-title {
   display: inline-block;
   inline-size: auto;
@@ -15937,7 +15931,21 @@ th.c4p--datagrid__select-all-toggle-on.button {
 
 .c4p--string-formatter {
   display: inline-block;
-  text-align: start;
+}
+.c4p--string-formatter--truncate {
+  display: -webkit-box;
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+  line-height: inherit;
+  text-overflow: ellipsis;
+  word-break: break-word;
+}
+.c4p--string-formatter button.cds--definition-term {
+  border-block-end: none;
+  letter-spacing: inherit;
+}
+.c4p--string-formatter .cds--popover-container {
+  display: flex;
 }
 
 .c4p--string-formatter--content {
@@ -15950,7 +15958,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
   overflow: hidden;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 1;
-  max-inline-size: 80ch;
 }
 
 .c4p--string-formatter__tooltip > button {
@@ -19288,7 +19295,9 @@ em {
   --cds-tag-hover-warm-gray: #d8d0cf;
   --cds-status-red: #da1e28;
   --cds-status-orange: #ff832b;
+  --cds-status-orange-outline: #ba4e00;
   --cds-status-yellow: #f1c21b;
+  --cds-status-yellow-outline: #8e6a00;
   --cds-status-green: #24a148;
   --cds-status-blue: #0043ce;
   --cds-status-purple: #8a3ffc;
@@ -19518,7 +19527,9 @@ em {
   --cds-tag-hover-warm-gray: #d8d0cf;
   --cds-status-red: #da1e28;
   --cds-status-orange: #ff832b;
+  --cds-status-orange-outline: #ba4e00;
   --cds-status-yellow: #f1c21b;
+  --cds-status-yellow-outline: #8e6a00;
   --cds-status-green: #24a148;
   --cds-status-blue: #0043ce;
   --cds-status-purple: #8a3ffc;
@@ -19747,7 +19758,9 @@ em {
   --cds-tag-hover-warm-gray: #696363;
   --cds-status-red: #fa4d56;
   --cds-status-orange: #ff832b;
+  --cds-status-orange-outline: #ff832b;
   --cds-status-yellow: #f1c21b;
+  --cds-status-yellow-outline: #f1c21b;
   --cds-status-green: #42be65;
   --cds-status-blue: #4589ff;
   --cds-status-purple: #a56eff;
@@ -19976,7 +19989,9 @@ em {
   --cds-tag-hover-warm-gray: #696363;
   --cds-status-red: #fa4d56;
   --cds-status-orange: #ff832b;
+  --cds-status-orange-outline: #ff832b;
   --cds-status-yellow: #f1c21b;
+  --cds-status-yellow-outline: #f1c21b;
   --cds-status-green: #42be65;
   --cds-status-blue: #4589ff;
   --cds-status-purple: #a56eff;
@@ -20442,6 +20457,27 @@ li.cds--accordion__item--disabled:last-of-type {
   transform: translate(var(--cds-popover-offset, 0rem), calc(100% + var(--cds-popover-offset, 0rem)));
 }
 
+.cds--popover--bottom-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret,
+.cds--popover--top-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret {
+  inset-block-end: 0;
+  inset-inline-end: 0;
+  inset-inline-start: auto;
+}
+
+.cds--popover--bottom-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret {
+  inset-block-end: 0;
+  inset-inline-end: auto;
+  inset-inline-start: 0;
+  transform: translate(50%, calc(var(--cds-popover-offset, 0rem)));
+}
+
+.cds--popover--top-start:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-caret {
+  inset-block-end: 0;
+  inset-inline-end: auto;
+  inset-inline-start: 0;
+  transform: translate(50%, calc(-1 * var(--cds-popover-offset, 0rem)));
+}
+
 [dir=rtl] .cds--popover--bottom-right:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content,
 [dir=rtl] .cds--popover--bottom-end:not(.cds--popover--auto-align) > .cds--popover > .cds--popover-content {
   inset-inline-start: 0;
@@ -20791,7 +20827,6 @@ li.cds--accordion__item--disabled:last-of-type {
   line-height: var(--cds-body-01-line-height, 1.42857);
   letter-spacing: var(--cds-body-01-letter-spacing, 0.16px);
   padding: var(--cds-tooltip-padding-block, 1rem) var(--cds-tooltip-padding-inline, 1rem);
-  color: var(--cds-text-inverse, #ffffff);
   max-inline-size: 18rem;
 }
 
@@ -20859,6 +20894,8 @@ li.cds--accordion__item--disabled:last-of-type {
   letter-spacing: var(--cds-body-01-letter-spacing, 0.16px);
   padding: 0.5rem 1rem;
   max-inline-size: 11rem;
+  text-wrap: auto;
+  word-break: break-word;
 }
 
 .cds--btn {
@@ -21015,7 +21052,7 @@ li.cds--accordion__item--disabled:last-of-type {
 }
 .cds--btn--tertiary:disabled, .cds--btn--tertiary:hover:disabled, .cds--btn--tertiary:focus:disabled, .cds--btn--tertiary.cds--btn--disabled, .cds--btn--tertiary.cds--btn--disabled:hover, .cds--btn--tertiary.cds--btn--disabled:focus {
   background: transparent;
-  color: var(--cds-text-on-color-disabled, #8d8d8d);
+  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
   outline: none;
 }
 
@@ -21055,7 +21092,7 @@ li.cds--accordion__item--disabled:last-of-type {
 .cds--btn--ghost:disabled, .cds--btn--ghost:hover:disabled, .cds--btn--ghost:focus:disabled, .cds--btn--ghost.cds--btn--disabled, .cds--btn--ghost.cds--btn--disabled:hover, .cds--btn--ghost.cds--btn--disabled:focus {
   border-color: transparent;
   background: transparent;
-  color: var(--cds-text-on-color-disabled, #8d8d8d);
+  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
   outline: none;
 }
 .cds--btn--ghost:not([disabled]) svg {
@@ -21178,7 +21215,7 @@ li.cds--accordion__item--disabled:last-of-type {
 }
 .cds--btn--danger--tertiary:disabled, .cds--btn--danger--tertiary:hover:disabled, .cds--btn--danger--tertiary:focus:disabled, .cds--btn--danger--tertiary.cds--btn--disabled, .cds--btn--danger--tertiary.cds--btn--disabled:hover, .cds--btn--danger--tertiary.cds--btn--disabled:focus {
   background: transparent;
-  color: var(--cds-text-on-color-disabled, #8d8d8d);
+  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
   outline: none;
 }
 .cds--btn--danger--ghost {
@@ -21319,6 +21356,11 @@ li.cds--accordion__item--disabled:last-of-type {
   box-shadow: none;
 }
 
+.cds--btn--sm .cds--badge-indicator {
+  margin-block-start: 0.25rem;
+  margin-inline-end: 0.25rem;
+}
+
 @media screen and (-ms-high-contrast: active), (forced-colors: active) {
   .cds--btn:focus {
     color: Highlight;
@@ -22302,6 +22344,30 @@ li.cds--accordion__item--disabled:last-of-type {
   padding-block-start: 100%;
 }
 
+.cds--badge-indicator {
+  font-size: var(--cds-helper-text-01-font-size, 0.75rem);
+  line-height: var(--cds-helper-text-01-line-height, 1.33333);
+  letter-spacing: var(--cds-helper-text-01-letter-spacing, 0.32px);
+  position: absolute;
+  display: flex;
+  padding: 0 0.25rem 0.125rem;
+  border-radius: 100px;
+  background: var(--cds-support-error, #da1e28);
+  color: var(--cds-text-on-color, #ffffff);
+  inset-block-start: 0;
+  inset-inline-end: 0;
+  margin-block-start: 0.5rem;
+  margin-inline-end: 0.5rem;
+  max-block-size: 1rem;
+  min-block-size: 0.5rem;
+  min-inline-size: 0.5rem;
+}
+
+.cds--badge-indicator--count {
+  margin-block-start: 0.25rem;
+  margin-inline-end: 0.25rem;
+}
+
 .cds--overflow-menu,
 .cds--overflow-menu__trigger {
   box-sizing: border-box;
@@ -22725,6 +22791,17 @@ a.cds--overflow-menu-options__btn::before {
   }
 }
 
+.cds--breadcrumb--sm {
+  font-size: var(--cds-label-01-font-size, 0.75rem);
+  font-weight: var(--cds-label-01-font-weight, 400);
+  line-height: var(--cds-label-01-line-height, 1.33333);
+  letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
+}
+
+.cds--breadcrumb .cds--link {
+  font: inherit;
+}
+
 .cds--breadcrumb-item {
   position: relative;
   display: flex;
@@ -22732,6 +22809,10 @@ a.cds--overflow-menu-options__btn::before {
   margin-inline-end: 0.5rem;
 }
 
+.cds--breadcrumb--sm .cds--breadcrumb-item {
+  margin-inline-end: 0.25rem;
+}
+
 .cds--breadcrumb-item .cds--link:visited {
   color: var(--cds-link-primary, #0f62fe);
 }
@@ -22739,12 +22820,21 @@ a.cds--overflow-menu-options__btn::before {
   color: var(--cds-link-primary-hover, #0043ce);
 }
 
+.cds--breadcrumb-item .cds--link:active,
+.cds--breadcrumb-item .cds--link:visited:active:hover {
+  color: var(--cds-text-primary, #161616);
+}
+
 .cds--breadcrumb-item::after {
   color: var(--cds-text-primary, #161616);
   content: "/";
   margin-inline-start: 0.5rem;
 }
 
+.cds--breadcrumb--sm .cds--breadcrumb-item::after {
+  margin-inline-start: 0.25rem;
+}
+
 .cds--breadcrumb--no-trailing-slash .cds--breadcrumb-item:last-child::after {
   content: "";
 }
@@ -22771,17 +22861,29 @@ a.cds--overflow-menu-options__btn::before {
 .cds--breadcrumb-item .cds--overflow-menu {
   position: relative;
   block-size: 1.125rem;
-  inline-size: 1.25rem;
+  inline-size: 1rem;
 }
 .cds--breadcrumb-item .cds--overflow-menu:focus {
+  border: none;
+  box-shadow: none;
   outline: 1px solid var(--cds-focus, #0f62fe);
+  outline-offset: 0;
 }
 .cds--breadcrumb-item .cds--overflow-menu:hover {
   background: transparent;
 }
+.cds--breadcrumb-item .cds--overflow-menu:hover::after {
+  background: var(--cds-link-primary-hover, #0043ce);
+}
+.cds--breadcrumb-item .cds--overflow-menu:active::after {
+  background: var(--cds-text-primary, #161616);
+}
+.cds--breadcrumb-item .cds--overflow-menu:focus::after, .cds--breadcrumb-item .cds--overflow-menu:hover::after {
+  opacity: 1;
+}
 .cds--breadcrumb-item .cds--overflow-menu::after {
   position: absolute;
-  background: var(--cds-link-primary-hover, #0043ce);
+  background: var(--cds-focus, #0f62fe);
   block-size: 1px;
   content: "";
   inline-size: 0.75rem;
@@ -22795,16 +22897,12 @@ a.cds--overflow-menu-options__btn::before {
   }
 }
 
-.cds--breadcrumb-item .cds--overflow-menu:hover::after {
-  opacity: 1;
-}
-
 .cds--breadcrumb-item .cds--overflow-menu.cds--overflow-menu--open {
   background: transparent;
   box-shadow: none;
 }
 
-.cds--breadcrumb-item .cds--overflow-menu__icon {
+.cds--breadcrumb-item .cds--overflow-menu .cds--overflow-menu__icon {
   position: relative;
   fill: var(--cds-link-primary, #0f62fe);
   transform: translateY(4px);
@@ -22814,6 +22912,10 @@ a.cds--overflow-menu-options__btn::before {
   fill: var(--cds-link-primary-hover, #0043ce);
 }
 
+.cds--breadcrumb-item .cds--overflow-menu:active .cds--overflow-menu__icon {
+  fill: var(--cds-text-primary, #161616);
+}
+
 .cds--breadcrumb-menu-options:focus {
   outline: none;
 }
@@ -22835,6 +22937,20 @@ a.cds--overflow-menu-options__btn::before {
   inset-inline-start: initial;
 }
 
+.cds--breadcrumb .cds--overflow-menu.cds--btn--icon-only {
+  min-block-size: 1.125rem;
+  padding-inline: 0;
+}
+
+.cds--breadcrumb--sm .cds--breadcrumb-item .cds--overflow-menu {
+  block-size: 1rem;
+  inline-size: 1rem;
+  min-block-size: 1rem;
+}
+.cds--breadcrumb--sm .cds--breadcrumb-item .cds--overflow-menu .cds--overflow-menu__icon {
+  transform: translateY(3px);
+}
+
 .cds--breadcrumb.cds--skeleton .cds--link {
   position: relative;
   padding: 0;
@@ -22866,11 +22982,6 @@ a.cds--overflow-menu-options__btn::before {
   }
 }
 
-.cds--breadcrumb .cds--overflow-menu.cds--btn--icon-only {
-  min-block-size: 1.125rem;
-  padding-inline: 0;
-}
-
 .cds--link {
   box-sizing: border-box;
   padding: 0;
@@ -26881,14 +26992,6 @@ fieldset[disabled] .cds--form__helper-text {
   block-size: 3rem;
 }
 
-.cds--menu-item__icon {
-  display: none;
-}
-
-.cds--menu--with-icons .cds--menu-item__icon {
-  display: flex;
-}
-
 .cds--menu-item__label {
   overflow: hidden;
   text-overflow: ellipsis;
@@ -26918,12 +27021,35 @@ fieldset[disabled] .cds--form__helper-text {
   box-sizing: inherit;
 }
 
+.cds--menu-item__icon,
+.cds--menu-item__selection-icon {
+  display: none;
+}
+
 .cds--menu--with-icons > .cds--menu-item,
 .cds--menu--with-icons > .cds--menu-item-group > ul > .cds--menu-item,
-.cds--menu--with-icons > .cds--menu-item-radio-group > ul > .cds--menu-item {
+.cds--menu--with-icons > .cds--menu-item-radio-group > ul > .cds--menu-item,
+.cds--menu--with-selectable-items > .cds--menu-item,
+.cds--menu--with-selectable-items > .cds--menu-item-group > ul > .cds--menu-item,
+.cds--menu--with-selectable-items > .cds--menu-item-radio-group > ul > .cds--menu-item {
   grid-template-columns: 1rem 1fr max-content;
 }
 
+.cds--menu--with-icons > .cds--menu-item > .cds--menu-item__icon,
+.cds--menu--with-icons > .cds--menu-item-group > ul > .cds--menu-item > .cds--menu-item__icon,
+.cds--menu--with-icons > .cds--menu-item-radio-group > ul > .cds--menu-item > .cds--menu-item__icon,
+.cds--menu--with-selectable-items > .cds--menu-item > .cds--menu-item__selection-icon,
+.cds--menu--with-selectable-items > .cds--menu-item-group > ul > .cds--menu-item > .cds--menu-item__selection-icon,
+.cds--menu--with-selectable-items > .cds--menu-item-radio-group > ul > .cds--menu-item > .cds--menu-item__selection-icon {
+  display: flex;
+}
+
+.cds--menu--with-icons.cds--menu--with-selectable-items > .cds--menu-item,
+.cds--menu--with-icons.cds--menu--with-selectable-items > .cds--menu-item-group > ul > .cds--menu-item,
+.cds--menu--with-icons.cds--menu--with-selectable-items > .cds--menu-item-radio-group > ul > .cds--menu-item {
+  grid-template-columns: 1rem 1rem 1fr max-content;
+}
+
 .cds--menu-item--disabled {
   color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
   cursor: not-allowed;
@@ -31198,6 +31324,117 @@ th .cds--table-sort__flex {
   }
 }
 
+.cds--dialog {
+  padding: 0;
+  border: none;
+  background-color: var(--cds-layer);
+  color: var(--cds-text-primary, #161616);
+  inline-size: 48rem;
+  max-block-size: 50%;
+  max-inline-size: 100%;
+  opacity: 0;
+  transform: translateY(calc(-1 * 1.5rem));
+  /** opening and closing is used in as allow-discrete is not currently supported wide enough
+   * https://caniuse.com/mdn-css_properties_display_is_transitionable
+   */
+  transition: opacity 240ms cubic-bezier(0.4, 0.14, 1, 1), transform 240ms cubic-bezier(0.4, 0.14, 1, 1), overlay 240ms cubic-bezier(0.4, 0.14, 1, 1) allow-discrete, display 240ms cubic-bezier(0.4, 0.14, 1, 1) allow-discrete;
+  /** starting style also not supported widely
+  * https://caniuse.com/mdn-css_at-rules_starting-style
+  */
+  /*   Before-open state  */
+  /* Needs to be after the previous dialog[open] rule to take effect,
+  as the specificity is the same */
+}
+@media (prefers-reduced-motion) {
+  .cds--dialog {
+    transition: none;
+  }
+}
+@media (min-width: 42rem) {
+  .cds--dialog {
+    max-inline-size: 84%;
+  }
+}
+@media (min-width: 66rem) {
+  .cds--dialog {
+    max-inline-size: 72%;
+  }
+}
+@media (min-width: 82rem) {
+  .cds--dialog {
+    max-inline-size: 64%;
+  }
+}
+@media (min-width: 82rem) {
+  .cds--dialog {
+    max-inline-size: 60%;
+  }
+}
+.cds--dialog[open] {
+  opacity: 1;
+  transform: translateY(0);
+  transition: opacity 240ms cubic-bezier(0, 0, 0.3, 1), transform 240ms cubic-bezier(0, 0, 0.3, 1), overlay 240ms cubic-bezier(0, 0, 0.3, 1) allow-discrete, display 240ms cubic-bezier(0, 0, 0.3, 1) allow-discrete;
+}
+@media (prefers-reduced-motion) {
+  .cds--dialog[open] {
+    transition: none;
+  }
+}
+@starting-style {
+  .cds--dialog[open] {
+    opacity: 0;
+    transform: translateY(calc(-1 * 1.5rem));
+  }
+}
+
+.cds--dialog__header {
+  position: relative;
+  overflow: visible;
+  inline-size: 100%;
+  min-block-size: 3rem;
+}
+
+/* Transition the :backdrop when the dialog modal is promoted to the top layer */
+.cds--dialog::backdrop {
+  background-color: var(--cds-overlay, rgba(22, 22, 22, 0.5));
+  opacity: 0;
+  /* opening and closing is used in as allow-discrete is not currently supported wide enough
+   * https://caniuse.com/mdn-css_properties_display_is_transitionable
+   */
+  transition: background-color 240ms cubic-bezier(0, 0, 0.3, 1), opacity 240ms cubic-bezier(0, 0, 0.3, 1);
+}
+@media (prefers-reduced-motion) {
+  .cds--dialog::backdrop {
+    transition: none;
+  }
+}
+
+.cds--dialog[open]::backdrop {
+  opacity: 1;
+  transition: background-color 240ms cubic-bezier(0.4, 0.14, 1, 1), opacity 240ms cubic-bezier(0.4, 0.14, 1, 1);
+}
+@media (prefers-reduced-motion) {
+  .cds--dialog[open]::backdrop {
+    transition: none;
+  }
+}
+
+/** starting style also not supported widely
+* https://caniuse.com/mdn-css_at-rules_starting-style
+*/
+/* This starting-style rule cannot be nested inside the above selector
+because the nesting selector cannot represent pseudo-elements. */
+@starting-style {
+  .cds--dialog[open]::backdrop {
+    opacity: 0;
+  }
+}
+.cds--dialog__header-controls {
+  position: absolute;
+  inset-block-start: 0;
+  inset-inline-end: 0;
+}
+
 .cds--dropdown__wrapper--inline {
   display: inline-grid;
   align-items: center;
@@ -34787,6 +35024,12 @@ optgroup.cds--select-optgroup:disabled,
   inset-inline-end: 1rem;
   inset-inline-start: auto;
 }
+.cds--text-area--fluid .cds--label .cds--toggletip-button {
+  padding: 0.25rem;
+  margin-inline-start: -0.25rem;
+  min-block-size: 1.5rem;
+  min-inline-size: 1.5rem;
+}
 
 .cds--text-area--fluid .cds--label::-webkit-scrollbar,
 .cds--text-area--fluid .cds--label .cds--toggletip-label::-webkit-scrollbar {
@@ -35599,18 +35842,6 @@ optgroup.cds--select-optgroup:disabled,
   transform: rotate(180deg);
 }
 
-.cds--menu-button__top {
-  transform: translate(0, calc(-100% - var(--cds-popover-offset, 3rem)));
-}
-
-.cds--menu-button__top-start {
-  transform: translate(0, calc(-100% - var(--cds-popover-offset, 3rem)));
-}
-
-.cds--menu-button__top-end {
-  transform: translate(0, calc(-100% - var(--cds-popover-offset, 3rem)));
-}
-
 .cds--modal {
   position: fixed;
   z-index: 9000;
@@ -37126,6 +37357,103 @@ optgroup.cds--select-optgroup:disabled,
   }
 }
 
+.cds--page-header {
+  border: 1px solid rebeccapurple; /* stylelint-disable-line */
+}
+
+.cds--page-header__breadcrumb-bar {
+  border: 1px solid blue; /* stylelint-disable-line */
+}
+
+.cds--page-header__content {
+  margin: 1.5rem 0;
+  border: 1px solid red; /* stylelint-disable-line */
+}
+
+.cds--page-header__content__title-wrapper {
+  display: flex;
+  justify-content: space-between;
+  gap: 1rem;
+}
+@media (max-width: 41.98rem) {
+  .cds--page-header__content__title-wrapper {
+    flex-direction: column;
+  }
+}
+
+.cds--page-header__content__start {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 1rem;
+}
+
+.cds--page-header__content__title-container {
+  display: flex;
+}
+
+.cds--page-header__content__contextual-actions {
+  display: flex;
+}
+
+.cds--page-header__content__title {
+  font-size: var(--cds-productive-heading-04-font-size, 1.75rem);
+  font-weight: var(--cds-productive-heading-04-font-weight, 400);
+  line-height: var(--cds-productive-heading-04-line-height, 1.28572);
+  letter-spacing: var(--cds-productive-heading-04-letter-spacing, 0);
+  display: -webkit-box;
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  max-inline-size: 40rem;
+  text-overflow: ellipsis;
+  white-space: normal;
+}
+
+.cds--page-header__content:has(.cds--page-header__content__contextual-actions) .cds--page-header__content__title {
+  -webkit-line-clamp: 1;
+}
+
+.cds--page-header__content__icon {
+  margin-inline-end: 1rem;
+}
+
+.cds--page-header__content__page-actions {
+  display: flex;
+  gap: 1rem;
+}
+
+.cds--page-header__content__subtitle {
+  font-size: var(--cds-productive-heading-03-font-size, 1.25rem);
+  font-weight: var(--cds-productive-heading-03-font-weight, 400);
+  line-height: var(--cds-productive-heading-03-line-height, 1.4);
+  letter-spacing: var(--cds-productive-heading-03-letter-spacing, 0);
+  margin-block-start: 1rem;
+}
+
+.cds--page-header__content__body {
+  font-size: var(--cds-body-01-font-size, 0.875rem);
+  font-weight: var(--cds-body-01-font-weight, 400);
+  line-height: var(--cds-body-01-line-height, 1.42857);
+  letter-spacing: var(--cds-body-01-letter-spacing, 0.16px);
+  margin-block-start: 0.5rem;
+  max-inline-size: 40rem;
+}
+
+.cds--page-header__content:not(:has(.cds--page-header__content__sub-title)) .cds--page-header__content__body {
+  margin-block-start: 1rem;
+}
+
+.cds--page-header__hero-image {
+  display: flex;
+  overflow: hidden;
+  align-items: center;
+  block-size: 100%;
+}
+
+.cds--page-header__tab-bar {
+  border: 1px solid green; /* stylelint-disable-line */
+}
+
 .cds--data-table-container + .cds--pagination {
   border-block-start: 0;
 }
@@ -38300,6 +38628,79 @@ span.cds--pagination__text.cds--pagination__items-count {
   inset-inline-start: 0;
 }
 
+.cds--shape-indicator {
+  font-size: var(--cds-helper-text-01-font-size, 0.75rem);
+  line-height: var(--cds-helper-text-01-line-height, 1.33333);
+  letter-spacing: var(--cds-helper-text-01-letter-spacing, 0.32px);
+  display: flex;
+  color: var(--cds-text-secondary, #525252);
+}
+
+.cds--shape-indicator svg {
+  align-self: center;
+  margin-inline-end: 0.5rem;
+}
+
+.cds--shape-indicator--14 {
+  font-size: var(--cds-body-compact-01-font-size, 0.875rem);
+  font-weight: var(--cds-body-compact-01-font-weight, 400);
+  line-height: var(--cds-body-compact-01-line-height, 1.28572);
+  letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
+}
+
+.cds--shape-indicator--failed {
+  fill: var(--cds-status-red, #da1e28);
+}
+
+.cds--shape-indicator--critical {
+  fill: var(--cds-status-red, #da1e28);
+}
+
+.cds--shape-indicator--high {
+  fill: var(--cds-status-red, #da1e28);
+}
+
+.cds--shape-indicator--medium {
+  fill: var(--cds-status-orange, #ff832b);
+}
+.cds--shape-indicator--medium path:first-of-type {
+  fill: var(--cds-status-orange-outline, #ba4e00);
+}
+
+.cds--shape-indicator--low {
+  fill: var(--cds-status-yellow, #f1c21b);
+}
+.cds--shape-indicator--low path:nth-of-type(2) {
+  fill: var(--cds-status-yellow-outline, #8e6a00);
+}
+
+.cds--shape-indicator--cautious {
+  fill: var(--cds-status-yellow, #f1c21b);
+}
+.cds--shape-indicator--cautious path:first-of-type {
+  fill: var(--cds-status-yellow-outline, #8e6a00);
+}
+
+.cds--shape-indicator--undefined {
+  fill: var(--cds-status-purple, #8a3ffc);
+}
+
+.cds--shape-indicator--stable {
+  fill: var(--cds-status-green, #24a148);
+}
+
+.cds--shape-indicator--informative {
+  fill: var(--cds-status-blue, #0043ce);
+}
+
+.cds--shape-indicator--incomplete path:nth-of-type(2) {
+  fill: var(--cds-status-blue, #0043ce);
+}
+
+.cds--shape-indicator--draft {
+  fill: var(--cds-status-gray, #6f6f6f);
+}
+
 @keyframes ai-skeleton-animation {
   0% {
     transform: translateX(-100%);
@@ -39454,6 +39855,7 @@ span.cds--pagination__text.cds--pagination__items-count {
   inset-block-start: 0.0625rem;
 }
 .cds--tabs .cds--tabs__nav-item {
+  position: relative;
   display: flex;
   flex: 1 0 auto;
   padding: 0;
@@ -39684,7 +40086,7 @@ span.cds--pagination__text.cds--pagination__items-count {
 .cds--tabs.cds--tabs--vertical:not(.cds--tabs--tall) .cds--tabs__nav-item-label {
   line-height: var(--cds-body-compact-01-line-height);
 }
-.cds--tabs.cds--tabs__icon--default .cds--tab--list, .cds--tabs.cds--tabs__icon--lg .cds--tab--list {
+.cds--tabs.cds--tabs__icon--default, .cds--tabs.cds--tabs__icon--lg, .cds--tabs.cds--tabs__icon--default .cds--tab--list, .cds--tabs.cds--tabs__icon--lg .cds--tab--list {
   overflow-x: visible;
 }
 .cds--tabs .cds--tabs__nav-item--icon-only {
@@ -39701,6 +40103,10 @@ span.cds--pagination__text.cds--pagination__items-count {
 .cds--tabs .cds--tabs__nav-item--icon-only .cds--tabs__nav-item-label, .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--icon-only .cds--tabs__nav-item-label {
   line-height: 0;
 }
+.cds--tabs .cds--tabs__nav-item--icon-only:not(.cds--tabs__nav-item--icon-only__20) .cds--badge-indicator {
+  margin-block-start: 0.25rem;
+  margin-inline-end: 0.25rem;
+}
 .cds--tabs:not(.cds--tabs--contained) .cds--tabs__nav-item:not(.cds--tabs__nav-item--selected):not(.cds--tabs__nav-item--disabled):hover {
   border-block-end: 2px solid var(--cds-border-strong);
   color: var(--cds-text-primary, #161616);
@@ -40904,6 +41310,22 @@ span.cds--pagination__text.cds--pagination__items-count {
   cursor: not-allowed;
 }
 
+li a.cds--tree-node {
+  text-decoration: none;
+}
+li a.cds--tree-node:not(.cds--tree-node--disabled) {
+  color: var(--cds-text-secondary, #525252);
+}
+
+li.cds--tree-node-link-parent {
+  display: flex;
+  flex-direction: column;
+  background-color: var(--cds-layer-01, #f4f4f4);
+}
+li.cds--tree-node-link-parent > .cds--tree-node__children {
+  padding-inline-start: 1rem;
+}
+
 .cds--tree-node__label {
   font-size: var(--cds-body-compact-01-font-size, 0.875rem);
   font-weight: var(--cds-body-compact-01-font-weight, 400);
@@ -40957,11 +41379,9 @@ span.cds--pagination__text.cds--pagination__items-count {
 .cds--tree-parent-node__toggle {
   display: flex;
   align-items: center;
-  align-self: flex-start;
   border: 0;
   block-size: 1.5rem;
   inline-size: 1.5rem;
-  margin-block-start: 0.25rem;
   margin-inline: -0.25rem 0.25rem;
   padding-inline-start: 0.25rem;
 }
@@ -40983,9 +41403,7 @@ span.cds--pagination__text.cds--pagination__items-count {
 }
 
 .cds--tree-node__icon {
-  align-self: flex-start;
   fill: var(--cds-icon-secondary, #525252);
-  margin-block-start: 0.0625rem;
   margin-inline: 0.5rem 0.5rem;
   min-block-size: 1rem;
   min-inline-size: 1rem;