@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
@@ -574,6 +574,48 @@
574
574
  --pf-v6-c-alert-group--m-toast--InsetInlineEnd: var(--pf-t--global--spacer--xl);
575
575
  --pf-v6-c-alert-group--m-toast--MaxWidth: 37.5rem;
576
576
  --pf-v6-c-alert-group--m-toast--ZIndex: var(--pf-t--global--z-index--2xl);
577
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default);
578
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--decelerate);
579
+ --pf-v6-c-alert-group--m-toast__item--Transition--opacity--default: var(--pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity--default)
580
+ var(--pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity--default)
581
+ 0s;
582
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--opacity: var(--pf-t--global--motion--duration--fade--default);
583
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--decelerate);
584
+ --pf-v6-c-alert-group--m-toast__item--TransitionDelay--opacity: var(--pf-t--global--motion--delay--none);
585
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
586
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--decelerate);
587
+ --pf-v6-c-alert-group--m-toast__item--TransitionDelay--transform: var(--pf-t--global--motion--delay--none);
588
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--default);
589
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--decelerate);
590
+ --pf-v6-c-alert-group--m-toast__item--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--slide-in--default);
591
+ --pf-v6-c-alert-group--m-toast__item--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--decelerate);
592
+ --pf-v6-c-alert-group--m-toast__item--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
593
+ --pf-v6-c-alert-group--m-toast__item--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
594
+ --pf-v6-c-alert-group--m-toast__item--c-alert--Transition: all
595
+ var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionDuration)
596
+ var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionTimingFunction)
597
+ 0s;
598
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default);
599
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--accelerate);
600
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default: var(--pf-t--global--motion--duration--fade--default);
601
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default: var(--pf-t--global--motion--duration--fade--default);
602
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default: var(--pf-t--global--motion--duration--fade--default);
603
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-out--short);
604
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--accelerate);
605
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity: var(--pf-t--global--motion--duration--slide-out--short);
606
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--accelerate);
607
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--fade--short);
608
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--accelerate);
609
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block: var(--pf-t--global--motion--duration--slide-out--short);
610
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--short);
611
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--accelerate);
612
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows: var(--pf-t--global--motion--duration--slide-out--short);
613
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-out--short);
614
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
615
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: all
616
+ var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration)
617
+ var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction)
618
+ var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration);
577
619
  --pf-v6-c-alert-group__overflow-button--BorderWidth: 0;
578
620
  --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
579
621
  --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -622,15 +664,15 @@
622
664
  display: grid;
623
665
  grid-template-rows: 1fr;
624
666
  opacity: 1;
625
- transition: opacity var(--pf-t--global--motion--duration--fade--default) var(--pf-t--global--motion--timing-function--decelerate) 0s;
667
+ transition: opacity var(--pf-v6-c-alert-group--m-toast__item--Transition--opacity--default);
626
668
  transform: translateX(0) translateY(0);
627
669
  }
628
670
  @media screen and (prefers-reduced-motion: no-preference) {
629
671
  .pf-v6-c-alert-group__item {
630
- 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;
672
+ 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);
631
673
  }
632
674
  .pf-v6-c-alert-group__item .pf-v6-c-alert {
633
- transition: all var(--pf-t--global--motion--duration--slide-in--default) var(--pf-t--global--motion--timing-function--decelerate);
675
+ transition: var(--pf-v6-c-alert-group--m-toast__item--c-alert--Transition);
634
676
  }
635
677
  }
636
678
  .pf-v6-c-alert-group__item.pf-m-offstage-top {
@@ -651,21 +693,22 @@
651
693
  margin-block: 0;
652
694
  overflow: hidden;
653
695
  opacity: 0;
654
- transition: opacity var(--pf-t--global--motion--duration--fade--short) var(--pf-t--global--motion--timing-function--accelerate) 0s;
655
- transform: translateX(100%);
696
+ 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);
656
697
  }
657
698
  .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
658
699
  min-height: 0;
659
700
  padding-block-start: 0;
660
701
  padding-block-end: 0;
661
702
  border-width: 0;
703
+ transition: all 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default);
662
704
  }
663
705
  @media screen and (prefers-reduced-motion: no-preference) {
664
706
  .pf-v6-c-alert-group__item.pf-m-offstage-right {
665
- 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);
707
+ 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);
708
+ transform: translateX(100%);
666
709
  }
667
710
  .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
668
- 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);
711
+ transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition);
669
712
  }
670
713
  }
671
714
  .pf-v6-c-alert-group__item:hover {
@@ -1197,7 +1240,7 @@
1197
1240
  }
1198
1241
  .pf-v6-c-banner a {
1199
1242
  color: var(--pf-v6-c-banner--link--Color);
1200
- text-decoration: var(--pf-v6-c-banner--link--TextDecoration);
1243
+ text-decoration-line: var(--pf-v6-c-banner--link--TextDecoration);
1201
1244
  }
1202
1245
  .pf-v6-c-banner a:hover:not(.pf-m-disabled) {
1203
1246
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
@@ -1210,7 +1253,7 @@
1210
1253
  --pf-v6-c-button--m-link--Color: var(--pf-v6-c-banner--link--Color);
1211
1254
  --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
1212
1255
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
1213
- text-decoration: var(--pf-v6-c-banner--link--TextDecoration);
1256
+ text-decoration-line: var(--pf-v6-c-banner--link--TextDecoration);
1214
1257
  }
1215
1258
  .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 {
1216
1259
  cursor: not-allowed;
@@ -1349,7 +1392,8 @@
1349
1392
  font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
1350
1393
  line-height: inherit;
1351
1394
  color: var(--pf-v6-c-breadcrumb__link--Color);
1352
- text-decoration: var(--pf-v6-c-breadcrumb__link--TextDecorationLine) var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
1395
+ text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
1396
+ text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
1353
1397
  word-break: break-word;
1354
1398
  background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
1355
1399
  }
@@ -1363,7 +1407,7 @@
1363
1407
  }
1364
1408
  .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
1365
1409
  color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
1366
- text-decoration: none;
1410
+ text-decoration-line: none;
1367
1411
  }
