@patternfly/patternfly 6.2.0-prerelease.2 → 6.2.0-prerelease.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (110) hide show
  1. package/assets/pficon/pficon.scss +1 -1
  2. package/base/normalize.scss +2 -2
  3. package/base/patternfly-pf-icons.css +1 -1
  4. package/components/Alert/alert-group.css +50 -7
  5. package/components/Alert/alert-group.scss +114 -28
  6. package/components/Banner/banner.css +2 -2
  7. package/components/Banner/banner.scss +2 -2
  8. package/components/Breadcrumb/breadcrumb.css +3 -2
  9. package/components/Breadcrumb/breadcrumb.scss +3 -2
  10. package/components/Button/button.css +63 -2
  11. package/components/Button/button.scss +74 -2
  12. package/components/Card/card.css +17 -0
  13. package/components/Card/card.scss +22 -0
  14. package/components/ClipboardCopy/clipboard-copy.css +3 -0
  15. package/components/ClipboardCopy/clipboard-copy.scss +4 -0
  16. package/components/Content/content.css +2 -1
  17. package/components/Content/content.scss +2 -1
  18. package/components/DescriptionList/description-list.css +3 -2
  19. package/components/DescriptionList/description-list.scss +3 -2
  20. package/components/Drawer/drawer.css +3 -1
  21. package/components/Drawer/drawer.scss +3 -1
  22. package/components/Form/form.css +3 -6
  23. package/components/Form/form.scss +3 -7
  24. package/components/HelperText/helper-text.css +13 -0
  25. package/components/HelperText/helper-text.scss +16 -0
  26. package/components/JumpLinks/jump-links.css +1 -1
  27. package/components/JumpLinks/jump-links.scss +1 -1
  28. package/components/Label/label.css +3 -2
  29. package/components/Label/label.scss +3 -2
  30. package/components/Masthead/masthead.css +1 -1
  31. package/components/Masthead/masthead.scss +1 -1
  32. package/components/Menu/menu.css +15 -7
  33. package/components/Menu/menu.scss +14 -5
  34. package/components/MenuToggle/menu-toggle.css +41 -0
  35. package/components/MenuToggle/menu-toggle.scss +49 -0
  36. package/components/Nav/nav.css +46 -13
  37. package/components/Nav/nav.scss +57 -17
  38. package/components/Page/page.css +16 -1
  39. package/components/Page/page.scss +17 -3
  40. package/components/Popover/popover.css +2 -0
  41. package/components/Popover/popover.scss +2 -0
  42. package/components/Progress/progress.css +3 -0
  43. package/components/Progress/progress.scss +3 -0
  44. package/components/ProgressStepper/progress-stepper.css +2 -1
  45. package/components/ProgressStepper/progress-stepper.scss +2 -1
  46. package/components/SimpleList/simple-list.css +2 -2
  47. package/components/SimpleList/simple-list.scss +2 -2
  48. package/components/Switch/switch.css +3 -1
  49. package/components/Switch/switch.scss +4 -2
  50. package/components/Table/table.css +3 -3
  51. package/components/Table/table.scss +3 -2
  52. package/components/Tabs/tabs.css +1 -1
  53. package/components/Tabs/tabs.scss +1 -1
  54. package/components/Timestamp/timestamp.css +2 -1
  55. package/components/Timestamp/timestamp.scss +2 -1
  56. package/components/ToggleGroup/toggle-group.css +1 -1
  57. package/components/ToggleGroup/toggle-group.scss +1 -1
  58. package/components/Toolbar/toolbar.css +6 -1
  59. package/components/Toolbar/toolbar.scss +7 -1
  60. package/components/Wizard/wizard.css +1 -1
  61. package/components/Wizard/wizard.scss +1 -1
  62. package/components/_index.css +310 -60
  63. package/docs/components/Alert/examples/Alert.md +6 -0
  64. package/docs/components/Avatar/examples/Avatar.md +4 -4
  65. package/docs/components/Brand/examples/Brand.md +2 -2
  66. package/docs/components/Button/examples/Button.md +29 -0
  67. package/docs/components/Card/examples/Card.md +30 -0
  68. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +29 -0
  69. package/docs/components/DataList/examples/DataList.md +3 -3
  70. package/docs/components/DescriptionList/examples/DescriptionList.md +2 -2
  71. package/docs/components/Divider/examples/Divider.md +2 -2
  72. package/docs/components/Drawer/examples/Drawer.md +3 -3
  73. package/docs/components/JumpLinks/examples/JumpLinks.md +2 -2
  74. package/docs/components/Masthead/examples/masthead.md +1 -1
  75. package/docs/components/Menu/examples/Menu.md +8 -8
  76. package/docs/components/Nav/examples/Navigation.md +3 -0
  77. package/docs/components/Page/examples/Page.md +2 -2
  78. package/docs/components/Pagination/examples/Pagination.md +3 -3
  79. package/docs/components/ProgressStepper/examples/ProgressStepper.md +2 -2
  80. package/docs/components/Sidebar/examples/Sidebar.md +1 -1
  81. package/docs/components/Table/examples/Table.md +17 -29
  82. package/docs/components/Tabs/examples/Tabs.md +148 -6
  83. package/docs/components/TextInputGroup/examples/TextInputGroup.md +10 -0
  84. package/docs/components/Toolbar/examples/Toolbar.css +3 -0
  85. package/docs/components/Toolbar/examples/Toolbar.md +35 -7
  86. package/docs/demos/Card/examples/Card.md +32 -24
  87. package/docs/demos/CardView/examples/CardView.md +2 -0
  88. package/docs/demos/Nav/examples/Nav.md +2 -0
  89. package/docs/layouts/Flex/examples/Flex.md +1 -1
  90. package/docs/layouts/Gallery/examples/Gallery.md +2 -2
  91. package/docs/layouts/Grid/examples/Grid.md +4 -4
  92. package/docs/utilities/Accessibility/examples/Accessibility.md +1 -1
  93. package/docs/utilities/Alignment/examples/Alignment.md +1 -1
  94. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +1 -1
  95. package/docs/utilities/Display/examples/Display.md +1 -1
  96. package/docs/utilities/Flex/examples/Flex.md +1 -1
  97. package/docs/utilities/Float/examples/Float.md +1 -1
  98. package/docs/utilities/Sizing/examples/Sizing.md +6 -6
  99. package/docs/utilities/Spacing/examples/Spacing.md +1 -1
  100. package/docs/utilities/Text/examples/Text.md +1 -1
  101. package/package.json +2 -2
  102. package/patternfly-base-no-globals.css +1 -1
  103. package/patternfly-base.css +3 -3
  104. package/patternfly-charts.css +83 -0
  105. package/patternfly-charts.scss +126 -0
  106. package/patternfly-no-globals.css +311 -61
  107. package/patternfly.css +313 -63
  108. package/patternfly.min.css +1 -1
  109. package/patternfly.min.css.map +1 -1
  110. package/docs/components/TabContent/examples/TabContent.md +0 -153
