@patternfly/patternfly 6.0.0-alpha.200 → 6.0.0-alpha.201

package/components/_index.css

@@ -1306,9 +1306,11 @@
   --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
   --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
-  --pf-v6-c-breadcrumb__link--TextDecoration: var(--pf-t--global--link--text-decoration);
+  --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
+  --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
   --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
-  --pf-v6-c-breadcrumb__link--hover--TextDecoration: var(--pf-t--global--link--text-decoration--hover);
+  --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
+  --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
   --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
   --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
   --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
@@ -1361,18 +1363,19 @@
   font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
   line-height: inherit;
   color: var(--pf-v6-c-breadcrumb__link--Color);
-  text-decoration: var(--pf-v6-c-breadcrumb__link--TextDecoration);
+  text-decoration: var(--pf-v6-c-breadcrumb__link--TextDecorationLine) var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
   word-break: break-word;
   background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
 }
-.pf-v6-c-breadcrumb__link:hover {
+.pf-v6-c-breadcrumb__link:is(:hover, :focus) {
   --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
-  --pf-v6-c-breadcrumb__link--TextDecoration: var(--pf-v6-c-breadcrumb__link--hover--TextDecoration);
+  --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
+  --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
 }
 .pf-v6-c-breadcrumb__link.pf-m-current {
   cursor: default;
 }
-.pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:hover {
+.pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
   color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
   text-decoration: none;
 }
@@ -1418,14 +1421,16 @@ button.pf-v6-c-breadcrumb__link {
   --pf-v6-c-button--BorderColor: transparent;
   --pf-v6-c-button--BorderWidth: var(--pf-t--global--border--width--action--default);
   --pf-v6-c-button--BorderRadius: var(--pf-t--global--border--radius--pill);
-  --pf-v6-c-button--TextDecoration: none;
+  --pf-v6-c-button--TextDecorationLine: none;
+  --pf-v6-c-button--TextDecorationStyle: none;
   --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
   --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
   --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
   --pf-v6-c-button--hover--BackgroundColor: transparent;
   --pf-v6-c-button--hover--BorderColor: transparent;
   --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
-  --pf-v6-c-button--hover--TextDecoration: none;
+  --pf-v6-c-button--hover--TextDecorationLine: none;
+  --pf-v6-c-button--hover--TextDecorationStyle: none;
   --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
   --pf-v6-c-button--m-clicked--BorderColor: transparent;
   --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
@@ -1495,7 +1500,10 @@ button.pf-v6-c-breadcrumb__link {
   --pf-v6-c-button--m-link--m-inline--PaddingInlineEnd: 0;
   --pf-v6-c-button--m-link--m-inline--PaddingBlockEnd: 0;
   --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: 0;
-  --pf-v6-c-button--m-link--m-inline--hover--TextDecoration: var(--pf-t--global--link--text-decoration--hover);
+  --pf-v6-c-button--m-link--m-inline--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
+  --pf-v6-c-button--m-link--m-inline--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
+  --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
+  --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
   --pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart: var(--pf-t--global--spacer--xs);
   --pf-v6-c-button--m-link--m-inline--m-in-progress--PaddingInlineStart: calc(var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart) + 1rem + var(--pf-t--global--spacer--sm));
   --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
@@ -1650,7 +1658,7 @@ button.pf-v6-c-breadcrumb__link {
   line-height: var(--pf-v6-c-button--LineHeight, inherit);
   color: var(--pf-v6-c-button--Color);
   text-align: center;
-  text-decoration: var(--pf-v6-c-button--TextDecoration);
+  text-decoration: var(--pf-v6-c-button--TextDecorationLine) var(--pf-v6-c-button--TextDecorationStyle);
   white-space: nowrap;
   cursor: pointer;
   user-select: none;
@@ -1750,7 +1758,10 @@ button.pf-v6-c-breadcrumb__link {
   --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-inline--PaddingInlineStart);
   --pf-v6-c-button--BackgroundColor: transparent;
   --pf-v6-c-button__progress--InsetInlineStart: var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart);
-  --pf-v6-c-button--hover--TextDecoration: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecoration);
+  --pf-v6-c-button--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--TextDecorationLine);
+  --pf-v6-c-button--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--TextDecorationStyle);
+  --pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
+  --pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
   --pf-v6-c-button--hover--BackgroundColor: transparent;
   --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
   --pf-v6-c-button--disabled--BackgroundColor: transparent;