1368
1412
  button.pf-v6-c-breadcrumb__link {
1369
1413
  border: none;
@@ -1410,6 +1454,7 @@ button.pf-v6-c-breadcrumb__link {
1410
1454
  --pf-v6-c-button--BorderRadius: var(--pf-t--global--border--radius--pill);
1411
1455
  --pf-v6-c-button--TextDecorationLine: none;
1412
1456
  --pf-v6-c-button--TextDecorationStyle: none;
1457
+ --pf-v6-c-button--TextDecorationColor: currentcolor;
1413
1458
  --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
1414
1459
  --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
1415
1460
  --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
@@ -1418,6 +1463,7 @@ button.pf-v6-c-breadcrumb__link {
1418
1463
  --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
1419
1464
  --pf-v6-c-button--hover--TextDecorationLine: none;
1420
1465
  --pf-v6-c-button--hover--TextDecorationStyle: none;
1466
+ --pf-v6-c-button--hover--TextDecorationColor: currentcolor;
1421
1467
  --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
1422
1468
  --pf-v6-c-button--m-clicked--BorderColor: transparent;
1423
1469
  --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
@@ -1502,6 +1548,12 @@ button.pf-v6-c-breadcrumb__link {
1502
1548
  --pf-v6-c-button--span--m-link--m-inline--Display: inline;
1503
1549
  --pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
1504
1550
  --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
1551
+ --pf-v6-c-button--m-link--m-inline--Color: var(--pf-t--global--text--color--brand--default);
1552
+ --pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
1553
+ --pf-v6-c-button--m-link--m-inline--TextDecorationColor: currentcolor;
1554
+ --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
1555
+ --pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
1556
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: currentcolor;
1505
1557
  --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
1506
1558
  --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
1507
1559
  --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
@@ -1609,6 +1661,7 @@ button.pf-v6-c-breadcrumb__link {
1609
1661
  --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
1610
1662
  --pf-v6-c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
1611
1663
  --pf-v6-c-button--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1664
+ --pf-v6-c-button--disabled--TextDecorationColor: currentcolor;
1612
1665
  --pf-v6-c-button--disabled--BorderColor: transparent;
1613
1666
  --pf-v6-c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1614
1667
  --pf-v6-c-button__icon--Color: var(--pf-t--global--icon--color--regular);
@@ -1618,6 +1671,14 @@ button.pf-v6-c-breadcrumb__link {
1618
1671
  --pf-v6-c-button__icon--MarginInlineEnd: 0;
1619
1672
  --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
1620
1673
  --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
1674
+ --pf-v6-c-button--m-notify__icon--AnimationDuration--notify: var(--pf-t--global--motion--duration--3xl);
1675
+ --pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify: var(--pf-t--global--motion--timing-function--default);
1676
+ --pf-v6-c-button--m-favorite__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
1677
+ --pf-v6-c-button--m-favorite__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
1678
+ --pf-v6-c-button--m-favorited__icon--Color: var(--pf-t--global--color--favorite--default);
1679
+ --pf-v6-c-button--m-favorited--hover__icon--Color: var(--pf-t--global--color--favorite--hover);
1680
+ --pf-v6-c-button--m-favorited__icon--AnimationDuration: var(--pf-t--global--motion--duration--icon--long);
1681
+ --pf-v6-c-button--m-favorited__icon--AnimationTimingFunction: var(--pf-t--global--motion--timing-function--default);
1621
1682
  --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
1622
1683
  --pf-v6-c-button__progress--Opacity: 0;
1623
1684
  --pf-v6-c-button__progress--TranslateY: -50%;
@@ -1653,7 +1714,9 @@ button.pf-v6-c-breadcrumb__link {
1653
1714
  line-height: var(--pf-v6-c-button--LineHeight, inherit);
1654
1715
  color: var(--pf-v6-c-button--Color);
1655
1716
  text-align: center;
1656
- text-decoration: var(--pf-v6-c-button--TextDecorationLine) var(--pf-v6-c-button--TextDecorationStyle);
1717
+ text-decoration-line: var(--pf-v6-c-button--TextDecorationLine);
1718
+ text-decoration-style: var(--pf-v6-c-button--TextDecorationStyle);
1719
+ text-decoration-color: var(--pf-v6-c-button--TextDecorationColor);
1657
1720
  white-space: nowrap;
1658
1721
  cursor: pointer;
1659
1722
  user-select: none;
@@ -1766,6 +1829,12 @@ button.pf-v6-c-breadcrumb__link {
1766
1829
  --pf-v6-c-button--disabled--BackgroundColor: transparent;
1767
1830
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-button--m-link--m-inline--disabled--Color);
1768
1831
  --pf-v6-c-button--disabled__icon--Color: var(--pf-v6-c-button--m-link--m-inline--disabled__icon--Color);
1832
+ --pf-v6-c-button--m-link--Color: var(--pf-v6-c-button--m-link--m-inline--Color);
1833
+ --pf-v6-c-button--m-link__icon--Color: var(--pf-v6-c-button--m-link--m-inline__icon--Color);
1834
+ --pf-v6-c-button--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--TextDecorationColor);
1835
+ --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
1836
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
1837
+ --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
1769
1838
  text-align: start;
1770
1839
  white-space: normal;
1771
1840
  outline-offset: 0.125rem;
@@ -1919,6 +1988,20 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1919
1988
  --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-display-lg--PaddingInlineStart);
1920
1989
  --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-display-lg--FontSize);
1921
1990
  }
1991
+ .pf-v6-c-button.pf-m-favorite .pf-v6-c-button__icon {
1992
+ transition-timing-function: var(--pf-v6-c-button--m-favorite__icon--TransitionTimingFunction);
1993
+ transition-duration: var(--pf-v6-c-button--m-favorite__icon--TransitionDuration);
1994
+ transition-property: color;
1995
+ }
1996
+ .pf-v6-c-button.pf-m-favorited {
1997
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
1998
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
1999
+ }
2000
+ .pf-v6-c-button.pf-m-favorited .pf-v6-c-button__icon {
2001
+ animation-name: pf-v6-c-button-icon-favorited;
2002
+ animation-duration: var(--pf-v6-c-button--m-favorited__icon--AnimationDuration);
2003
+ animation-timing-function: var(--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction);
2004
+ }
1922
2005
  .pf-v6-c-button:hover, .pf-v6-c-button:focus {
1923
2006
  --pf-v6-c-button--Color: var(--pf-v6-c-button--hover--Color);
1924
2007
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
@@ -1926,7 +2009,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1926
2009
  --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
1927
2010
  --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color);
1928
2011
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
1929
- text-decoration: var(--pf-v6-c-button--hover--TextDecorationLine) var(--pf-v6-c-button--hover--TextDecorationStyle);
2012
+ text-decoration-line: var(--pf-v6-c-button--hover--TextDecorationLine);
2013
+ text-decoration-style: var(--pf-v6-c-button--hover--TextDecorationStyle);
2014
+ text-decoration-color: var(--pf-v6-c-button--hover--TextDecorationColor);
1930
2015
  }
1931
2016
  .pf-v6-c-button.pf-m-clicked {
1932
2017
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-clicked--Color);
@@ -1940,6 +2025,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1940
2025
  }
1941
2026
  .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled, .pf-v6-c-button.pf-m-aria-disabled {
1942
2027
  color: var(--pf-v6-c-button--disabled--Color);
2028
+ text-decoration-color: var(--pf-v6-c-button--disabled--TextDecorationColor);
1943
2029
  background-color: var(--pf-v6-c-button--disabled--BackgroundColor);
1944
2030
  }
1945
2031
  .pf-v6-c-button:disabled::after, .pf-v6-c-button.pf-m-disabled::after, .pf-v6-c-button.pf-m-aria-disabled::after {
@@ -1971,6 +2057,11 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1971
2057
  .pf-v6-c-button.pf-m-in-progress.pf-m-plain > :not(.pf-v6-c-button__progress) {
1972
2058
  opacity: 0;
1973
2059
  }
2060
+ .pf-v6-c-button.pf-m-notify .pf-v6-c-button__icon {
2061
+ animation-name: pf-v6-c-button-icon-notify;
2062
+ animation-duration: var(--pf-v6-c-button--m-notify__icon--AnimationDuration--notify);
2063
+ animation-timing-function: var(--pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify);
2064
+ }
1974
2065
 
1975
2066
  .pf-v6-c-button__icon {
1976
2067
  margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
@@ -2001,6 +2092,19 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2001
2092
  align-items: center;
2002
2093
  }
2003
2094
 
2095
+ @keyframes pf-v6-c-button-icon-notify {
2096
+ 33% {
2097
+ transform: rotate(30deg);
2098
+ }
2099
+ 66% {
2100
+ transform: rotate(-60deg);
2101
+ }
2102
+ }
2103
+ @keyframes pf-v6-c-button-icon-favorited {
2104
+ 50% {
2105
+ transform: scale(1.5);
2106
+ }
2107
+ }
2004
2108
  .pf-v6-c-calendar-month {
2005
2109
  --pf-v6-c-calendar-month--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2006
2110
  --pf-v6-c-calendar-month--PaddingBlockStart: var(--pf-t--global--spacer--lg);
@@ -2231,6 +2335,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2231
2335
  --pf-v6-c-card__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--default);
2232
2336
  --pf-v6-c-card__actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2233
2337
  --pf-v6-c-card__actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2338
+ --pf-v6-c-card__header--m-wrap--RowGap: var(--pf-t--global--spacer--sm);
2339
+ --pf-v6-c-card__header--m-wrap--ColumnGap: var(--pf-t--global--spacer--md);
2234
2340
  --pf-v6-c-card__header-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2235
2341
  --pf-v6-c-card__header-toggle--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
2236
2342
  --pf-v6-c-card__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
@@ -2394,6 +2500,21 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2394
2500
  .pf-v6-c-card__header.pf-m-toggle-right .pf-v6-c-card__header-toggle {
2395
2501
  order: 2;
2396
2502
  }
2503
+ .pf-v6-c-card__header.pf-m-wrap {
2504
+ --pf-v6-c-card__actions--PaddingInlineStart: 0;
2505
+ gap: var(--pf-v6-c-card__header--m-wrap--RowGap) var(--pf-v6-c-card__header--m-wrap--ColumnGap);
2506
+ }
2507
+ .pf-v6-c-card__header.pf-m-wrap,
2508
+ .pf-v6-c-card__header.pf-m-wrap .pf-v6-c-card__actions {
2509
+ flex-wrap: wrap;
2510
+ row-gap: var(--pf-v6-c-card__header--m-wrap--RowGap);
2511
+ }
2512
+ .pf-v6-c-card__header.pf-m-wrap .pf-v6-c-card__actions {
2513
+ margin-inline-start: 0;
2514
+ }
2515
+ .pf-v6-c-card__header.pf-m-wrap .pf-v6-c-card__actions + * {
2516
+ margin-inline-end: auto;
2517
+ }
2397
2518
 
2398
2519
  .pf-v6-c-card__header-main {
2399
2520
  flex-grow: 1;
@@ -2660,6 +2781,9 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2660
2781
  .pf-v6-c-clipboard-copy.pf-m-inline.pf-m-block {
2661
2782
  display: block;
2662
2783
  }
2784
+ .pf-v6-c-clipboard-copy.pf-m-inline.pf-m-truncate {
2785
+ display: inline-flex;
2786
+ }
2663
2787
 
2664
2788
  .pf-v6-c-clipboard-copy__group {
2665
2789
  display: flex;
@@ -3045,7 +3169,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
3045
3169
 
3046
3170
  :is(.pf-v6-c-content--a, .pf-v6-c-content a) {
3047
3171
  color: var(--pf-v6-c-content--a--Color);
3048
- text-decoration: var(--pf-v6-c-content--a--TextDecorationLine) var(--pf-v6-c-content--a--TextDecorationStyle);
3172
+ text-decoration-line: var(--pf-v6-c-content--a--TextDecorationLine);
3173
+ text-decoration-style: var(--pf-v6-c-content--a--TextDecorationStyle);
3049
3174
  }
3050
3175
  :is(.pf-v6-c-content--a, .pf-v6-c-content a):is(:hover, :focus) {
3051
3176
  --pf-v6-c-content--a--Color: var(--pf-v6-c-content--a--hover--Color);
@@ -4083,7 +4208,7 @@ ul) {
4083
4208
  --pf-v6-c-description-list__term--Display: inline;
4084
4209
  --pf-v6-c-description-list__term--sm--Display: flex;
4085
4210
  --pf-v6-c-description-list__term--FontWeight: var(--pf-t--global--font--weight--body--bold);
4086
- --pf-v6-c-description-list__term--FontSize: var(--pf-t--global--font--size--body--sm);
4211
+ --pf-v6-c-description-list__term--FontSize: var(--pf-t--global--font--size--body--default);
4087
4212
  --pf-v6-c-description-list__term--LineHeight: var(--pf-t--global--font--line-height--body);
4088
4213
  --pf-v6-c-description-list__term-icon--MinWidth: var(--pf-t--global--font--size--body--sm);
4089
4214
  --pf-v6-c-description-list__term-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -4265,7 +4390,8 @@ ul) {
4265
4390
  min-width: 0;
4266
4391
  }
4267
4392
  .pf-v6-c-description-list__text.pf-m-help-text {
4268
- text-decoration: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationLine) var(--pf-v6-c-description-list__text--m-help-text--TextDecorationStyle);
4393
+ text-decoration-line: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationLine);
4394
+ text-decoration-style: var(--pf-v6-c-description-list__text--m-help-text--TextDecorationStyle);
4269
4395
  text-underline-offset: var(--pf-v6-c-description-list__text--m-help-text--TextUnderlineOffset);
4270
4396
  cursor: pointer;
4271
4397
  }
@@ -5168,7 +5294,8 @@ ul) {
5168
5294
  --pf-v6-c-drawer__panel--RowGap: var(--pf-t--global--spacer--sm);
5169
5295
  --pf-v6-c-drawer__panel--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5170
5296
  --pf-v6-c-drawer__panel--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
5171
- --pf-v6-c-drawer__panel--TransitionDuration: 250ms;
5297
+ --pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
5298
+ --pf-v6-c-drawer__panel--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--short);
5172
5299
  --pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis;
5173
5300
  --pf-v6-c-drawer__panel--FlexBasis: 100%;
5174
5301
  --pf-v6-c-drawer__panel--md--FlexBasis--min: 1.5rem;
@@ -5382,6 +5509,7 @@ ul) {
5382
5509
  overflow: auto;
5383
5510
  background-color: var(--pf-v6-c-drawer__panel--BackgroundColor);
5384
5511
  box-shadow: var(--pf-v6-c-drawer__panel--BoxShadow);
5512
+ transition-timing-function: var(--pf-v6-c-drawer__panel--TransitionTimingFunction);
5385
5513
  transition-duration: var(--pf-v6-c-drawer__panel--TransitionDuration);
5386
5514
  transition-property: var(--pf-v6-c-drawer__panel--TransitionProperty);
5387
5515
  -webkit-overflow-scrolling: touch;
@@ -6278,16 +6406,16 @@ ul) {
6278
6406
  --pf-v6-c-form__group-label--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
6279
6407
  --pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart: 0;
6280
6408
  --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)));