package/patternfly.css CHANGED
@@ -118,12 +118,12 @@ pre) {
118
118
 
119
119
  :where(a) {
120
120
  color: var(--pf-t--global--text--color--link--default);
121
- text-decoration: var(--pf-t--global--text-decoration--link--line--default);
121
+ text-decoration-line: var(--pf-t--global--text-decoration--link--line--default);
122
122
  }
123
123
 
124
124
  :where(a:hover, a:focus) {
125
125
  color: var(--pf-t--global--text--color--link--hover);
126
- text-decoration: var(--pf-t--global--text-decoration--link--line--hover);
126
+ text-decoration-line: var(--pf-t--global--text-decoration--link--line--hover);
127
127
  }
128
128
 
129
129
  :where(a,
@@ -5802,7 +5802,7 @@ button) {
5802
5802
  font-style: normal;
5803
5803
  font-variant: normal;
5804
5804
  font-weight: normal;
5805
- text-decoration: none;
5805
+ text-decoration-line: none;
5806
5806
  text-transform: none;
5807
5807
  }
5808
5808
 
@@ -8172,6 +8172,48 @@ button) {
8172
8172
  --pf-v6-c-alert-group--m-toast--InsetInlineEnd: var(--pf-t--global--spacer--xl);
8173
8173
  --pf-v6-c-alert-group--m-toast--MaxWidth: 37.5rem;
8174
8174
  --pf-v6-c-alert-group--m-toast--ZIndex: var(--pf-t--global--z-index--2xl);
8175
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default);
8176
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--decelerate);
8177
+ --pf-v6-c-alert-group--m-toast__item--Transition--opacity--default: var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity--default)
8178
+ var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity--default)
8179
+ 0s;
8180
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity: var(--pf-t--global--motion--duration--fade--default);
8181
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--decelerate);
8182
+ --pf-v6-c-alert-group--m-toast__item--TransitionDelay--opacity: var(--pf-t--global--motion--delay--none);
8183
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
8184
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--decelerate);
8185
+ --pf-v6-c-alert-group--m-toast__item--TransitionDelay--transform: var(--pf-t--global--motion--delay--none);
8186
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--default);
8187
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--decelerate);
8188
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--slide-in--default);
8189
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--decelerate);
8190
+ --pf-v6-c-alert-group--m-toast__item--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
8191
+ --pf-v6-c-alert-group--m-toast__item--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
8192
+ --pf-v6-c-alert-group--m-toast__item--c-alert--Transition: all
8193
+ var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionDuration)
8194
+ var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionTimingFunction)
8195
+ 0s;
8196
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default);
8197
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--accelerate);
8198
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default: var(--pf-t--global--motion--duration--fade--default);
8199
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default: var(--pf-t--global--motion--duration--fade--default);
8200
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default: var(--pf-t--global--motion--duration--fade--default);
8201
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-out--short);
8202
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--accelerate);
8203
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity: var(--pf-t--global--motion--duration--slide-out--short);
8204
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--accelerate);
8205
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--fade--short);
8206
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--accelerate);
8207
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block: var(--pf-t--global--motion--duration--slide-out--short);
8208
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--short);
8209
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--accelerate);
8210
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows: var(--pf-t--global--motion--duration--slide-out--short);
8211
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-out--short);
8212
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
8213
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: all
8214
+ var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration)
8215
+ var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction)
8216
+ var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration);
8175
8217
  --pf-v6-c-alert-group__overflow-button--BorderWidth: 0;
8176
8218
  --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
8177
8219
  --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -8220,15 +8262,15 @@ button) {
8220
8262
  display: grid;
8221
8263
  grid-template-rows: 1fr;
8222
8264
  opacity: 1;
8223
- transition: opacity var(--pf-t--global--motion--duration--fade--default) var(--pf-t--global--motion--timing-function--decelerate) 0s;
8265
+ transition: opacity var(--pf-v6-c-alert-group--m-toast__item--Transition--opacity--default);
8224
8266
  transform: translateX(0) translateY(0);
8225
8267
  }
8226
8268
  @media screen and (prefers-reduced-motion: no-preference) {
8227
8269
  .pf-v6-c-alert-group__item {
8228
- transition: opacity var(--pf-t--global--motion--duration--fade--default) var(--pf-t--global--motion--timing-function--decelerate) var(--pf-t--global--motion--duration--slide-in--default), transform var(--pf-t--global--motion--duration--slide-in--default) var(--pf-t--global--motion--timing-function--decelerate) var(--pf-t--global--motion--duration--slide-in--default), grid-template-rows var(--pf-t--global--motion--duration--slide-in--default) var(--pf-t--global--motion--timing-function--decelerate) 0s, margin-block var(--pf-t--global--motion--duration--slide-in--default) var(--pf-t--global--motion--timing-function--decelerate) 0s;
8270
+ transition: opacity var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity) var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity) var(--pf-v6-c-alert-group--m-toast__item--TransitionDelay--opacity), transform var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--transform) var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--transform) var(--pf-v6-c-alert-group--m-toast__item--TransitionDelay--transform), grid-template-rows var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--grid-template-rows) var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--grid-template-rows), margin-block var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--margin-block) var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--margin-block);
8229
8271
  }
8230
8272
  .pf-v6-c-alert-group__item .pf-v6-c-alert {
8231
- transition: all var(--pf-t--global--motion--duration--slide-in--default) var(--pf-t--global--motion--timing-function--decelerate);
8273
+ transition: var(--pf-v6-c-alert-group--m-toast__item--c-alert--Transition);
8232
8274
  }
8233
8275
  }
8234
8276
  .pf-v6-c-alert-group__item.pf-m-offstage-top {
@@ -8249,21 +8291,22 @@ button) {
8249
8291
  margin-block: 0;
8250
8292
  overflow: hidden;
8251
8293
  opacity: 0;
8252
- transition: opacity var(--pf-t--global--motion--duration--fade--short) var(--pf-t--global--motion--timing-function--accelerate) 0s;
8253
- transform: translateX(100%);
8294
+ transition: grid-template-rows 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default), margin-block 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default), opacity var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default);
8254
8295
  }
8255
8296
  .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
8256
8297
  min-height: 0;
8257
8298
  padding-block-start: 0;
8258
8299
  padding-block-end: 0;
8259
8300
  border-width: 0;
8301
+ transition: all 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default);
8260
8302
  }
8261
8303
  @media screen and (prefers-reduced-motion: no-preference) {
8262
8304
  .pf-v6-c-alert-group__item.pf-m-offstage-right {
8263
- transition: transform var(--pf-t--global--motion--duration--slide-out--short) var(--pf-t--global--motion--timing-function--accelerate) 0s, opacity var(--pf-t--global--motion--duration--slide-out--short) var(--pf-t--global--motion--timing-function--accelerate) 0s, margin-block var(--pf-t--global--motion--duration--fade--short) var(--pf-t--global--motion--timing-function--accelerate) var(--pf-t--global--motion--duration--slide-out--short), grid-template-rows var(--pf-t--global--motion--duration--slide-in--short) var(--pf-t--global--motion--timing-function--accelerate) var(--pf-t--global--motion--duration--slide-out--short);
8305
+ transition: transform var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform), opacity var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity), margin-block var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block), grid-template-rows var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows);
8306
+ transform: translateX(100%);
8264
8307
  }
8265
8308
  .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
8266
- transition: all var(--pf-t--global--motion--duration--slide-out--short) var(--pf-t--global--motion--timing-function--accelerate) var(--pf-t--global--motion--duration--slide-out--short);
8309
+ transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition);
8267
8310
  }
8268
8311
  }
8269
8312
  .pf-v6-c-alert-group__item:hover {
@@ -8795,7 +8838,7 @@ button) {
8795
8838
  }
8796
8839
  .pf-v6-c-banner a {
8797
8840
  color: var(--pf-v6-c-banner--link--Color);
8798
- text-decoration: var(--pf-v6-c-banner--link--TextDecoration);
8841
+ text-decoration-line: var(--pf-v6-c-banner--link--TextDecoration);
8799
8842
  }
8800
8843
  .pf-v6-c-banner a:hover:not(.pf-m-disabled) {
8801
8844
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
@@ -8808,7 +8851,7 @@ button) {
8808
8851
  --pf-v6-c-button--m-link--Color: var(--pf-v6-c-banner--link--Color);
8809
8852
  --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
8810
8853
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
8811
- text-decoration: var(--pf-v6-c-banner--link--TextDecoration);
8854
+ text-decoration-line: var(--pf-v6-c-banner--link--TextDecoration);
8812
8855
  }
8813
8856
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:disabled, .pf-v6-c-banner .pf-v6-c-button.pf-m-inline.pf-m-disabled {
8814
8857
  cursor: not-allowed;
@@ -8947,7 +8990,8 @@ button) {
8947
8990
  font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
8948
8991
  line-height: inherit;
8949
8992
  color: var(--pf-v6-c-breadcrumb__link--Color);
8950
- text-decoration: var(--pf-v6-c-breadcrumb__link--TextDecorationLine) var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
8993
+ text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
8994
+ text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
8951
8995
  word-break: break-word;
8952
8996
  background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
8953
8997
  }
@@ -8961,7 +9005,7 @@ button) {
8961
9005
  }
8962
9006
  .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
8963
9007
  color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
8964
- text-decoration: none;
9008
+ text-decoration-line: none;
8965
9009
  }