@@ -1912,8 +1923,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
   --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
   --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--hover--BorderColor);
   --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
-  --pf-v6-c-button--TextDecoration: var(--pf-v6-c-button--hover--TextDecoration);
   --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
+  text-decoration: var(--pf-v6-c-button--hover--TextDecorationLine) var(--pf-v6-c-button--hover--TextDecorationStyle);
 }
 .pf-v6-c-button.pf-m-clicked {
   --pf-v6-c-button--Color: var(--pf-v6-c-button--m-clicked--Color);
@@ -1936,7 +1947,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
   color: var(--pf-v6-c-button--disabled__icon--Color);
 }
 .pf-v6-c-button.pf-m-aria-disabled {
-  --pf-v6-c-button--m-link--m-inline--hover--TextDecoration: none;
+  --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-v6-c-button--TextDecorationLine);
+  --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-v6-c-button--TextDecorationStyle);
   cursor: default;
 }
 .pf-v6-c-button.pf-m-progress {
@@ -2969,9 +2981,11 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
   --pf-v6-c-content--small--FontSize: var(--pf-t--global--font--size--body--sm);
   --pf-v6-c-content--small--Color: var(--pf-t--global--text--color--subtle);
   --pf-v6-c-content--a--Color: var(--pf-t--global--text--color--link--default);
-  --pf-v6-c-content--a--TextDecoration: var(--pf-t--global--link--text-decoration);
+  --pf-v6-c-content--a--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
+  --pf-v6-c-content--a--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
   --pf-v6-c-content--a--hover--Color: var(--pf-t--global--text--color--link--hover);
-  --pf-v6-c-content--a--hover--TextDecoration: var(--pf-t--global--link--text-decoration);
+  --pf-v6-c-content--a--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
+  --pf-v6-c-content--a--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
   --pf-v6-c-content--a--visited--Color: var(--pf-t--global--text--color--link--visited);
   --pf-v6-c-content--blockquote--PaddingBlockStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-content--blockquote--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -3000,11 +3014,12 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
 }
 :is(.pf-v6-c-content--a, .pf-v6-c-content a) {
   color: var(--pf-v6-c-content--a--Color);
-  text-decoration: var(--pf-v6-c-content--a--TextDecoration);
+  text-decoration: var(--pf-v6-c-content--a--TextDecorationLine) var(--pf-v6-c-content--a--TextDecorationStyle);
 }