6281
- --pf-v6-c-form__label--FontSize: var(--pf-t--global--font--size--body--sm);
6409
+ --pf-v6-c-form__label--FontSize: var(--pf-t--global--font--size--body--default);
6282
6410
  --pf-v6-c-form__label--LineHeight: var(--pf-t--global--font--line-height--body);
6283
6411
  --pf-v6-c-form__label--m-disabled--Color: var(--pf-t--global--text--color--disabled);
6284
6412
  --pf-v6-c-form__label--hover--Cursor: pointer;
6285
6413
  --pf-v6-c-form__label--m-disabled--hover--Cursor: not-allowed;
6286
6414
  --pf-v6-c-form__label-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
6287
6415
  --pf-v6-c-form__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
6288
- --pf-v6-c-form__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
6416
+ --pf-v6-c-form__label-required--FontSize: var(--pf-t--global--font--size--body--default);
6289
6417
  --pf-v6-c-form__label-required--Color: var(--pf-t--global--color--status--danger--default);
6290
- --pf-v6-c-form__group-label-help--FontSize: var(--pf-t--global--font--size--body--sm);
6418
+ --pf-v6-c-form__group-label-help--FontSize: var(--pf-t--global--font--size--body--default);
6291
6419
  --pf-v6-c-form__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--horizontal);