8966
9010
  button.pf-v6-c-breadcrumb__link {
8967
9011
  border: none;
@@ -9008,6 +9052,7 @@ button.pf-v6-c-breadcrumb__link {
9008
9052
  --pf-v6-c-button--BorderRadius: var(--pf-t--global--border--radius--pill);
9009
9053
  --pf-v6-c-button--TextDecorationLine: none;
9010
9054
  --pf-v6-c-button--TextDecorationStyle: none;
9055
+ --pf-v6-c-button--TextDecorationColor: currentcolor;
9011
9056
  --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
9012
9057
  --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
9013
9058
  --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
@@ -9016,6 +9061,7 @@ button.pf-v6-c-breadcrumb__link {
9016
9061
  --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
9017
9062
  --pf-v6-c-button--hover--TextDecorationLine: none;
9018
9063
  --pf-v6-c-button--hover--TextDecorationStyle: none;
9064
+ --pf-v6-c-button--hover--TextDecorationColor: currentcolor;
9019
9065
  --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
9020
9066
  --pf-v6-c-button--m-clicked--BorderColor: transparent;
9021
9067
  --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
@@ -9100,6 +9146,12 @@ button.pf-v6-c-breadcrumb__link {
9100
9146
  --pf-v6-c-button--span--m-link--m-inline--Display: inline;
9101
9147
  --pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
9102
9148
  --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
9149
+ --pf-v6-c-button--m-link--m-inline--Color: var(--pf-t--global--text--color--brand--default);
9150
+ --pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
9151
+ --pf-v6-c-button--m-link--m-inline--TextDecorationColor: currentcolor;
9152
+ --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
9153
+ --pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
9154
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: currentcolor;
9103
9155
  --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
9104
9156
  --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
9105
9157
  --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
@@ -9207,6 +9259,7 @@ button.pf-v6-c-breadcrumb__link {
9207
9259
  --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
9208
9260
  --pf-v6-c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
9209
9261
  --pf-v6-c-button--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9262
+ --pf-v6-c-button--disabled--TextDecorationColor: currentcolor;
9210
9263
  --pf-v6-c-button--disabled--BorderColor: transparent;
9211
9264
  --pf-v6-c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
9212
9265
  --pf-v6-c-button__icon--Color: var(--pf-t--global--icon--color--regular);
@@ -9216,6 +9269,14 @@ button.pf-v6-c-breadcrumb__link {
9216
9269
  --pf-v6-c-button__icon--MarginInlineEnd: 0;
9217
9270
  --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
9218
9271
  --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
9272
+ --pf-v6-c-button--m-notify__icon--AnimationDuration--notify: var(--pf-t--global--motion--duration--3xl);
9273
+ --pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify: var(--pf-t--global--motion--timing-function--default);
9274
+ --pf-v6-c-button--m-favorite__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
9275
+ --pf-v6-c-button--m-favorite__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
9276
+ --pf-v6-c-button--m-favorited__icon--Color: var(--pf-t--global--color--favorite--default);
9277
+ --pf-v6-c-button--m-favorited--hover__icon--Color: var(--pf-t--global--color--favorite--hover);
9278
+ --pf-v6-c-button--m-favorited__icon--AnimationDuration: var(--pf-t--global--motion--duration--icon--long);
9279
+ --pf-v6-c-button--m-favorited__icon--AnimationTimingFunction: var(--pf-t--global--motion--timing-function--default);
9219
9280
  --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
9220
9281
  --pf-v6-c-button__progress--Opacity: 0;
9221
9282
  --pf-v6-c-button__progress--TranslateY: -50%;
@@ -9251,7 +9312,9 @@ button.pf-v6-c-breadcrumb__link {
9251
9312
  line-height: var(--pf-v6-c-button--LineHeight, inherit);
9252
9313
  color: var(--pf-v6-c-button--Color);
9253
9314
  text-align: center;
9254
- text-decoration: var(--pf-v6-c-button--TextDecorationLine) var(--pf-v6-c-button--TextDecorationStyle);
9315
+ text-decoration-line: var(--pf-v6-c-button--TextDecorationLine);
9316
+ text-decoration-style: var(--pf-v6-c-button--TextDecorationStyle);
9317
+ text-decoration-color: var(--pf-v6-c-button--TextDecorationColor);
9255
9318
  white-space: nowrap;
9256
9319
  cursor: pointer;
9257
9320
  user-select: none;
@@ -9364,6 +9427,12 @@ button.pf-v6-c-breadcrumb__link {
9364
9427
  --pf-v6-c-button--disabled--BackgroundColor: transparent;
9365
9428
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-button--m-link--m-inline--disabled--Color);
9366
9429
  --pf-v6-c-button--disabled__icon--Color: var(--pf-v6-c-button--m-link--m-inline--disabled__icon--Color);
9430
+ --pf-v6-c-button--m-link--Color: var(--pf-v6-c-button--m-link--m-inline--Color);
9431
+ --pf-v6-c-button--m-link__icon--Color: var(--pf-v6-c-button--m-link--m-inline__icon--Color);
9432
+ --pf-v6-c-button--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--TextDecorationColor);
9433
+ --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
9434
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
9435
+ --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
9367
9436
  text-align: start;
9368
9437
  white-space: normal;
9369
9438
  outline-offset: 0.125rem;
@@ -9517,6 +9586,20 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
9517
9586
  --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-display-lg--PaddingInlineStart);
9518
9587
  --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-display-lg--FontSize);
9519
9588
  }
9589
+ .pf-v6-c-button.pf-m-favorite .pf-v6-c-button__icon {
9590
+ transition-timing-function: var(--pf-v6-c-button--m-favorite__icon--TransitionTimingFunction);
9591
+ transition-duration: var(--pf-v6-c-button--m-favorite__icon--TransitionDuration);
9592
+ transition-property: color;
9593
+ }
9594
+ .pf-v6-c-button.pf-m-favorited {
9595
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
9596
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
9597
+ }
9598
+ .pf-v6-c-button.pf-m-favorited .pf-v6-c-button__icon {
9599
+ animation-name: pf-v6-c-button-icon-favorited;
9600
+ animation-duration: var(--pf-v6-c-button--m-favorited__icon--AnimationDuration);
9601
+ animation-timing-function: var(--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction);
9602
+ }
9520
9603
  .pf-v6-c-button:hover, .pf-v6-c-button:focus {
9521
9604
  --pf-v6-c-button--Color: var(--pf-v6-c-button--hover--Color);
9522
9605
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
@@ -9524,7 +9607,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
9524
9607
  --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
9525
9608
  --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color);
9526
9609
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
9527
- text-decoration: var(--pf-v6-c-button--hover--TextDecorationLine) var(--pf-v6-c-button--hover--TextDecorationStyle);
9610
+ text-decoration-line: var(--pf-v6-c-button--hover--TextDecorationLine);
9611
+ text-decoration-style: var(--pf-v6-c-button--hover--TextDecorationStyle);
9612
+ text-decoration-color: var(--pf-v6-c-button--hover--TextDecorationColor);
9528
9613
  }
9529
9614
  .pf-v6-c-button.pf-m-clicked {
9530
9615
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-clicked--Color);
@@ -9538,6 +9623,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
9538
9623
  }
9539
9624
  .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled, .pf-v6-c-button.pf-m-aria-disabled {
9540
9625
  color: var(--pf-v6-c-button--disabled--Color);
9626
+ text-decoration-color: var(--pf-v6-c-button--disabled--TextDecorationColor);
9541
9627
  background-color: var(--pf-v6-c-button--disabled--BackgroundColor);
9542
9628
  }
9543
9629
  .pf-v6-c-button:disabled::after, .pf-v6-c-button.pf-m-disabled::after, .pf-v6-c-button.pf-m-aria-disabled::after {
@@ -9569,6 +9655,11 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
9569
9655
  .pf-v6-c-button.pf-m-in-progress.pf-m-plain > :not(.pf-v6-c-button__progress) {
9570
9656
  opacity: 0;
9571
9657
  }
9658
+ .pf-v6-c-button.pf-m-notify .pf-v6-c-button__icon {
9659
+ animation-name: pf-v6-c-button-icon-notify;
9660
+ animation-duration: var(--pf-v6-c-button--m-notify__icon--AnimationDuration--notify);
9661
+ animation-timing-function: var(--pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify);
9662
+ }
9572
9663
 
9573
9664
  .pf-v6-c-button__icon {
9574
9665
  margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
@@ -9599,6 +9690,19 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
9599
9690
  align-items: center;
9600
9691
  }
9601
9692
 
9693
+ @keyframes pf-v6-c-button-icon-notify {
9694
+ 33% {
9695
+ transform: rotate(30deg);
9696
+ }
9697
+ 66% {
9698
+ transform: rotate(-60deg);
9699
+ }
9700
+ }
9701
+ @keyframes pf-v6-c-button-icon-favorited {
9702
+ 50% {
9703
+ transform: scale(1.5);
9704
+ }
9705
+ }
9602
9706
  .pf-v6-c-calendar-month {
9603
9707
  --pf-v6-c-calendar-month--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9604
9708
  --pf-v6-c-calendar-month--PaddingBlockStart: var(--pf-t--global--spacer--lg);
@@ -9829,6 +9933,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
9829
9933
  --pf-v6-c-card__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--default);
9830
9934
  --pf-v6-c-card__actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
9831
9935
  --pf-v6-c-card__actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
9936
+ --pf-v6-c-card__header--m-wrap--RowGap: var(--pf-t--global--spacer--sm);
9937
+ --pf-v6-c-card__header--m-wrap--ColumnGap: var(--pf-t--global--spacer--md);
9832
9938
  --pf-v6-c-card__header-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
9833
9939
  --pf-v6-c-card__header-toggle--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
9834
9940
  --pf-v6-c-card__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
@@ -9992,6 +10098,21 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
9992
10098
  .pf-v6-c-card__header.pf-m-toggle-right .pf-v6-c-card__header-toggle {
9993
10099
  order: 2;
9994
10100
  }
10101
+ .pf-v6-c-card__header.pf-m-wrap {
10102
+ --pf-v6-c-card__actions--PaddingInlineStart: 0;
10103
+ gap: var(--pf-v6-c-card__header--m-wrap--RowGap) var(--pf-v6-c-card__header--m-wrap--ColumnGap);
10104
+ }
10105
+ .pf-v6-c-card__header.pf-m-wrap,
10106
+ .pf-v6-c-card__header.pf-m-wrap .pf-v6-c-card__actions {
10107
+ flex-wrap: wrap;
10108
+ row-gap: var(--pf-v6-c-card__header--m-wrap--RowGap);
10109
+ }
10110
+ .pf-v6-c-card__header.pf-m-wrap .pf-v6-c-card__actions {
10111
+ margin-inline-start: 0;
10112
+ }
10113
+ .pf-v6-c-card__header.pf-m-wrap .pf-v6-c-card__actions + * {
10114
+ margin-inline-end: auto;
10115
+ }
9995
10116
 
9996
10117
  .pf-v6-c-card__header-main {
9997
10118
  flex-grow: 1;
@@ -10258,6 +10379,9 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
10258
10379
  .pf-v6-c-clipboard-copy.pf-m-inline.pf-m-block {
10259
10380
  display: block;
10260
10381
  }
10382
+ .pf-v6-c-clipboard-copy.pf-m-inline.pf-m-truncate {
10383
+ display: inline-flex;
10384
+ }
10261
10385
 
10262
10386
  .pf-v6-c-clipboard-copy__group {
10263
10387
  display: flex;
@@ -10643,7 +10767,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
10643
10767
 
10644
10768
  :is(.pf-v6-c-content--a, .pf-v6-c-content a) {
10645
10769
  color: var(--pf-v6-c-content--a--Color);
10646
- text-decoration: var(--pf-v6-c-content--a--TextDecorationLine) var(--pf-v6-c-content--a--TextDecorationStyle);
10770
+ text-decoration-line: var(--pf-v6-c-content--a--TextDecorationLine);
10771
+ text-decoration-style: var(--pf-v6-c-content--a--TextDecorationStyle);
10647
10772
  }
10648
10773
  :is(.pf-v6-c-content--a, .pf-v6-c-content a):is(:hover, :focus) {
10649
10774
  --pf-v6-c-content--a--Color: var(--pf-v6-c-content--a--hover--Color);
@@ -11681,7 +11806,7 @@ ul) {
11681
11806
  --pf-v6-c-description-list__term--Display: inline;
11682
11807
  --pf-v6-c-description-list__term--sm--Display: flex;
11683
11808
  --pf-v6-c-description-list__term--FontWeight: var(--pf-t--global--font--weight--body--bold);
11684
- --pf-v6-c-description-list__term--FontSize: var(--pf-t--global--font--size--body--sm);
11809
+ --pf-v6-c-description-list__term--FontSize: var(--pf-t--global--font--size--body--default);
11685
11810
  --pf-v6-c-description-list__term--LineHeight: var(--pf-t--global--font--line-height--body);
11686
11811
  --pf-v6-c-description-list__term-icon--MinWidth: var(--pf-t--global--font--size--body--sm);
11687
11812
  --pf-v6-c-description-list__term-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -11863,7 +11988,8 @@ ul) {
11863
11988
  min-width: 0;
11864
11989
  }
11865
11990
  .pf-v6-c-description-list__text.pf-m-help-text {
11866
- text-decoration: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationLine) var(--pf-v6-c-description-list__text--m-help-text--TextDecorationStyle);
11991
+ text-decoration-line: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationLine);
11992
+ text-decoration-style: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationStyle);
11867
11993
  text-underline-offset: var(--pf-v6-c-description-list__text--m-help-text--TextUnderlineOffset);
11868
11994
  cursor: pointer;
11869
11995
  }
@@ -12766,7 +12892,8 @@ ul) {
12766
12892
  --pf-v6-c-drawer__panel--RowGap: var(--pf-t--global--spacer--sm);
12767
12893
  --pf-v6-c-drawer__panel--PaddingBlockStart: var(--pf-t--global--spacer--sm);
12768
12894
  --pf-v6-c-drawer__panel--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
12769
- --pf-v6-c-drawer__panel--TransitionDuration: 250ms;
12895
+ --pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
12896
+ --pf-v6-c-drawer__panel--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--short);
12770
12897
  --pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis;