-:is(.pf-v6-c-content--a, .pf-v6-c-content a):hover {
+:is(.pf-v6-c-content--a, .pf-v6-c-content a):is(:hover, :focus) {
   --pf-v6-c-content--a--Color: var(--pf-v6-c-content--a--hover--Color);
-  --pf-v6-c-content--a--TextDecoration: var(--pf-v6-c-content--a--hover--TextDecoration);
+  --pf-v6-c-content--a--TextDecorationLine: var(--pf-v6-c-content--a--hover--TextDecorationLine);
+  --pf-v6-c-content--a--TextDecorationStyle: var(--pf-v6-c-content--a--hover--TextDecorationStyle);
 }
 
 :is(.pf-v6-c-content--a.pf-m-visited, .pf-v6-c-content.pf-m-visited a, .pf-v6-c-content a.pf-m-visited):visited {
@@ -4048,11 +4063,11 @@ ul) {
   --pf-v6-c-description-list--m-3-col--GridTemplateColumns--count: 3;
   --pf-v6-c-description-list--m-auto-fit--GridTemplateColumns--min: 15.625rem;
   --pf-v6-c-description-list--m-auto-fit--GridTemplateColumns--minmax--min: var(--pf-v6-c-description-list--m-auto-fit--GridTemplateColumns--min);
-  --pf-v6-c-description-list__text--m-help-text--TextDecorationColor: currentcolor;
-  --pf-v6-c-description-list__text--m-help-text--TextDecorationThickness: var(--pf-t--global--border--width--regular);
-  --pf-v6-c-description-list__text--m-help-text--TextDecorationOffset: 0.25rem;
-  --pf-v6-c-description-list__text--m-help-text--hover--TextDecorationColor: var(--pf-t--global--border--color--hover);
-  --pf-v6-c-description-list__text--m-help-text--focus--TextDecorationColor: var(--pf-t--global--border--color--hover);
+  --pf-v6-c-description-list__text--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
+  --pf-v6-c-description-list__text--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
+  --pf-v6-c-description-list__text--m-help-text--TextUnderlineOffset: 0.25rem;
+  --pf-v6-c-description-list__text--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
+  --pf-v6-c-description-list__text--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
   --pf-v6-c-description-list--m-display-lg__description--FontSize: var(--pf-t--global--font--size--body--lg);
   --pf-v6-c-description-list--m-display-2xl__description--FontSize: var(--pf-t--global--font--size--heading--lg);
   --pf-v6-c-description-list--m-horizontal__term--width-on-sm: inherit;
@@ -4214,18 +4229,13 @@ ul) {
   min-width: 0;
 }
 .pf-v6-c-description-list__text.pf-m-help-text {
-  text-decoration: underline;
-  text-decoration-thickness: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationThickness);
-  text-decoration-style: dashed;
-  text-decoration-color: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationColor);
-  text-underline-offset: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationOffset);
+  text-decoration: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationLine) var(--pf-v6-c-description-list__text--m-help-text--TextDecorationStyle);
+  text-underline-offset: var(--pf-v6-c-description-list__text--m-help-text--TextUnderlineOffset);
   cursor: pointer;
 }