6292
6420
  --pf-v6-c-form__group-label-info--FontSize: var(--pf-t--global--font--size--body--sm);
6293
6421
  --pf-v6-c-form--m-horizontal__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--group--vertical);
@@ -6601,9 +6729,6 @@ ul) {
6601
6729
  font-size: var(--pf-v6-c-form__label--FontSize);
6602
6730
  line-height: var(--pf-v6-c-form__label--LineHeight);
6603
6731
  }
6604
- .pf-v6-c-form__label::selection {
6605
- background-color: none;
6606
- }
6607
6732
  .pf-v6-c-form__label:not(.pf-m-disabled):hover {
6608
6733
  cursor: var(--pf-v6-c-form__label--hover--Cursor);
6609
6734
  }
@@ -7160,6 +7285,8 @@ select ~ .pf-v6-c-form-control__utilities {
7160
7285
  --pf-v6-c-helper-text__item-text--m-success--FontWeight: var(--pf-t--global--font--weight--body--bold);
7161
7286
  --pf-v6-c-helper-text__item-icon--m-error--Color: var(--pf-t--global--icon--color--status--danger--default);
7162
7287
  --pf-v6-c-helper-text__item-text--m-error--FontWeight: var(--pf-t--global--font--weight--body--bold);
7288
+ --pf-v6-c-helper-text__item--m-error--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
7289
+ --pf-v6-c-helper-text__item--m-error--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
7163
7290
  --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-t--global--icon--color--regular);
7164
7291
  --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color: var(--pf-t--global--icon--color--subtle);
7165
7292
  --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color: var(--pf-t--global--text--color--subtle);
@@ -7204,6 +7331,17 @@ select ~ .pf-v6-c-form-control__utilities {
7204
7331
  --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-error--FontWeight);
7205
7332
  --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-error--Color);
7206
7333
  --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color);
7334
+ animation-name: --pf-v6-c-helper-text-item-fade-in;
7335
+ animation-duration: var(--pf-v6-c-helper-text__item--m-error--TransitionDuration--Opacity);
7336
+ animation-timing-function: var(--pf-v6-c-helper-text__item--m-error--TransitionTimingFunction--Opacity);
7337
+ }
7338
+ @keyframes --pf-v6-c-helper-text-item-fade-in {
7339
+ from {
7340
+ opacity: 0;
7341
+ }
7342
+ to {
7343
+ opacity: 1;
7344
+ }
7207
7345
  }
7208
7346
  .pf-v6-c-helper-text__item.pf-m-dynamic {
7209
7347
  --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic__item-icon--Color);
@@ -7818,7 +7956,7 @@ label.pf-v6-c-input-group__text {
7818
7956
  padding-block-end: var(--pf-v6-c-jump-links__link--PaddingBlockEnd);
7819
7957
  padding-inline-start: var(--pf-v6-c-jump-links__link--PaddingInlineStart);
7820
7958
  padding-inline-end: var(--pf-v6-c-jump-links__link--PaddingInlineEnd);
7821
- text-decoration: none;
7959
+ text-decoration-line: none;
7822
7960
  outline-offset: var(--pf-v6-c-jump-links__link--OutlineOffset);
7823
7961
  }
7824
7962
  .pf-v6-c-jump-links__link:is(:hover, :focus) {
@@ -8259,7 +8397,8 @@ label.pf-v6-c-input-group__text {
8259
8397
  --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-v6-c-label--m-editable--hover--TextDecorationStyle);
8260
8398
  }
8261
8399
  .pf-v6-c-label.pf-m-editable .pf-v6-c-label__text {
8262
- text-decoration: var(--pf-v6-c-label--m-editable--TextDecorationLine) var(--pf-v6-c-label--m-editable--TextDecorationStyle);
8400
+ text-decoration-line: var(--pf-v6-c-label--m-editable--TextDecorationLine);
8401
+ text-decoration-style: var(--pf-v6-c-label--m-editable--TextDecorationStyle);
8263
8402
  text-underline-offset: var(--pf-v6-c-label--m-editable--TextUnderlineOffset);
8264
8403
  }
8265
8404
  .pf-v6-c-label.pf-m-editable-active {
@@ -8292,7 +8431,7 @@ label.pf-v6-c-input-group__text {
8292
8431
  --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-clickable__content--Cursor);
8293
8432
  }
8294
8433
  .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) {
8295
- text-decoration: none;
8434
+ text-decoration-line: none;
8296
8435
  }
8297
8436
  .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
8298
8437
  --pf-v6-c-label--Color: var(--pf-v6-c-label--m-clickable--hover--Color);
@@ -9032,7 +9171,7 @@ ul.pf-v6-c-list {
9032
9171
  grid-column-end: -1;
9033
9172
  row-gap: var(--pf-v6-c-masthead__content-RowGap, var(--pf-v6-c-masthead--RowGap));
9034
9173
  column-gap: var(--pf-v6-c-masthead__content--ColumnGap, var(--pf-v6-c-masthead--ColumnGap));
9035
- align-self: stretch;
9174
+ align-self: center;
9036
9175
  order: var(--pf-v6-c-masthead__content--Order);
9037
9176
  min-width: 0.25rem;
9038
9177
  }