12771
12898
  --pf-v6-c-drawer__panel--FlexBasis: 100%;
12772
12899
  --pf-v6-c-drawer__panel--md--FlexBasis--min: 1.5rem;
@@ -12980,6 +13107,7 @@ ul) {
12980
13107
  overflow: auto;
12981
13108
  background-color: var(--pf-v6-c-drawer__panel--BackgroundColor);
12982
13109
  box-shadow: var(--pf-v6-c-drawer__panel--BoxShadow);
13110
+ transition-timing-function: var(--pf-v6-c-drawer__panel--TransitionTimingFunction);
12983
13111
  transition-duration: var(--pf-v6-c-drawer__panel--TransitionDuration);
12984
13112
  transition-property: var(--pf-v6-c-drawer__panel--TransitionProperty);
12985
13113
  -webkit-overflow-scrolling: touch;
@@ -13876,16 +14004,16 @@ ul) {
13876
14004
  --pf-v6-c-form__group-label--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
13877
14005
  --pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart: 0;
13878
14006
  --pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY: calc(((((var(--pf-t--global--font--size--body--sm) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--sm)) / 2) + var(--pf-t--global--font--size--body--sm)) - ((((var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--default)) / 2) + var(--pf-t--global--font--size--body--default)));
13879
- --pf-v6-c-form__label--FontSize: var(--pf-t--global--font--size--body--sm);
14007
+ --pf-v6-c-form__label--FontSize: var(--pf-t--global--font--size--body--default);
13880
14008
  --pf-v6-c-form__label--LineHeight: var(--pf-t--global--font--line-height--body);
13881
14009
  --pf-v6-c-form__label--m-disabled--Color: var(--pf-t--global--text--color--disabled);
13882
14010
  --pf-v6-c-form__label--hover--Cursor: pointer;
13883
14011
  --pf-v6-c-form__label--m-disabled--hover--Cursor: not-allowed;
13884
14012
  --pf-v6-c-form__label-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
13885
14013
  --pf-v6-c-form__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
13886
- --pf-v6-c-form__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
14014
+ --pf-v6-c-form__label-required--FontSize: var(--pf-t--global--font--size--body--default);
13887
14015
  --pf-v6-c-form__label-required--Color: var(--pf-t--global--color--status--danger--default);
13888
- --pf-v6-c-form__group-label-help--FontSize: var(--pf-t--global--font--size--body--sm);
14016
+ --pf-v6-c-form__group-label-help--FontSize: var(--pf-t--global--font--size--body--default);
13889
14017
  --pf-v6-c-form__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--horizontal);
13890
14018
  --pf-v6-c-form__group-label-info--FontSize: var(--pf-t--global--font--size--body--sm);
13891
14019
  --pf-v6-c-form--m-horizontal__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--group--vertical);
@@ -14199,9 +14327,6 @@ ul) {
14199
14327
  font-size: var(--pf-v6-c-form__label--FontSize);
14200
14328
  line-height: var(--pf-v6-c-form__label--LineHeight);
14201
14329
  }
14202
- .pf-v6-c-form__label::selection {
14203
- background-color: none;
14204
- }
14205
14330
  .pf-v6-c-form__label:not(.pf-m-disabled):hover {
14206
14331
  cursor: var(--pf-v6-c-form__label--hover--Cursor);
14207
14332
  }