-.pf-v6-c-description-list__text.pf-m-help-text:hover {
-  --pf-v6-c-description-list__text--m-help-text--TextDecorationColor: var(--pf-v6-c-description-list__text--m-help-text--hover--TextDecorationColor);
-}
-.pf-v6-c-description-list__text.pf-m-help-text:focus {
-  --pf-v6-c-description-list__text--m-help-text--TextDecorationColor: var(--pf-v6-c-description-list__text--m-help-text--focus--TextDecorationColor);
+.pf-v6-c-description-list__text.pf-m-help-text:is(:hover, :focus) {
+  --pf-v6-c-description-list__text--m-help-text--TextDecorationLine: var(--pf-v6-c-description-list__text--m-help-text--hover--TextDecorationLine);
+  --pf-v6-c-description-list__text--m-help-text--TextDecorationStyle: var(--pf-v6-c-description-list__text--m-help-text--hover--TextDecorationStyle);
 }
 
 .pf-v6-c-description-list.pf-m-1-col {
@@ -7816,7 +7826,7 @@ label.pf-v6-c-input-group__text {
   text-decoration: none;
   outline-offset: var(--pf-v6-c-jump-links__link--OutlineOffset);
 }
-.pf-v6-c-jump-links__link:hover, .pf-v6-c-jump-links__link:focus {
+.pf-v6-c-jump-links__link:is(:hover, :focus) {
   --pf-v6-c-jump-links__link-text--Color: var(--pf-v6-c-jump-links__link--hover__link-text--Color);
 }
 .pf-v6-c-jump-links__link::before {
@@ -8032,7 +8042,7 @@ label.pf-v6-c-input-group__text {
   --pf-v6-c-label--m-compact--PaddingBlockEnd: 0;
   --pf-v6-c-label--m-compact--PaddingInlineStart: var(--pf-t--global--spacer--sm);
   --pf-v6-c-label--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
-  --pf-v6-c-label--m-compact--m-editable--TextDecorationOffset: 0.0625rem;
+  --pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset: 0.0625rem;
   --pf-v6-c-label__content--MaxWidth: 100%;
   --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--xs);
   --pf-v6-c-label__content--Cursor: initial;
@@ -8047,14 +8057,14 @@ label.pf-v6-c-input-group__text {
   --pf-v6-c-label__actions--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
   --pf-v6-c-label__actions--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
   --pf-v6-c-label__actions--c-button--PaddingInlineStart: var(--pf-t--global--spacer--xs);
-  --pf-v6-c-label--m-editable--TextDecoration: underline;
-  --pf-v6-c-label--m-editable--TextDecorationStyle: dashed;
-  --pf-v6-c-label--m-editable--TextDecorationThickness: var(--pf-t--global--border--width--regular);
-  --pf-v6-c-label--m-editable--TextDecorationOffset: 0.25rem;
-  --pf-v6-c-label--m-editable--TextDecorationColor: currentcolor;
+  --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--default);
+  --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--default);
+  --pf-v6-c-label--m-editable--hover--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--hover);
+  --pf-v6-c-label--m-editable--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--hover);
+  --pf-v6-c-label--m-editable--TextUnderlineOffset: 0.25rem;
   --pf-v6-c-label--m-editable__content--MaxWidth: 16ch;
   --pf-v6-c-label--m-editable__content--Cursor: pointer;
-  --pf-v6-c-label--m-editable--m-editable-active--TextDecoration: none;
+  --pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine: none;
   --pf-v6-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
   --pf-v6-c-label--m-editable--m-editable-active--Color: var(--pf-t--global--text--color--regular);
   --pf-v6-c-label--m-editable--m-editable-active__content--Cursor: initial;
@@ -8224,7 +8234,7 @@ label.pf-v6-c-input-group__text {
   --pf-v6-c-label--PaddingBlockEnd: var(--pf-v6-c-label--m-compact--PaddingBlockEnd);
   --pf-v6-c-label--PaddingInlineStart: var(--pf-v6-c-label--m-compact--PaddingInlineStart);
   --pf-v6-c-label--FontSize: var(--pf-v6-c-label--m-compact--FontSize);
-  --pf-v6-c-label--m-editable--TextDecorationOffset: var(--pf-v6-c-label--m-compact--m-editable--TextDecorationOffset);
+  --pf-v6-c-label--m-editable--TextUnderlineOffset: var(--pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset);
 }
 .pf-v6-c-label.pf-m-filled .pf-v6-c-label__actions .pf-v6-c-button {
   --pf-v6-c-button__icon--Color: var(--pf-v6-c-label--m-filled__actions--c-button__icon--Color);
@@ -8245,15 +8255,16 @@ label.pf-v6-c-input-group__text {
   --pf-v6-c-label__content--MaxWidth: var(--pf-v6-c-label--m-editable__content--MaxWidth);
   --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable__content--Cursor);
 }
+.pf-v6-c-label.pf-m-editable .pf-v6-c-label__content:is(:hover, :focus) {
+  --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--hover--TextDecorationLine);
+  --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-v6-c-label--m-editable--hover--TextDecorationStyle);
+}
 .pf-v6-c-label.pf-m-editable .pf-v6-c-label__text {
-  text-decoration: var(--pf-v6-c-label--m-editable--TextDecoration);
-  text-decoration-thickness: var(--pf-v6-c-label--m-editable--TextDecorationThickness);
-  text-decoration-style: var(--pf-v6-c-label--m-editable--TextDecorationStyle);
-  text-decoration-color: var(--pf-v6-c-label--m-editable--TextDecorationColor);
-  text-underline-offset: var(--pf-v6-c-label--m-editable--TextDecorationOffset);
+  text-decoration: var(--pf-v6-c-label--m-editable--TextDecorationLine) var(--pf-v6-c-label--m-editable--TextDecorationStyle);
+  text-underline-offset: var(--pf-v6-c-label--m-editable--TextUnderlineOffset);
 }
 .pf-v6-c-label.pf-m-editable-active {
-  --pf-v6-c-label--m-editable--TextDecoration: var(--pf-v6-c-label--m-editable--m-editable-active--TextDecoration);
+  --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine);
   --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-editable--m-editable-active--BackgroundColor);
   --pf-v6-c-label--Color: var(--pf-v6-c-label--m-editable--m-editable-active--Color);
   --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable--m-editable-active__content--Cursor);