@@ -9559,11 +9698,20 @@ ul.pf-v6-c-list {
9559
9698
  .pf-v6-c-menu__item-action:is(.pf-m-disabled, :disabled, .pf-m-aria-disabled, [aria-disabled=true]) {
9560
9699
  --pf-v6-c-menu__item--Color: var(--pf-v6-c-menu__item--m-disabled--Color);
9561
9700
  --pf-v6-c-menu__item-toggle-icon--Color: var(--pf-v6-c-menu--icon--disabled--Color);
9562
- --pf-v6-c-menu__item-external-icon--Color: var(--pf-v6-c-menu--icon--disabled--Color);
9701
+ --pf-v6-c-menu__item-external--Color: transparent;
9702
+ --pf-v6-c-menu__item-select-icon--Color: transparent;
9563
9703
  --pf-v6-c-menu__item-description--Color: var(--pf-v6-c-menu--icon--disabled--Color);
9564
9704
  --pf-v6-c-menu__list-item--BackgroundColor: transparent;
9705
+ --pf-v6-c-menu__list-item--hover--BackgroundColor: transparent;
9706
+ }
9707
+ .pf-v6-c-menu__list-item:is(.pf-m-disabled, :disabled),
9708
+ .pf-v6-c-menu__item-action:is(.pf-m-disabled, :disabled) {
9565
9709
  pointer-events: none;
9566
9710
  }
9711
+ .pf-v6-c-menu__list-item.pf-m-aria-disabled .pf-v6-c-menu__item,
9712
+ .pf-v6-c-menu__item-action.pf-m-aria-disabled .pf-v6-c-menu__item {
9713
+ cursor: default;
9714
+ }
9567
9715
 
9568
9716
  [class*=pf-v6-c-menu]:is([hidden]) {
9569
9717
  display: none;
@@ -9707,7 +9855,6 @@ ul.pf-v6-c-list {
9707
9855
  z-index: var(--pf-v6-c-menu--ZIndex);
9708
9856
  margin-block-start: calc(var(--pf-v6-c-menu--RowGap) * -1);
9709
9857
  margin-block-end: calc(var(--pf-v6-c-menu--RowGap) * -1);
9710
- overflow: hidden;
9711
9858
  }
9712
9859
  .pf-v6-c-menu.pf-m-scrollable .pf-v6-c-menu__list {
9713
9860
  padding-block-start: var(--pf-v6-c-menu--RowGap);
@@ -9811,7 +9958,7 @@ ul.pf-v6-c-list {
9811
9958
  line-height: var(--pf-v6-c-menu__item--LineHeight);
9812
9959
  color: var(--pf-v6-c-menu__item--Color);
9813
9960
  text-align: start;
9814
- text-decoration: none;
9961
+ text-decoration-line: none;
9815
9962
  background-color: var(--pf-v6-c-menu__item--BackgroundColor);
9816
9963
  border: 0;
9817
9964
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
@@ -9931,16 +10078,16 @@ ul.pf-v6-c-list {
9931
10078
  opacity: 0;
9932
10079
  }
9933
10080
 
9934
- .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,
10081
+ .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),
9935
10082
  .pf-v6-c-menu__item-action.pf-m-favorited,
9936
10083
  .pf-v6-c-menu__item-action.pf-m-favorited:hover,
9937
- .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button {
10084
+ .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited) {
9938
10085
  --pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
9939
10086
  }
9940
- .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),
10087
+ .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),
9941
10088
  .pf-v6-c-menu__item-action.pf-m-favorited:is(:hover, :focus),
9942
10089
  .pf-v6-c-menu__item-action.pf-m-favorited:hover:is(:hover, :focus),
9943
- .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:is(:hover, :focus) {
10090
+ .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus) {
9944
10091
  --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
9945
10092
  }
9946
10093
 
@@ -10085,12 +10232,16 @@ ul.pf-v6-c-list {
10085
10232
  --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
10086
10233
  --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
10087
10234
  --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
10235
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
10236
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
10088
10237
  --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
10089
10238
  --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
10090
10239
  --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
10091
10240
  --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
10092
10241
  --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
10093
10242
  --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
10243
+ --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
10244
+ --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
10094
10245
  --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
10095
10246
  --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
10096
10247
  }
@@ -10239,6 +10390,28 @@ ul.pf-v6-c-list {
10239
10390
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
10240
10391
  --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
10241
10392
  }
10393
+ @media screen and (prefers-reduced-motion: no-preference) {
10394
+ .pf-v6-c-menu-toggle.pf-m-danger {
10395
+ transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
10396
+ animation-name: pf-v6-c-menu-toggle-m-danger-motion;
10397
+ animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
10398
+ animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
10399
+ animation-fill-mode: both;
10400
+ }
10401
+ }
10402
+ .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
10403
+ animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
10404
+ animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
10405
+ animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
10406
+ }
10407
+ @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
10408
+ from {
10409
+ opacity: 0;
10410
+ }
10411
+ to {
10412
+ opacity: 1;
10413
+ }
10414
+ }
10242
10415
  .pf-v6-c-menu-toggle.pf-m-placeholder {
10243
10416
  --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
10244
10417
  }
@@ -10254,6 +10427,21 @@ ul.pf-v6-c-list {
10254
10427
  pointer-events: none;
10255
10428
  }
10256
10429
 
10430
+ @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
10431
+ syntax: "<length>";
10432
+ inherits: false;
10433
+ initial-value: 0;
10434
+ }
10435
+ @media (prefers-reduced-motion: no-preference) {
10436
+ @keyframes pf-v6-c-menu-toggle-m-danger-motion {
10437
+ 33% {
10438
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
10439
+ }
10440
+ 66% {
10441
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
10442
+ }
10443
+ }
10444
+ }
10257
10445
  .pf-v6-c-menu-toggle.pf-m-split-button {
10258
10446
  --pf-v6-c-menu-toggle--Gap: 0;
10259
10447
  --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
@@ -10843,13 +11031,15 @@ ul.pf-v6-c-list {
10843
11031
  --pf-v6-c-nav__item--ScrollSnapAlign: end;
10844
11032
  --pf-v6-c-nav__section-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
10845
11033
  --pf-v6-c-nav__section-title--Color: var(--pf-t--global--text--color--regular);
10846
- --pf-v6-c-nav__section-title--PaddingBlockStart: var(--pf-v6-c-nav__link--PaddingBlockStart);
10847
- --pf-v6-c-nav__section-title--PaddingBlockEnd: var(--pf-v6-c-nav__link--PaddingBlockEnd);
11034
+ --pf-v6-c-nav__section-title--PaddingBlockStart: 0;
11035
+ --pf-v6-c-nav__section-title--PaddingBlockEnd: 0;
10848
11036
  --pf-v6-c-nav__section-title--PaddingInlineStart: var(--pf-v6-c-nav__link--PaddingInlineStart);
10849
11037
  --pf-v6-c-nav__section-title--PaddingInlineEnd: var(--pf-v6-c-nav__link--PaddingInlineEnd);
10850
11038
  --pf-v6-c-nav__item--RowGap: var(--pf-v6-c-nav__list--RowGap);
10851
11039
  --pf-v6-c-nav__item__toggle-icon--Rotate: 0;
10852
11040
  --pf-v6-c-nav__item--m-expanded__toggle-icon--Rotate: 90deg;
11041
+ --pf-v6-c-nav__item__toggle-icon--TransitionDuration--transform: var(--pf-t--global--motion--duration--icon--default);
11042
+ --pf-v6-c-nav__item__toggle-icon--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--default);
10853
11043
  --pf-v6-c-nav__link--ColumnGap: var(--pf-t--global--spacer--sm);
10854
11044
  --pf-v6-c-nav__link--AlignItems: baseline;
10855
11045
  --pf-v6-c-nav__link--BorderRadius: var(--pf-t--global--border--radius--small);
@@ -10860,10 +11050,19 @@ ul.pf-v6-c-list {
10860
11050
  --pf-v6-c-nav__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--hover);
10861
11051
  --pf-v6-c-nav__link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--clicked);