@@ -14758,6 +14883,8 @@ select ~ .pf-v6-c-form-control__utilities {
14758
14883
  --pf-v6-c-helper-text__item-text--m-success--FontWeight: var(--pf-t--global--font--weight--body--bold);
14759
14884
  --pf-v6-c-helper-text__item-icon--m-error--Color: var(--pf-t--global--icon--color--status--danger--default);
14760
14885
  --pf-v6-c-helper-text__item-text--m-error--FontWeight: var(--pf-t--global--font--weight--body--bold);
14886
+ --pf-v6-c-helper-text__item--m-error--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
14887
+ --pf-v6-c-helper-text__item--m-error--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
14761
14888
  --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-t--global--icon--color--regular);
14762
14889
  --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color: var(--pf-t--global--icon--color--subtle);
14763
14890
  --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color: var(--pf-t--global--text--color--subtle);
@@ -14802,6 +14929,17 @@ select ~ .pf-v6-c-form-control__utilities {
14802
14929
  --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-error--FontWeight);
14803
14930
  --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-error--Color);
14804
14931
  --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color);
14932
+ animation-name: --pf-v6-c-helper-text-item-fade-in;
14933
+ animation-duration: var(--pf-v6-c-helper-text__item--m-error--TransitionDuration--Opacity);
14934
+ animation-timing-function: var(--pf-v6-c-helper-text__item--m-error--TransitionTimingFunction--Opacity);
14935
+ }
14936
+ @keyframes --pf-v6-c-helper-text-item-fade-in {
14937
+ from {
14938
+ opacity: 0;
14939
+ }
14940
+ to {
14941
+ opacity: 1;
14942
+ }
14805
14943
  }
14806
14944
  .pf-v6-c-helper-text__item.pf-m-dynamic {
14807
14945
  --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic__item-icon--Color);
@@ -15416,7 +15554,7 @@ label.pf-v6-c-input-group__text {
15416
15554
  padding-block-end: var(--pf-v6-c-jump-links__link--PaddingBlockEnd);
15417
15555
  padding-inline-start: var(--pf-v6-c-jump-links__link--PaddingInlineStart);
15418
15556
  padding-inline-end: var(--pf-v6-c-jump-links__link--PaddingInlineEnd);
15419
- text-decoration: none;
15557
+ text-decoration-line: none;
15420
15558
  outline-offset: var(--pf-v6-c-jump-links__link--OutlineOffset);
15421
15559
  }
15422
15560
  .pf-v6-c-jump-links__link:is(:hover, :focus) {
@@ -15857,7 +15995,8 @@ label.pf-v6-c-input-group__text {
15857
15995
  --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-v6-c-label--m-editable--hover--TextDecorationStyle);
15858
15996
  }
15859
15997
  .pf-v6-c-label.pf-m-editable .pf-v6-c-label__text {
15860
- text-decoration: var(--pf-v6-c-label--m-editable--TextDecorationLine) var(--pf-v6-c-label--m-editable--TextDecorationStyle);
15998
+ text-decoration-line: var(--pf-v6-c-label--m-editable--TextDecorationLine);
15999
+ text-decoration-style: var(--pf-v6-c-label--m-editable--TextDecorationStyle);
15861
16000
  text-underline-offset: var(--pf-v6-c-label--m-editable--TextUnderlineOffset);
15862
16001
  }
15863
16002
  .pf-v6-c-label.pf-m-editable-active {
@@ -15890,7 +16029,7 @@ label.pf-v6-c-input-group__text {
15890
16029
  --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-clickable__content--Cursor);
15891
16030
  }
15892
16031
  .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content, .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
15893
- text-decoration: none;
16032
+ text-decoration-line: none;
15894
16033
  }
15895
16034
  .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
15896
16035
  --pf-v6-c-label--Color: var(--pf-v6-c-label--m-clickable--hover--Color);
@@ -16630,7 +16769,7 @@ ul.pf-v6-c-list {
16630
16769
  grid-column-end: -1;
16631
16770
  row-gap: var(--pf-v6-c-masthead__content-RowGap, var(--pf-v6-c-masthead--RowGap));
16632
16771
  column-gap: var(--pf-v6-c-masthead__content--ColumnGap, var(--pf-v6-c-masthead--ColumnGap));
16633
- align-self: stretch;
16772
+ align-self: center;
16634
16773
  order: var(--pf-v6-c-masthead__content--Order);
16635
16774
  min-width: 0.25rem;
16636
16775
  }
@@ -17157,11 +17296,20 @@ ul.pf-v6-c-list {
17157
17296
  .pf-v6-c-menu__item-action:is(.pf-m-disabled, :disabled, .pf-m-aria-disabled, [aria-disabled=true]) {
17158
17297
  --pf-v6-c-menu__item--Color: var(--pf-v6-c-menu__item--m-disabled--Color);
17159
17298
  --pf-v6-c-menu__item-toggle-icon--Color: var(--pf-v6-c-menu--icon--disabled--Color);
17160
- --pf-v6-c-menu__item-external-icon--Color: var(--pf-v6-c-menu--icon--disabled--Color);
17299
+ --pf-v6-c-menu__item-external--Color: transparent;
17300
+ --pf-v6-c-menu__item-select-icon--Color: transparent;
17161
17301
  --pf-v6-c-menu__item-description--Color: var(--pf-v6-c-menu--icon--disabled--Color);
17162
17302
  --pf-v6-c-menu__list-item--BackgroundColor: transparent;
17303
+ --pf-v6-c-menu__list-item--hover--BackgroundColor: transparent;
17304
+ }
17305
+ .pf-v6-c-menu__list-item:is(.pf-m-disabled, :disabled),
17306
+ .pf-v6-c-menu__item-action:is(.pf-m-disabled, :disabled) {
17163
17307
  pointer-events: none;
17164
17308
  }
17309
+ .pf-v6-c-menu__list-item.pf-m-aria-disabled .pf-v6-c-menu__item,
17310
+ .pf-v6-c-menu__item-action.pf-m-aria-disabled .pf-v6-c-menu__item {
17311
+ cursor: default;
17312
+ }
17165
17313
 
17166
17314
  [class*=pf-v6-c-menu]:is([hidden]) {
17167
17315
  display: none;
@@ -17305,7 +17453,6 @@ ul.pf-v6-c-list {
17305
17453
  z-index: var(--pf-v6-c-menu--ZIndex);
17306
17454
  margin-block-start: calc(var(--pf-v6-c-menu--RowGap) * -1);
17307
17455
  margin-block-end: calc(var(--pf-v6-c-menu--RowGap) * -1);
17308
- overflow: hidden;
17309
17456
  }
17310
17457
  .pf-v6-c-menu.pf-m-scrollable .pf-v6-c-menu__list {
17311
17458
  padding-block-start: var(--pf-v6-c-menu--RowGap);
@@ -17409,7 +17556,7 @@ ul.pf-v6-c-list {
17409
17556
  line-height: var(--pf-v6-c-menu__item--LineHeight);
17410
17557
  color: var(--pf-v6-c-menu__item--Color);
17411
17558
  text-align: start;
17412
- text-decoration: none;
17559
+ text-decoration-line: none;
17413
17560
  background-color: var(--pf-v6-c-menu__item--BackgroundColor);
17414
17561
  border: 0;
17415
17562
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
@@ -17529,16 +17676,16 @@ ul.pf-v6-c-list {
17529
17676
  opacity: 0;
17530
17677
  }
17531
17678
 
17532
- .pf-v6-c-menu__item-toggle-icon.pf-m-favorited, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button,
17679
+ .pf-v6-c-menu__item-toggle-icon.pf-m-favorited, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited),
17533
17680
  .pf-v6-c-menu__item-action.pf-m-favorited,
17534
17681
  .pf-v6-c-menu__item-action.pf-m-favorited:hover,
17535
- .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button {
17682
+ .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited) {
17536
17683
  --pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
17537
17684
  }
17538
- .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:is(:hover, :focus),
17685
+ .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus),
17539
17686
  .pf-v6-c-menu__item-action.pf-m-favorited:is(:hover, :focus),
17540
17687
  .pf-v6-c-menu__item-action.pf-m-favorited:hover:is(:hover, :focus),
17541
- .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:is(:hover, :focus) {
17688
+ .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus) {
17542
17689
  --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
17543
17690
  }
17544
17691
 
@@ -17683,12 +17830,16 @@ ul.pf-v6-c-list {
17683
17830
  --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
17684
17831
  --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
17685
17832
  --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
17833
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
17834
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
17686
17835
  --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
17687
17836
  --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
17688
17837
  --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
17689
17838
  --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
17690
17839
  --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
17691
17840
  --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
17841
+ --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
17842
+ --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
17692
17843
  --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
17693
17844
  --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
17694
17845
  }
@@ -17837,6 +17988,28 @@ ul.pf-v6-c-list {
17837
17988
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
17838
17989
  --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
17839
17990
  }
17991
+ @media screen and (prefers-reduced-motion: no-preference) {
17992
+ .pf-v6-c-menu-toggle.pf-m-danger {
17993
+ transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
17994
+ animation-name: pf-v6-c-menu-toggle-m-danger-motion;
17995
+ animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
17996
+ animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
17997
+ animation-fill-mode: both;
17998
+ }
17999
+ }
18000
+ .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
18001
+ animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
18002
+ animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
18003
+ animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
18004
+ }
18005
+ @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
18006
+ from {
18007
+ opacity: 0;
18008
+ }
18009
+ to {
18010
+ opacity: 1;
18011
+ }
18012
+ }
17840
18013
  .pf-v6-c-menu-toggle.pf-m-placeholder {
17841
18014
  --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
17842
18015
  }