@@ -12835,9 +12846,11 @@ ul.pf-v6-c-list {
   --pf-v6-c-progress-stepper__step--m-danger__step-title--Color: var(--pf-t--global--text--color--status--danger--default);
   --pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineStart: 0;
   --pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineEnd: 0;
-  --pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationColor: currentcolor;
-  --pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationThickness: var(--pf-t--global--link--text-decoration);
+  --pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
+  --pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
   --pf-v6-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset: 0.25rem;
+  --pf-v6-c-progress-stepper__step-title--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
+  --pf-v6-c-progress-stepper__step-title--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
   --pf-v6-c-progress-stepper__step-title--m-help-text--hover--Color: var(--pf-t--global--text--color--brand--hover);
   --pf-v6-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
   --pf-v6-c-progress-stepper__step-description--MarginBlockStart: var(--pf-t--global--spacer--xs);
@@ -13063,14 +13076,13 @@ ul.pf-v6-c-list {
 .pf-v6-c-progress-stepper__step-title.pf-m-help-text {
   padding-inline-start: var(--pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineStart);
   padding-inline-end: var(--pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineEnd);
-  text-decoration: underline;
-  text-decoration-thickness: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationThickness);
-  text-decoration-style: dashed;
-  text-decoration-color: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationColor);
+  text-decoration: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationLine) var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationStyle);
   text-underline-offset: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset);
   cursor: pointer;
 }
-.pf-v6-c-progress-stepper__step-title.pf-m-help-text:hover, .pf-v6-c-progress-stepper__step-title.pf-m-help-text:focus {
+.pf-v6-c-progress-stepper__step-title.pf-m-help-text:is(:hover, :focus) {
+  --pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationLine: var(--pf-v6-c-progress-stepper__step-title--m-help-text--hover--TextDecorationLine);
+  --pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationStyle: var(--pf-v6-c-progress-stepper__step-title--m-help-text--hover--TextDecorationStyle);
   --pf-v6-c-progress-stepper__step-title--Color: var(--pf-v6-c-progress-stepper__step-title--m-help-text--hover--Color);
 }
 
@@ -13827,7 +13839,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
   --pf-v6-c-simple-list__item-link--hover--Color: var(--pf-v6-c-simple-list__item-link--m-link--m-current--Color);
   --pf-v6-c-simple-list__item-link--m-current--Color: var(--pf-v6-c-simple-list__item-link--m-link--hover--Color);
 }
-.pf-v6-c-simple-list__item-link:hover, .pf-v6-c-simple-list__item-link:focus {
+.pf-v6-c-simple-list__item-link:is(:hover, :focus) {
   --pf-v6-c-simple-list__item-link--BackgroundColor: var(--pf-v6-c-simple-list__item-link--hover--BackgroundColor);
   --pf-v6-c-simple-list__item-link--Color: var(--pf-v6-c-simple-list__item-link--hover--Color);
   text-decoration: none;
@@ -18374,7 +18386,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   --pf-v6-c-tabs__link--after--BorderWidth: 0;
 }
 
-.pf-v6-c-tabs__link:disabled, .pf-v6-c-tabs__link.pf-m-disabled, .pf-v6-c-tabs__link.pf-m-aria-disabled {
+.pf-v6-c-tabs__link:is(:disabled, .pf-m-disabled, .pf-m-aria-disabled) {
   --pf-v6-c-tabs__link--BackgroundColor: var(--pf-v6-c-tabs__link--disabled--BackgroundColor);
 }
 .pf-v6-c-tabs__item.pf-m-action.pf-m-disabled {
@@ -18947,15 +18959,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
   --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
   --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
-  --pf-v6-c-timestamp--m-help-text--TextDecorationLine: underline;
-  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: dashed;
-  --pf-v6-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-t--global--border--width--regular);
+  --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
+  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
   --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
-  --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-t--global--border--color--default);
   --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
-  --pf-v6-c-timestamp--m-help-text--focus--Color: var(--pf-t--global--text--color--regular);
-  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-t--global--text--color--regular);
-  --pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-t--global--text--color--regular);
+  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
+  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
 }
 
 .pf-v6-c-timestamp {
@@ -18965,20 +18974,14 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
 }
 .pf-v6-c-timestamp.pf-m-help-text {
-  text-decoration-line: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine);
-  text-decoration-thickness: var(--pf-v6-c-timestamp--m-help-text--TextDecorationThickness);
-  text-decoration-style: var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
-  text-decoration-color: var(--pf-v6-c-timestamp--m-help-text--TextDecorationColor);
+  text-decoration: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine) var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
   text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
   cursor: pointer;
 }