10862
11052
  --pf-v6-c-nav__link--m-current--Color: var(--pf-t--global--text--color--regular);
11053
+ --pf-v6-c-nav__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--default);
11054
+ --pf-v6-c-nav__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
11055
+ --pf-v6-c-nav__link--m-current--TransitionDuration--color: var(--pf-t--global--motion--duration--fade--short);
11056
+ --pf-v6-c-nav__link--m-current--TransitionTimingFunction--color: var(--pf-t--global--motion--timing-function--default);
10863
11057
  --pf-v6-c-nav__link-icon--Color: var(--pf-t--global--icon--color--subtle);
10864
11058
  --pf-v6-c-nav__link--m-current__link-icon--Color: var(--pf-t--global--icon--color--regular);
10865
11059
  --pf-v6-c-nav__subnav--RowGap: var(--pf-t--global--border--width--extra-strong);
11060
+ --pf-v6-c-nav__subnav--PaddingBlockStart: var(--pf-v6-c-nav__item--RowGap);
11061
+ --pf-v6-c-nav__subnav--PaddingBlockEnd: var(--pf-v6-c-nav__item--RowGap);
10866
11062
  --pf-v6-c-nav__subnav--PaddingInlineStart: var(--pf-t--global--spacer--md);
11063
+ --pf-v6-c-nav__subnav--TransitionDuration--expansion: 0s;
11064
+ --pf-v6-c-nav__subnav--hidden--TransitionDuration--expansion: 0s;
11065
+ --pf-v6-c-nav__subnav--TransitionTimingFunction--expansion: var(--pf-t--global--motion--timing-function--default);
10867
11066
  --pf-v6-c-nav__scroll-button--BorderColor: var(--pf-t--global--border--color--default);
10868
11067
  --pf-v6-c-nav__scroll-button--BorderWidth: var(--pf-t--global--border--width--divider--default);
10869
11068
  --pf-v6-c-nav__scroll-button--first-of-type--c-button--BorderStartStartRadius: var(--pf-t--global--border--radius--pill);
@@ -10892,6 +11091,12 @@ ul.pf-v6-c-list {
10892
11091
  --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
10893
11092
  --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
10894
11093
  }
11094
+ @media (prefers-reduced-motion: no-preference) {
11095
+ .pf-v6-c-nav {
11096
+ --pf-v6-c-nav__subnav--TransitionDuration--expansion: var(--pf-t--global--motion--duration--slide-in--default);
11097
+ --pf-v6-c-nav__subnav--hidden--TransitionDuration--expansion: var(--pf-t--global--motion--duration--slide-in--short);
11098
+ }
11099
+ }
10895
11100
 
10896
11101
  .pf-v6-c-nav,
10897
11102
  .pf-v6-c-nav__section,
@@ -10943,7 +11148,7 @@ ul.pf-v6-c-list {
10943
11148
  }
10944
11149
 
10945
11150
  [class^=pf-v6-c-nav][hidden] {
10946
- display: none;
11151
+ visibility: hidden;
10947
11152
  }
10948
11153
 
10949
11154
  .pf-v6-c-nav__nav,
@@ -10952,30 +11157,43 @@ ul.pf-v6-c-list {
10952
11157
  --pf-v6-c-nav__item--RowGap--row-offset: calc(var(--pf-v6-c-nav__list--RowGap) / 2 * -1);
10953
11158
  --pf-v6-c-nav__link--clickable-inset--Block: var(--pf-v6-c-nav__item--RowGap--row-offset);
10954
11159
  --pf-v6-c-nav__button--RowGap--row-offset: calc(var(--pf-v6-c-nav__item--RowGap) * -1);
11160
+ visibility: visible;
10955
11161
  }
10956
11162
 
10957
11163
  .pf-v6-c-nav__list {
10958
11164
  row-gap: var(--pf-v6-c-nav__list--RowGap);
10959
11165
  column-gap: var(--pf-v6-c-nav__list--ColumnGap);
11166
+ min-height: 0;
10960
11167
  }
10961
11168
 
10962
11169
  .pf-v6-c-nav__subnav {
10963
11170
  --pf-v6-c-nav__list--RowGap: var(--pf-v6-c-nav__subnav--RowGap);
11171
+ grid-template-rows: 1fr;
11172
+ min-height: 0;
11173
+ padding-block-start: var(--pf-v6-c-nav__subnav--PaddingBlockStart);
11174
+ padding-block-end: var(--pf-v6-c-nav__subnav--PaddingBlockEnd);
10964
11175
  padding-inline-start: var(--pf-v6-c-nav__subnav--PaddingInlineStart);
11176
+ overflow-y: clip;
11177
+ transition-timing-function: var(--pf-v6-c-nav__subnav--TransitionTimingFunction--expansion);
11178
+ transition-duration: var(--pf-v6-c-nav__subnav--TransitionDuration--expansion);
11179
+ transition-property: grid-template-rows, padding-block-start, padding-block-end, opacity;
11180
+ }
11181
+ .pf-v6-c-nav__subnav[hidden] {
11182
+ --pf-v6-c-nav__subnav--TransitionDuration--expansion: var(--pf-v6-c-nav__subnav--hidden--TransitionDuration--expansion);
11183
+ --pf-v6-c-nav__subnav--PaddingBlockStart: 0;
11184
+ --pf-v6-c-nav__subnav--PaddingBlockEnd: 0;
11185
+ grid-template-rows: 0fr;
11186
+ opacity: 0;
10965
11187
  }
10966
11188
 
10967
11189
  .pf-v6-c-nav__item {
10968
- row-gap: var(--pf-v6-c-nav__item--RowGap);
10969
11190
  scroll-snap-align: var(--pf-v6-c-nav__item--ScrollSnapAlign);
10970
11191
  }
10971
11192
  .pf-v6-c-nav__item > .pf-v6-c-nav__link[button] {
10972
11193
  margin-block-end: var(--pf-v6-c-nav__button--RowGap--row-offset);
10973
11194
  }