@@ -17852,6 +18025,21 @@ ul.pf-v6-c-list {
17852
18025
  pointer-events: none;
17853
18026
  }
17854
18027
 
18028
+ @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
18029
+ syntax: "<length>";
18030
+ inherits: false;
18031
+ initial-value: 0;
18032
+ }
18033
+ @media (prefers-reduced-motion: no-preference) {
18034
+ @keyframes pf-v6-c-menu-toggle-m-danger-motion {
18035
+ 33% {
18036
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
18037
+ }
18038
+ 66% {
18039
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
18040
+ }
18041
+ }
18042
+ }
17855
18043
  .pf-v6-c-menu-toggle.pf-m-split-button {
17856
18044
  --pf-v6-c-menu-toggle--Gap: 0;
17857
18045
  --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
@@ -18441,13 +18629,15 @@ ul.pf-v6-c-list {
18441
18629
  --pf-v6-c-nav__item--ScrollSnapAlign: end;
18442
18630
  --pf-v6-c-nav__section-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
18443
18631
  --pf-v6-c-nav__section-title--Color: var(--pf-t--global--text--color--regular);
18444
- --pf-v6-c-nav__section-title--PaddingBlockStart: var(--pf-v6-c-nav__link--PaddingBlockStart);
18445
- --pf-v6-c-nav__section-title--PaddingBlockEnd: var(--pf-v6-c-nav__link--PaddingBlockEnd);
18632
+ --pf-v6-c-nav__section-title--PaddingBlockStart: 0;
18633
+ --pf-v6-c-nav__section-title--PaddingBlockEnd: 0;
18446
18634
  --pf-v6-c-nav__section-title--PaddingInlineStart: var(--pf-v6-c-nav__link--PaddingInlineStart);
18447
18635
  --pf-v6-c-nav__section-title--PaddingInlineEnd: var(--pf-v6-c-nav__link--PaddingInlineEnd);
18448
18636
  --pf-v6-c-nav__item--RowGap: var(--pf-v6-c-nav__list--RowGap);
18449
18637
  --pf-v6-c-nav__item__toggle-icon--Rotate: 0;
18450
18638
  --pf-v6-c-nav__item--m-expanded__toggle-icon--Rotate: 90deg;
18639
+ --pf-v6-c-nav__item__toggle-icon--TransitionDuration--transform: var(--pf-t--global--motion--duration--icon--default);
18640
+ --pf-v6-c-nav__item__toggle-icon--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--default);
18451
18641
  --pf-v6-c-nav__link--ColumnGap: var(--pf-t--global--spacer--sm);
18452
18642
  --pf-v6-c-nav__link--AlignItems: baseline;
18453
18643
  --pf-v6-c-nav__link--BorderRadius: var(--pf-t--global--border--radius--small);
@@ -18458,10 +18648,19 @@ ul.pf-v6-c-list {
18458
18648
  --pf-v6-c-nav__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--hover);
18459
18649
  --pf-v6-c-nav__link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--clicked);
18460
18650
  --pf-v6-c-nav__link--m-current--Color: var(--pf-t--global--text--color--regular);
18651
+ --pf-v6-c-nav__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--default);
18652
+ --pf-v6-c-nav__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
18653
+ --pf-v6-c-nav__link--m-current--TransitionDuration--color: var(--pf-t--global--motion--duration--fade--short);
18654
+ --pf-v6-c-nav__link--m-current--TransitionTimingFunction--color: var(--pf-t--global--motion--timing-function--default);
18461
18655
  --pf-v6-c-nav__link-icon--Color: var(--pf-t--global--icon--color--subtle);
18462
18656
  --pf-v6-c-nav__link--m-current__link-icon--Color: var(--pf-t--global--icon--color--regular);
18463
18657
  --pf-v6-c-nav__subnav--RowGap: var(--pf-t--global--border--width--extra-strong);
18658
+ --pf-v6-c-nav__subnav--PaddingBlockStart: var(--pf-v6-c-nav__item--RowGap);
18659
+ --pf-v6-c-nav__subnav--PaddingBlockEnd: var(--pf-v6-c-nav__item--RowGap);
18464
18660
  --pf-v6-c-nav__subnav--PaddingInlineStart: var(--pf-t--global--spacer--md);
18661
+ --pf-v6-c-nav__subnav--TransitionDuration--expansion: 0s;
18662
+ --pf-v6-c-nav__subnav--hidden--TransitionDuration--expansion: 0s;
18663
+ --pf-v6-c-nav__subnav--TransitionTimingFunction--expansion: var(--pf-t--global--motion--timing-function--default);
18465
18664
  --pf-v6-c-nav__scroll-button--BorderColor: var(--pf-t--global--border--color--default);
18466
18665
  --pf-v6-c-nav__scroll-button--BorderWidth: var(--pf-t--global--border--width--divider--default);
18467
18666
  --pf-v6-c-nav__scroll-button--first-of-type--c-button--BorderStartStartRadius: var(--pf-t--global--border--radius--pill);
@@ -18490,6 +18689,12 @@ ul.pf-v6-c-list {
18490
18689
  --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
18491
18690
  --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
18492
18691
  }
18692
+ @media (prefers-reduced-motion: no-preference) {
18693
+ .pf-v6-c-nav {
18694
+ --pf-v6-c-nav__subnav--TransitionDuration--expansion: var(--pf-t--global--motion--duration--slide-in--default);
18695
+ --pf-v6-c-nav__subnav--hidden--TransitionDuration--expansion: var(--pf-t--global--motion--duration--slide-in--short);
18696
+ }
18697
+ }
18493
18698
 
18494
18699
  .pf-v6-c-nav,
18495
18700
  .pf-v6-c-nav__section,
@@ -18541,7 +18746,7 @@ ul.pf-v6-c-list {
18541
18746
  }
18542
18747
 
18543
18748
  [class^=pf-v6-c-nav][hidden] {
18544
- display: none;
18749
+ visibility: hidden;
18545
18750
  }
18546
18751
 
18547
18752
  .pf-v6-c-nav__nav,
@@ -18550,30 +18755,43 @@ ul.pf-v6-c-list {
18550
18755
  --pf-v6-c-nav__item--RowGap--row-offset: calc(var(--pf-v6-c-nav__list--RowGap) / 2 * -1);
18551
18756
  --pf-v6-c-nav__link--clickable-inset--Block: var(--pf-v6-c-nav__item--RowGap--row-offset);
18552
18757
  --pf-v6-c-nav__button--RowGap--row-offset: calc(var(--pf-v6-c-nav__item--RowGap) * -1);
18758
+ visibility: visible;
18553
18759
  }
18554
18760
 
18555
18761
  .pf-v6-c-nav__list {
18556
18762
  row-gap: var(--pf-v6-c-nav__list--RowGap);
18557
18763
  column-gap: var(--pf-v6-c-nav__list--ColumnGap);
18764
+ min-height: 0;
18558
18765
  }
18559
18766
 
18560
18767
  .pf-v6-c-nav__subnav {
18561
18768
  --pf-v6-c-nav__list--RowGap: var(--pf-v6-c-nav__subnav--RowGap);
18769
+ grid-template-rows: 1fr;
18770
+ min-height: 0;
18771
+ padding-block-start: var(--pf-v6-c-nav__subnav--PaddingBlockStart);
18772
+ padding-block-end: var(--pf-v6-c-nav__subnav--PaddingBlockEnd);
18562
18773
  padding-inline-start: var(--pf-v6-c-nav__subnav--PaddingInlineStart);
18774
+ overflow-y: clip;
18775
+ transition-timing-function: var(--pf-v6-c-nav__subnav--TransitionTimingFunction--expansion);
18776
+ transition-duration: var(--pf-v6-c-nav__subnav--TransitionDuration--expansion);
18777
+ transition-property: grid-template-rows, padding-block-start, padding-block-end, opacity;
18778
+ }
18779
+ .pf-v6-c-nav__subnav[hidden] {
18780
+ --pf-v6-c-nav__subnav--TransitionDuration--expansion: var(--pf-v6-c-nav__subnav--hidden--TransitionDuration--expansion);
18781
+ --pf-v6-c-nav__subnav--PaddingBlockStart: 0;
18782
+ --pf-v6-c-nav__subnav--PaddingBlockEnd: 0;
18783
+ grid-template-rows: 0fr;
18784
+ opacity: 0;
18563
18785
  }