-.pf-v6-c-timestamp.pf-m-help-text:hover {
+.pf-v6-c-timestamp.pf-m-help-text:is(:hover, :focus) {
   --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--hover--Color);
-  --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor);
-}
-.pf-v6-c-timestamp.pf-m-help-text:focus {
-  --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--focus--Color);
-  --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor);
+  --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine);
+  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle);
 }
 
 :where(:root, .pf-v6-c-title) {
@@ -19176,7 +19179,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   border-inline-start-color: var(--pf-v6-c-toggle-group__button--before--BorderInlineStartColor, var(--pf-v6-c-toggle-group__button--before--BorderColor));
   border-inline-end-color: var(--pf-v6-c-toggle-group__button--before--BorderInlineEndColor, var(--pf-v6-c-toggle-group__button--before--BorderColor));
 }
-.pf-v6-c-toggle-group__button:hover, .pf-v6-c-toggle-group__button:focus {
+.pf-v6-c-toggle-group__button:is(:hover, :focus) {
   --pf-v6-c-toggle-group__button--BackgroundColor: var(--pf-v6-c-toggle-group__button--hover--BackgroundColor);
   --pf-v6-c-toggle-group__button--ZIndex: var(--pf-v6-c-toggle-group__button--hover--ZIndex);
   --pf-v6-c-toggle-group__button--before--BorderColor: var(--pf-v6-c-toggle-group__button--hover--before--BorderColor);
@@ -19188,7 +19191,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   --pf-v6-c-toggle-group__button--ZIndex: var(--pf-v6-c-toggle-group__button--m-selected--ZIndex);
   --pf-v6-c-toggle-group__button--before--BorderColor: var(--pf-v6-c-toggle-group__button--m-selected--before--BorderColor);
 }
-.pf-v6-c-toggle-group__button:disabled, .pf-v6-c-toggle-group__button.pf-m-disabled {
+.pf-v6-c-toggle-group__button:is(:disabled, .pf-m-disabled) {
   --pf-v6-c-toggle-group__button--BackgroundColor: var(--pf-v6-c-toggle-group__button--disabled--BackgroundColor);
   --pf-v6-c-toggle-group__button--Color: var(--pf-v6-c-toggle-group__button--disabled--Color);
   --pf-v6-c-toggle-group__button--ZIndex: var(--pf-v6-c-toggle-group__button--disabled--ZIndex);

package/docs/components/Alert/examples/Alert.md

@@ -444,7 +444,7 @@ cssPrefix: ['pf-v6-c-alert','pf-v6-c-alert-group']
   <div class="pf-v6-c-alert__toggle">
     <button
       class="pf-v6-c-button pf-m-plain"
-      id&#x26;#x3D;&#x26;quot;alert-expandable-example-1-toggle&#x26;quot;
+      id="alert-expandable-example-1-toggle"
       type="button"
       aria-labelledby="alert-expandable-example-1-title alert-expandable-example-1-toggle"
       aria-label="Details"
@@ -494,7 +494,7 @@ cssPrefix: ['pf-v6-c-alert','pf-v6-c-alert-group']
   <div class="pf-v6-c-alert__toggle">
     <button
       class="pf-v6-c-button pf-m-expanded pf-m-plain"
-      id&#x26;#x3D;&#x26;quot;alert-expandable-example-2-toggle&#x26;quot;
+      id="alert-expandable-example-2-toggle"
       type="button"
       aria-expanded="true"
       aria-labelledby="alert-expandable-example-2-title alert-expandable-example-2-toggle"
@@ -545,7 +545,7 @@ cssPrefix: ['pf-v6-c-alert','pf-v6-c-alert-group']
   <div class="pf-v6-c-alert__toggle">
     <button
       class="pf-v6-c-button pf-m-plain"
-      id&#x26;#x3D;&#x26;quot;alert-expandable-example-3-toggle&#x26;quot;
+      id="alert-expandable-example-3-toggle"
       type="button"
       aria-labelledby="alert-expandable-example-3-title alert-expandable-example-3-toggle"
       aria-label="Details"
@@ -595,7 +595,7 @@ cssPrefix: ['pf-v6-c-alert','pf-v6-c-alert-group']
   <div class="pf-v6-c-alert__toggle">
     <button
       class="pf-v6-c-button pf-m-expanded pf-m-plain"
-      id&#x26;#x3D;&#x26;quot;alert-expandable-example-4-toggle&#x26;quot;
+      id="alert-expandable-example-4-toggle"
       type="button"
       aria-expanded="true"
       aria-labelledby="alert-expandable-example-4-title alert-expandable-example-4-toggle"

package/docs/components/Card/examples/Card.md

@@ -1368,7 +1368,7 @@ cssPrefix: pf-v6-c-card
     <div class="pf-v6-c-card__header-toggle">
       <button
         class="pf-v6-c-button pf-m-plain"
-        id&#x26;#x3D;&#x26;quot;card-expandable-example-toggle&#x26;quot;
+        id="card-expandable-example-toggle"
         type="button"
         aria-labelledby="card-expandable-example-title card-expandable-example-toggle"
         aria-label="Details"
@@ -1424,7 +1424,7 @@ cssPrefix: pf-v6-c-card
     <div class="pf-v6-c-card__header-toggle">
       <button
         class="pf-v6-c-button pf-m-plain"
-        id&#x26;#x3D;&#x26;quot;card-expandable-image-example-toggle&#x26;quot;
+        id="card-expandable-image-example-toggle"
         type="button"
         aria-labelledby="card-expandable-image-example-title card-expandable-image-example-toggle"
         aria-label="Details"
@@ -1479,7 +1479,7 @@ cssPrefix: pf-v6-c-card
     <div class="pf-v6-c-card__header-toggle">
       <button
         class="pf-v6-c-button pf-m-plain"
-        id&#x26;#x3D;&#x26;quot;card-expanded-example-toggle&#x26;quot;
+        id="card-expanded-example-toggle"
         type="button"
         aria-labelledby="card-expanded-example-title card-expanded-example-toggle"
         aria-label="Details"
@@ -1611,7 +1611,7 @@ cssPrefix: pf-v6-c-card
     <div class="pf-v6-c-card__header-toggle">
       <button
         class="pf-v6-c-button pf-m-plain"
-        id&#x26;#x3D;&#x26;quot;card-toggle-on-right-example-toggle&#x26;quot;
+        id="card-toggle-on-right-example-toggle"
         type="button"
         aria-labelledby="card-toggle-on-right-example-title card-toggle-on-right-example-toggle"
         aria-label="Details"

package/docs/components/ClipboardCopy/examples/ClipboardCopy.md

@@ -19,7 +19,7 @@ cssPrefix: pf-v6-c-clipboard-copy
     </span>
     <button
       class="pf-v6-c-button pf-m-control"
-      id&#x26;#x3D;&#x26;quot;basic-editable-copy-button&#x26;quot;
+      id="basic-editable-copy-button"
       type="button"
       aria-labelledby="basic-editable-copy-button basic-editable-text-input"
       aria-label="Copy to clipboard"
@@ -44,7 +44,7 @@ cssPrefix: pf-v6-c-clipboard-copy
     </span>
     <button
       class="pf-v6-c-button pf-m-control"
-      id&#x26;#x3D;&#x26;quot;basic-readonly-copy-button&#x26;quot;
+      id="basic-readonly-copy-button"
       type="button"
       aria-labelledby="basic-readonly-copy-button basic-readonly-text-input"
       aria-label="Copy to clipboard"

package/docs/components/DescriptionList/examples/DescriptionList.md

@@ -67,7 +67,12 @@ cssPrefix: pf-v6-c-description-list
 <dl class="pf-v6-c-description-list">
   <div class="pf-v6-c-description-list__group">
     <dt class="pf-v6-c-description-list__term">
-      <span class="pf-v6-c-description-list__text">Name</span>
+      <span
+        class="pf-v6-c-description-list__text pf-m-help-text"
+        role="button"
+        type="button"
+        tabindex="0"
+      >Name</span>
     </dt>
     <dd class="pf-v6-c-description-list__description">
       <div class="pf-v6-c-description-list__text">example</div>
@@ -75,7 +80,12 @@ cssPrefix: pf-v6-c-description-list
   </div>
   <div class="pf-v6-c-description-list__group">
     <dt class="pf-v6-c-description-list__term">
-      <span class="pf-v6-c-description-list__text">Namespace</span>
+      <span
+        class="pf-v6-c-description-list__text pf-m-help-text"
+        role="button"
+        type="button"
+        tabindex="0"
+      >Namespace</span>
     </dt>
     <dd class="pf-v6-c-description-list__description">
       <div class="pf-v6-c-description-list__text">
@@ -85,7 +95,12 @@ cssPrefix: pf-v6-c-description-list
   </div>
   <div class="pf-v6-c-description-list__group">
     <dt class="pf-v6-c-description-list__term">
-      <span class="pf-v6-c-description-list__text">Labels</span>
+      <span
+        class="pf-v6-c-description-list__text pf-m-help-text"
+        role="button"
+        type="button"
+        tabindex="0"
+      >Labels</span>
     </dt>
     <dd class="pf-v6-c-description-list__description">
       <div class="pf-v6-c-description-list__text">example</div>
@@ -93,7 +108,12 @@ cssPrefix: pf-v6-c-description-list
   </div>
   <div class="pf-v6-c-description-list__group">
     <dt class="pf-v6-c-description-list__term">
-      <span class="pf-v6-c-description-list__text">Pod selector</span>
+      <span
+        class="pf-v6-c-description-list__text pf-m-help-text"
+        role="button"
+        type="button"
+        tabindex="0"
+      >Pod selector</span>
     </dt>
     <dd class="pf-v6-c-description-list__description">
       <div class="pf-v6-c-description-list__text">
@@ -108,7 +128,12 @@ cssPrefix: pf-v6-c-description-list
   </div>
   <div class="pf-v6-c-description-list__group">
     <dt class="pf-v6-c-description-list__term">
-      <span class="pf-v6-c-description-list__text">Annotation</span>
+      <span
+        class="pf-v6-c-description-list__text pf-m-help-text"
+        role="button"
+        type="button"
+        tabindex="0"
+      >Annotation</span>
     </dt>
     <dd class="pf-v6-c-description-list__description">
       <div class="pf-v6-c-description-list__text">2 Annotations</div>

package/docs/components/Form/examples/Form.md

@@ -658,7 +658,7 @@ cssPrefix: pf-v6-c-form
       <div class="pf-v6-c-form__field-group-toggle-button">
         <button
           class="pf-v6-c-button pf-m-plain"
-          id&#x26;#x3D;&#x26;quot;form-expandable-field-groups-field-group-1-toggle&#x26;quot;
+          id="form-expandable-field-groups-field-group-1-toggle"
           type="button"
           aria-labelledby="form-expandable-field-groups-field-group-1-title form-expandable-field-groups-field-group-1-toggle"
           aria-label="Details"
@@ -699,7 +699,7 @@ cssPrefix: pf-v6-c-form
       <div class="pf-v6-c-form__field-group-toggle-button">
         <button
           class="pf-v6-c-button pf-m-expanded pf-m-plain"
-          id&#x26;#x3D;&#x26;quot;form-expandable-field-groups-field-group-2-toggle&#x26;quot;
+          id="form-expandable-field-groups-field-group-2-toggle"
           type="button"
           aria-expanded="true"
           aria-labelledby="form-expandable-field-groups-field-group-2-title form-expandable-field-groups-field-group-2-toggle"