10974
- .pf-v6-c-nav__item.pf-m-expanded:is(:not(:only-child, :last-child)) {
10975
- margin-block-end: var(--pf-v6-c-nav__item--m-expanded--MarginBlockEnd, var(--pf-v6-c-nav__item--RowGap));
10976
- }
10977
- .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 {
10978
- inset-block-start: calc(var(--pf-v6-c-nav__item--RowGap) * -1 - var(--pf-v6-c-nav__list--RowGap));
11195
+ .pf-v6-c-nav__item.pf-m-expanded:last-child > .pf-v6-c-nav__subnav {
11196
+ margin-block-end: calc(var(--pf-v6-c-nav__subnav--PaddingBlockEnd) * -1);
10979
11197
  }
10980
11198
 
10981
11199
  .pf-v6-c-nav__section {
@@ -11006,13 +11224,13 @@ ul.pf-v6-c-list {
11006
11224
  line-height: var(--pf-v6-c-nav__link--LineHeight, inherit);
11007
11225
  color: var(--pf-v6-c-nav__link--Color);
11008
11226
  text-align: start;
11009
- text-decoration: none;
11227
+ text-decoration-line: none;
11010
11228
  background-color: var(--pf-v6-c-nav__link--BackgroundColor);
11011
11229
  border: none;
11012
11230
  border-radius: var(--pf-v6-c-nav__link--BorderRadius);
11013
- }
11014
- .pf-v6-c-nav__link[aria-expanded=true]::before {
11015
- inset-block-end: calc(var(--pf-v6-c-nav__item--RowGap) * -1);
11231
+ transition-timing-function: var(--pf-v6-c-nav__link--TransitionTimingFunction--background-color), var(--pf-v6-c-nav__link--m-current--TransitionTimingFunction--color);
11232
+ transition-duration: var(--pf-v6-c-nav__link--TransitionDuration--background-color), var(--pf-v6-c-nav__link--m-current--TransitionDuration--color);
11233
+ transition-property: background-color, color;
11016
11234
  }
11017
11235
  .pf-v6-c-nav__link:hover, .pf-v6-c-nav__link.pf-m-hover, .pf-v6-c-nav__link:focus {
11018
11236
  color: var(--pf-v6-c-nav__link--hover--Color);
@@ -11037,6 +11255,9 @@ ul.pf-v6-c-list {
11037
11255
 
11038
11256
  .pf-v6-c-nav__toggle-icon {
11039
11257
  display: inline-block;
11258
+ transition-timing-function: var(--pf-v6-c-nav__item__toggle-icon--TransitionTimingFunction--transform);
11259
+ transition-duration: var(--pf-v6-c-nav__item__toggle-icon--TransitionDuration--transform);
11260
+ transition-property: transform;
11040
11261
  transform: rotate(var(--pf-v6-c-nav__item__toggle-icon--Rotate));
11041
11262
  }
11042
11263
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-nav__toggle-icon {
@@ -11476,12 +11697,18 @@ ul.pf-v6-c-list {
11476
11697
  --pf-v6-c-page__main-container--GridArea: main;
11477
11698
  --pf-v6-c-page--masthead--main-container--GridArea: sidebar / sidebar / main / main;
11478
11699
  --pf-v6-c-page__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg));
11700
+ --pf-v6-c-page__main-container--AlignSelf: start;
11479
11701
  --pf-v6-c-page__main-container--BackgroundColor: var(--pf-t--global--background--color--primary--default);
11480
11702
  --pf-v6-c-page__main-container--MarginInlineStart: var(--pf-v6-c-page--inset);
11481
11703
  --pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page--inset);
11482
11704
  --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--medium);
11483
11705
  --pf-v6-c-page__main-container--BorderWidth: 0.25rem;
11484
11706
  --pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
11707
+ --pf-v6-c-page__main-container--xs--AlignSelf: stretch;
11708
+ --pf-v6-c-page__main-container--xs--BorderRadius: 0;
11709
+ --pf-v6-c-page__main-container--xs--MarginInlineStart: 0;
11710
+ --pf-v6-c-page__main-container--xs--MaxHeight: 100%;
11711
+ --pf-v6-c-page__main-container--xs--MarginInlineEnd: 0;
11485
11712
  --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
11486
11713
  --pf-v6-c-page__main-section--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
11487
11714
  --pf-v6-c-page__main-section--PaddingBlockEnd: var(--pf-t--global--spacer--md);
@@ -11839,7 +12066,7 @@ ul.pf-v6-c-list {
11839
12066
  .pf-v6-c-page__main-container {
11840
12067
  display: flex;
11841
12068
  flex-direction: column;
11842
- align-self: start;
12069
+ align-self: var(--pf-v6-c-page__main-container--AlignSelf);
11843
12070
  max-height: var(--pf-v6-c-page__main-container--MaxHeight);
11844
12071
  margin-inline-start: var(--pf-v6-c-page__main-container--MarginInlineStart);
11845
12072
  margin-inline-end: var(--pf-v6-c-page__main-container--MarginInlineEnd);
@@ -11847,6 +12074,15 @@ ul.pf-v6-c-list {
11847
12074
  border: var(--pf-v6-c-page__main-container--BorderWidth) solid var(--pf-v6-c-page__main-container--BorderColor);
11848
12075
  border-radius: var(--pf-v6-c-page__main-container--BorderRadius);
11849
12076
  }
12077
+ @media screen and (max-width: calc(48rem - 1px)) {
12078
+ .pf-v6-c-page__main-container {
12079
+ --pf-v6-c-page__main-container--AlignSelf: var(--pf-v6-c-page__main-container--xs--AlignSelf);
12080
+ --pf-v6-c-page__main-container--MarginInlineStart: var(--pf-v6-c-page__main-container--xs--MarginInlineStart);
12081
+ --pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page__main-container--xs--MarginInlineEnd);
12082
+ --pf-v6-c-page__main-container--MaxHeight: var(--pf-v6-c-page__main-container--xs--MaxHeight);
12083
+ --pf-v6-c-page__main-container--BorderRadius: var(--pf-v6-c-page__main-container--xs--BorderRadius);
12084
+ }
12085
+ }
11850
12086
 
11851
12087
  .pf-v6-c-page__main-container,
11852
12088
  .pf-v6-c-page__drawer {
@@ -12709,9 +12945,11 @@ ul.pf-v6-c-list {
12709
12945
  }
12710
12946
 
12711
12947
  .pf-v6-c-popover__title-text {
12948
+ min-width: 0;
12712
12949
  font-size: var(--pf-v6-c-popover__title-text--FontSize);
12713
12950
  font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
12714
12951
  color: var(--pf-v6-c-popover__title-text--Color);
12952
+ overflow-wrap: break-word;
12715
12953
  }
12716
12954
 
12717
12955
  .pf-v6-c-popover__body {
@@ -12726,6 +12964,7 @@ ul.pf-v6-c-list {
12726
12964
  --pf-v6-c-progress--GridGap: var(--pf-t--global--spacer--md);
12727
12965
  --pf-v6-c-progress__bar--Height: var(--pf-t--global--spacer--md);
12728
12966
  --pf-v6-c-progress__bar--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
12967
+ --pf-v6-c-progress__bar--BorderRadius: var(--pf-t--global--border--radius--medium);
12729
12968
  --pf-v6-c-progress__measure--m-static-width--MinWidth: 4.5ch;
12730
12969
  --pf-v6-c-progress__status--Gap: var(--pf-t--global--spacer--sm);
12731
12970
  --pf-v6-c-progress__status-icon--Color: var(--pf-t--global--icon--color--regular);
@@ -12867,7 +13106,9 @@ ul.pf-v6-c-list {
12867
13106
  grid-column: 1/3;
12868
13107
  align-self: center;
12869
13108
  height: var(--pf-v6-c-progress__bar--Height);
13109
+ overflow: hidden;
12870
13110
  background-color: var(--pf-v6-c-progress__bar--BackgroundColor);
13111
+ border-radius: var(--pf-v6-c-progress__bar--BorderRadius);
12871
13112
  }
12872
13113
 
12873
13114
  .pf-v6-c-progress__indicator {
@@ -13204,7 +13445,8 @@ ul.pf-v6-c-list {
13204
13445
  .pf-v6-c-progress-stepper__step-title.pf-m-help-text {
13205
13446
  padding-inline-start: var(--pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineStart);
13206
13447
  padding-inline-end: var(--pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineEnd);
13207
- 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);
13448
+ text-decoration-line: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationLine);
13449
+ text-decoration-style: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationStyle);
13208
13450
  text-underline-offset: var(--pf-v6-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset);
13209
13451
  cursor: pointer;
13210
13452
  }
@@ -13957,7 +14199,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13957
14199
  font-size: var(--pf-v6-c-simple-list__item-link--FontSize);
13958
14200
  color: var(--pf-v6-c-simple-list__item-link--Color);
13959
14201
  text-align: start;
13960
- text-decoration: none;
14202
+ text-decoration-line: none;
13961
14203
  background-color: var(--pf-v6-c-simple-list__item-link--BackgroundColor);
13962
14204
  border: none;
13963
14205
  border-radius: var(--pf-v6-c-simple-list__item-link--BorderRadius);
@@ -13970,7 +14212,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13970
14212
  .pf-v6-c-simple-list__item-link:is(:hover, :focus) {
13971
14213
  --pf-v6-c-simple-list__item-link--BackgroundColor: var(--pf-v6-c-simple-list__item-link--hover--BackgroundColor);
13972
14214
  --pf-v6-c-simple-list__item-link--Color: var(--pf-v6-c-simple-list__item-link--hover--Color);
13973
- text-decoration: none;
14215
+ text-decoration-line: none;
13974
14216
  }
13975
14217
  .pf-v6-c-simple-list__item-link.pf-m-current {
13976
14218
  --pf-v6-c-simple-list__item-link--BackgroundColor: var(--pf-v6-c-simple-list__item-link--m-current--BackgroundColor);
@@ -14501,7 +14743,9 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14501
14743
  --pf-v6-c-switch__toggle--before--Height: var(--pf-v6-c-switch__toggle--before--Width);
14502
14744
  --pf-v6-c-switch__toggle--before--InsetInlineStart: calc((var(--pf-v6-c-switch__toggle--Height) - var(--pf-v6-c-switch__toggle--before--Height)) / 2);
14503
14745
  --pf-v6-c-switch__toggle--before--BorderRadius: var(--pf-t--global--border--radius--large);
14504
- --pf-v6-c-switch__toggle--before--Transition: transform .25s ease 0s;
14746
+ --pf-v6-c-switch__toggle--before--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
14747
+ --pf-v6-c-switch__toggle--before--TransitionDuration: var(--pf-t--global--motion--duration--md);
14748
+ --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);
14505
14749
  --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));
14506
14750
  }
14507
14751
 
@@ -16816,13 +17060,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
16816
17060
  vertical-align: baseline;
16817
17061
  }
16818
17062
 
16819
- .pf-v6-c-table__favorite .pf-v6-c-button {
17063
+ .pf-v6-c-table__favorite .pf-v6-c-button:not(.pf-m-favorite) {
16820
17064
  --pf-v6-c-button--FontSize: var(--pf-v6-c-table__favorite--c-button--FontSize);
16821
17065
  }
16822
- .pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button {
17066
+ .pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited) {
16823
17067
  --pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-table__favorite--m-favorited--c-button--Color);
16824
17068
  }
16825
- .pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button:is(:hover, :focus) {
17069
+ .pf-v6-c-table__favorite.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus) {
16826
17070
  --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-table__favorite--m-favorited--c-button--Color);
16827
17071
  }