18564
18786
 
18565
18787
  .pf-v6-c-nav__item {
18566
- row-gap: var(--pf-v6-c-nav__item--RowGap);
18567
18788
  scroll-snap-align: var(--pf-v6-c-nav__item--ScrollSnapAlign);
18568
18789
  }
18569
18790
  .pf-v6-c-nav__item > .pf-v6-c-nav__link[button] {
18570
18791
  margin-block-end: var(--pf-v6-c-nav__button--RowGap--row-offset);
18571
18792
  }
18572
- .pf-v6-c-nav__item.pf-m-expanded:is(:not(:only-child, :last-child)) {
18573
- margin-block-end: var(--pf-v6-c-nav__item--m-expanded--MarginBlockEnd, var(--pf-v6-c-nav__item--RowGap));
18574
- }
18575
- .pf-v6-c-nav__item.pf-m-expanded:is(:not(:only-child, :last-child)) + .pf-v6-c-nav__item > .pf-v6-c-nav__link::before {
18576
- inset-block-start: calc(var(--pf-v6-c-nav__item--RowGap) * -1 - var(--pf-v6-c-nav__list--RowGap));
18793
+ .pf-v6-c-nav__item.pf-m-expanded:last-child > .pf-v6-c-nav__subnav {
18794
+ margin-block-end: calc(var(--pf-v6-c-nav__subnav--PaddingBlockEnd) * -1);
18577
18795
  }
18578
18796
 
18579
18797
  .pf-v6-c-nav__section {
@@ -18604,13 +18822,13 @@ ul.pf-v6-c-list {
18604
18822
  line-height: var(--pf-v6-c-nav__link--LineHeight, inherit);
18605
18823
  color: var(--pf-v6-c-nav__link--Color);
18606
18824
  text-align: start;
18607
- text-decoration: none;
18825
+ text-decoration-line: none;
18608
18826
  background-color: var(--pf-v6-c-nav__link--BackgroundColor);
18609
18827
  border: none;
18610
18828
  border-radius: var(--pf-v6-c-nav__link--BorderRadius);
18611
- }
18612
- .pf-v6-c-nav__link[aria-expanded=true]::before {
18613
- inset-block-end: calc(var(--pf-v6-c-nav__item--RowGap) * -1);
18829
+ transition-timing-function: var(--pf-v6-c-nav__link--TransitionTimingFunction--background-color), var(--pf-v6-c-nav__link--m-current--TransitionTimingFunction--color);
18830
+ transition-duration: var(--pf-v6-c-nav__link--TransitionDuration--background-color), var(--pf-v6-c-nav__link--m-current--TransitionDuration--color);
18831
+ transition-property: background-color, color;
18614
18832
  }
18615
18833
  .pf-v6-c-nav__link:hover, .pf-v6-c-nav__link.pf-m-hover, .pf-v6-c-nav__link:focus {
18616
18834
  color: var(--pf-v6-c-nav__link--hover--Color);
@@ -18635,6 +18853,9 @@ ul.pf-v6-c-list {
18635
18853
 
18636
18854
  .pf-v6-c-nav__toggle-icon {
18637
18855
  display: inline-block;
18856
+ transition-timing-function: var(--pf-v6-c-nav__item__toggle-icon--TransitionTimingFunction--transform);
18857
+ transition-duration: var(--pf-v6-c-nav__item__toggle-icon--TransitionDuration--transform);
18858
+ transition-property: transform;
18638
18859
  transform: rotate(var(--pf-v6-c-nav__item__toggle-icon--Rotate));
18639
18860
  }
18640
18861
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-nav__toggle-icon {
@@ -19074,12 +19295,18 @@ ul.pf-v6-c-list {
19074
19295
  --pf-v6-c-page__main-container--GridArea: main;
19075
19296
  --pf-v6-c-page--masthead--main-container--GridArea: sidebar / sidebar / main / main;
19076
19297
  --pf-v6-c-page__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg));
19298
+ --pf-v6-c-page__main-container--AlignSelf: start;
19077
19299
  --pf-v6-c-page__main-container--BackgroundColor: var(--pf-t--global--background--color--primary--default);
19078
19300
  --pf-v6-c-page__main-container--MarginInlineStart: var(--pf-v6-c-page--inset);
19079
19301
  --pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page--inset);
19080
19302
  --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--medium);
19081
19303
  --pf-v6-c-page__main-container--BorderWidth: 0.25rem;
19082
19304
  --pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
19305
+ --pf-v6-c-page__main-container--xs--AlignSelf: stretch;
19306
+ --pf-v6-c-page__main-container--xs--BorderRadius: 0;
19307
+ --pf-v6-c-page__main-container--xs--MarginInlineStart: 0;
19308
+ --pf-v6-c-page__main-container--xs--MaxHeight: 100%;
19309
+ --pf-v6-c-page__main-container--xs--MarginInlineEnd: 0;
19083
19310
  --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
19084
19311
  --pf-v6-c-page__main-section--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
19085
19312
  --pf-v6-c-page__main-section--PaddingBlockEnd: var(--pf-t--global--spacer--md);
@@ -19437,7 +19664,7 @@ ul.pf-v6-c-list {
19437
19664
  .pf-v6-c-page__main-container {
19438
19665
  display: flex;
19439
19666
  flex-direction: column;
19440
- align-self: start;
19667
+ align-self: var(--pf-v6-c-page__main-container--AlignSelf);
19441
19668
  max-height: var(--pf-v6-c-page__main-container--MaxHeight);
19442
19669
  margin-inline-start: var(--pf-v6-c-page__main-container--MarginInlineStart);
19443
19670
  margin-inline-end: var(--pf-v6-c-page__main-container--MarginInlineEnd);
@@ -19445,6 +19672,15 @@ ul.pf-v6-c-list {
19445
19672
  border: var(--pf-v6-c-page__main-container--BorderWidth) solid var(--pf-v6-c-page__main-container--BorderColor);
19446
19673
  border-radius: var(--pf-v6-c-page__main-container--BorderRadius);
19447
19674
  }
19675
+ @media screen and (max-width: calc(48rem - 1px)) {
19676
+ .pf-v6-c-page__main-container {
19677
+ --pf-v6-c-page__main-container--AlignSelf: var(--pf-v6-c-page__main-container--xs--AlignSelf);
19678
+ --pf-v6-c-page__main-container--MarginInlineStart: var(--pf-v6-c-page__main-container--xs--MarginInlineStart);
19679
+ --pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page__main-container--xs--MarginInlineEnd);
19680
+ --pf-v6-c-page__main-container--MaxHeight: var(--pf-v6-c-page__main-container--xs--MaxHeight);
19681
+ --pf-v6-c-page__main-container--BorderRadius: var(--pf-v6-c-page__main-container--xs--BorderRadius);
19682
+ }
19683
+ }
19448
19684
 
19449
19685
  .pf-v6-c-page__main-container,
19450
19686
  .pf-v6-c-page__drawer {
@@ -20307,9 +20543,11 @@ ul.pf-v6-c-list {
20307
20543
  }
20308
20544
 
20309
20545
  .pf-v6-c-popover__title-text {
20546
+ min-width: 0;
20310
20547
  font-size: var(--pf-v6-c-popover__title-text--FontSize);
20311
20548
  font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
20312
20549
  color: var(--pf-v6-c-popover__title-text--Color);
20550
+ overflow-wrap: break-word;
20313
20551
  }
20314
20552
 
20315
20553
  .pf-v6-c-popover__body {
@@ -20324,6 +20562,7 @@ ul.pf-v6-c-list {
20324
20562
  --pf-v6-c-progress--GridGap: var(--pf-t--global--spacer--md);
20325
20563
  --pf-v6-c-progress__bar--Height: var(--pf-t--global--spacer--md);
20326
20564
  --pf-v6-c-progress__bar--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
20565
+ --pf-v6-c-progress__bar--BorderRadius: var(--pf-t--global--border--radius--medium);
20327
20566
  --pf-v6-c-progress__measure--m-static-width--MinWidth: 4.5ch;
20328
20567
  --pf-v6-c-progress__status--Gap: var(--pf-t--global--spacer--sm);
20329
20568
  --pf-v6-c-progress__status-icon--Color: var(--pf-t--global--icon--color--regular);
@@ -20465,7 +20704,9 @@ ul.pf-v6-c-list {
20465
20704
  grid-column: 1/3;
20466
20705
  align-self: center;
20467
20706
  height: var(--pf-v6-c-progress__bar--Height);
20707
+ overflow: hidden;
20468
20708
  background-color: var(--pf-v6-c-progress__bar--BackgroundColor);
20709
+ border-radius: var(--pf-v6-c-progress__bar--BorderRadius);
20469
20710
  }
20470
20711
 
20471
20712
  .pf-v6-c-progress__indicator {
@@ -20802,7 +21043,8 @@ ul.pf-v6-c-list {
20802
21043
  .pf-v6-c-progress-stepper__step-title.pf-m-help-text {
20803
21044
  padding-inline-start: var(--pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineStart);
20804
21045
  padding-inline-end: var(--pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineEnd);
20805
- 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);
21046
+ text-decoration-line: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationLine);
21047
+ text-decoration-style: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationStyle);
20806
21048
  text-underline-offset: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset);
20807
21049
  cursor: pointer;
20808
21050
  }
@@ -21555,7 +21797,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
21555
21797
  font-size: var(--pf-v6-c-simple-list__item-link--FontSize);
21556
21798
  color: var(--pf-v6-c-simple-list__item-link--Color);
21557
21799
  text-align: start;
21558
- text-decoration: none;
21800
+ text-decoration-line: none;
21559
21801
  background-color: var(--pf-v6-c-simple-list__item-link--BackgroundColor);
21560
21802
  border: none;
21561
21803
  border-radius: var(--pf-v6-c-simple-list__item-link--BorderRadius);
@@ -21568,7 +21810,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
21568
21810
  .pf-v6-c-simple-list__item-link:is(:hover, :focus) {
21569
21811
  --pf-v6-c-simple-list__item-link--BackgroundColor: var(--pf-v6-c-simple-list__item-link--hover--BackgroundColor);
21570
21812
  --pf-v6-c-simple-list__item-link--Color: var(--pf-v6-c-simple-list__item-link--hover--Color);
21571
- text-decoration: none;
21813
+ text-decoration-line: none;
21572
21814
  }
21573
21815
  .pf-v6-c-simple-list__item-link.pf-m-current {
21574
21816
  --pf-v6-c-simple-list__item-link--BackgroundColor: var(--pf-v6-c-simple-list__item-link--m-current--BackgroundColor);
@@ -22099,7 +22341,9 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
22099
22341
  --pf-v6-c-switch__toggle--before--Height: var(--pf-v6-c-switch__toggle--before--Width);
22100
22342
  --pf-v6-c-switch__toggle--before--InsetInlineStart: calc((var(--pf-v6-c-switch__toggle--Height) - var(--pf-v6-c-switch__toggle--before--Height)) / 2);
22101
22343
  --pf-v6-c-switch__toggle--before--BorderRadius: var(--pf-t--global--border--radius--large);
22102
- --pf-v6-c-switch__toggle--before--Transition: transform .25s ease 0s;
22344
+ --pf-v6-c-switch__toggle--before--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
22345
+ --pf-v6-c-switch__toggle--before--TransitionDuration: var(--pf-t--global--motion--duration--md);
22346
+ --pf-v6-c-switch__toggle--before--Transition: transform var(--pf-v6-c-switch__toggle--before--TransitionTimingFunction) var(--pf-v6-c-switch__toggle--before--TransitionDuration), background-color var(--pf-v6-c-switch__toggle--before--TransitionTimingFunction) var(--pf-v6-c-switch__toggle--before--TransitionDuration);
22103
22347
  --pf-v6-c-switch__toggle--Width: calc(var(--pf-v6-c-switch__toggle--Height) + var(--pf-v6-c-switch__toggle-icon--Offset) + var(--pf-v6-c-switch__toggle--before--Width));
22104
22348
  }
22105
22349
 
@@ -24414,13 +24658,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
24414
24658
  vertical-align: baseline;
24415
24659
  }
24416
24660
 
24417
- .pf-v6-c-table__favorite .pf-v6-c-button {
24661
+ .pf-v6-c-table__favorite .pf-v6-c-button:not(.pf-m-favorite) {
24418
24662
  --pf-v6-c-button--FontSize: var(--pf-v6-c-table__favorite--c-button--FontSize);
24419
24663
  }
24420
- .pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button {
24664
+ .pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited) {
24421
24665
  --pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-table__favorite--m-favorited--c-button--Color);
24422
24666
  }
24423
- .pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button:is(:hover, :focus) {
24667
+ .pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus) {
24424
24668
  --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-table__favorite--m-favorited--c-button--Color);
24425
24669
  }
24426
24670
 
@@ -26080,7 +26324,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
26080
26324
  padding-inline-end: var(--pf-v6-c-tabs__link--PaddingInlineEnd);
26081
26325
  font-size: var(--pf-v6-c-tabs__link--FontSize);
26082
26326
  color: var(--pf-v6-c-tabs__link--Color);
26083
- text-decoration: none;
26327
+ text-decoration-line: none;
26084
26328
  background-color: var(--pf-v6-c-tabs__link--BackgroundColor);
26085
26329
  border-radius: var(--pf-v6-c-tabs__link--BorderRadius);
26086
26330
  }
@@ -26720,7 +26964,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
26720
26964
  }
26721
26965
  .pf-v6-c-timestamp.pf-m-help-text {
26722
26966
  --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--Color);
26723
- text-decoration: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine) var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
26967
+ text-decoration-line: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine);
26968
+ text-decoration-style: var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
26724
26969
  text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
26725
26970
  cursor: pointer;
26726
26971
  }
@@ -26933,7 +27178,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
26933
27178
  --pf-v6-c-toggle-group__button--BackgroundColor: var(--pf-v6-c-toggle-group__button--hover--BackgroundColor);
26934
27179
  --pf-v6-c-toggle-group__button--ZIndex: var(--pf-v6-c-toggle-group__button--hover--ZIndex);
26935
27180
  --pf-v6-c-toggle-group__button--before--BorderColor: var(--pf-v6-c-toggle-group__button--hover--before--BorderColor);
26936
- text-decoration: none;
27181
+ text-decoration-line: none;
26937
27182
  }
26938
27183
  .pf-v6-c-toggle-group__button.pf-m-selected {
26939
27184
  --pf-v6-c-toggle-group__button--BackgroundColor: var(--pf-v6-c-toggle-group__button--m-selected--BackgroundColor);
@@ -27181,13 +27426,18 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
27181
27426
  }
27182
27427
  .pf-v6-c-toolbar.pf-m-full-height {
27183
27428
  --pf-v6-c-toolbar--PaddingBlockStart: 0;
27184
- --pf-v6-c-toolbar--PaddinkBlockEnd: 0;
27429
+ --pf-v6-c-toolbar--PaddingBlockEnd: 0;
27185
27430
  }
27186
27431
  .pf-v6-c-toolbar.pf-m-full-height .pf-v6-c-toolbar__group,
27187
27432
  .pf-v6-c-toolbar.pf-m-full-height .pf-v6-c-toolbar__item {
27188
27433
  align-items: stretch;
27189
27434
  align-self: stretch;
27190
27435
  }
27436
+ .pf-v6-c-toolbar.pf-m-no-padding {
27437
+ --pf-v6-c-toolbar--PaddingBlockEnd: 0;
27438
+ --pf-v6-c-toolbar--m-sticky--PaddingBlockStart: 0;
27439
+ --pf-v6-c-toolbar--m-sticky--PaddingBlockEnd: 0;
27440
+ }
27191
27441
  .pf-v6-c-toolbar.pf-m-primary {
27192
27442
  --pf-v6-c-toolbar--BackgroundColor: var(--pf-v6-c-toolbar--m-primary--BackgroundColor);
27193
27443
  }
@@ -29884,7 +30134,7 @@ label.pf-v6-c-tree-view__node-text {
29884
30134
  padding-inline: 0;
29885
30135
  color: var(--pf-v6-c-wizard__nav-link--Color);
29886
30136
  text-align: start;
29887
- text-decoration: var(--pf-v6-c-wizard__nav-link--TextDecoration);
30137
+ text-decoration-line: var(--pf-v6-c-wizard__nav-link--TextDecoration);
29888
30138
  word-break: break-word;
29889
30139
  counter-increment: wizard-nav-count;
29890
30140
  background-color: transparent;