16828
17072
 
@@ -18482,7 +18726,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18482
18726
  padding-inline-end: var(--pf-v6-c-tabs__link--PaddingInlineEnd);
18483
18727
  font-size: var(--pf-v6-c-tabs__link--FontSize);
18484
18728
  color: var(--pf-v6-c-tabs__link--Color);
18485
- text-decoration: none;
18729
+ text-decoration-line: none;
18486
18730
  background-color: var(--pf-v6-c-tabs__link--BackgroundColor);
18487
18731
  border-radius: var(--pf-v6-c-tabs__link--BorderRadius);
18488
18732
  }
@@ -19122,7 +19366,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19122
19366
  }
19123
19367
  .pf-v6-c-timestamp.pf-m-help-text {
19124
19368
  --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--Color);
19125
- text-decoration: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine) var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
19369
+ text-decoration-line: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine);
19370
+ text-decoration-style: var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
19126
19371
  text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
19127
19372
  cursor: pointer;
19128
19373
  }
@@ -19335,7 +19580,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19335
19580
  --pf-v6-c-toggle-group__button--BackgroundColor: var(--pf-v6-c-toggle-group__button--hover--BackgroundColor);
19336
19581
  --pf-v6-c-toggle-group__button--ZIndex: var(--pf-v6-c-toggle-group__button--hover--ZIndex);
19337
19582
  --pf-v6-c-toggle-group__button--before--BorderColor: var(--pf-v6-c-toggle-group__button--hover--before--BorderColor);
19338
- text-decoration: none;
19583
+ text-decoration-line: none;
19339
19584
  }
19340
19585
  .pf-v6-c-toggle-group__button.pf-m-selected {
19341
19586
  --pf-v6-c-toggle-group__button--BackgroundColor: var(--pf-v6-c-toggle-group__button--m-selected--BackgroundColor);
@@ -19583,13 +19828,18 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19583
19828
  }
19584
19829
  .pf-v6-c-toolbar.pf-m-full-height {
19585
19830
  --pf-v6-c-toolbar--PaddingBlockStart: 0;
19586
- --pf-v6-c-toolbar--PaddinkBlockEnd: 0;
19831
+ --pf-v6-c-toolbar--PaddingBlockEnd: 0;
19587
19832
  }
19588
19833
  .pf-v6-c-toolbar.pf-m-full-height .pf-v6-c-toolbar__group,
19589
19834
  .pf-v6-c-toolbar.pf-m-full-height .pf-v6-c-toolbar__item {
19590
19835
  align-items: stretch;
19591
19836
  align-self: stretch;
19592
19837
  }
19838
+ .pf-v6-c-toolbar.pf-m-no-padding {
19839
+ --pf-v6-c-toolbar--PaddingBlockEnd: 0;
19840
+ --pf-v6-c-toolbar--m-sticky--PaddingBlockStart: 0;
19841
+ --pf-v6-c-toolbar--m-sticky--PaddingBlockEnd: 0;
19842
+ }
19593
19843
  .pf-v6-c-toolbar.pf-m-primary {
19594
19844
  --pf-v6-c-toolbar--BackgroundColor: var(--pf-v6-c-toolbar--m-primary--BackgroundColor);
19595
19845
  }
@@ -22286,7 +22536,7 @@ label.pf-v6-c-tree-view__node-text {
22286
22536
  padding-inline: 0;
22287
22537
  color: var(--pf-v6-c-wizard__nav-link--Color);
22288
22538
  text-align: start;
22289
- text-decoration: var(--pf-v6-c-wizard__nav-link--TextDecoration);
22539
+ text-decoration-line: var(--pf-v6-c-wizard__nav-link--TextDecoration);
22290
22540
  word-break: break-word;
22291
22541
  counter-increment: wizard-nav-count;
22292
22542
  background-color: transparent;