@patternfly/patternfly 6.3.0-prerelease.6 → 6.3.0-prerelease.60

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 (168) hide show
  1. package/README.md +22 -14
  2. package/assets/images/icon-help.hbs +3 -0
  3. package/assets/images/icon-outlined-star.hbs +3 -0
  4. package/assets/images/icon-star.hbs +3 -0
  5. package/base/normalize.scss +4 -0
  6. package/base/patternfly-common.css +46 -11
  7. package/base/patternfly-common.scss +58 -13
  8. package/base/patternfly-variables.css +1172 -1
  9. package/base/patternfly-variables.scss +10 -0
  10. package/base/tokens/tokens-charts-dark.scss +1 -1
  11. package/base/tokens/tokens-charts.scss +1 -1
  12. package/base/tokens/tokens-dark.scss +13 -1
  13. package/base/tokens/tokens-default.scss +60 -2
  14. package/base/tokens/tokens-highcontrast-dark.scss +396 -0
  15. package/base/tokens/tokens-highcontrast.scss +703 -0
  16. package/base/tokens/tokens-local.scss +1 -0
  17. package/base/tokens/tokens-palette.scss +9 -1
  18. package/components/Accordion/accordion.css +102 -6
  19. package/components/Accordion/accordion.scss +112 -10
  20. package/components/Alert/alert-group.css +67 -33
  21. package/components/Alert/alert-group.scss +95 -48
  22. package/components/Badge/badge.css +2 -0
  23. package/components/Badge/badge.scss +2 -0
  24. package/components/Banner/banner.css +4 -0
  25. package/components/Banner/banner.scss +4 -0
  26. package/components/Button/button.css +187 -9
  27. package/components/Button/button.scss +195 -13
  28. package/components/CalendarMonth/calendar-month.css +16 -0
  29. package/components/CalendarMonth/calendar-month.scss +16 -0
  30. package/components/Card/card.css +5 -4
  31. package/components/Card/card.scss +5 -4
  32. package/components/CodeBlock/code-block.css +3 -0
  33. package/components/CodeBlock/code-block.scss +3 -0
  34. package/components/CodeEditor/code-editor.css +8 -3
  35. package/components/CodeEditor/code-editor.scss +11 -6
  36. package/components/DataList/data-list.css +2 -2
  37. package/components/DataList/data-list.scss +2 -2
  38. package/components/DatePicker/date-picker.css +3 -0
  39. package/components/DatePicker/date-picker.scss +4 -0
  40. package/components/Drawer/drawer.css +44 -41
  41. package/components/Drawer/drawer.scss +42 -36
  42. package/components/DualListSelector/dual-list-selector.css +55 -1
  43. package/components/DualListSelector/dual-list-selector.scss +63 -1
  44. package/components/ExpandableSection/expandable-section.css +63 -1
  45. package/components/ExpandableSection/expandable-section.scss +76 -2
  46. package/components/FileUpload/file-upload.css +3 -3
  47. package/components/FileUpload/file-upload.scss +3 -3
  48. package/components/Form/form.css +40 -1
  49. package/components/Form/form.scss +47 -1
  50. package/components/FormControl/form-control.css +16 -0
  51. package/components/FormControl/form-control.scss +9 -0
  52. package/components/InputGroup/input-group.css +80 -0
  53. package/components/InputGroup/input-group.scss +95 -0
  54. package/components/Label/label.css +20 -11
  55. package/components/Label/label.scss +21 -11
  56. package/components/Login/login.css +3 -0
  57. package/components/Login/login.scss +3 -0
  58. package/components/Menu/menu.css +35 -4
  59. package/components/Menu/menu.scss +32 -6
  60. package/components/MenuToggle/menu-toggle.css +51 -10
  61. package/components/MenuToggle/menu-toggle.scss +61 -9
  62. package/components/ModalBox/modal-box.css +3 -0
  63. package/components/ModalBox/modal-box.scss +3 -0
  64. package/components/Nav/nav.css +39 -8
  65. package/components/Nav/nav.scss +42 -9
  66. package/components/Page/page.css +124 -26
  67. package/components/Page/page.scss +86 -16
  68. package/components/Pagination/pagination.css +14 -1
  69. package/components/Pagination/pagination.scss +14 -1
  70. package/components/Panel/panel.css +7 -1
  71. package/components/Panel/panel.scss +7 -1
  72. package/components/Popover/popover.css +4 -0
  73. package/components/Popover/popover.scss +4 -0
  74. package/components/Progress/progress.css +26 -0
  75. package/components/Progress/progress.scss +22 -1
  76. package/components/ProgressStepper/progress-stepper.scss +1 -0
  77. package/components/SimpleList/simple-list.css +15 -0
  78. package/components/SimpleList/simple-list.scss +17 -1
  79. package/components/Skeleton/skeleton.css +22 -2
  80. package/components/Skeleton/skeleton.scss +25 -3
  81. package/components/Spinner/spinner.css +5 -0
  82. package/components/Spinner/spinner.scss +6 -0
  83. package/components/Table/table-grid.css +51 -5
  84. package/components/Table/table-grid.scss +22 -1
  85. package/components/Table/table.css +124 -2
  86. package/components/Table/table.scss +171 -3
  87. package/components/Tabs/tabs.css +32 -15
  88. package/components/Tabs/tabs.scss +34 -14
  89. package/components/TextInputGroup/text-input-group.css +23 -0
  90. package/components/TextInputGroup/text-input-group.scss +16 -1
  91. package/components/Timestamp/timestamp.css +4 -0
  92. package/components/Timestamp/timestamp.scss +7 -0
  93. package/components/TreeView/tree-view.css +54 -0
  94. package/components/TreeView/tree-view.scss +59 -2
  95. package/components/Truncate/truncate.css +1 -0
  96. package/components/Truncate/truncate.scss +3 -0
  97. package/components/Wizard/wizard.css +33 -6
  98. package/components/Wizard/wizard.scss +38 -8
  99. package/components/_index.css +1390 -195
  100. package/docs/components/Alert/examples/Alert.md +2 -2
  101. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  102. package/docs/components/Button/examples/Button.md +159 -6
  103. package/docs/components/Card/examples/Card.md +8 -8
  104. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +24 -32
  105. package/docs/components/CodeBlock/examples/CodeBlock.md +10 -10
  106. package/docs/components/CodeEditor/examples/CodeEditor.md +29 -5
  107. package/docs/components/DataList/examples/DataList.md +83 -207
  108. package/docs/components/DescriptionList/examples/DescriptionList.md +78 -22
  109. package/docs/components/DualListSelector/examples/DualListSelector.md +642 -319
  110. package/docs/components/EmptyState/examples/EmptyState.md +6 -6
  111. package/docs/components/ExpandableSection/examples/ExpandableSection.md +26 -15
  112. package/docs/components/Form/examples/Form.md +1178 -113
  113. package/docs/components/Hint/examples/Hint.md +3 -3
  114. package/docs/components/InlineEdit/examples/InlineEdit.md +2 -6
  115. package/docs/components/InputGroup/examples/InputGroup.md +5 -1
  116. package/docs/components/Label/examples/Label.md +2 -2
  117. package/docs/components/Login/examples/Login.md +22 -22
  118. package/docs/components/Masthead/examples/masthead.md +90 -12
  119. package/docs/components/Menu/examples/Menu.md +122 -6
  120. package/docs/components/MenuToggle/examples/MenuToggle.md +93 -55
  121. package/docs/components/ModalBox/examples/ModalBox.md +13 -1
  122. package/docs/components/OverflowMenu/examples/overflow-menu.md +5 -5
  123. package/docs/components/Page/examples/Page.md +147 -14
  124. package/docs/components/Pagination/examples/Pagination.md +123 -12
  125. package/docs/components/Popover/examples/Popover.md +0 -4
  126. package/docs/components/Progress/examples/Progress.md +222 -210
  127. package/docs/components/ProgressStepper/examples/ProgressStepper.md +32 -6
  128. package/docs/components/Skeleton/examples/Skeleton.md +21 -7
  129. package/docs/components/Slider/examples/Slider.md +2 -2
  130. package/docs/components/Spinner/examples/Spinner.md +10 -0
  131. package/docs/components/Table/examples/Table.md +7699 -4896
  132. package/docs/components/Tabs/examples/Tabs.md +1214 -6729
  133. package/docs/components/TextInputGroup/examples/TextInputGroup.md +168 -49
  134. package/docs/components/Title/examples/Title.md +8 -8
  135. package/docs/components/Toolbar/examples/Toolbar.md +7 -7
  136. package/docs/components/Wizard/examples/Wizard.md +583 -0
  137. package/docs/demos/AboutModal/examples/AboutModal.md +22 -3
  138. package/docs/demos/Alert/examples/Alert.md +66 -9
  139. package/docs/demos/BackToTop/examples/BackToTop.md +22 -3
  140. package/docs/demos/Banner/examples/Banner.md +47 -6
  141. package/docs/demos/Card/examples/Card.md +13 -67
  142. package/docs/demos/CardView/examples/CardView.md +24 -5
  143. package/docs/demos/Dashboard/examples/Dashboard.md +34 -27
  144. package/docs/demos/DataList/examples/DataList.md +628 -192
  145. package/docs/demos/DescriptionList/examples/DescriptionList.md +79 -50
  146. package/docs/demos/Drawer/examples/Drawer.md +110 -53
  147. package/docs/demos/Form/examples/BasicForms.md +146 -26
  148. package/docs/demos/JumpLinks/examples/JumpLinks.md +132 -18
  149. package/docs/demos/Masthead/examples/Masthead.md +170 -18
  150. package/docs/demos/Modal/examples/Modal.md +171 -21
  151. package/docs/demos/Nav/examples/Nav.md +111 -16
  152. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +114 -19
  153. package/docs/demos/Page/examples/Page.md +309 -43
  154. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -1
  155. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +886 -415
  156. package/docs/demos/Skeleton/examples/Skeleton.md +25 -4
  157. package/docs/demos/Table/examples/Table.md +480 -177
  158. package/docs/demos/Tabs/examples/Tabs.md +139 -594
  159. package/docs/demos/Toolbar/examples/Toolbar.md +72 -34
  160. package/docs/demos/Wizard/examples/Wizard.md +198 -27
  161. package/package.json +12 -7
  162. package/patternfly-base-no-globals.css +1217 -12
  163. package/patternfly-base.css +1221 -12
  164. package/patternfly-no-globals.css +2837 -437
  165. package/patternfly.css +2839 -435
  166. package/patternfly.min.css +1 -1
  167. package/patternfly.min.css.map +1 -1
  168. package/sass-utilities/mixins.scss +54 -0
@@ -205,6 +205,10 @@
205
205
  --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
206
206
  --pf-v6-c-accordion__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
207
207
  --pf-v6-c-accordion__toggle--BorderRadius: var(--pf-t--global--border--radius--small);
208
+ --pf-v6-c-accordion__toggle--ZIndex: var(--pf-t--global--z-index--xs);
209
+ --pf-v6-c-accordion__toggle--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
210
+ --pf-v6-c-accordion__toggle--BorderColor: var(--pf-t--global--border--color--high-contrast);
211
+ --pf-v6-c-accordion__toggle--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
208
212
  --pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
209
213
  --pf-v6-c-accordion__toggle-text--Color: var(--pf-t--global--text--color--regular);
210
214
  --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -213,15 +217,40 @@
213
217
  --pf-v6-c-accordion__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
214
218
  --pf-v6-c-accordion__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
215
219
  --pf-v6-c-accordion__toggle-icon--Transition: transform var(--pf-v6-c-accordion__toggle-icon--TransitionDuration) var(--pf-v6-c-accordion__toggle-icon--TransitionTimingFunction);
220
+ --pf-v6-c-accordion__toggle-icon--Rotate: 0;
216
221
  --pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate: 90deg;
217
222
  --pf-v6-c-accordion__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
218
- --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
223
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: 0;
219
224
  --pf-v6-c-accordion__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
220
225
  --pf-v6-c-accordion__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
221
226
  --pf-v6-c-accordion__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
222
227
  --pf-v6-c-accordion__expandable-content--Color: var(--pf-t--global--text--color--regular);
223
228
  --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-t--global--font--size--body--default);
229
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: 0;
224
230
  --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight: 9.375rem;
231
+ --pf-v6-c-accordion__expandable-content--MaxHeight: 0;
232
+ --pf-v6-c-accordion__expandable-content--Visibility: hidden;
233
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility: visible;
234
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight: 99999px;
235
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
236
+ --pf-v6-c-accordion__item--before--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
237
+ --pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
238
+ --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade);
239
+ --pf-v6-c-accordion__item--before--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
240
+ --pf-v6-c-accordion__item--before--Opacity: 0;
241
+ --pf-v6-c-accordion__item--m-expanded--before--Opacity: 1;
242
+ --pf-v6-c-accordion__item--m-expanded--before--TranslateY: 0;
243
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--slide: 0s;
244
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
245
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--expand--slide: 0s;
246
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
247
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--slide: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--slide);
248
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--fade);
249
+ --pf-v6-c-accordion__expandable-content--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
250
+ --pf-v6-c-accordion__expandable-content--Opacity: 0;
251
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity: 1;
252
+ --pf-v6-c-accordion__expandable-content--TranslateY: 0;
253
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY: 0;
225
254
  --pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-t--global--spacer--sm);
226
255
  --pf-v6-c-accordion__expandable-content-body--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
227
256
  --pf-v6-c-accordion__expandable-content-body--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -240,6 +269,22 @@
240
269
  --pf-v6-c-accordion--m-bordered--RowGap: 0;
241
270
  --pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
242
271
  --pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor: var(--pf-t--global--border--color--default);
272
+ --pf-v6-c-accordion__item--BorderWidth: 0;
273
+ --pf-v6-c-accordion__item--BorderColor: var(--pf-t--global--border--color--high-contrast);
274
+ --pf-v6-c-accordion__item--m-expanded--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
275
+ --pf-v6-c-accordion__expandable-content--BorderWidth: 0;
276
+ --pf-v6-c-accordion__expandable-content--BorderColor: var(--pf-t--global--border--color--high-contrast);
277
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
278
+ }
279
+ @media screen and (prefers-reduced-motion: no-preference) {
280
+ .pf-v6-c-accordion {
281
+ --pf-v6-c-accordion__item--before--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
282
+ --pf-v6-c-accordion__item--before--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
283
+ --pf-v6-c-accordion__item--before--TranslateY: -.5rem;
284
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
285
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
286
+ --pf-v6-c-accordion__expandable-content--TranslateY: -.5rem;
287
+ }
243
288
  }
244
289
 
245
290
  .pf-v6-c-accordion {
@@ -268,24 +313,52 @@
268
313
  --pf-v6-c-accordion--RowGap: var(--pf-v6-c-accordion--m-bordered--RowGap);
269
314
  --pf-v6-c-accordion__item--BorderRadius: 0;
270
315
  --pf-v6-c-accordion__toggle--BorderRadius: 0;
316
+ --pf-v6-c-accordion__item--BorderWidth: 0;
271
317
  }
272
318
  .pf-v6-c-accordion.pf-m-bordered .pf-v6-c-accordion__item {
273
319
  border-block-end: var(--pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth) solid var(--pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor);
274
320
  }
275
321
 
276
322
  .pf-v6-c-accordion__item {
323
+ position: relative;
324
+ }
325
+ .pf-v6-c-accordion__item::before {
326
+ position: absolute;
327
+ inset: 0;
328
+ pointer-events: none;
329
+ content: "";
330
+ background-color: var(--pf-v6-c-accordion__item--m-expanded--BackgroundColor);
331
+ border: var(--pf-v6-c-accordion__item--BorderWidth) solid var(--pf-v6-c-accordion__item--BorderColor);
277
332
  border-radius: var(--pf-v6-c-accordion__item--BorderRadius);
333
+ opacity: var(--pf-v6-c-accordion__item--before--Opacity);
334
+ transition-timing-function: var(--pf-v6-c-accordion__item--before--TransitionTimingFunction);
335
+ transition-duration: var(--pf-v6-c-accordion__item--before--TransitionDuration--fade);
336
+ transition-property: opacity;
278
337
  }
279
338
  .pf-v6-c-accordion__item.pf-m-expanded {
280
339
  --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd);
281
340
  --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight);
282
- background-color: var(--pf-v6-c-accordion__item--m-expanded--BackgroundColor);
283
- }
284
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__toggle-icon {
285
- transform: rotate(var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate));
341
+ --pf-v6-c-accordion__toggle-icon--Rotate: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate);
342
+ --pf-v6-c-accordion__item--before--TransitionDuration--slide: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--slide);
343
+ --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--fade);
344
+ --pf-v6-c-accordion__item--before--Opacity: var(--pf-v6-c-accordion__item--m-expanded--before--Opacity);
345
+ --pf-v6-c-accordion__item--before--TranslateY: var(--pf-v6-c-accordion__item--m-expanded--before--TranslateY);
346
+ --pf-v6-c-accordion__item--BorderWidth: var(--pf-v6-c-accordion__item--m-expanded--BorderWidth);
347
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--slide: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--slide);
348
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade);
349
+ --pf-v6-c-accordion__expandable-content--Opacity: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity);
350
+ --pf-v6-c-accordion__expandable-content--TranslateY: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY);
351
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd);
352
+ --pf-v6-c-accordion__expandable-content--MaxHeight: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight);
353
+ --pf-v6-c-accordion__expandable-content--Visibility: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility);
354
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: 0s;
355
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
356
+ --pf-v6-c-accordion__expandable-content--BorderWidth: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--BorderWidth);
286
357
  }
287
358
 
288
359
  .pf-v6-c-accordion__toggle {
360
+ position: relative;
361
+ z-index: var(--pf-v6-c-accordion__toggle--ZIndex);
289
362
  display: flex;
290
363
  column-gap: var(--pf-v6-c-accordion__toggle--ColumnGap);
291
364
  align-items: center;
@@ -301,8 +374,17 @@
301
374
  border: 0;
302
375
  border-radius: var(--pf-v6-c-accordion__toggle--BorderRadius);
303
376
  }
377
+ .pf-v6-c-accordion__toggle::after {
378
+ position: absolute;
379
+ inset: 0;
380
+ pointer-events: none;
381
+ content: "";
382
+ border: var(--pf-v6-c-accordion__toggle--BorderWidth) solid var(--pf-v6-c-accordion__toggle--BorderColor);
383
+ border-radius: inherit;
384
+ }
304
385
  .pf-v6-c-accordion__toggle:is(:hover, :focus) {
305
386
  --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-v6-c-accordion__toggle--hover--BackgroundColor);
387
+ --pf-v6-c-accordion__toggle--BorderWidth: var(--pf-v6-c-accordion__toggle--hover--BorderWidth);
306
388
  }
307
389
 
308
390
  .pf-v6-c-accordion__toggle-text {
@@ -316,22 +398,36 @@
316
398
 
317
399
  .pf-v6-c-accordion__toggle-icon {
318
400
  transition: var(--pf-v6-c-accordion__toggle-icon--Transition);
401
+ transform: rotate(var(--pf-v6-c-accordion__toggle-icon--Rotate));
319
402
  }
320
403
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-accordion__toggle-icon {
321
404
  scale: -1 1;
322
405
  }
323
406
 
407
+ .pf-v6-c-accordion__expandable-content:where([hidden]) {
408
+ display: revert;
409
+ }
410
+
324
411
  .pf-v6-c-accordion__expandable-content {
412
+ max-height: var(--pf-v6-c-accordion__expandable-content--MaxHeight);
325
413
  margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
326
414
  margin-inline-start: var(--pf-v6-c-accordion__expandable-content--MarginInlineStart);
327
415
  margin-inline-end: var(--pf-v6-c-accordion__expandable-content--MarginInlineEnd);
328
416
  font-size: var(--pf-v6-c-accordion__expandable-content--FontSize);
329
417
  color: var(--pf-v6-c-accordion__expandable-content--Color);
418
+ visibility: var(--pf-v6-c-accordion__expandable-content--Visibility);
330
419
  background-color: var(--pf-v6-c-accordion__expandable-content--BackgroundColor);
420
+ border: var(--pf-v6-c-accordion__expandable-content--BorderWidth) solid var(--pf-v6-c-accordion__expandable-content--BorderColor);
331
421
  border-radius: var(--pf-v6-c-accordion__expandable-content--BorderRadius);
422
+ opacity: var(--pf-v6-c-accordion__expandable-content--Opacity);
423
+ transition-delay: 0s, 0s, var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade), var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade), var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade);
424
+ transition-timing-function: var(--pf-v6-c-accordion__expandable-content--TransitionTimingFunction);
425
+ transition-duration: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--fade), var(--pf-v6-c-accordion__expandable-content--TransitionDuration--slide), 0s, 0s, 0s;
426
+ transition-property: opacity, translate, visibility, max-height, margin-block-end;
427
+ translate: 0 var(--pf-v6-c-accordion__expandable-content--TranslateY);
332
428
  }
333
429
  .pf-v6-c-accordion__expandable-content.pf-m-fixed {
334
- max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
430
+ max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base);
335
431
  overflow-y: auto;
336
432
  }
337
433
 
@@ -597,28 +693,47 @@
597
693
  var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionDuration)
598
694
  var(--pf-v6-c-alert-group--m-toast__item--c-alert--TransitionTimingFunction)
599
695
  0s;
600
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default);
601
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--accelerate);
602
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default: var(--pf-t--global--motion--duration--fade--default);
603
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default: var(--pf-t--global--motion--duration--fade--default);
604
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default: var(--pf-t--global--motion--duration--fade--default);
605
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-out--short);
606
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--accelerate);
607
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity: var(--pf-t--global--motion--duration--slide-out--short);
608
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--accelerate);
609
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--fade--short);
610
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--accelerate);
611
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block: var(--pf-t--global--motion--duration--slide-out--short);
612
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--short);
613
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--accelerate);
614
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows: var(--pf-t--global--motion--duration--slide-out--short);
615
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-out--short);
616
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
617
- --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: all
618
- var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration)
619
- var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction)
620
- var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration);
621
- --pf-v6-c-alert-group__overflow-button--BorderWidth: 0;
696
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity--default: var(--pf-t--global--motion--duration--fade--default);
697
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity--default: var(--pf-t--global--motion--timing-function--accelerate);
698
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows--default: var(--pf-t--global--motion--duration--fade--default);
699
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block--default: var(--pf-t--global--motion--duration--fade--default);
700
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDelay--default: var(--pf-t--global--motion--duration--fade--default);
701
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity--default: initial;
702
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default: initial;
703
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default: initial;
704
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default: initial;
705
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default: initial;
706
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-out--short);
707
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--transform: var(--pf-t--global--motion--timing-function--accelerate);
708
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--opacity: var(--pf-t--global--motion--duration--slide-out--short);
709
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity: var(--pf-t--global--motion--timing-function--accelerate);
710
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--margin-block: var(--pf-t--global--motion--duration--fade--short);
711
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--margin-block: var(--pf-t--global--motion--timing-function--accelerate);
712
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--margin-block: var(--pf-t--global--motion--duration--slide-out--short);
713
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDuration--grid-template-rows: var(--pf-t--global--motion--duration--slide-in--short);
714
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--grid-template-rows: var(--pf-t--global--motion--timing-function--accelerate);
715
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows: var(--pf-t--global--motion--duration--slide-out--short);
716
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--transform: initial;
717
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform: initial;
718
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--opacity: initial;
719
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity: initial;
720
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--margin-block: initial;
721
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--margin-block: initial;
722
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block: initial;
723
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDuration--grid-template-rows: initial;
724
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--grid-template-rows: initial;
725
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows: initial;
726
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration: var(--pf-t--global--motion--duration--slide-out--short);
727
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
728
+ --pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition: all
729
+ var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration)
730
+ var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionTimingFunction)
731
+ var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDuration);
732
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: initial;
733
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: initial;
734
+ --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: initial;
735
+ --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
736
+ --pf-v6-c-alert-group__overflow-button--BorderColor: var(--pf-t--global--border--color--high-contrast);
622
737
  --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
623
738
  --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
624
739
  --pf-v6-c-alert-group__overflow-button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -627,6 +742,7 @@
627
742
  --pf-v6-c-alert-group__overflow-button--Color: var(--pf-t--global--text--color--link--default);
628
743
  --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-t--global--box-shadow--lg);
629
744
  --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-t--global--background--color--floating--default);
745
+ --pf-v6-c-alert-group__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
630
746
  --pf-v6-c-alert-group__overflow-button--hover--Color: var(--pf-t--global--text--color--link--hover);
631
747
  --pf-v6-c-alert-group__overflow-button--hover--BackgroundColor: var(--pf-t--global--background--color--floating--hover);
632
748
  --pf-v6-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
@@ -657,10 +773,21 @@
657
773
  padding-inline-end: var(--pf-v6-c-alert-group__overflow-button--PaddingInlineEnd);
658
774
  color: var(--pf-v6-c-alert-group__overflow-button--Color);
659
775
  background-color: var(--pf-v6-c-alert-group__overflow-button--BackgroundColor);
660
- border-width: var(--pf-v6-c-alert-group__overflow-button--BorderWidth);
776
+ border: 0;
661
777
  border-radius: var(--pf-v6-c-alert-group__overflow-button--BorderRadius);
662
778
  box-shadow: var(--pf-v6-c-alert-group__overflow-button--BoxShadow);
663
779
  }
780
+ .pf-v6-c-alert-group__overflow-button::after {
781
+ position: absolute;
782
+ inset: 0;
783
+ pointer-events: none;
784
+ content: "";
785
+ border: var(--pf-v6-c-alert-group__overflow-button--BorderWidth) solid var(--pf-v6-c-alert-group__overflow-button--BorderColor);
786
+ border-radius: inherit;
787
+ }
788
+ .pf-v6-c-alert-group__overflow-button:hover, .pf-v6-c-alert-group__overflow-button:focus {
789
+ --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-v6-c-alert-group__overflow-button--hover--BorderWidth);
790
+ }
664
791
 
665
792
  .pf-v6-c-alert-group__item {
666
793
  display: grid;
@@ -677,40 +804,43 @@
677
804
  transition: var(--pf-v6-c-alert-group--m-toast__item--c-alert--Transition);
678
805
  }
679
806
  }
680
- .pf-v6-c-alert-group__item.pf-m-offstage-top:first-child {
807
+ .pf-v6-c-alert-group__item.pf-m-offstage-top:first-child, .pf-v6-c-alert-group__item.pf-m-incoming:first-child {
681
808
  grid-template-rows: 0fr;
682
809
  margin-block: 0;
683
810
  overflow: hidden;
684
811
  opacity: 0;
685
812
  transform: translateY(-100%);
686
813
  }
687
- .pf-v6-c-alert-group__item.pf-m-offstage-top:first-child .pf-v6-c-alert {
814
+ .pf-v6-c-alert-group__item.pf-m-offstage-top:first-child .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-incoming:first-child .pf-v6-c-alert {
688
815
  min-height: 0;
689
816
  padding-block-start: 0;
690
817
  padding-block-end: 0;
691
818
  border-width: 0;
692
819
  }
693
- .pf-v6-c-alert-group__item.pf-m-offstage-right {
820
+ .pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing {
694
821
  grid-template-rows: 0fr;
695
822
  margin-block: 0;
696
823
  overflow: hidden;
697
824
  opacity: 0;
698
- 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);
825
+ transition: grid-template-rows 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows--default)), margin-block 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--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-outgoing--TransitionDuration--opacity--default)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionTimingFunction--opacity--default));
699
826
  }
700
- .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
827
+ .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-outgoing .pf-v6-c-alert {
701
828
  min-height: 0;
702
829
  padding-block-start: 0;
703
830
  padding-block-end: 0;
704
831
  border-width: 0;
705
- transition: all 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default);
832
+ transition: all 0s var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDelay--default, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--TransitionDelay--default));
706
833
  }
707
834
  @media screen and (prefers-reduced-motion: no-preference) {
708
- .pf-v6-c-alert-group__item.pf-m-offstage-right {
709
- 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);
835
+ .pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing {
836
+ 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-outgoing--TransitionDuration--transform)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--transform, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--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-outgoing--TransitionDuration--opacity)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionTimingFunction--opacity, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--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-outgoing--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-outgoing--TransitionTimingFunction--margin-block)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--margin-block, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--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-outgoing--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-outgoing--TransitionTimingFunction--grid-template-rows)) var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--TransitionDelay--grid-template-rows, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--TransitionDelay--grid-template-rows));
710
837
  transform: translateX(100%);
711
838
  }
712
- .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert {
713
- transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition);
839
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-alert-group__item.pf-m-offstage-right, .pf-v6-c-alert-group__item.pf-m-outgoing {
840
+ transform: translateX(calc(100% * var(--pf-v6-global--inverse--multiplier)));
841
+ }
842
+ .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-outgoing .pf-v6-c-alert {
843
+ transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition));
714
844
  }
715
845
  }
716
846
  .pf-v6-c-alert-group__item:hover {
@@ -1067,6 +1197,7 @@
1067
1197
  --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
1068
1198
  --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
1069
1199
  --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
1200
+ --pf-v6-c-badge--m-read--BorderColor: var(--pf-t--global--border--color--high-contrast);
1070
1201
  --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
1071
1202
  --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
1072
1203
  --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
@@ -1099,6 +1230,7 @@
1099
1230
  border-radius: inherit;
1100
1231
  }
1101
1232
  .pf-v6-c-badge.pf-m-read {
1233
+ --pf-v6-c-badge--BorderColor: var(--pf-v6-c-badge--m-read--BorderColor);
1102
1234
  --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
1103
1235
  --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
1104
1236
  --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
@@ -1131,6 +1263,8 @@
1131
1263
  --pf-v6-c-banner--FontSize: var(--pf-t--global--font--size--body--default);
1132
1264
  --pf-v6-c-banner--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
1133
1265
  --pf-v6-c-banner--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
1266
+ --pf-v6-c-banner--BorderColor: var(--pf-t--global--border--color--high-contrast);
1267
+ --pf-v6-c-banner--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
1134
1268
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
1135
1269
  --pf-v6-c-banner--link--TextDecoration: underline;
1136
1270
  --pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
@@ -1181,6 +1315,8 @@
1181
1315
  color: var(--pf-v6-c-banner--Color);
1182
1316
  white-space: nowrap;
1183
1317
  background-color: var(--pf-v6-c-banner--BackgroundColor);
1318
+ border-block-start: var(--pf-v6-c-banner--BorderWidth) solid var(--pf-v6-c-banner--BorderColor);
1319
+ border-block-end: var(--pf-v6-c-banner--BorderWidth) solid var(--pf-v6-c-banner--BorderColor);
1184
1320
  }
1185
1321
  .pf-v6-c-banner.pf-m-danger {
1186
1322
  --pf-v6-c-banner--BackgroundColor: var(--pf-v6-c-banner--m-danger--BackgroundColor);
@@ -1457,15 +1593,21 @@ button.pf-v6-c-breadcrumb__link {
1457
1593
  --pf-v6-c-button--TextDecorationLine: none;
1458
1594
  --pf-v6-c-button--TextDecorationStyle: none;
1459
1595
  --pf-v6-c-button--TextDecorationColor: currentcolor;
1596
+ --pf-v6-c-button--TransitionDelay: 0s;
1460
1597
  --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
1461
- --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
1462
- --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
1598
+ --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
1599
+ --pf-v6-c-button--TransitionProperty: color, background, border-width, border-color;
1600
+ --pf-v6-c-button--ScaleX: 1;
1601
+ --pf-v6-c-button--ScaleY: 1;
1602
+ --pf-v6-c-button--border--offset: 0;
1463
1603
  --pf-v6-c-button--hover--BackgroundColor: transparent;
1464
1604
  --pf-v6-c-button--hover--BorderColor: transparent;
1465
1605
  --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
1466
1606
  --pf-v6-c-button--hover--TextDecorationLine: none;
1467
1607
  --pf-v6-c-button--hover--TextDecorationStyle: none;
1468
1608
  --pf-v6-c-button--hover--TextDecorationColor: currentcolor;
1609
+ --pf-v6-c-button--hover--ScaleX: 1;
1610
+ --pf-v6-c-button--hover--ScaleY: 1;
1469
1611
  --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
1470
1612
  --pf-v6-c-button--m-clicked--BorderColor: transparent;
1471
1613
  --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
@@ -1521,6 +1663,12 @@ button.pf-v6-c-breadcrumb__link {
1521
1663
  --pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-t--global--text--color--brand--clicked);
1522
1664
  --pf-v6-c-button--m-link--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1523
1665
  --pf-v6-c-button--m-link--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1666
+ --pf-v6-c-button--m-link--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
1667
+ --pf-v6-c-button--m-link--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
1668
+ --pf-v6-c-button--m-link--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
1669
+ --pf-v6-c-button--m-link--BorderColor: var(--pf-t--global--border--color--high-contrast);
1670
+ --pf-v6-c-button--m-link--m-clicked--BorderColor: var(--pf-t--global--border--color--high-contrast);
1671
+ --pf-v6-c-button--m-link--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
1524
1672
  --pf-v6-c-button--m-link--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
1525
1673
  --pf-v6-c-button--m-link--m-danger--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
1526
1674
  --pf-v6-c-button--m-link--m-danger__icon--Color: var(--pf-t--global--text--color--status--danger--default);
@@ -1571,6 +1719,12 @@ button.pf-v6-c-breadcrumb__link {
1571
1719
  --pf-v6-c-button--m-plain--disabled--BackgroundColor: transparent;
1572
1720
  --pf-v6-c-button--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1573
1721
  --pf-v6-c-button--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1722
+ --pf-v6-c-button--m-plain--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
1723
+ --pf-v6-c-button--m-plain--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
1724
+ --pf-v6-c-button--m-plain--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
1725
+ --pf-v6-c-button--m-plain--BorderColor: var(--pf-t--global--border--color--high-contrast);
1726
+ --pf-v6-c-button--m-plain--m-clicked--BorderColor: var(--pf-t--global--border--color--high-contrast);
1727
+ --pf-v6-c-button--m-plain--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
1574
1728
  --pf-v6-c-button--m-plain--m-no-padding--MinWidth: auto;
1575
1729
  --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: 0;
1576
1730
  --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: 0;
@@ -1583,7 +1737,7 @@ button.pf-v6-c-breadcrumb__link {
1583
1737
  --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-t--global--icon--color--regular);
1584
1738
  --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
1585
1739
  --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
1586
- --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
1740
+ --pf-v6-c-button--m-plain--m-no-padding--border--offset: calc(0.125rem * -1);
1587
1741
  --pf-v6-c-button--m-control--BorderRadius: var(--pf-t--global--border--radius--small);
1588
1742
  --pf-v6-c-button--m-control--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1589
1743
  --pf-v6-c-button--m-control--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
@@ -1675,12 +1829,30 @@ button.pf-v6-c-breadcrumb__link {
1675
1829
  --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
1676
1830
  --pf-v6-c-button--m-notify__icon--AnimationDuration--notify: var(--pf-t--global--motion--duration--3xl);
1677
1831
  --pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify: var(--pf-t--global--motion--timing-function--default);
1832
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
1833
+ --pf-v6-c-button__icon--TransitionTimingFunction: auto;
1834
+ --pf-v6-c-button__icon--TransitionDuration: 0s;
1835
+ --pf-v6-c-button__icon--TransitionProperty: none;
1836
+ --pf-v6-c-button__icon--Rotate: 0deg;
1837
+ --pf-v6-c-button--hover__icon--TransitionTimingFunction: auto;
1838
+ --pf-v6-c-button--hover__icon--TransitionDuration: 0s;
1839
+ --pf-v6-c-button--hover__icon--TransitionProperty: none;
1840
+ --pf-v6-c-button--hover__icon--Rotate: 0deg;
1841
+ --pf-v6-c-button__icon--ScaleX: 1;
1842
+ --pf-v6-c-button__icon--ScaleY: 1;
1843
+ --pf-v6-c-button--hover__icon--ScaleX: 1;
1844
+ --pf-v6-c-button--hover__icon--ScaleY: 1;
1678
1845
  --pf-v6-c-button--m-favorite__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
1679
1846
  --pf-v6-c-button--m-favorite__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
1680
1847
  --pf-v6-c-button--m-favorited__icon--Color: var(--pf-t--global--color--favorite--default);
1681
1848
  --pf-v6-c-button--m-favorited--hover__icon--Color: var(--pf-t--global--color--favorite--hover);
1682
1849
  --pf-v6-c-button--m-favorited__icon--AnimationDuration: var(--pf-t--global--motion--duration--icon--long);
1683
1850
  --pf-v6-c-button--m-favorited__icon--AnimationTimingFunction: var(--pf-t--global--motion--timing-function--default);
1851
+ --pf-v6-c-button__icon--favorite--Opacity: 1;
1852
+ --pf-v6-c-button__icon--favorited--Opacity: 0;
1853
+ --pf-v6-c-button--m-favorited__icon--favorite--Opacity: 0;
1854
+ --pf-v6-c-button--m-favorited__icon--favorited--Opacity: 1;
1855
+ --pf-v6-c-button__icon--favorite--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
1684
1856
  --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
1685
1857
  --pf-v6-c-button__progress--Opacity: 0;
1686
1858
  --pf-v6-c-button__progress--TranslateY: -50%;
@@ -1695,9 +1867,28 @@ button.pf-v6-c-breadcrumb__link {
1695
1867
  --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
1696
1868
  --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
1697
1869
  --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
1698
- --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
1870
+ --pf-v6-c-button--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
1871
+ --pf-v6-c-button--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
1872
+ --pf-v6-c-button--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
1873
+ --pf-v6-c-button--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
1874
+ --pf-v6-c-button--m-settings--hover__icon--Rotate: 60deg;
1875
+ --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--alt);
1699
1876
  --pf-v6-c-button--m-block--Display: flex;
1700
1877
  --pf-v6-c-button--m-block--Width: 100%;
1878
+ --pf-v6-c-button--hamburger-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
1879
+ --pf-v6-c-button--hamburger-icon--TransitionDuration: var(--pf-t--global--motion--duration--md);
1880
+ --pf-v6-c-button--hamburger-icon--top--path--base: path("M1,1 L9,1");
1881
+ --pf-v6-c-button--hamburger-icon--middle--path--base: path("M1,5 L9,5");
1882
+ --pf-v6-c-button--hamburger-icon--arrow--path--base: path("M1,5 L1,5 L1,5");
1883
+ --pf-v6-c-button--hamburger-icon--bottom--path--base: path("M9,9 L1,9");
1884
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
1885
+ --pf-v6-c-button--hamburger-icon--middle--path: var(--pf-v6-c-button--hamburger-icon--middle--path--base);
1886
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
1887
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
1888
+ --pf-v6-c-button--hamburger-icon--top--collapse--path: path("M5,1 L9,1");
1889
+ --pf-v6-c-button--hamburger-icon--arrow--collapse--path: path("M3,7 L1,5 L3,3");
1890
+ --pf-v6-c-button--hamburger-icon--bottom--collapse--path: path("M9,9 L5,9");
1891
+ --pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX: -1;
1701
1892
  }
1702
1893
 
1703
1894
  .pf-v6-c-button {
@@ -1721,20 +1912,23 @@ button.pf-v6-c-breadcrumb__link {
1721
1912
  text-decoration-color: var(--pf-v6-c-button--TextDecorationColor);
1722
1913
  white-space: nowrap;
1723
1914
  cursor: pointer;
1915
+ -webkit-user-select: none;
1724
1916
  user-select: none;
1725
- background-color: var(--pf-v6-c-button--BackgroundColor);
1917
+ background: var(--pf-v6-c-button--BackgroundColor) radial-gradient(circle, transparent 1%, color-mix(in srgb, currentcolor 15%, transparent) 2%) center/15000% 15000%;
1726
1918
  border: 0;
1727
1919
  border-start-start-radius: var(--pf-v6-c-button--BorderStartStartRadius, var(--pf-v6-c-button--BorderRadius));
1728
1920
  border-start-end-radius: var(--pf-v6-c-button--BorderStartEndRadius, var(--pf-v6-c-button--BorderRadius));
1729
1921
  border-end-start-radius: var(--pf-v6-c-button--BorderEndStartRadius, var(--pf-v6-c-button--BorderRadius));
1730
1922
  border-end-end-radius: var(--pf-v6-c-button--BorderEndEndRadius, var(--pf-v6-c-button--BorderRadius));
1923
+ transition-delay: var(--pf-v6-c-button--TransitionDelay);
1731
1924
  transition-timing-function: var(--pf-v6-c-button--TransitionTimingFunction);
1732
1925
  transition-duration: var(--pf-v6-c-button--TransitionDuration);
1733
1926
  transition-property: var(--pf-v6-c-button--TransitionProperty);
1927
+ scale: var(--pf-v6-c-button--ScaleX) var(--pf-v6-c-button--ScaleY);
1734
1928
  }
1735
1929
  .pf-v6-c-button::after {
1736
1930
  position: absolute;
1737
- inset: 0;
1931
+ inset: var(--pf-v6-c-button--border--offset);
1738
1932
  pointer-events: none;
1739
1933
  content: "";
1740
1934
  border: var(--pf-v6-c-button--BorderWidth) solid;
@@ -1798,6 +1992,12 @@ button.pf-v6-c-breadcrumb__link {
1798
1992
  --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-link--PaddingInlineEnd);
1799
1993
  --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-link--PaddingInlineStart);
1800
1994
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-link--Color);
1995
+ --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--m-link--BorderWidth);
1996
+ --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-link--hover--BorderColor);
1997
+ --pf-v6-c-button--hover--BorderWidth: var(--pf-v6-c-button--m-link--hover--BorderWidth);
1998
+ --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-link--m-clicked--BorderColor);
1999
+ --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-v6-c-button--m-link--m-clicked--BorderWidth);
2000
+ --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-link--BorderColor);
1801
2001
  --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-link--BorderRadius);
1802
2002
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-link--BackgroundColor);
1803
2003
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-link__icon--Color);
@@ -1837,8 +2037,12 @@ button.pf-v6-c-breadcrumb__link {
1837
2037
  --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
1838
2038
  --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
1839
2039
  --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
2040
+ --pf-v6-c-button--BorderWidth: 0;
2041
+ --pf-v6-c-button--hover--BorderWidth: 0;
2042
+ --pf-v6-c-button--m-clicked--BorderWidth: 0;
1840
2043
  text-align: start;
1841
2044
  white-space: normal;
2045
+ background: transparent;
1842
2046
  outline-offset: 0.125rem;
1843
2047
  }
1844
2048
  span.pf-v6-c-button.pf-m-link.pf-m-inline {
@@ -1943,6 +2147,12 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1943
2147
  --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-attention--m-clicked__icon--Color);
1944
2148
  }
1945
2149
  .pf-v6-c-button.pf-m-plain {
2150
+ --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--m-plain--BorderWidth);
2151
+ --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-plain--hover--BorderColor);
2152
+ --pf-v6-c-button--hover--BorderWidth: var(--pf-v6-c-button--m-plain--hover--BorderWidth);
2153
+ --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-plain--m-clicked--BorderColor);
2154
+ --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-v6-c-button--m-plain--m-clicked--BorderWidth);
2155
+ --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-plain--BorderColor);
1946
2156
  --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-plain--BorderRadius);
1947
2157
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-plain--Color);
1948
2158
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-plain__icon--Color);
@@ -1971,7 +2181,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1971
2181
  --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart);
1972
2182
  --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineEnd);
1973
2183
  --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineStart);
2184
+ --pf-v6-c-button--border--offset: var(--pf-v6-c-button--m-plain--m-no-padding--border--offset);
1974
2185
  min-width: var(--pf-v6-c-button--m-plain--m-no-padding--MinWidth);
2186
+ background: var(--pf-v6-c-button--BackgroundColor);
1975
2187
  }
1976
2188
  .pf-v6-c-button.pf-m-block {
1977
2189
  --pf-v6-c-button--Display: var(--pf-v6-c-button--m-block--Display);
@@ -1991,44 +2203,97 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1991
2203
  --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-display-lg--FontSize);
1992
2204
  }
1993
2205
  .pf-v6-c-button.pf-m-favorite .pf-v6-c-button__icon {
2206
+ display: grid;
1994
2207
  transition-timing-function: var(--pf-v6-c-button--m-favorite__icon--TransitionTimingFunction);
1995
2208
  transition-duration: var(--pf-v6-c-button--m-favorite__icon--TransitionDuration);
1996
2209
  transition-property: color;
1997
2210
  }
1998
2211
  .pf-v6-c-button.pf-m-favorited {
1999
2212
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
2213
+ --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
2000
2214
  --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
2215
+ --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
2216
+ --pf-v6-c-button__icon--favorite--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorite--Opacity);
2217
+ --pf-v6-c-button__icon--favorited--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorited--Opacity);
2001
2218
  }
2002
2219
  .pf-v6-c-button.pf-m-favorited .pf-v6-c-button__icon {
2003
2220
  animation-name: pf-v6-c-button-icon-favorited;
2004
2221
  animation-duration: var(--pf-v6-c-button--m-favorited__icon--AnimationDuration);
2005
2222
  animation-timing-function: var(--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction);
2006
2223
  }
2224
+ .pf-v6-c-button.pf-m-settings {
2225
+ --pf-v6-c-button__icon--TransitionProperty: rotate;
2226
+ --pf-v6-c-button__icon--TransitionDuration: var(--pf-v6-c-button--m-settings__icon--TransitionDuration);
2227
+ --pf-v6-c-button__icon--TransitionTimingFunction: var(--pf-v6-c-button--m-settings__icon--TransitionTimingFunction);
2228
+ --pf-v6-c-button--hover__icon--TransitionProperty: rotate;
2229
+ --pf-v6-c-button--hover__icon--TransitionDuration: var(--pf-v6-c-button--m-settings--hover__icon--TransitionDuration);
2230
+ --pf-v6-c-button--hover__icon--TransitionTimingFunction: var(--pf-v6-c-button--m-settings--hover__icon--TransitionTimingFunction);
2231
+ --pf-v6-c-button--hover__icon--Rotate: var(--pf-v6-c-button--m-settings--hover__icon--Rotate);
2232
+ }
2233
+ .pf-v6-c-button.pf-m-hamburger {
2234
+ --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
2235
+ --pf-v6-c-button__icon--TransitionDuration: 0s;
2236
+ --pf-v6-c-button__icon--TransitionProperty: scale;
2237
+ --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
2238
+ --pf-v6-c-button--hover__icon--TransitionDuration: 0s;
2239
+ --pf-v6-c-button--hover__icon--TransitionProperty: scale;
2240
+ }
2241
+ .pf-v6-c-button.pf-m-hamburger.pf-m-expand {
2242
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
2243
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
2244
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
2245
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
2246
+ --pf-v6-c-button__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
2247
+ --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
2248
+ --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
2249
+ }
2250
+ .pf-v6-c-button.pf-m-hamburger.pf-m-collapse {
2251
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
2252
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
2253
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
2254
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
2255
+ --pf-v6-c-button__icon--ScaleX: 1;
2256
+ --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
2257
+ --pf-v6-c-button--hover__icon--ScaleX: 1;
2258
+ }
2007
2259
  .pf-v6-c-button:hover, .pf-v6-c-button:focus {
2008
2260
  --pf-v6-c-button--Color: var(--pf-v6-c-button--hover--Color);
2009
2261
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
2010
2262
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--hover--BorderColor);
2011
2263
  --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
2264
+ --pf-v6-c-button--ScaleX: var(--pf-v6-c-button--hover--ScaleX);
2265
+ --pf-v6-c-button--ScaleY: var(--pf-v6-c-button--hover--ScaleY);
2012
2266
  --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color);
2013
2267
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
2268
+ --pf-v6-c-button__icon--TransitionTimingFunction: var(--pf-v6-c-button--hover__icon--TransitionTimingFunction);
2269
+ --pf-v6-c-button__icon--TransitionDuration: var(--pf-v6-c-button--hover__icon--TransitionDuration);
2270
+ --pf-v6-c-button__icon--TransitionProperty: var(--pf-v6-c-button--hover__icon--TransitionProperty);
2271
+ --pf-v6-c-button__icon--Rotate: var(--pf-v6-c-button--hover__icon--Rotate);
2272
+ --pf-v6-c-button__icon--ScaleX: var(--pf-v6-c-button--hover__icon--ScaleX);
2273
+ --pf-v6-c-button__icon--ScaleY: var(--pf-v6-c-button--hover__icon--ScaleY);
2014
2274
  text-decoration-line: var(--pf-v6-c-button--hover--TextDecorationLine);
2015
2275
  text-decoration-style: var(--pf-v6-c-button--hover--TextDecorationStyle);
2016
2276
  text-decoration-color: var(--pf-v6-c-button--hover--TextDecorationColor);
2277
+ outline-offset: var(--pf-t--global--focus-ring--position--offset);
2017
2278
  }
2018
- .pf-v6-c-button.pf-m-clicked {
2279
+ .pf-v6-c-button:active, .pf-v6-c-button.pf-m-clicked {
2019
2280
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-clicked--Color);
2020
2281
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-clicked--BackgroundColor);
2021
2282
  --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--m-clicked--BorderWidth);
2022
2283
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-clicked--BorderColor);
2023
2284
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-clicked__icon--Color);
2024
2285
  }
2286
+ .pf-v6-c-button:active {
2287
+ background-size: 100% 100%;
2288
+ transition-duration: 0s;
2289
+ }
2025
2290
  .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled {
2026
2291
  pointer-events: none;
2027
2292
  }
2028
2293
  .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled, .pf-v6-c-button.pf-m-aria-disabled {
2029
2294
  color: var(--pf-v6-c-button--disabled--Color);
2030
2295
  text-decoration-color: var(--pf-v6-c-button--disabled--TextDecorationColor);
2031
- background-color: var(--pf-v6-c-button--disabled--BackgroundColor);
2296
+ background: var(--pf-v6-c-button--disabled--BackgroundColor);
2032
2297
  }
2033
2298
  .pf-v6-c-button:disabled::after, .pf-v6-c-button.pf-m-disabled::after, .pf-v6-c-button.pf-m-aria-disabled::after {
2034
2299
  border-color: transparent;
@@ -2069,6 +2334,12 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2069
2334
  margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
2070
2335
  margin-inline-end: var(--pf-v6-c-button__icon--MarginInlineEnd);
2071
2336
  color: var(--pf-v6-c-button__icon--Color);
2337
+ transition-delay: var(--pf-v6-c-button__icon--TransitionDelay);
2338
+ transition-timing-function: var(--pf-v6-c-button__icon--TransitionTimingFunction);
2339
+ transition-duration: var(--pf-v6-c-button__icon--TransitionDuration);
2340
+ transition-property: var(--pf-v6-c-button__icon--TransitionProperty);
2341
+ rotate: var(--pf-v6-c-button__icon--Rotate);
2342
+ scale: var(--pf-v6-c-button__icon--ScaleX) var(--pf-v6-c-button__icon--ScaleY);
2072
2343
  }
2073
2344
  .pf-v6-c-button__icon.pf-m-start {
2074
2345
  --pf-v6-c-button__icon--MarginInlineEnd: var(--pf-v6-c-button__icon--m-start--MarginInlineEnd);
@@ -2077,6 +2348,21 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2077
2348
  --pf-v6-c-button__icon--MarginInlineStart: var(--pf-v6-c-button__icon--m-end--MarginInlineStart);
2078
2349
  }
2079
2350
 
2351
+ .pf-v6-c-button__icon-favorite,
2352
+ .pf-v6-c-button__icon-favorited {
2353
+ grid-area: 1/1/1/1;
2354
+ transition-duration: var(--pf-v6-c-button__icon--favorite--TransitionDuration);
2355
+ transition-property: opacity;
2356
+ }
2357
+
2358
+ .pf-v6-c-button__icon-favorite {
2359
+ opacity: var(--pf-v6-c-button__icon--favorite--Opacity);
2360
+ }
2361
+
2362
+ .pf-v6-c-button__icon-favorited {
2363
+ opacity: var(--pf-v6-c-button__icon--favorited--Opacity);
2364
+ }
2365
+
2080
2366
  .pf-v6-c-button__progress {
2081
2367
  position: absolute;
2082
2368
  inset-block-start: var(--pf-v6-c-button__progress--InsetBlockStart);
@@ -2089,11 +2375,39 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2089
2375
  --pf-v6-c-spinner--Color: currentcolor;
2090
2376
  }
2091
2377
 
2378
+ .pf-v6-c-button__text {
2379
+ text-decoration: inherit;
2380
+ }
2381
+
2092
2382
  .pf-v6-c-button__count {
2093
2383
  display: inline-flex;
2094
2384
  align-items: center;
2095
2385
  }
2096
2386
 
2387
+ .pf-v6-c-button--hamburger-icon path {
2388
+ fill: none;
2389
+ stroke: currentcolor;
2390
+ stroke-linecap: round;
2391
+ stroke-linejoin: round;
2392
+ transition: d var(--pf-v6-c-button--hamburger-icon--TransitionDuration) var(--pf-v6-c-button--hamburger-icon--TransitionTimingFunction);
2393
+ }
2394
+
2395
+ .pf-v6-c-button--hamburger-icon--top {
2396
+ d: var(--pf-v6-c-button--hamburger-icon--top--path);
2397
+ }
2398
+
2399
+ .pf-v6-c-button--hamburger-icon--middle {
2400
+ d: var(--pf-v6-c-button--hamburger-icon--middle--path);
2401
+ }
2402
+
2403
+ .pf-v6-c-button--hamburger-icon--arrow {
2404
+ d: var(--pf-v6-c-button--hamburger-icon--arrow--path);
2405
+ }
2406
+
2407
+ .pf-v6-c-button--hamburger-icon--bottom {
2408
+ d: var(--pf-v6-c-button--hamburger-icon--bottom--path);
2409
+ }
2410
+
2097
2411
  @keyframes pf-v6-c-button-icon-notify {
2098
2412
  33% {
2099
2413
  transform: rotate(30deg);
@@ -2104,7 +2418,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2104
2418
  }
2105
2419
  @keyframes pf-v6-c-button-icon-favorited {
2106
2420
  50% {
2107
- transform: scale(1.5);
2421
+ scale: 1.5;
2108
2422
  }
2109
2423
  }
2110
2424
  .pf-v6-c-calendar-month {
@@ -2140,6 +2454,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2140
2454
  --pf-v6-c-calendar-month__dates-cell--before--InsetInlineEnd: 0;
2141
2455
  --pf-v6-c-calendar-month__dates-cell--before--InsetBlockEnd: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockEnd);
2142
2456
  --pf-v6-c-calendar-month__dates-cell--before--InsetInlineStart: 0;
2457
+ --pf-v6-c-calendar-month__dates-cell--after--BorderColor: var(--pf-t--global--border--color--high-contrast);
2458
+ --pf-v6-c-calendar-month__dates-cell--after--BorderBlockStartWidth: 0;
2459
+ --pf-v6-c-calendar-month__dates-cell--after--BorderBlockEndWidth: 0;
2143
2460
  --pf-v6-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2144
2461
  --pf-v6-c-calendar-month__dates-cell--m-in-range--m-start-range--before--InsetInlineStart: 50%;
2145
2462
  --pf-v6-c-calendar-month__dates-cell--m-in-range--m-end-range--before--InsetInlineEnd: 50%;
@@ -2147,6 +2464,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2147
2464
  --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderWidth: var(--pf-t--global--border--width--regular);
2148
2465
  --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderColor: var(--pf-t--global--border--color--hover);
2149
2466
  --pf-v6-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2467
+ --pf-v6-c-calendar-month__dates-cell--m-in-range--after--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
2468
+ --pf-v6-c-calendar-month__dates-cell--m-in-range--after--BorderBlockEndWidth: var(--pf-t--global--border--width--high-contrast--regular);
2150
2469
  --pf-v6-c-calendar-month__dates-cell--m-adjacent-month__date--Color: var(--pf-t--global--text--color--subtle);
2151
2470
  --pf-v6-c-calendar-month__date--Width: 4ch;
2152
2471
  --pf-v6-c-calendar-month__date--Height: 4ch;
@@ -2165,6 +2484,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2165
2484
  --pf-v6-c-calendar-month__date--focus--BackgroundColor: var(--pf-t--global--color--brand--default);
2166
2485
  --pf-v6-c-calendar-month__date--focus--after--BorderColor: var(--pf-t--global--border--color--hover);
2167
2486
  --pf-v6-c-calendar-month__date--after--focus--OutlineOffset: -2px;
2487
+ --pf-v6-c-calendar-month__dates-cell--m-current__date--after--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
2488
+ --pf-v6-c-calendar-month__dates-cell--m-current__date--after--BorderColor: var(--pf-t--global--border--color--high-contrast);
2168
2489
  }
2169
2490
 
2170
2491
  .pf-v6-c-calendar-month {
@@ -2237,13 +2558,20 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2237
2558
  inset-block-end: var(--pf-v6-c-calendar-month__dates-cell--before--InsetBlockEnd);
2238
2559
  inset-inline-start: var(--pf-v6-c-calendar-month__dates-cell--before--InsetInlineStart);
2239
2560
  inset-inline-end: var(--pf-v6-c-calendar-month__dates-cell--before--InsetInlineEnd);
2561
+ pointer-events: none;
2240
2562
  content: "";
2241
2563
  background-color: var(--pf-v6-c-calendar-month__dates-cell--before--BackgroundColor);
2564
+ border: solid var(--pf-v6-c-calendar-month__dates-cell--after--BorderColor);
2565
+ border-width: var(--pf-v6-c-calendar-month__dates-cell--after--BorderBlockStartWidth) 0 var(--pf-v6-c-calendar-month__dates-cell--after--BorderBlockEndWidth);
2242
2566
  }
2243
2567
  .pf-v6-c-calendar-month__dates-cell.pf-m-current {
2244
2568
  --pf-v6-c-calendar-month__date--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-current__date--BackgroundColor);
2569
+ --pf-v6-c-calendar-month__date--after--BorderWidth: var(--pf-v6-c-calendar-month__dates-cell--m-current__date--after--BorderWidth);
2570
+ --pf-v6-c-calendar-month__date--after--BorderColor: var(--pf-v6-c-calendar-month__dates-cell--m-current__date--after--BorderColor);
2245
2571
  }
2246
2572
  .pf-v6-c-calendar-month__dates-cell.pf-m-in-range {
2573
+ --pf-v6-c-calendar-month__dates-cell--after--BorderBlockStartWidth: var(--pf-v6-c-calendar-month__dates-cell--m-in-range--after--BorderBlockStartWidth);
2574
+ --pf-v6-c-calendar-month__dates-cell--after--BorderBlockEndWidth: var(--pf-v6-c-calendar-month__dates-cell--m-in-range--after--BorderBlockEndWidth);
2247
2575
  --pf-v6-c-calendar-month__dates-cell--before--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor);
2248
2576
  --pf-v6-c-calendar-month__date--hover--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor);
2249
2577
  --pf-v6-c-calendar-month__date--hover--BorderWidth: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderWidth);
@@ -2270,6 +2598,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2270
2598
  }
2271
2599
  .pf-v6-c-calendar-month__dates-cell.pf-m-disabled {
2272
2600
  --pf-v6-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
2601
+ --pf-v6-c-calendar-month__dates-cell--after--BorderBlockStartWidth: 0;
2602
+ --pf-v6-c-calendar-month__dates-cell--after--BorderBlockEndWidth: 0;
2273
2603
  --pf-v6-c-calendar-month__date--BackgroundColor: transparent;
2274
2604
  }
2275
2605
 
@@ -2353,6 +2683,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2353
2683
  --pf-v6-c-card--m-selectable--m-selected--BorderColor: var(--pf-t--global--border--color--clicked);
2354
2684
  --pf-v6-c-card--m-selectable--m-selected--BorderWidth: var(--pf-t--global--border--width--box--clicked);
2355
2685
  --pf-v6-c-card--m-selectable--hover--BorderColor: var(--pf-t--global--border--color--hover);
2686
+ --pf-v6-c-card--m-selectable--hover--BorderWidth: var(--pf-t--global--border--width--box--hover);
2356
2687
  --pf-v6-c-card--m-selectable--focus--BorderColor: var(--pf-t--global--border--color--hover);
2357
2688
  --pf-v6-c-card--m-selectable--focus--BorderWidth: var(--pf-t--global--border--width--box--hover);
2358
2689
  --pf-v6-c-card--m-selectable--m-selected--focus--BorderColor: var(--pf-t--global--border--color--clicked);
@@ -2383,7 +2714,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2383
2714
  --pf-v6-c-card--m-display-lg--c-divider--child--PaddingBlockStart: var(--pf-t--global--spacer--xl);
2384
2715
  --pf-v6-c-card--m-display-lg__title--not--last-child--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
2385
2716
  --pf-v6-c-card--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2386
- --pf-v6-c-card--m-secondary--BorderColor: transparent;
2717
+ --pf-v6-c-card--m-secondary--BorderColor: var(--pf-t--global--border--color--high-contrast);
2387
2718
  --pf-v6-c-card--m-full-height--Height: 100%;
2388
2719
  --pf-v6-c-card--m-plain--BorderColor: transparent;
2389
2720
  --pf-v6-c-card--m-plain--BackgroundColor: transparent;
@@ -2542,7 +2873,6 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2542
2873
  }
2543
2874
 
2544
2875
  .pf-v6-c-card__title-text {
2545
- overflow: auto;
2546
2876
  font-family: var(--pf-v6-c-card__title-text--FontFamily);
2547
2877
  font-size: var(--pf-v6-c-card__title-text--FontSize);
2548
2878
  font-weight: var(--pf-v6-c-card__title-text--FontWeight);
@@ -2584,17 +2914,18 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2584
2914
  z-index: -1;
2585
2915
  content: "";
2586
2916
  background-color: var(--pf-v6-c-card--BackgroundColor, transparent);
2587
- border: var(--pf-v6-c-card--m-selectable--BorderWidth) solid var(--pf-v6-c-card--BorderColor, transparent);
2917
+ border: var(--pf-v6-c-card--BorderWidth) solid var(--pf-v6-c-card--BorderColor, transparent);
2588
2918
  border-radius: var(--pf-v6-c-card--BorderRadius);
2589
2919
  }
2590
2920
  .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__label, .pf-v6-c-radio__label, .pf-v6-c-card__clickable-action):hover {
2591
2921
  --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-selectable--hover--BorderColor);
2922
+ --pf-v6-c-card--BorderWidth: var(--pf-v6-c-card--m-selectable--hover--BorderWidth);
2592
2923
  }
2593
2924
 
2594
2925
  .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__input, .pf-v6-c-radio__input):where(:checked) ~ :is(.pf-v6-c-radio__label, .pf-v6-c-check__label),
2595
2926
  .pf-v6-c-card.pf-m-selected {
2596
2927
  --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-selectable--m-selected--BorderColor);
2597
- --pf-v6-c-card--m-selectable--BorderWidth: var(--pf-v6-c-card--m-selectable--m-selected--BorderWidth);
2928
+ --pf-v6-c-card--BorderWidth: var(--pf-v6-c-card--m-selectable--m-selected--BorderWidth);
2598
2929
  }
2599
2930
 
2600
2931
  .pf-v6-c-card__selectable-actions .pf-v6-c-card__clickable-action:where(:focus-visible),
@@ -2848,6 +3179,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2848
3179
  }
2849
3180
 
2850
3181
  .pf-v6-c-code-block {
3182
+ --pf-v6-c-code-block--BorderColor: var(--pf-t--global--border--color--high-contrast);
3183
+ --pf-v6-c-code-block--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
2851
3184
  --pf-v6-c-code-block--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2852
3185
  --pf-v6-c-code-block--BorderRadius: var(--pf-t--global--border--radius--medium);
2853
3186
  --pf-v6-c-code-block__header--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
@@ -2866,6 +3199,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2866
3199
 
2867
3200
  .pf-v6-c-code-block {
2868
3201
  background-color: var(--pf-v6-c-code-block--BackgroundColor);
3202
+ border: var(--pf-v6-c-code-block--BorderWidth) solid var(--pf-v6-c-code-block--BorderColor);
2869
3203
  border-radius: var(--pf-v6-c-code-block--BorderRadius);
2870
3204
  }
2871
3205
 
@@ -2906,6 +3240,10 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2906
3240
  --pf-v6-c-code-editor__controls--Gap: var(--pf-t--global--spacer--gap--action-to-action--plain);
2907
3241
  --pf-v6-c-code-editor__header--before--BorderBlockEndWidth: var(--pf-t--global--border--width--box--default);
2908
3242
  --pf-v6-c-code-editor__header--before--BorderBlockEndColor: var(--pf-t--global--border--color--default);
3243
+ --pf-v6-c-code-editor__header--BorderWidth: var(--pf-t--global--border--width--box--default);
3244
+ --pf-v6-c-code-editor__header--BorderColor: var(--pf-t--global--border--color--default);
3245
+ --pf-v6-c-code-editor__header--BorderStartStartRadius: var(--pf-t--global--border--radius--medium);
3246
+ --pf-v6-c-code-editor__header--BorderStartEndRadius: var(--pf-t--global--border--radius--medium);
2909
3247
  --pf-v6-c-code-editor__header-content--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2910
3248
  --pf-v6-c-code-editor__header-content--m-plain--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2911
3249
  --pf-v6-c-code-editor__header-content--PaddingBlockStart: var(--pf-t--global--spacer--xs);
@@ -2977,12 +3315,13 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2977
3315
  }
2978
3316
  .pf-v6-c-code-editor__header::before {
2979
3317
  position: absolute;
2980
- inset-block-end: 0;
2981
- inset-inline-start: 0;
2982
- inset-inline-end: 0;
3318
+ inset: 0;
2983
3319
  pointer-events: none;
2984
3320
  content: "";
3321
+ border: var(--pf-v6-c-code-editor__header--BorderWidth) solid var(--pf-v6-c-code-editor__header--BorderColor);
2985
3322
  border-block-end: var(--pf-v6-c-code-editor__header--before--BorderBlockEndWidth) solid var(--pf-v6-c-code-editor__header--before--BorderBlockEndColor);
3323
+ border-start-start-radius: var(--pf-v6-c-code-editor__header--BorderStartStartRadius);
3324
+ border-start-end-radius: var(--pf-v6-c-code-editor__header--BorderStartEndRadius);
2986
3325
  }
2987
3326
  .pf-v6-c-code-editor__header.pf-m-plain {
2988
3327
  --pf-v6-c-code-editor__header-content--BackgroundColor: var(--pf-v6-c-code-editor__header-content--m-plain--BackgroundColor);
@@ -3889,8 +4228,8 @@ ul) {
3889
4228
  --pf-v6-c-data-list--m-compact__item-content--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3890
4229
  --pf-v6-c-data-list--m-compact__item-draggable-button--MarginBlockStart: calc(var(--pf-t--global--spacer--sm) * -1);
3891
4230
  --pf-v6-c-data-list--m-compact__item-draggable-button--MarginBlockEnd: calc(var(--pf-t--global--spacer--sm) * -1);
3892
- --pf-v6-c-data-list--m-compact__item-draggable-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
3893
- --pf-v6-c-data-list--m-compact__item-draggable-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
4231
+ --pf-v6-c-data-list--m-compact__item-draggable-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
4232
+ --pf-v6-c-data-list--m-compact__item-draggable-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
3894
4233
  --pf-v6-c-data-list--m-compact__cell--m-icon--cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
3895
4234
  }
3896
4235
  @media screen and (min-width: 36rem) {
@@ -4627,10 +4966,25 @@ ul) {
4627
4966
  --pf-v6-c-dual-list-selector__menu--MinHeight: 12.5rem;
4628
4967
  --pf-v6-c-dual-list-selector__menu--MaxHeight: 20rem;
4629
4968
  --pf-v6-c-dual-list-selector__menu--MarginBlockStart: var(--pf-t--global--spacer--md);
4969
+ --pf-v6-c-dual-list-selector__list--TransitionDuration--expand--slide: 0s;
4970
+ --pf-v6-c-dual-list-selector__list--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
4971
+ --pf-v6-c-dual-list-selector__list--TransitionDuration--collapse--slide: 0s;
4972
+ --pf-v6-c-dual-list-selector__list--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
4973
+ --pf-v6-c-dual-list-selector__list--TransitionDuration--slide: var(--pf-v6-c-dual-list-selector__list--TransitionDuration--collapse--slide);
4974
+ --pf-v6-c-dual-list-selector__list--TransitionDuration--fade: var(--pf-v6-c-dual-list-selector__list--TransitionDuration--collapse--fade);
4975
+ --pf-v6-c-dual-list-selector__list--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
4976
+ --pf-v6-c-dual-list-selector__list--Opacity: 0;
4977
+ --pf-v6-c-dual-list-selector--m-expanded__list--Opacity: 1;
4978
+ --pf-v6-c-dual-list-selector__list--TranslateY: 0;
4979
+ --pf-v6-c-dual-list-selector--m-expanded__list--TranslateY: 0;
4630
4980
  --pf-v6-c-dual-list-selector__list-item-row--FontSize: var(--pf-t--global--font--size--sm);
4631
4981
  --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
4982
+ --pf-v6-c-dual-list-selector__list-item-row--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
4983
+ --pf-v6-c-dual-list-selector__list-item-row--BorderColor: var(--pf-t--global--border--color--high-contrast);
4632
4984
  --pf-v6-c-dual-list-selector__list-item-row--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
4985
+ --pf-v6-c-dual-list-selector__list-item-row--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
4633
4986
  --pf-v6-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
4987
+ --pf-v6-c-dual-list-selector__list-item-row--m-selected--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
4634
4988
  --pf-v6-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
4635
4989
  --pf-v6-c-dual-list-selector__list-item--m-ghost-row--Opacity: .4;
4636
4990
  --pf-v6-c-dual-list-selector__item--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -4664,6 +5018,13 @@ ul) {
4664
5018
  --pf-v6-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-v6-c-dual-list-selector__list-item-row--FontSize);
4665
5019
  --pf-v6-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
4666
5020
  }
5021
+ @media screen and (prefers-reduced-motion: no-preference) {
5022
+ .pf-v6-c-dual-list-selector {
5023
+ --pf-v6-c-dual-list-selector__list--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
5024
+ --pf-v6-c-dual-list-selector__list--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
5025
+ --pf-v6-c-dual-list-selector__list--TranslateY: -.5rem;
5026
+ }
5027
+ }
4667
5028
 
4668
5029
  .pf-v6-c-dual-list-selector {
4669
5030
  display: grid;
@@ -4729,6 +5090,7 @@ ul) {
4729
5090
  overflow: auto;
4730
5091
  border: var(--pf-v6-c-dual-list-selector__menu--BorderWidth) solid var(--pf-v6-c-dual-list-selector__menu--BorderColor);
4731
5092
  border-radius: var(--pf-v6-c-dual-list-selector__menu--BorderRadius);
5093
+ outline-offset: 2px;
4732
5094
  }
4733
5095
 
4734
5096
  .pf-v6-c-dual-list-selector__list {
@@ -4753,15 +5115,33 @@ ul) {
4753
5115
  overflow-anchor: none;
4754
5116
  }
4755
5117
 
4756
- .pf-v6-c-dual-list-selector__list-item:focus {
5118
+ .pf-v6-c-dual-list-selector__list-item:focus-visible {
4757
5119
  --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-v6-c-dual-list-selector__list-item-row--hover--BackgroundColor);
4758
5120
  }
4759
5121
  .pf-v6-c-dual-list-selector__list-item.pf-m-expandable {
4760
5122
  --pf-v6-c-dual-list-selector__item--PaddingInlineStart: var(--pf-v6-c-dual-list-selector__item--m-expandable--PaddingInlineStart);
4761
5123
  }
5124
+ .pf-v6-c-dual-list-selector.pf-m-animate-expand .pf-v6-c-dual-list-selector__list-item.pf-m-expandable > .pf-v6-c-dual-list-selector__list {
5125
+ max-height: 0;
5126
+ visibility: hidden;
5127
+ opacity: var(--pf-v6-c-dual-list-selector__list--Opacity);
5128
+ transition-delay: 0s, 0s, var(--pf-v6-c-dual-list-selector__list--TransitionDuration--fade), var(--pf-v6-c-dual-list-selector__list--TransitionDuration--fade);
5129
+ transition-timing-function: var(--pf-v6-c-dual-list-selector__list--TransitionTimingFunction);
5130
+ transition-duration: var(--pf-v6-c-dual-list-selector__list--TransitionDuration--fade), var(--pf-v6-c-dual-list-selector__list--TransitionDuration--slide), 0s, 0s;
5131
+ transition-property: opacity, translate, visibility, max-height;
5132
+ translate: 0 var(--pf-v6-c-dual-list-selector__list--TranslateY);
5133
+ }
4762
5134
  .pf-v6-c-dual-list-selector__list-item.pf-m-expanded {
4763
5135
  --pf-v6-c-dual-list-selector__item-toggle-icon--Rotate: var(--pf-v6-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate);
4764
5136
  }
5137
+ .pf-v6-c-dual-list-selector.pf-m-animate-expand .pf-v6-c-dual-list-selector__list-item.pf-m-expanded > .pf-v6-c-dual-list-selector__list {
5138
+ max-height: 99999px;
5139
+ visibility: revert;
5140
+ opacity: var(--pf-v6-c-dual-list-selector--m-expanded__list--Opacity);
5141
+ transition-delay: 0s;
5142
+ transition-duration: var(--pf-v6-c-dual-list-selector__list--TransitionDuration--expand--fade), var(--pf-v6-c-dual-list-selector__list--TransitionDuration--expand--slide), 0s, 0s;
5143
+ translate: 0 var(--pf-v6-c-dual-list-selector--m-expanded__list--TranslateY);
5144
+ }
4765
5145
  .pf-v6-c-dual-list-selector__list-item.pf-m-disabled {
4766
5146
  --pf-v6-c-dual-list-selector__item-text--Color: var(--pf-v6-c-dual-list-selector__list-item--m-disabled__item-text--Color);
4767
5147
  --pf-v6-c-dual-list-selector__item-toggle-icon--Color: var(--pf-v6-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color);
@@ -4769,12 +5149,22 @@ ul) {
4769
5149
  }
4770
5150
 
4771
5151
  .pf-v6-c-dual-list-selector__list-item-row {
5152
+ position: relative;
4772
5153
  display: flex;
4773
5154
  font-size: var(--pf-v6-c-dual-list-selector__list-item-row--FontSize);
4774
5155
  background-color: var(--pf-v6-c-dual-list-selector__list-item-row--BackgroundColor);
4775
5156
  }
5157
+ .pf-v6-c-dual-list-selector__list-item-row::before {
5158
+ position: absolute;
5159
+ inset: 0;
5160
+ pointer-events: none;
5161
+ content: "";
5162
+ border-block-start: var(--pf-v6-c-dual-list-selector__list-item-row--BorderWidth) solid var(--pf-v6-c-dual-list-selector__list-item-row--BorderColor);
5163
+ border-block-end: var(--pf-v6-c-dual-list-selector__list-item-row--BorderWidth) solid var(--pf-v6-c-dual-list-selector__list-item-row--BorderColor);
5164
+ }
4776
5165
  .pf-v6-c-dual-list-selector__list-item-row.pf-m-selected {
4777
5166
  --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-v6-c-dual-list-selector__list-item-row--m-selected--BackgroundColor);
5167
+ --pf-v6-c-dual-list-selector__list-item-row--BorderWidth: var(--pf-v6-c-dual-list-selector__list-item-row--m-selected--BorderWidth);
4778
5168
  }
4779
5169
  .pf-v6-c-dual-list-selector__list-item-row.pf-m-selected .pf-v6-c-dual-list-selector__item-text {
4780
5170
  --pf-v6-c-dual-list-selector__item-text--Color: var(--pf-v6-c-dual-list-selector__list-item-row--m-selected__text--Color);
@@ -4782,9 +5172,12 @@ ul) {
4782
5172
  }
4783
5173
  .pf-v6-c-dual-list-selector__list-item-row:hover {
4784
5174
  --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-v6-c-dual-list-selector__list-item-row--hover--BackgroundColor);
5175
+ --pf-v6-c-dual-list-selector__list-item-row--BorderWidth: var(--pf-v6-c-dual-list-selector__list-item-row--hover--BorderWidth);
4785
5176
  }
4786
5177
  .pf-v6-c-dual-list-selector__list-item-row.pf-m-check {
4787
5178
  --pf-v6-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: transparent;
5179
+ --pf-v6-c-dual-list-selector__list-item-row--m-selected--BorderColor: transparent;
5180
+ --pf-v6-c-dual-list-selector__list-item-row--BorderWidth: revert;
4788
5181
  }
4789
5182
  .pf-v6-c-dual-list-selector__list-item-row.pf-m-ghost-row {
4790
5183
  --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-v6-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor);
@@ -4937,6 +5330,8 @@ ul) {
4937
5330
  --pf-v6-c-date-picker__input--c-form-control--Width: calc(var(--pf-v6-c-date-picker__input--c-form-control--width-chars) * 1ch + var(--pf-v6-c-date-picker__input--c-form-control--width-base));
4938
5331
  --pf-v6-c-date-picker__input--c-form-control--width-base: calc(var(--pf-t--global--spacer--xl) + var(--pf-t--global--spacer--sm));
4939
5332
  --pf-v6-c-date-picker__input--c-form-control--width-chars: 11;
5333
+ --pf-v6-c-date-picker__calendar--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
5334
+ --pf-v6-c-date-picker__calendar--BorderColor: var(--pf-t--global--border--color--high-contrast);
4940
5335
  --pf-v6-c-date-picker__calendar--BackgroundColor: var(--pf-t--global--background--color--floating--default);
4941
5336
  --pf-v6-c-date-picker__calendar--BoxShadow: var(--pf-t--global--box-shadow--md);
4942
5337
  --pf-v6-c-date-picker__calendar--ZIndex: var(--pf-t--global--z-index--sm);
@@ -4967,6 +5362,7 @@ ul) {
4967
5362
  inset-inline-end: var(--pf-v6-c-date-picker__calendar--InsetInlineEnd);
4968
5363
  z-index: var(--pf-v6-c-date-picker__calendar--ZIndex);
4969
5364
  background-color: var(--pf-v6-c-date-picker__calendar--BackgroundColor);
5365
+ border: var(--pf-v6-c-date-picker__calendar--BorderWidth) solid var(--pf-v6-c-date-picker__calendar--BorderColor);
4970
5366
  box-shadow: var(--pf-v6-c-date-picker__calendar--BoxShadow);
4971
5367
  }
4972
5368
  .pf-v6-c-date-picker__calendar.pf-m-align-right {
@@ -5304,6 +5700,11 @@ ul) {
5304
5700
  --pf-v6-c-drawer__panel--MinWidth: 50%;
5305
5701
  --pf-v6-c-drawer__panel--MaxHeight: auto;
5306
5702
  --pf-v6-c-drawer__panel--ZIndex: var(--pf-t--global--z-index--sm);
5703
+ --pf-v6-c-drawer__panel--BorderColor: var(--pf-v6-c-drawer__panel--after--BackgroundColor);
5704
+ --pf-v6-c-drawer__panel--BorderBlockStartWidth: 0;
5705
+ --pf-v6-c-drawer__panel--BorderBlockEndWidth: 0;
5706
+ --pf-v6-c-drawer__panel--BorderInlineStartWidth: var(--pf-v6-c-drawer__panel--after--Width);
5707
+ --pf-v6-c-drawer__panel--BorderInlineEndWidth: 0;
5307
5708
  --pf-v6-c-drawer__panel--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5308
5709
  --pf-v6-c-drawer__panel--m-inline--BackgroundColor: var(--pf-t--global--background--color--primary--default);
5309
5710
  --pf-v6-c-drawer__panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
@@ -5400,13 +5801,14 @@ ul) {
5400
5801
  --pf-v6-c-drawer__actions--MarginInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--compact) * -1.5);
5401
5802
  --pf-v6-c-drawer__panel--BoxShadow: none;
5402
5803
  --pf-v6-c-drawer--m-expanded--m-panel-bottom__panel--BoxShadow: var(--pf-t--global--box-shadow--md--top);
5403
- --pf-v6-c-drawer__panel--after--Width: var(--pf-t--global--border--width--divider--default);
5404
- --pf-v6-c-drawer--m-panel-bottom__panel--after--Height: var(--pf-t--global--border--width--divider--default);
5405
- --pf-v6-c-drawer__panel--after--BackgroundColor: transparent;
5804
+ --pf-v6-c-drawer__panel--after--Width: var(--pf-t--global--border--width--high-contrast--regular);
5805
+ --pf-v6-c-drawer--m-inline__panel--after--Width: var(--pf-t--global--border--width--divider--default);
5806
+ --pf-v6-c-drawer--m-panel-bottom__panel--after--Height: var(--pf-t--global--border--width--high-contrast--regular);
5807
+ --pf-v6-c-drawer__panel--after--BackgroundColor: var(--pf-t--global--border--color--high-contrast);
5406
5808
  --pf-v6-c-drawer--m-inline--m-expanded__panel--after--BackgroundColor: var(--pf-t--global--border--color--default);
5407
- --pf-v6-c-drawer--m-inline__panel--PaddingInlineStart: var(--pf-v6-c-drawer__panel--after--Width);
5408
- --pf-v6-c-drawer--m-panel-left--m-inline__panel--PaddingInlineEnd: var(--pf-v6-c-drawer__panel--after--Width);
5409
- --pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart: var(--pf-v6-c-drawer__panel--after--Width);
5809
+ --pf-v6-c-drawer--m-inline__panel--PaddingInlineStart: 0;
5810
+ --pf-v6-c-drawer--m-panel-left--m-inline__panel--PaddingInlineEnd: 0;
5811
+ --pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart: 0;
5410
5812
  }
5411
5813
  @media screen and (prefers-reduced-motion: no-preference) {
5412
5814
  .pf-v6-c-drawer {
@@ -5447,6 +5849,7 @@ ul) {
5447
5849
 
5448
5850
  .pf-v6-c-drawer.pf-m-inline, .pf-v6-c-drawer.pf-m-static {
5449
5851
  --pf-v6-c-drawer__panel--BackgroundColor: var(--pf-v6-c-drawer__panel--m-inline--BackgroundColor);
5852
+ --pf-v6-c-drawer__panel--BorderInlineStartWidth: var(--pf-v6-c-drawer--m-inline__panel--after--Width);
5450
5853
  }
5451
5854
  .pf-v6-c-drawer.pf-m-inline > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable), .pf-v6-c-drawer.pf-m-static > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable) {
5452
5855
  padding-inline-start: var(--pf-v6-c-drawer--m-inline__panel--PaddingInlineStart);
@@ -5547,6 +5950,11 @@ ul) {
5547
5950
  overflow: auto;
5548
5951
  visibility: hidden;
5549
5952
  background-color: var(--pf-v6-c-drawer__panel--BackgroundColor);
5953
+ border: solid var(--pf-v6-c-drawer__panel--BorderColor);
5954
+ border-block-start-width: var(--pf-v6-c-drawer__panel--BorderBlockStartWidth);
5955
+ border-block-end-width: var(--pf-v6-c-drawer__panel--BorderBlockEndWidth);
5956
+ border-inline-start-width: var(--pf-v6-c-drawer__panel--BorderInlineStartWidth);
5957
+ border-inline-end-width: var(--pf-v6-c-drawer__panel--BorderInlineEndWidth);
5550
5958
  box-shadow: var(--pf-v6-c-drawer__panel--BoxShadow);
5551
5959
  opacity: var(--pf-v6-c-drawer__panel--Opacity);
5552
5960
  transition-delay: var(--pf-v6-c-drawer__panel--TransitionDelay);
@@ -5555,15 +5963,6 @@ ul) {
5555
5963
  transition-property: var(--pf-v6-c-drawer__panel--TransitionProperty);
5556
5964
  -webkit-overflow-scrolling: touch;
5557
5965
  }
5558
- .pf-v6-c-drawer__panel::after {
5559
- position: absolute;
5560
- inset-block-start: 0;
5561
- inset-inline-start: 0;
5562
- width: var(--pf-v6-c-drawer__panel--after--Width);
5563
- height: 100%;
5564
- content: "";
5565
- background-color: var(--pf-v6-c-drawer__panel--after--BackgroundColor);
5566
- }
5567
5966
  .pf-v6-c-drawer__panel:not(.pf-m-resizable) {
5568
5967
  padding-block-start: var(--pf-v6-c-drawer__panel--PaddingBlockStart);
5569
5968
  padding-block-end: var(--pf-v6-c-drawer__panel--PaddingBlockEnd);
@@ -5718,13 +6117,13 @@ ul) {
5718
6117
  }
5719
6118
  .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable {
5720
6119
  --pf-v6-c-drawer__panel--md--FlexBasis--min: var(--pf-v6-c-drawer__panel--m-resizable--md--FlexBasis--min);
6120
+ --pf-v6-c-drawer__panel--BorderBlockStartWidth: 0;
6121
+ --pf-v6-c-drawer__panel--BorderBlockEndWidth: 0;
6122
+ --pf-v6-c-drawer__panel--BorderInlineStartWidth: 0;
6123
+ --pf-v6-c-drawer__panel--BorderInlineEndWidth: 0;
5721
6124
  flex-direction: var(--pf-v6-c-drawer__panel--m-resizable--FlexDirection);
5722
6125
  min-width: var(--pf-v6-c-drawer__panel--m-resizable--MinWidth);
5723
6126
  }
5724
- .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable::after {
5725
- width: 0;
5726
- height: 0;
5727
- }
5728
6127
  .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable > .pf-v6-c-drawer__splitter {
5729
6128
  flex-shrink: 0;
5730
6129
  }
@@ -5733,18 +6132,17 @@ ul) {
5733
6132
  }
5734
6133
  .pf-v6-c-drawer.pf-m-panel-left {
5735
6134
  --pf-v6-c-drawer--m-expanded__panel--BoxShadow: var(--pf-v6-c-drawer--m-expanded--m-panel-left__panel--BoxShadow);
6135
+ --pf-v6-c-drawer__panel--BorderInlineEndWidth: var(--pf-v6-c-drawer__panel--after--Width);
6136
+ --pf-v6-c-drawer__panel--BorderInlineStartWidth: 0;
5736
6137
  }
5737
6138
  .pf-v6-c-drawer.pf-m-panel-left.pf-m-inline > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable), .pf-v6-c-drawer.pf-m-panel-left.pf-m-static > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable) {
6139
+ --pf-v6-c-drawer__panel--BorderInlineEndWidth: var(--pf-v6-c-drawer--m-inline__panel--after--Width);
5738
6140
  padding-inline-start: 0;
5739
6141
  padding-inline-end: var(--pf-v6-c-drawer--m-panel-left--m-inline__panel--PaddingInlineEnd);
5740
6142
  }
5741
6143
  .pf-v6-c-drawer.pf-m-panel-left.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
5742
6144
  transform: translateX(0);
5743
6145
  }
5744
- .pf-v6-c-drawer.pf-m-panel-left > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel::after {
5745
- inset-inline-start: auto;
5746
- inset-inline-end: 0;
5747
- }
5748
6146
  .pf-v6-c-drawer.pf-m-panel-left > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable > .pf-v6-c-drawer__splitter {
5749
6147
  --pf-v6-c-drawer__splitter-handle--InsetInlineStart: var(--pf-v6-c-drawer--m-panel-left__splitter-handle--InsetInlineStart);
5750
6148
  order: 1;
@@ -5753,19 +6151,16 @@ ul) {
5753
6151
  --pf-v6-c-drawer--m-expanded__panel--BoxShadow: var(--pf-v6-c-drawer--m-expanded--m-panel-bottom__panel--BoxShadow);
5754
6152
  --pf-v6-c-drawer__panel--MaxHeight: 100%;
5755
6153
  --pf-v6-c-drawer__panel--FlexBasis--min: var(--pf-v6-c-drawer--m-panel-bottom__panel--FlexBasis--min);
6154
+ --pf-v6-c-drawer__panel--BorderInlineStartWidth: 0;
6155
+ --pf-v6-c-drawer__panel--BorderBlockStartWidth: var(--pf-v6-c-drawer--m-panel-bottom__panel--after--Height);
5756
6156
  min-width: auto;
5757
6157
  min-height: var(--pf-v6-c-drawer--m-panel-bottom__panel--md--MinHeight);
5758
6158
  }
5759
6159
  .pf-v6-c-drawer.pf-m-panel-bottom.pf-m-inline > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable), .pf-v6-c-drawer.pf-m-panel-bottom.pf-m-static > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable) {
6160
+ --pf-v6-c-drawer__panel--BorderBlockStartWidth: var(--pf-v6-c-drawer--m-inline__panel--after--Width);
5760
6161
  padding-block-start: var(--pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart);
5761
6162
  padding-inline-start: 0;
5762
6163
  }
5763
- .pf-v6-c-drawer.pf-m-panel-bottom > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel::after {
5764
- inset-block-start: 0;
5765
- inset-inline-start: auto;
5766
- width: 100%;
5767
- height: var(--pf-v6-c-drawer--m-panel-bottom__panel--after--Height);
5768
- }
5769
6164
  .pf-v6-c-drawer.pf-m-panel-bottom > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable {
5770
6165
  --pf-v6-c-drawer__panel--md--FlexBasis--min: var(--pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--md--FlexBasis--min);
5771
6166
  --pf-v6-c-drawer__panel--m-resizable--FlexDirection: var(--pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--FlexDirection);
@@ -5794,6 +6189,10 @@ ul) {
5794
6189
  .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-no-border,
5795
6190
  .pf-v6-c-drawer.pf-m-panel-left > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-no-border {
5796
6191
  --pf-v6-c-drawer--m-expanded__panel--BoxShadow: none;
6192
+ --pf-v6-c-drawer__panel--BorderBlockStartWidth: 0;
6193
+ --pf-v6-c-drawer__panel--BorderBlockEndWidth: 0;
6194
+ --pf-v6-c-drawer__panel--BorderInlineStartWidth: 0;
6195
+ --pf-v6-c-drawer__panel--BorderInlineEndWidth: 0;
5797
6196
  }
5798
6197
  .pf-v6-c-drawer__splitter {
5799
6198
  display: block;
@@ -5888,9 +6287,9 @@ ul) {
5888
6287
  .pf-v6-c-drawer.pf-m-static > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
5889
6288
  --pf-v6-c-drawer--m-expanded__panel--BoxShadow: none;
5890
6289
  }
5891
- .pf-v6-c-drawer.pf-m-inline > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border)::after,
5892
- .pf-v6-c-drawer.pf-m-static > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border)::after {
5893
- background-color: var(--pf-v6-c-drawer--m-inline--m-expanded__panel--after--BackgroundColor);
6290
+ .pf-v6-c-drawer.pf-m-inline > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border),
6291
+ .pf-v6-c-drawer.pf-m-static > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border) {
6292
+ --pf-v6-c-drawer__panel--BorderColor: var(--pf-v6-c-drawer--m-inline--m-expanded__panel--after--BackgroundColor);
5894
6293
  }
5895
6294
  .pf-v6-c-drawer.pf-m-inline > .pf-v6-c-drawer__main > .pf-v6-c-drawer__content {
5896
6295
  overflow-x: auto;
@@ -5955,9 +6354,9 @@ ul) {
5955
6354
  .pf-v6-c-drawer.pf-m-static-on-lg > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
5956
6355
  --pf-v6-c-drawer--m-expanded__panel--BoxShadow: none;
5957
6356
  }
5958
- .pf-v6-c-drawer.pf-m-inline-on-lg > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border)::after,
5959
- .pf-v6-c-drawer.pf-m-static-on-lg > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border)::after {
5960
- background-color: var(--pf-v6-c-drawer--m-inline--m-expanded__panel--after--BackgroundColor);
6357
+ .pf-v6-c-drawer.pf-m-inline-on-lg > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border),
6358
+ .pf-v6-c-drawer.pf-m-static-on-lg > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border) {
6359
+ --pf-v6-c-drawer__panel--BorderColor: var(--pf-v6-c-drawer--m-inline--m-expanded__panel--after--BackgroundColor);
5961
6360
  }
5962
6361
  .pf-v6-c-drawer.pf-m-inline-on-lg > .pf-v6-c-drawer__main > .pf-v6-c-drawer__content {
5963
6362
  overflow-x: auto;
@@ -6022,9 +6421,9 @@ ul) {
6022
6421
  .pf-v6-c-drawer.pf-m-static-on-xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
6023
6422
  --pf-v6-c-drawer--m-expanded__panel--BoxShadow: none;
6024
6423
  }
6025
- .pf-v6-c-drawer.pf-m-inline-on-xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border)::after,
6026
- .pf-v6-c-drawer.pf-m-static-on-xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border)::after {
6027
- background-color: var(--pf-v6-c-drawer--m-inline--m-expanded__panel--after--BackgroundColor);
6424
+ .pf-v6-c-drawer.pf-m-inline-on-xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border),
6425
+ .pf-v6-c-drawer.pf-m-static-on-xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border) {
6426
+ --pf-v6-c-drawer__panel--BorderColor: var(--pf-v6-c-drawer--m-inline--m-expanded__panel--after--BackgroundColor);
6028
6427
  }
6029
6428
  .pf-v6-c-drawer.pf-m-inline-on-xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__content {
6030
6429
  overflow-x: auto;
@@ -6089,9 +6488,9 @@ ul) {
6089
6488
  .pf-v6-c-drawer.pf-m-static-on-2xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
6090
6489
  --pf-v6-c-drawer--m-expanded__panel--BoxShadow: none;
6091
6490
  }
6092
- .pf-v6-c-drawer.pf-m-inline-on-2xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border)::after,
6093
- .pf-v6-c-drawer.pf-m-static-on-2xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border)::after {
6094
- background-color: var(--pf-v6-c-drawer--m-inline--m-expanded__panel--after--BackgroundColor);
6491
+ .pf-v6-c-drawer.pf-m-inline-on-2xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border),
6492
+ .pf-v6-c-drawer.pf-m-static-on-2xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border) {
6493
+ --pf-v6-c-drawer__panel--BorderColor: var(--pf-v6-c-drawer--m-inline--m-expanded__panel--after--BackgroundColor);
6095
6494
  }
6096
6495
  .pf-v6-c-drawer.pf-m-inline-on-2xl > .pf-v6-c-drawer__main > .pf-v6-c-drawer__content {
6097
6496
  overflow-x: auto;
@@ -6297,6 +6696,20 @@ ul) {
6297
6696
  --pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: 0;
6298
6697
  --pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate: 90deg;
6299
6698
  --pf-v6-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate: -90deg;
6699
+ --pf-v6-c-expandable-section__content--TransitionDuration--collapse--slide: 0s;
6700
+ --pf-v6-c-expandable-section__content--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
6701
+ --pf-v6-c-expandable-section__content--TransitionDuration--expand--slide: 0s;
6702
+ --pf-v6-c-expandable-section__content--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
6703
+ --pf-v6-c-expandable-section__content--TransitionDuration--slide: var(--pf-v6-c-expandable-section__content--TransitionDuration--collapse--slide);
6704
+ --pf-v6-c-expandable-section__content--TransitionDuration--fade: var(--pf-v6-c-expandable-section__content--TransitionDuration--collapse--fade);
6705
+ --pf-v6-c-expandable-section__content--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
6706
+ --pf-v6-c-expandable-section__content--TransitionDelay--hide: var(--pf-v6-c-expandable-section__content--TransitionDuration--fade);
6707
+ --pf-v6-c-expandable-section__content--Opacity: 0;
6708
+ --pf-v6-c-expandable-section__content--TranslateY: 0;
6709
+ --pf-v6-c-expandable-section--m-expand-top__content--TranslateY: 0;
6710
+ --pf-v6-c-expandable-section--m-expand-bottom__content--TranslateY: 0;
6711
+ --pf-v6-c-expandable-section--m-expanded__content--Opacity: 1;
6712
+ --pf-v6-c-expandable-section--m-expanded__content--TranslateY: 0;
6300
6713
  --pf-v6-c-expandable-section__content--MaxWidth: auto;
6301
6714
  --pf-v6-c-expandable-section--m-limit-width__content--MaxWidth: 46.875rem;
6302
6715
  --pf-v6-c-expandable-section--m-display-lg--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -6308,20 +6721,55 @@ ul) {
6308
6721
  --pf-v6-c-expandable-section--m-display-lg--BorderWidth: var(--pf-t--global--border--width--box--default);
6309
6722
  --pf-v6-c-expandable-section--m-display-lg--BorderColor: var(--pf-t--global--border--color--default);
6310
6723
  --pf-v6-c-expandable-section--m-display-lg--BorderRadius: var(--pf-t--global--border--radius--medium);
6724
+ --pf-v6-c-expandable-section--m-display-lg--TransitionDelay: var(--pf-v6-c-expandable-section__content--TransitionDuration--collapse--fade);
6311
6725
  --pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) + var(--pf-t--global--spacer--gap--text-to-element--default) + var(--pf-v6-c-expandable-section__toggle-icon--MinWidth));
6312
6726
  --pf-v6-c-expandable-section--m-truncate__content--LineClamp: 3;
6313
6727
  --pf-v6-c-expandable-section--m-truncate--Gap: var(--pf-t--global--spacer--xs);
6314
6728
  }
6729
+ @media screen and (prefers-reduced-motion: no-preference) {
6730
+ .pf-v6-c-expandable-section {
6731
+ --pf-v6-c-expandable-section__content--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
6732
+ --pf-v6-c-expandable-section__content--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
6733
+ --pf-v6-c-expandable-section__content--TranslateY: -.5rem;
6734
+ --pf-v6-c-expandable-section--m-expand-top__content--TranslateY: .5rem;
6735
+ --pf-v6-c-expandable-section--m-expand-bottom__content--TranslateY: -.5rem;
6736
+ }
6737
+ }
6315
6738
 
6316
6739
  .pf-v6-c-expandable-section {
6317
6740
  display: flex;
6318
6741
  flex-direction: column;
6319
- gap: var(--pf-v6-c-expandable-section--Gap);
6742
+ gap: 0;
6743
+ transition-delay: var(--pf-v6-c-expandable-section__content--TransitionDelay--hide);
6744
+ transition-duration: 0s;
6745
+ transition-property: gap, padding-block-end;
6320
6746
  }
6321
6747
  .pf-v6-c-expandable-section.pf-m-expanded {
6322
6748
  --pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate);
6323
6749
  --pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate);
6324
6750
  --pf-v6-c-expandable-section--m-display-lg--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-display-lg--m-expanded--PaddingBlockEnd);
6751
+ --pf-v6-c-expandable-section__content--TransitionDuration--slide: var(--pf-v6-c-expandable-section__content--TransitionDuration--expand--slide);
6752
+ --pf-v6-c-expandable-section__content--TransitionDuration--fade: var(--pf-v6-c-expandable-section__content--TransitionDuration--expand--fade);
6753
+ --pf-v6-c-expandable-section__content--Opacity: var(--pf-v6-c-expandable-section--m-expanded__content--Opacity);
6754
+ --pf-v6-c-expandable-section__content--TranslateY: var(--pf-v6-c-expandable-section--m-expanded__content--TranslateY);
6755
+ --pf-v6-c-expandable-section__content--Visibility: auto;
6756
+ --pf-v6-c-expandable-section__content--MaxHeight: 99999px;
6757
+ --pf-v6-c-expandable-section__content--TransitionDelay--hide: 0s;
6758
+ gap: var(--pf-v6-c-expandable-section--Gap);
6759
+ }
6760
+ .pf-v6-c-expandable-section.pf-m-expand-top {
6761
+ --pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate);
6762
+ }
6763
+ .pf-v6-c-expandable-section:has(.pf-v6-c-expandable-section__content:only-child):not(.pf-m-expand-top, .pf-m-expand-bottom) {
6764
+ --pf-v6-c-expandable-section__content--TranslateY: 0;
6765
+ --pf-v6-c-expandable-section__content--TransitionDuration--expand--fade: 0s;
6766
+ --pf-v6-c-expandable-section__content--TransitionDuration--collapse--fade: 0s;
6767
+ }
6768
+ .pf-v6-c-expandable-section:has(.pf-v6-c-expandable-section__content:only-child).pf-m-expand-top:not(.pf-m-expanded) {
6769
+ --pf-v6-c-expandable-section__content--TranslateY: var(--pf-v6-c-expandable-section--m-expand-top__content--TranslateY);
6770
+ }
6771
+ .pf-v6-c-expandable-section:has(.pf-v6-c-expandable-section__content:only-child).pf-m-expand-bottom:not(.pf-m-expanded) {
6772
+ --pf-v6-c-expandable-section__content--TranslateY: var(--pf-v6-c-expandable-section--m-expand-bottom__content--TranslateY);
6325
6773
  }
6326
6774
  .pf-v6-c-expandable-section.pf-m-limit-width {
6327
6775
  --pf-v6-c-expandable-section__content--MaxWidth: var(--pf-v6-c-expandable-section--m-limit-width__content--MaxWidth);
@@ -6368,6 +6816,19 @@ ul) {
6368
6816
  padding-block-end: var(--pf-v6-c-expandable-section__content--PaddingBlockEnd, 0);
6369
6817
  padding-inline-start: var(--pf-v6-c-expandable-section__content--PaddingInlineStart, 0);
6370
6818
  }
6819
+ .pf-v6-c-expandable-section__content:where([hidden]) {
6820
+ display: revert;
6821
+ }
6822
+ .pf-v6-c-expandable-section:where(:not(.pf-m-truncate)) .pf-v6-c-expandable-section__content {
6823
+ max-height: var(--pf-v6-c-expandable-section__content--MaxHeight, 0);
6824
+ visibility: var(--pf-v6-c-expandable-section__content--Visibility, hidden);
6825
+ opacity: var(--pf-v6-c-expandable-section__content--Opacity);
6826
+ transition-delay: 0s, 0s, var(--pf-v6-c-expandable-section__content--TransitionDelay--hide, 0s), var(--pf-v6-c-expandable-section__content--TransitionDelay--hide, 0s);
6827
+ transition-timing-function: var(--pf-v6-c-expandable-section__content--TransitionTimingFunction);
6828
+ transition-duration: var(--pf-v6-c-expandable-section__content--TransitionDuration--fade), var(--pf-v6-c-expandable-section__content--TransitionDuration--slide), 0s, 0s;
6829
+ transition-property: opacity, translate, visibility, max-height;
6830
+ translate: 0 var(--pf-v6-c-expandable-section__content--TranslateY);
6831
+ }
6371
6832
 
6372
6833
  .pf-v6-c-file-upload {
6373
6834
  --pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
@@ -6377,9 +6838,9 @@ ul) {
6377
6838
  --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
6378
6839
  --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
6379
6840
  --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
6380
- --pf-v6-c-file-upload--BorderColor: transparent;
6381
- --pf-v6-c-file-upload--BorderStyle: solid;
6382
- --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
6841
+ --pf-v6-c-file-upload--BorderColor: var(--pf-t--global--border--color--default);
6842
+ --pf-v6-c-file-upload--BorderStyle: dashed;
6843
+ --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--border--color--clicked);
6383
6844
  --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
6384
6845
  --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
6385
6846
  --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
@@ -6479,7 +6940,7 @@ ul) {
6479
6940
  --pf-v6-c-form__field-group--GridTemplateColumns--toggle: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-form__field-group-toggle-icon--MinWidth) + var(--pf-t--global--spacer--xs));
6480
6941
  --pf-v6-c-form__field-group-toggle--PaddingBlockStart: var(--pf-v6-c-form__field-group-header--PaddingBlockStart);
6481
6942
  --pf-v6-c-form__field-group-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
6482
- --pf-v6-c-form__field-group__field-group__field-group-toggle--PaddingBlockStart: var(--pf-t--global--spacer--md);
6943
+ --pf-v6-c-form__field-group__field-group__field-group-toggle--PaddingBlockStart: var(--pf-t--global--spacer--lg);
6483
6944
  --pf-v6-c-form__field-group-header-toggle--BorderWidth--base: var(--pf-t--global--border--width--divider--default);
6484
6945
  --pf-v6-c-form__field-group__field-group--field-group__field-group-toggle--after--BorderBlockStartWidth: var(--pf-v6-c-form__field-group-header-toggle--BorderWidth--base);
6485
6946
  --pf-v6-c-form__field-group-toggle-button--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
@@ -6499,6 +6960,8 @@ ul) {
6499
6960
  --pf-v6-c-form__field-group-header-description--MarginBlockStart: var(--pf-t--global--spacer--xs);
6500
6961
  --pf-v6-c-form__field-group-header-description--Color: var(--pf-t--global--text--color--subtle);
6501
6962
  --pf-v6-c-form__field-group-header-actions--MarginInlineStart: var(--pf-t--global--spacer--sm);
6963
+ --pf-v6-c-form__field-group-header-actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
6964
+ --pf-v6-c-form__field-group-header-actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
6502
6965
  --pf-v6-c-form__field-group-body--PaddingBlockStart: var(--pf-t--global--spacer--lg);
6503
6966
  --pf-v6-c-form__field-group-body--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
6504
6967
  --pf-v6-c-form__field-group-body--Gap: var(--pf-v6-c-form--GridGap);
@@ -6506,6 +6969,19 @@ ul) {
6506
6969
  --pf-v6-c-form__field-group__field-group__field-group-body--GridColumn: 1 / 3;
6507
6970
  --pf-v6-c-form__field-group__field-group__field-group-toggle--field-group-body--GridColumn: 2 / 3;
6508
6971
  --pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd: calc(var(--pf-v6-c-form__field-group-body--PaddingBlockEnd) * -1);
6972
+ --pf-v6-c-form__field-group-body--TranslateY: 0;
6973
+ --pf-v6-c-form__field-group--m-expanded__field-group-body--TranslateY: 0;
6974
+ --pf-v6-c-form__field-group-body--TransitionDuration--expand--slide: 0s;
6975
+ --pf-v6-c-form__field-group-body--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
6976
+ --pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide: 0s;
6977
+ --pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
6978
+ }
6979
+ @media screen and (prefers-reduced-motion: no-preference) {
6980
+ .pf-v6-c-form {
6981
+ --pf-v6-c-form__field-group-body--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
6982
+ --pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
6983
+ --pf-v6-c-form__field-group-body--TranslateY: -.5rem;
6984
+ }
6509
6985
  }
6510
6986
 
6511
6987
  .pf-v6-c-form {
@@ -6862,6 +7338,16 @@ ul) {
6862
7338
  .pf-v6-c-form__field-group.pf-m-expanded > .pf-v6-c-form__field-group-toggle {
6863
7339
  --pf-v6-c-form__field-group-toggle-icon--Rotate: var(--pf-v6-c-form__field-group--m-expanded__toggle-icon--Rotate);
6864
7340
  }
7341
+ .pf-v6-c-form__field-group.pf-m-expanded.pf-m-expandable > .pf-v6-c-form__field-group-body {
7342
+ max-height: 99999px;
7343
+ padding-block-start: var(--pf-v6-c-form__field-group-body--PaddingBlockStart);
7344
+ padding-block-end: var(--pf-v6-c-form__field-group-body--PaddingBlockEnd);
7345
+ visibility: visible;
7346
+ opacity: 1;
7347
+ transition-delay: 0s;
7348
+ transition-duration: var(--pf-v6-c-form__field-group-body--TransitionDuration--expand--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--expand--slide), 0s, 0s, 0s, 0s;
7349
+ translate: 0 var(--pf-v6-c-form__field-group--m-expanded__field-group-body--TranslateY);
7350
+ }
6865
7351
 
6866
7352
  .pf-v6-c-form__field-group-toggle {
6867
7353
  grid-row: 1/2;
@@ -6920,6 +7406,8 @@ ul) {
6920
7406
  }
6921
7407
 
6922
7408
  .pf-v6-c-form__field-group-header-actions {
7409
+ margin-block-start: var(--pf-v6-c-form__field-group-header-actions--MarginBlockStart);
7410
+ margin-block-end: var(--pf-v6-c-form__field-group-header-actions--MarginBlockEnd);
6923
7411
  margin-inline-start: var(--pf-v6-c-form__field-group-header-actions--MarginInlineStart);
6924
7412
  white-space: nowrap;
6925
7413
  }
@@ -6931,6 +7419,18 @@ ul) {
6931
7419
  padding-block-start: var(--pf-v6-c-form__field-group-body--PaddingBlockStart);
6932
7420
  padding-block-end: var(--pf-v6-c-form__field-group-body--PaddingBlockEnd);
6933
7421
  }
7422
+ .pf-v6-c-form__field-group.pf-m-expandable > .pf-v6-c-form__field-group-body {
7423
+ max-height: 0;
7424
+ padding-block-start: 0;
7425
+ padding-block-end: 0;
7426
+ visibility: hidden;
7427
+ opacity: 0;
7428
+ transition-delay: 0s, 0s, var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade);
7429
+ transition-duration: var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide), 0s, 0s, 0s, 0s;
7430
+ transition-property: opacity, translate, visibility, max-height, padding-block-start, padding-block-end;
7431
+ translate: 0 var(--pf-v6-c-form__field-group-body--TranslateY);
7432
+ }
7433
+
6934
7434
  .pf-v6-c-form__field-group-body > .pf-v6-c-form__field-group:first-child {
6935
7435
  --pf-v6-c-form__field-group-toggle--PaddingBlockStart: 0;
6936
7436
  --pf-v6-c-form__field-group-header--PaddingBlockStart: 0;
@@ -7167,6 +7667,22 @@ ul) {
7167
7667
  --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
7168
7668
  --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
7169
7669
  }
7670
+ @media (prefers-reduced-motion: no-preference) {
7671
+ .pf-v6-c-form-control.pf-m-error {
7672
+ translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
7673
+ animation-name: pf-v6-global-danger-jiggle-motion;
7674
+ animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
7675
+ animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
7676
+ animation-fill-mode: both;
7677
+ }
7678
+ }
7679
+ .pf-v6-c-form-control.pf-m-error .pf-v6-c-form-control__icon.pf-m-status {
7680
+ --pf-v6-c-form-control--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
7681
+ --pf-v6-c-form-control--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
7682
+ animation-name: pf-v6-global-fade-in;
7683
+ animation-duration: var(--pf-v6-c-form-control--TransitionDuration--Opacity);
7684
+ animation-timing-function: var(--pf-v6-c-form-control--TransitionTimingFunction--Opacity);
7685
+ }
7170
7686
  .pf-v6-c-form-control.pf-m-error > textarea {
7171
7687
  padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd));
7172
7688
  }
@@ -7816,6 +8332,30 @@ ul) {
7816
8332
  --pf-v6-c-input-group__text--Color: var(--pf-t--global--text--color--regular);
7817
8333
  --pf-v6-c-input-group__item--m-disabled__text--Color: var(--pf-t--global--text--color--on-disabled);
7818
8334
  --pf-v6-c-input-group__item--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
8335
+ --pf-v6-c-input-group__item--m-search-text-input--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
8336
+ --pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
8337
+ --pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
8338
+ --pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
8339
+ --pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
8340
+ --pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--fade: var(--pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--collapse--fade);
8341
+ --pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--slide: var(--pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--collapse--slide);
8342
+ --pf-v6-c-input-group__item--m-search-text-input--ScaleX: 1;
8343
+ --pf-v6-c-input-group__item--m-search-text-input--TransformOriginX--expand-start: 100%;
8344
+ --pf-v6-c-input-group__item--m-search-text-input--TransformOriginX--expand-end: 0;
8345
+ --pf-v6-c-input-group__item--m-search-text-input--TransformOriginX: var(--pf-v6-c-input-group__item--m-search-text-input--TransformOriginX--expand-end);
8346
+ --pf-v6-c-input-group__item--m-search-expand--TransitionTimingFunction:var(--pf-t--global--motion--timing-function--default);
8347
+ --pf-v6-c-input-group__item--m-search-expand--TransitionDuration--expand--fade: 0s;
8348
+ --pf-v6-c-input-group__item--m-search-expand--TransitionDuration--collapse--fade: 0s;
8349
+ --pf-v6-c-input-group__item--m-search-expand--TransitionDuration--fade: var(--pf-v6-c-input-group__item--m-search-expand--TransitionDuration--expand--fade);
8350
+ --pf-v6-c-input-group__item--m-search-action--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
8351
+ --pf-v6-c-input-group__item--m-search-action--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
8352
+ --pf-v6-c-input-group__item--m-search-action--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
8353
+ --pf-v6-c-input-group__item--m-search-action--TransitionDuration--fade: var(--pf-v6-c-input-group__item--m-search-action--TransitionDuration--collapse--fade);
8354
+ }
8355
+ @media (prefers-reduced-motion: no-preference) {
8356
+ .pf-v6-c-input-group {
8357
+ --pf-v6-c-input-group__item--m-search-text-input--ScaleX: .7;
8358
+ }
7819
8359
  }
7820
8360
 
7821
8361
  .pf-v6-c-input-group {
@@ -7823,6 +8363,62 @@ ul) {
7823
8363
  gap: var(--pf-v6-c-input-group--Gap);
7824
8364
  width: 100%;
7825
8365
  }
8366
+ .pf-v6-c-input-group.pf-m-search-expandable:not(.pf-m-expanded) {
8367
+ --pf-v6-c-input-group--Gap: 0;
8368
+ transition: gap 0s var(--pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--fade);
8369
+ }
8370
+ .pf-v6-c-input-group.pf-m-search-expandable .pf-v6-c-input-group__item.pf-m-search-input {
8371
+ flex-grow: 1;
8372
+ max-width: var(--pf-v6-c-input-group__item--m-search-text-input--MaxWidth, 0);
8373
+ visibility: var(--pf-v6-c-input-group__item--m-search-text-input--Visibility, hidden);
8374
+ opacity: var(--pf-v6-c-input-group__item--m-search-text-input--Opacity, 0);
8375
+ transition-delay: 0s, 0s, var(--pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--fade), var(--pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--fade);
8376
+ transition-timing-function: var(--pf-v6-c-input-group__item--m-search-text-input--TransitionTimingFunction);
8377
+ transition-duration: var(--pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--fade), var(--pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--slide), 0s, 0s;
8378
+ transition-property: opacity, scale, visibility, max-width;
8379
+ transform-origin: var(--pf-v6-c-input-group__item--m-search-text-input--TransformOriginX) center;
8380
+ scale: var(--pf-v6-c-input-group__item--m-search-text-input--ScaleX) 1;
8381
+ }
8382
+ .pf-v6-c-input-group.pf-m-search-expandable .pf-v6-c-input-group__item.pf-m-search-expand {
8383
+ max-width: var(--pf-v6-c-input-group__item--m-search-expand--MaxWidth, 100%);
8384
+ visibility: var(--pf-v6-c-input-group__item--m-search-expand--Visibility, visible);
8385
+ opacity: var(--pf-v6-c-input-group__item--m-search-expand--Opacity, 1);
8386
+ transition-delay: var(--pf-v6-c-input-group__item--m-search-action--TransitionDuration--fade);
8387
+ transition-timing-function: var(--pf-v6-c-input-group__item--m-search-expand--TransitionTimingFunction);
8388
+ transition-duration: var(--pf-v6-c-input-group__item--m-search-expand--TransitionDuration--fade), 0s, 0s;
8389
+ transition-property: opacity, visibility, max-width;
8390
+ }
8391
+ .pf-v6-c-input-group.pf-m-search-expandable .pf-v6-c-input-group__item.pf-m-search-action {
8392
+ max-width: var(--pf-v6-c-input-group__item--m-search-action--MaxWidth, 0);
8393
+ visibility: var(--pf-v6-c-input-group__item--m-search-action--Visibility, hidden);
8394
+ opacity: var(--pf-v6-c-input-group__item--m-search-action--Opacity, 0);
8395
+ transition-delay: 0s, var(--pf-v6-c-input-group__item--m-search-action--TransitionDuration--fade), var(--pf-v6-c-input-group__item--m-search-action--TransitionDuration--fade);
8396
+ transition-timing-function: var(--pf-v6-c-input-group__item--m-search-action--TransitionTimingFunction);
8397
+ transition-duration: var(--pf-v6-c-input-group__item--m-search-action--TransitionDuration--fade), 0s, 0s;
8398
+ transition-property: opacity, visibility, max-width;
8399
+ }
8400
+ .pf-v6-c-input-group.pf-m-search-expandable.pf-m-expand-start {
8401
+ --pf-v6-c-input-group__item--m-search-text-input--TransformOriginX: var(--pf-v6-c-input-group__item--m-search-text-input--TransformOriginX--expand-start);
8402
+ }
8403
+ .pf-v6-c-input-group.pf-m-search-expandable.pf-m-expanded {
8404
+ --pf-v6-c-input-group__item--m-search-text-input--MaxWidth: 100%;
8405
+ --pf-v6-c-input-group__item--m-search-text-input--Visibility: visible;
8406
+ --pf-v6-c-input-group__item--m-search-text-input--Opacity: 1;
8407
+ --pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--fade: var(--pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--expand--fade);
8408
+ --pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--slide: var(--pf-v6-c-input-group__item--m-search-text-input--TransitionDuration--expand--slide);
8409
+ --pf-v6-c-input-group__item--m-search-text-input--ScaleX: 1;
8410
+ --pf-v6-c-input-group__item--m-search-action--MaxWidth: 100%;
8411
+ --pf-v6-c-input-group__item--m-search-action--Visibility: visible;
8412
+ --pf-v6-c-input-group__item--m-search-action--Opacity: 1;
8413
+ --pf-v6-c-input-group__item--m-search-action--TransitionDuration--fade: var(--pf-v6-c-input-group__item--m-search-action--TransitionDuration--expand--fade);
8414
+ --pf-v6-c-input-group__item--m-search-expand--MaxWidth: 0;
8415
+ --pf-v6-c-input-group__item--m-search-expand--Visibility: hidden;
8416
+ --pf-v6-c-input-group__item--m-search-expand--Opacity: 0;
8417
+ --pf-v6-c-input-group__item--m-search-expand--TransitionDuration--fade: var(--pf-v6-c-input-group__item--m-search-expand--TransitionDuration--collapse--fade);
8418
+ }
8419
+ .pf-v6-c-input-group.pf-m-search-expandable.pf-m-expanded .pf-v6-c-input-group__item:is(.pf-m-search-input, .pf-m-search-expand, .pf-m-search-action) {
8420
+ transition-delay: 0s;
8421
+ }
7826
8422
 
7827
8423
  .pf-v6-c-input-group__item {
7828
8424
  position: relative;
@@ -8123,10 +8719,11 @@ label.pf-v6-c-input-group__text {
8123
8719
  --pf-v6-c-label--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8124
8720
  --pf-v6-c-label--MaxWidth: 100%;
8125
8721
  --pf-v6-c-label--MinWidth: calc((var(--pf-v6-c-label--FontSize) * var(--pf-t--global--font--line-height--body) + var(--pf-v6-c-label--PaddingBlockStart) + var(--pf-v6-c-label--PaddingBlockEnd)));
8126
- --pf-v6-c-label--BorderWidth: 0;
8127
- --pf-v6-c-label--BorderColor: transparent;
8722
+ --pf-v6-c-label--BorderWidth: var(--pf-t--global--border--width--regular);
8723
+ --pf-v6-c-label--BorderColor: var(--pf-t--global--border--color--high-contrast);
8128
8724
  --pf-v6-c-label--BorderRadius: var(--pf-t--global--border--radius--pill);
8129
8725
  --pf-v6-c-label--FontSize: var(--pf-t--global--font--size--body--sm);
8726
+ --pf-v6-c-label--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
8130
8727
  --pf-v6-c-label--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
8131
8728
  --pf-v6-c-label--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
8132
8729
  --pf-v6-c-label__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
@@ -8249,8 +8846,8 @@ label.pf-v6-c-input-group__text {
8249
8846
  --pf-v6-c-label--m-custom--m-outline--BorderColor: var(--pf-t--global--border--color--status--custom--default);
8250
8847
  --pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--custom--hover);
8251
8848
  --pf-v6-c-label--m-custom--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--custom--hover);
8252
- --pf-v6-c-label--m-clickable--hover--BorderWidth: 0;
8253
- --pf-v6-c-label--m-clickable--hover--BorderColor: transparent;
8849
+ --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
8850
+ --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
8254
8851
  --pf-v6-c-label--m-clickable__content--Cursor: pointer;
8255
8852
  --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label__icon--Color);
8256
8853
  --pf-v6-c-label--m-outline--BorderWidth: var(--pf-t--global--border--width--action--default);
@@ -8263,8 +8860,10 @@ label.pf-v6-c-input-group__text {
8263
8860
  --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--regular);
8264
8861
  --pf-v6-c-label--m-overflow--Color: var(--pf-t--global--text--color--brand--default);
8265
8862
  --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
8863
+ --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-t--global--border--width--action--default);
8266
8864
  --pf-v6-c-label--m-overflow--hover--Color: var(--pf-t--global--text--color--brand--hover);
8267
8865
  --pf-v6-c-label--m-overflow--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
8866
+ --pf-v6-c-label--m-overflow--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
8268
8867
  --pf-v6-c-label--m-add--Color: var(--pf-t--global--text--color--brand--default);
8269
8868
  --pf-v6-c-label--m-add--BackgroundColor: transparent;
8270
8869
  --pf-v6-c-label--m-add--BorderColor: var(--pf-t--global--border--color--default);
@@ -8285,15 +8884,15 @@ label.pf-v6-c-input-group__text {
8285
8884
  --pf-v6-c-label__content--Cursor: initial;
8286
8885
  --pf-v6-c-label__icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
8287
8886
  --pf-v6-c-label__text--MaxWidth: 100%;
8288
- --pf-v6-c-label__actions--MarginInlineEnd: calc(var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd) * -1);
8887
+ --pf-v6-c-label__actions--MarginInlineEnd: 0;
8289
8888
  --pf-v6-c-label__actions--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
8290
8889
  --pf-v6-c-label__actions--c-button--OutlineOffset: -0.1875rem;
8291
- --pf-v6-c-label__actions--c-button--MarginBlockStart: calc(var(--pf-v6-c-label__actions--c-button--PaddingBlockStart) * -1);
8292
- --pf-v6-c-label__actions--c-button--MarginBlockEnd: calc(var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd) * -1);
8293
- --pf-v6-c-label__actions--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
8294
- --pf-v6-c-label__actions--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
8295
- --pf-v6-c-label__actions--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
8296
- --pf-v6-c-label__actions--c-button--PaddingInlineStart: var(--pf-t--global--spacer--xs);
8890
+ --pf-v6-c-label__actions--c-button--MarginBlockStart: 0;
8891
+ --pf-v6-c-label__actions--c-button--MarginBlockEnd: 0;
8892
+ --pf-v6-c-label__actions--c-button--PaddingBlockStart: 0;
8893
+ --pf-v6-c-label__actions--c-button--PaddingInlineEnd: 0;
8894
+ --pf-v6-c-label__actions--c-button--PaddingBlockEnd: 0;
8895
+ --pf-v6-c-label__actions--c-button--PaddingInlineStart: 0;
8297
8896
  --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--default);
8298
8897
  --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--default);
8299
8898
  --pf-v6-c-label--m-editable--hover--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--hover);
@@ -8313,6 +8912,7 @@ label.pf-v6-c-input-group__text {
8313
8912
 
8314
8913
  .pf-v6-c-label {
8315
8914
  position: relative;
8915
+ gap: var(--pf-v6-c-label--Gap);
8316
8916
  min-width: var(--pf-v6-c-label--MinWidth);
8317
8917
  max-width: var(--pf-v6-c-label--MaxWidth);
8318
8918
  padding-block-start: var(--pf-v6-c-label--PaddingBlockStart);
@@ -8512,10 +9112,12 @@ label.pf-v6-c-input-group__text {
8512
9112
  .pf-v6-c-label.pf-m-overflow {
8513
9113
  --pf-v6-c-label--Color: var(--pf-v6-c-label--m-overflow--Color);
8514
9114
  --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-overflow--BackgroundColor);
9115
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-overflow--BorderWidth);
8515
9116
  }
8516
9117
  .pf-v6-c-label.pf-m-overflow:is(:hover, :focus) {
8517
9118
  --pf-v6-c-label--m-overflow--Color: var(--pf-v6-c-label--m-overflow--hover--Color);
8518
9119
  --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-v6-c-label--m-overflow--hover--BackgroundColor);
9120
+ --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-v6-c-label--m-overflow--hover--BorderWidth);
8519
9121
  }
8520
9122
  .pf-v6-c-label.pf-m-add {
8521
9123
  --pf-v6-c-label--Color: var(--pf-v6-c-label--m-add--Color);
@@ -8615,6 +9217,9 @@ input.pf-v6-c-label__content {
8615
9217
  margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
8616
9218
  outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
8617
9219
  }
9220
+ .pf-v6-c-label.pf-m-compact .pf-v6-c-label__actions .pf-v6-c-button {
9221
+ --pf-v6-c-button--m-plain--m-no-padding--after--Inset: 0 calc(-0.125rem);
9222
+ }
8618
9223
 
8619
9224
  .pf-v6-c-label-group {
8620
9225
  --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
@@ -8853,6 +9458,8 @@ ul.pf-v6-c-list {
8853
9458
  --pf-v6-c-login__main--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8854
9459
  --pf-v6-c-login__main--MarginBlockEnd: var(--pf-t--global--spacer--lg);
8855
9460
  --pf-v6-c-login__main--BorderRadius: var(--pf-t--global--border--radius--large);
9461
+ --pf-v6-c-login__main--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
9462
+ --pf-v6-c-login__main--BorderColor: var(--pf-t--global--border--color--high-contrast);
8856
9463
  --pf-v6-c-login__main-header--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
8857
9464
  --pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
8858
9465
  --pf-v6-c-login__main-header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
@@ -8984,6 +9591,7 @@ ul.pf-v6-c-list {
8984
9591
  align-self: start;
8985
9592
  margin-block-end: var(--pf-v6-c-login__main--MarginBlockEnd);
8986
9593
  background-color: var(--pf-v6-c-login__main--BackgroundColor);
9594
+ border: var(--pf-v6-c-login__main--BorderWidth) solid var(--pf-v6-c-login__main--BorderColor);
8987
9595
  border-radius: var(--pf-v6-c-login__main--BorderRadius);
8988
9596
  }
8989
9597
  .pf-v6-c-login__main > :first-child:not(.pf-v6-c-login__main-header) {
@@ -9630,12 +10238,14 @@ ul.pf-v6-c-list {
9630
10238
  --pf-v6-c-menu--BackgroundColor: var(--pf-t--global--background--color--floating--default);
9631
10239
  --pf-v6-c-menu--BoxShadow: var(--pf-t--global--box-shadow--md);
9632
10240
  --pf-v6-c-menu--Color: var(--pf-t--global--text--color--regular);
10241
+ --pf-v6-c-menu--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
10242
+ --pf-v6-c-menu--BorderColor: var(--pf-t--global--border--color--high-contrast);
9633
10243
  --pf-v6-c-menu--BorderRadius: var(--pf-t--global--border--radius--small);
9634
10244
  --pf-v6-c-menu--OutlineOffset: calc(var(--pf-t--global--border--width--control--default) * -3);
9635
10245
  --pf-v6-c-menu--ZIndex: var(--pf-t--global--z-index--sm);
9636
10246
  --pf-v6-c-menu--button--disabled--Color: var(--pf-t--global--text--color--disabled);
9637
10247
  --pf-v6-c-menu--icon--disabled--Color: var(--pf-t--global--icon--color--disabled);
9638
- --pf-v6-c-menu--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
10248
+ --pf-v6-c-menu--TransitionDuration: 0s;
9639
10249
  --pf-v6-c-menu--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
9640
10250
  --pf-v6-c-menu--m-plain--BoxShadow: none;
9641
10251
  --pf-v6-c-menu__content--RowGap: var(--pf-v6-c-menu--RowGap);
@@ -9650,6 +10260,9 @@ ul.pf-v6-c-list {
9650
10260
  --pf-v6-c-menu--m-scrollable__footer--BoxShadow: var(--pf-t--global--box-shadow--md--top);
9651
10261
  --pf-v6-c-menu__list-item--Color: var(--pf-t--global--text--color--regular);
9652
10262
  --pf-v6-c-menu__list-item--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
10263
+ --pf-v6-c-menu__list-item--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
10264
+ --pf-v6-c-menu__list-item--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
10265
+ --pf-v6-c-menu__list-item--BorderColor: var(--pf-t--global--border--color--high-contrast);
9653
10266
  --pf-v6-c-menu__list-item--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
9654
10267
  --pf-v6-c-menu__list-item--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
9655
10268
  --pf-v6-c-menu__list-item--TransitionProperty: background-color;
@@ -9708,14 +10321,34 @@ ul.pf-v6-c-list {
9708
10321
  --pf-v6-c-menu--m-flyout__menu--m-left--InsetInlineEnd: calc(100% + var(--pf-v6-c-menu--m-flyout__menu--m-left--right-offset));
9709
10322
  --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--motion--duration--slide-in--default);
9710
10323
  --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
9711
- --pf-v6-c-menu--m-drilldown__content--Transition: transform var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform), height var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--height);
10324
+ --pf-v6-c-menu--m-drilldown__content--Transition: height var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--height);
9712
10325
  --pf-v6-c-menu--m-drilldown--c-menu--InsetBlockStart: 0;
9713
- --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
10326
+ --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: 0s;
9714
10327
  --pf-v6-c-menu--m-drilldown--c-menu--Transition: transform var(--pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform);
9715
- --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
10328
+ --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: 0s;
9716
10329
  --pf-v6-c-menu--m-drilldown__list--Transition: transform var(--pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform);
9717
10330
  --pf-v6-c-menu--m-drilled-in--c-menu__list-item--m-current-path--c-menu--ZIndex: var(--pf-t--global--z-index--xs);
9718
10331
  }
10332
+ @media (prefers-reduced-motion: no-preference) {
10333
+ .pf-v6-c-menu {
10334
+ --pf-v6-c-menu--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
10335
+ }
10336
+ }
10337
+ @media (prefers-reduced-motion: no-preference) {
10338
+ .pf-v6-c-menu {
10339
+ --pf-v6-c-menu--m-drilldown__content--Transition: transform var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform), height var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--height);
10340
+ }
10341
+ }
10342
+ @media (prefers-reduced-motion: no-preference) {
10343
+ .pf-v6-c-menu {
10344
+ --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
10345
+ }
10346
+ }
10347
+ @media (prefers-reduced-motion: no-preference) {
10348
+ .pf-v6-c-menu {
10349
+ --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
10350
+ }
10351
+ }
9719
10352
 
9720
10353
  .pf-v6-c-menu__content,
9721
10354
  .pf-v6-c-menu__list-item,
@@ -9805,6 +10438,7 @@ ul.pf-v6-c-list {
9805
10438
  --pf-v6-c-menu__item-description--Color: var(--pf-v6-c-menu--icon--disabled--Color);
9806
10439
  --pf-v6-c-menu__list-item--BackgroundColor: transparent;
9807
10440
  --pf-v6-c-menu__list-item--hover--BackgroundColor: transparent;
10441
+ --pf-v6-c-menu__list-item--hover--BorderColor: transparent;
9808
10442
  }
9809
10443
  .pf-v6-c-menu__list-item:is(.pf-m-disabled, :disabled),
9810
10444
  .pf-v6-c-menu__item-action:is(.pf-m-disabled, :disabled) {
@@ -9829,6 +10463,7 @@ ul.pf-v6-c-list {
9829
10463
  overflow: hidden;
9830
10464
  color: var(--pf-v6-c-menu--Color);
9831
10465
  background-color: var(--pf-v6-c-menu--BackgroundColor);
10466
+ border: var(--pf-v6-c-menu--BorderWidth) solid var(--pf-v6-c-menu--BorderColor);
9832
10467
  border-radius: var(--pf-v6-c-menu--BorderRadius);
9833
10468
  box-shadow: var(--pf-v6-c-menu--BoxShadow);
9834
10469
  transition-timing-function: var(--pf-v6-c-menu--TransitionTimingFunction) !important;
@@ -9873,6 +10508,7 @@ ul.pf-v6-c-list {
9873
10508
  }
9874
10509
  .pf-v6-c-menu.pf-m-drilldown :where(.pf-v6-c-menu) {
9875
10510
  padding: 0;
10511
+ border: 0;
9876
10512
  }
9877
10513
  .pf-v6-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v6-c-menu__content > .pf-v6-c-menu__list,
9878
10514
  .pf-v6-c-menu.pf-m-drilldown.pf-m-drilled-in > .pf-v6-c-menu__list {
@@ -10015,6 +10651,8 @@ ul.pf-v6-c-list {
10015
10651
  inset: 0;
10016
10652
  content: "";
10017
10653
  background-color: var(--pf-v6-c-menu__list-item--BackgroundColor);
10654
+ border-block-start: var(--pf-v6-c-menu__list-item--BorderWidth) solid var(--pf-v6-c-menu__list-item--BorderColor);
10655
+ border-block-end: var(--pf-v6-c-menu__list-item--BorderWidth) solid var(--pf-v6-c-menu__list-item--BorderColor);
10018
10656
  transition: inherit;
10019
10657
  }
10020
10658
  .pf-v6-c-menu__list-item.pf-m-load {
@@ -10039,6 +10677,7 @@ ul.pf-v6-c-list {
10039
10677
  }
10040
10678
  .pf-v6-c-menu__list-item.pf-m-focus, .pf-v6-c-menu__list-item:focus-within, .pf-v6-c-menu__list-item:has(> :hover) {
10041
10679
  --pf-v6-c-menu__list-item--BackgroundColor: var(--pf-v6-c-menu__list-item--hover--BackgroundColor);
10680
+ --pf-v6-c-menu__list-item--BorderWidth: var(--pf-v6-c-menu__list-item--hover--BorderWidth);
10042
10681
  }
10043
10682
  .pf-v6-c-menu__list-item.pf-m-focus .pf-v6-c-menu__item-select-icon,
10044
10683
  .pf-v6-c-menu__list-item.pf-m-focus .pf-v6-c-menu__item-external-icon, .pf-v6-c-menu__list-item:focus-within .pf-v6-c-menu__item-select-icon,
@@ -10227,19 +10866,19 @@ ul.pf-v6-c-list {
10227
10866
  --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
10228
10867
  --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
10229
10868
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
10230
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--action--default);
10869
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
10231
10870
  --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
10232
10871
  --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
10233
10872
  --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
10234
10873
  --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
10235
10874
  --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
10236
10875
  --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
10237
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--action--default);
10876
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
10238
10877
  --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
10239
10878
  --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
10240
10879
  --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
10241
10880
  --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
10242
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
10881
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--control--clicked);
10243
10882
  --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
10244
10883
  --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
10245
10884
  --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
@@ -10249,6 +10888,14 @@ ul.pf-v6-c-list {
10249
10888
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
10250
10889
  --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
10251
10890
  --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
10891
+ --pf-v6-c-menu-toggle__icon--TransitionDelay: 0s;
10892
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: 0s;
10893
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: none;
10894
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDelay: 0s;
10895
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: 0s;
10896
+ --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: none;
10897
+ --pf-v6-c-menu-toggle__icon--Rotate: 0deg;
10898
+ --pf-v6-c-menu-toggle--hover__icon--Rotate: 0deg;
10252
10899
  --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
10253
10900
  --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
10254
10901
  --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
@@ -10300,7 +10947,7 @@ ul.pf-v6-c-list {
10300
10947
  --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
10301
10948
  --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
10302
10949
  --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
10303
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
10950
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--alt);
10304
10951
  --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
10305
10952
  --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
10306
10953
  --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
@@ -10318,7 +10965,10 @@ ul.pf-v6-c-list {
10318
10965
  --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
10319
10966
  --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
10320
10967
  --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
10321
- --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
10968
+ --pf-v6-c-menu-toggle--m-plain--BorderColor: var(--pf-t--global--border--color--high-contrast);
10969
+ --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
10970
+ --pf-v6-c-menu-toggle--m-plain--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
10971
+ --pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
10322
10972
  --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
10323
10973
  --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
10324
10974
  --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
@@ -10346,6 +10996,11 @@ ul.pf-v6-c-list {
10346
10996
  --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
10347
10997
  --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
10348
10998
  --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
10999
+ --pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
11000
+ --pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
11001
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
11002
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
11003
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate: 60deg;
10349
11004
  }
10350
11005
 
10351
11006
  .pf-v6-c-menu-toggle {
@@ -10439,6 +11094,7 @@ ul.pf-v6-c-list {
10439
11094
  --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
10440
11095
  --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
10441
11096
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
11097
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
10442
11098
  --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
10443
11099
  --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
10444
11100
  --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
@@ -10451,19 +11107,26 @@ ul.pf-v6-c-list {
10451
11107
  --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
10452
11108
  }
10453
11109
  .pf-v6-c-menu-toggle.pf-m-plain::before {
10454
- border: none;
11110
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
11111
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
10455
11112
  }
10456
11113
  .pf-v6-c-menu-toggle:is(:hover, :focus) {
10457
11114
  --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
10458
11115
  --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
10459
11116
  --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
11117
+ --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--hover--BorderWidth);
10460
11118
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
10461
11119
  --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
11120
+ --pf-v6-c-menu-toggle__icon--TransitionDelay: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDelay);
11121
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDuration);
11122
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: var(--pf-v6-c-menu-toggle--hover__icon--TransitionProperty);
11123
+ --pf-v6-c-menu-toggle__icon--Rotate: var(--pf-v6-c-menu-toggle--hover__icon--Rotate);
10462
11124
  }
10463
11125
  .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
10464
11126
  --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
10465
11127
  --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
10466
11128
  --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
11129
+ --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth);
10467
11130
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
10468
11131
  --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
10469
11132
  }
@@ -10514,6 +11177,15 @@ ul.pf-v6-c-list {
10514
11177
  opacity: 1;
10515
11178
  }
10516
11179
  }
11180
+ .pf-v6-c-menu-toggle.pf-m-settings {
11181
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: rotate;
11182
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration);
11183
+ --pf-v6-c-menu-toggle__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction);
11184
+ --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: rotate;
11185
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration);
11186
+ --pf-v6-c-menu-toggle--hover__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction);
11187
+ --pf-v6-c-menu-toggle--hover__icon--Rotate: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate);
11188
+ }
10517
11189
  .pf-v6-c-menu-toggle.pf-m-placeholder {
10518
11190
  --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
10519
11191
  }
@@ -10666,16 +11338,24 @@ ul.pf-v6-c-list {
10666
11338
  flex-wrap: nowrap;
10667
11339
  }
10668
11340
 
10669
- .pf-v6-c-menu-toggle__icon {
10670
- flex-shrink: 0;
10671
- }
10672
11341
  .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
10673
11342
  .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
10674
- .pf-v6-c-menu-toggle__icon.pf-m-avatar svg {
11343
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar svg, .pf-v6-c-menu-toggle:not(.pf-m-plain) .pf-v6-c-menu-toggle__icon {
10675
11344
  margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
10676
11345
  margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
10677
11346
  }
10678
11347
 
11348
+ .pf-v6-c-menu-toggle__icon {
11349
+ flex-shrink: 0;
11350
+ transition-delay: var(--pf-v6-c-menu-toggle__icon--TransitionDelay);
11351
+ transition-duration: var(--pf-v6-c-menu-toggle__icon--TransitionDuration);
11352
+ transition-property: var(--pf-v6-c-menu-toggle__icon--TransitionProperty);
11353
+ rotate: var(--pf-v6-c-menu-toggle__icon--Rotate);
11354
+ }
11355
+ .pf-v6-c-menu-toggle__icon :where(picture, img) {
11356
+ vertical-align: middle;
11357
+ }
11358
+
10679
11359
  .pf-v6-c-menu-toggle__controls {
10680
11360
  display: flex;
10681
11361
  gap: var(--pf-v6-c-menu-toggle__controls--Gap);
@@ -10695,6 +11375,8 @@ ul.pf-v6-c-list {
10695
11375
 
10696
11376
  .pf-v6-c-modal-box {
10697
11377
  --pf-v6-c-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
11378
+ --pf-v6-c-modal-box--BorderColor: var(--pf-t--global--border--color--high-contrast);
11379
+ --pf-v6-c-modal-box--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
10698
11380
  --pf-v6-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--large);
10699
11381
  --pf-v6-c-modal-box--BoxShadow: var(--pf-t--global--box-shadow--lg);
10700
11382
  --pf-v6-c-modal-box--ZIndex: var(--pf-t--global--z-index--xl);
@@ -10761,6 +11443,7 @@ ul.pf-v6-c-list {
10761
11443
  max-height: var(--pf-v6-c-modal-box--MaxHeight);
10762
11444
  overflow: auto;
10763
11445
  background-color: var(--pf-v6-c-modal-box--BackgroundColor);
11446
+ border: var(--pf-v6-c-modal-box--BorderWidth) solid var(--pf-v6-c-modal-box--BorderColor);
10764
11447
  border-radius: var(--pf-v6-c-modal-box--BorderRadius);
10765
11448
  box-shadow: var(--pf-v6-c-modal-box--BoxShadow);
10766
11449
  }
@@ -11152,6 +11835,10 @@ ul.pf-v6-c-list {
11152
11835
  --pf-v6-c-nav__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--hover);
11153
11836
  --pf-v6-c-nav__link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--clicked);
11154
11837
  --pf-v6-c-nav__link--m-current--Color: var(--pf-t--global--text--color--regular);
11838
+ --pf-v6-c-nav__link--BorderColor: var(--pf-t--global--border--color--high-contrast);
11839
+ --pf-v6-c-nav__link--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
11840
+ --pf-v6-c-nav__link--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
11841
+ --pf-v6-c-nav__link--m-current--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
11155
11842
  --pf-v6-c-nav__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--default);
11156
11843
  --pf-v6-c-nav__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
11157
11844
  --pf-v6-c-nav__link--m-current--TransitionDuration--color: var(--pf-t--global--motion--duration--fade--short);
@@ -11162,9 +11849,13 @@ ul.pf-v6-c-list {
11162
11849
  --pf-v6-c-nav__subnav--PaddingBlockStart: var(--pf-v6-c-nav__item--RowGap);
11163
11850
  --pf-v6-c-nav__subnav--PaddingBlockEnd: var(--pf-v6-c-nav__item--RowGap);
11164
11851
  --pf-v6-c-nav__subnav--PaddingInlineStart: var(--pf-t--global--spacer--md);
11165
- --pf-v6-c-nav__subnav--TransitionDuration--expand: var(--pf-t--global--motion--duration--slide-in--default);
11166
- --pf-v6-c-nav__subnav--TransitionDuration--collapse: var(--pf-t--global--motion--duration--slide-in--short);
11852
+ --pf-v6-c-nav__subnav--TransitionDuration--expand: var(--pf-t--global--motion--duration--fade--default);
11853
+ --pf-v6-c-nav__subnav--TransitionDuration--expand--slide: 0s;
11854
+ --pf-v6-c-nav__subnav--TransitionDuration--collapse: var(--pf-t--global--motion--duration--fade--short);
11855
+ --pf-v6-c-nav__subnav--TransitionDuration--collapse--slide: 0s;
11167
11856
  --pf-v6-c-nav__subnav--TransitionTimingFunction--expand: var(--pf-t--global--motion--timing-function--default);
11857
+ --pf-v6-c-nav__subnav--TranslateY: 0;
11858
+ --pf-v6-c-nav__subnav--hidden--TranslateY: 0;
11168
11859
  --pf-v6-c-nav__scroll-button--BorderColor: var(--pf-t--global--border--color--default);
11169
11860
  --pf-v6-c-nav__scroll-button--BorderWidth: var(--pf-t--global--border--width--divider--default);
11170
11861
  --pf-v6-c-nav__scroll-button--first-of-type--c-button--BorderStartStartRadius: var(--pf-t--global--border--radius--pill);
@@ -11182,6 +11873,8 @@ ul.pf-v6-c-list {
11182
11873
  --pf-v6-c-nav--m-horizontal--m-scrollable__list--PaddingInlineEnd: var(--pf-v6-c-nav__list--ColumnGap);
11183
11874
  --pf-v6-c-nav--m-horizontal--m-subnav--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
11184
11875
  --pf-v6-c-nav--m-horizontal--m-subnav--BorderRadius: var(--pf-t--global--border--radius--pill);
11876
+ --pf-v6-c-nav--m-horizontal--m-subnav--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
11877
+ --pf-v6-c-nav--m-horizontal--m-subnav--BorderColor: var(--pf-t--global--border--color--high-contrast);
11185
11878
  --pf-v6-c-nav--m-horizontal--m-subnav__list--PaddingBlockStart: var(--pf-t--global--spacer--xs);
11186
11879
  --pf-v6-c-nav--m-horizontal--m-subnav__list--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
11187
11880
  --pf-v6-c-nav--m-horizontal--m-subnav__list--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -11193,6 +11886,13 @@ ul.pf-v6-c-list {
11193
11886
  --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
11194
11887
  --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
11195
11888
  }
11889
+ @media screen and (prefers-reduced-motion: no-preference) {
11890
+ .pf-v6-c-nav {
11891
+ --pf-v6-c-nav__subnav--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
11892
+ --pf-v6-c-nav__subnav--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
11893
+ --pf-v6-c-nav__subnav--hidden--TranslateY: -.5rem;
11894
+ }
11895
+ }
11196
11896
 
11197
11897
  .pf-v6-c-nav,
11198
11898
  .pf-v6-c-nav__section,
@@ -11263,24 +11963,27 @@ ul.pf-v6-c-list {
11263
11963
 
11264
11964
  .pf-v6-c-nav__subnav {
11265
11965
  --pf-v6-c-nav__list--RowGap: var(--pf-v6-c-nav__subnav--RowGap);
11266
- grid-template-rows: 1fr;
11267
- min-height: 0;
11966
+ max-height: 99999px;
11268
11967
  padding-block-start: var(--pf-v6-c-nav__subnav--PaddingBlockStart);
11269
11968
  padding-block-end: var(--pf-v6-c-nav__subnav--PaddingBlockEnd);
11270
11969
  padding-inline-start: var(--pf-v6-c-nav__subnav--PaddingInlineStart);
11271
11970
  overflow-y: clip;
11272
- transition-delay: 0s, var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s), var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s), var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s), var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s);
11971
+ visibility: visible;
11972
+ transition-delay: 0s, 0s, var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s), var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s), var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s), var(--pf-v6-c-nav__subnav--TransitionDelay--expand--focus, 0s);
11273
11973
  transition-timing-function: var(--pf-v6-c-nav__subnav--TransitionTimingFunction--expand);
11274
- transition-duration: var(--pf-v6-c-nav__subnav--TransitionDuration--expand), 0s, 0s, 0s, 0s;
11275
- transition-property: opacity, visibility, grid-template-rows, padding-block-start, padding-block-end;
11974
+ transition-duration: var(--pf-v6-c-nav__subnav--TransitionDuration--expand), var(--pf-v6-c-nav__subnav--TransitionDuration--expand--slide), 0s, 0s, 0s, 0s;
11975
+ transition-property: opacity, translate, visibility, max-height, padding-block-start, padding-block-end;
11976
+ translate: 0 var(--pf-v6-c-nav__subnav--TranslateY);
11276
11977
  }
11277
11978
  .pf-v6-c-nav__subnav[hidden] {
11278
11979
  --pf-v6-c-nav__subnav--TransitionDelay--expand--focus: var(--pf-v6-c-nav__subnav--TransitionDuration--expand);
11279
11980
  --pf-v6-c-nav__subnav--TransitionDuration--expand: var(--pf-v6-c-nav__subnav--TransitionDuration--collapse);
11981
+ --pf-v6-c-nav__subnav--TransitionDuration--expand--slide: var(--pf-v6-c-nav__subnav--TransitionDuration--collapse--slide);
11280
11982
  --pf-v6-c-nav__subnav--PaddingBlockStart: 0;
11281
11983
  --pf-v6-c-nav__subnav--PaddingBlockEnd: 0;
11984
+ --pf-v6-c-nav__subnav--TranslateY: var(--pf-v6-c-nav__subnav--hidden--TranslateY);
11282
11985
  display: grid;
11283
- grid-template-rows: 0fr;
11986
+ max-height: 0;
11284
11987
  visibility: hidden;
11285
11988
  opacity: 0;
11286
11989
  }
@@ -11331,12 +12034,22 @@ ul.pf-v6-c-list {
11331
12034
  transition-duration: var(--pf-v6-c-nav__link--TransitionDuration--background-color), var(--pf-v6-c-nav__link--m-current--TransitionDuration--color);
11332
12035
  transition-property: background-color, color;
11333
12036
  }
12037
+ .pf-v6-c-nav__link::after {
12038
+ position: absolute;
12039
+ inset: 0;
12040
+ pointer-events: none;
12041
+ content: "";
12042
+ border: var(--pf-v6-c-nav__link--BorderWidth) solid var(--pf-v6-c-nav__link--BorderColor);
12043
+ border-radius: inherit;
12044
+ }
11334
12045
  .pf-v6-c-nav__link:hover, .pf-v6-c-nav__link.pf-m-hover, .pf-v6-c-nav__link:focus {
12046
+ --pf-v6-c-nav__link--BorderWidth: var(--pf-v6-c-nav__link--hover--BorderWidth);
11335
12047
  color: var(--pf-v6-c-nav__link--hover--Color);
11336
12048
  background-color: var(--pf-v6-c-nav__link--hover--BackgroundColor);
11337
12049
  }
11338
12050
  .pf-v6-c-nav__link.pf-m-current, .pf-v6-c-nav__link.pf-m-current:hover {
11339
12051
  --pf-v6-c-nav__link-icon--Color: var(--pf-v6-c-nav__link--m-current__link-icon--Color);
12052
+ --pf-v6-c-nav__link--BorderWidth: var(--pf-v6-c-nav__link--m-current--BorderWidth);
11340
12053
  color: var(--pf-v6-c-nav__link--m-current--Color);
11341
12054
  background-color: var(--pf-v6-c-nav__link--m-current--BackgroundColor);
11342
12055
  }
@@ -11439,6 +12152,7 @@ ul.pf-v6-c-list {
11439
12152
  --pf-v6-c-nav--m-horizontal--m-scrollable__list--PaddingInlineEnd: var(--pf-v6-c-nav--m-horizontal--m-subnav--m-scrollable__list--PaddingInlineEnd);
11440
12153
  --pf-v6-c-nav__link--PaddingBlockStart: var(--pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingBlockStart);
11441
12154
  --pf-v6-c-nav__link--PaddingBlockEnd: var(--pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingBlockEnd);
12155
+ border: var(--pf-v6-c-nav--m-horizontal--m-subnav--BorderWidth) solid var(--pf-v6-c-nav--m-horizontal--m-subnav--BorderColor);
11442
12156
  border-radius: var(--pf-v6-c-nav--m-horizontal--m-subnav--BorderRadius);
11443
12157
  }
11444
12158
  .pf-v6-c-nav:where(.pf-m-horizontal).pf-m-scrollable {
@@ -11769,10 +12483,14 @@ ul.pf-v6-c-list {
11769
12483
  --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--Width--base);
11770
12484
  --pf-v6-c-page__sidebar--xl--Width: var(--pf-v6-c-page__sidebar--Width--base);
11771
12485
  --pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
11772
- --pf-v6-c-page__sidebar--BoxShadow: none;
11773
- --pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
11774
- --pf-v6-c-page__sidebar--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
12486
+ --pf-v6-c-page__sidebar--BoxShadow: var(--pf-t--global--box-shadow--md--right);
12487
+ --pf-v6-c-page__sidebar--TransitionProperty: opacity;
12488
+ --pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
12489
+ --pf-v6-c-page__sidebar--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
11775
12490
  --pf-v6-c-page__sidebar--TranslateX: -100%;
12491
+ --pf-v6-c-page__sidebar--Opacity: 0;
12492
+ --pf-v6-c-page__sidebar--m-expanded--Opacity: 1;
12493
+ --pf-v6-c-page__sidebar--xl--Opacity: 1;
11776
12494
  --pf-v6-c-page__sidebar--TranslateZ: 0;
11777
12495
  --pf-v6-c-page__sidebar--m-expanded--TranslateX: 0;
11778
12496
  --pf-v6-c-page__sidebar--xl--TranslateX: 0;
@@ -11780,6 +12498,8 @@ ul.pf-v6-c-list {
11780
12498
  --pf-v6-c-page__sidebar--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
11781
12499
  --pf-v6-c-page__sidebar--PaddingInlineStart: 0;
11782
12500
  --pf-v6-c-page__sidebar--PaddingInlineEnd: 0;
12501
+ --pf-v6-c-page__sidebar--BorderInlineEndWidth: var(--pf-t--global--border--width--high-contrast--regular);
12502
+ --pf-v6-c-page__sidebar--BorderInlineEndColor: var(--pf-t--global--border--color--high-contrast);
11783
12503
  --pf-v6-c-page__sidebar-header--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
11784
12504
  --pf-v6-c-page__sidebar-header--BorderBlockEndColor: var(--pf-t--global--border--color--default);
11785
12505
  --pf-v6-c-page__sidebar-header--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -11804,13 +12524,19 @@ ul.pf-v6-c-list {
11804
12524
  --pf-v6-c-page__main-container--MarginInlineStart: var(--pf-v6-c-page--inset);
11805
12525
  --pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page--inset);
11806
12526
  --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--medium);
11807
- --pf-v6-c-page__main-container--BorderWidth: 0.25rem;
11808
- --pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
12527
+ --pf-v6-c-page__main-container--BorderBlockStartWidth: var(--pf-t--global--border--width--main--default);
12528
+ --pf-v6-c-page__main-container--BorderBlockEndWidth: var(--pf-t--global--border--width--main--default);
12529
+ --pf-v6-c-page__main-container--BorderInlineStartWidth: var(--pf-t--global--border--width--main--default);
12530
+ --pf-v6-c-page__main-container--BorderInlineEndWidth: var(--pf-t--global--border--width--main--default);
12531
+ --pf-v6-c-page__main-container--BorderColor: var(--pf-t--global--border--color--main--default);
11809
12532
  --pf-v6-c-page__main-container--xs--AlignSelf: stretch;
11810
12533
  --pf-v6-c-page__main-container--xs--BorderRadius: 0;
11811
12534
  --pf-v6-c-page__main-container--xs--MarginInlineStart: 0;
11812
12535
  --pf-v6-c-page__main-container--xs--MaxHeight: 100%;
11813
12536
  --pf-v6-c-page__main-container--xs--MarginInlineEnd: 0;
12537
+ --pf-v6-c-page__main-container--xs--BorderBlockEndWidth: 0;
12538
+ --pf-v6-c-page__main-container--xs--BorderInlineStartWidth: 0px;
12539
+ --pf-v6-c-page__main-container--xs--BorderInlineEndWidth: 0px;
11814
12540
  --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
11815
12541
  --pf-v6-c-page__main-section--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
11816
12542
  --pf-v6-c-page__main-section--PaddingBlockEnd: var(--pf-t--global--spacer--md);
@@ -11823,22 +12549,30 @@ ul.pf-v6-c-list {
11823
12549
  --pf-v6-c-page--section--m-limit-width--MaxWidth: calc(125rem - var(--pf-v6-c-page__sidebar--Width));
11824
12550
  --pf-v6-c-page--section--m-sticky-top--ZIndex: var(--pf-t--global--z-index--md);
11825
12551
  --pf-v6-c-page--section--m-sticky-top--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
12552
+ --pf-v6-c-page--section--m-sticky-top--BorderBlockEndWidth: var(--pf-t--global--border--width--high-contrast--regular);
12553
+ --pf-v6-c-page--section--m-sticky-top--BorderBlockEndColor: var(--pf-t--global--border--color--high-contrast);
11826
12554
  --pf-v6-c-page--section--m-sticky-bottom--ZIndex: var(--pf-t--global--z-index--md);
11827
12555
  --pf-v6-c-page--section--m-sticky-bottom--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
12556
+ --pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
12557
+ --pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartColor: var(--pf-t--global--border--color--high-contrast);
11828
12558
  --pf-v6-c-page--section--m-shadow-bottom--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
11829
12559
  --pf-v6-c-page--section--m-shadow-bottom--ZIndex: var(--pf-t--global--z-index--xs);
12560
+ --pf-v6-c-page--section--m-shadow-bottom--BorderBlockEndWidth: var(--pf-t--global--border--width--high-contrast--regular);
12561
+ --pf-v6-c-page--section--m-shadow-bottom--BorderBlockEndColor: var(--pf-t--global--border--color--high-contrast);
11830
12562
  --pf-v6-c-page--section--m-shadow-top--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
11831
12563
  --pf-v6-c-page--section--m-shadow-top--ZIndex: var(--pf-t--global--z-index--xs);
12564
+ --pf-v6-c-page--section--m-shadow-top--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
12565
+ --pf-v6-c-page--section--m-shadow-top--BorderBlockStartColor: var(--pf-t--global--border--color--high-contrast);
11832
12566
  --pf-v6-c-page__main-subnav--BackgroundColor: var(--pf-t--global--background--color--primary--default);
11833
12567
  --pf-v6-c-page__main-subnav--PaddingBlockStart: var(--pf-t--global--spacer--md);
11834
12568
  --pf-v6-c-page__main-subnav--PaddingBlockEnd: 0;
11835
- --pf-v6-c-page__main-subnav--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
11836
- --pf-v6-c-page__main-subnav--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
12569
+ --pf-v6-c-page__main-subnav--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderInlineStartWidth));
12570
+ --pf-v6-c-page__main-subnav--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderInlineEndWidth));
11837
12571
  --pf-v6-c-page__main-subnav--m-sticky-top--PaddingBlockEnd: var(--pf-t--global--spacer--md);
11838
12572
  --pf-v6-c-page__main-breadcrumb--PaddingBlockStart: var(--pf-t--global--spacer--md);
11839
- --pf-v6-c-page__main-breadcrumb--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
12573
+ --pf-v6-c-page__main-breadcrumb--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderInlineEndWidth));
11840
12574
  --pf-v6-c-page__main-breadcrumb--PaddingBlockEnd: 0;
11841
- --pf-v6-c-page__main-breadcrumb--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
12575
+ --pf-v6-c-page__main-breadcrumb--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderInlineStartWidth));
11842
12576
  --pf-v6-c-page__main-breadcrumb--BackgroundColor: var(--pf-t--global--background--color--primary--default);
11843
12577
  --pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBlockEnd: var(--pf-t--global--spacer--md);
11844
12578
  --pf-v6-c-page__main-tabs--PaddingBlockStart: 0;
@@ -11850,9 +12584,18 @@ ul.pf-v6-c-list {
11850
12584
  --pf-v6-c-page__main-wizard--BorderBlockStartColor: var(--pf-t--global--border--color--default);
11851
12585
  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
11852
12586
  }
12587
+ @media screen and (prefers-reduced-motion: no-preference) {
12588
+ .pf-v6-c-page {
12589
+ --pf-v6-c-page__sidebar--Opacity: 1;
12590
+ --pf-v6-c-page__sidebar--TransitionProperty: transform;
12591
+ --pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
12592
+ }
12593
+ }
11853
12594
  @media screen and (min-width: 75rem) {
11854
12595
  .pf-v6-c-page {
11855
12596
  --pf-v6-c-page__sidebar--TranslateX: var(--pf-v6-c-page__sidebar--xl--TranslateX);
12597
+ --pf-v6-c-page__sidebar--Opacity: var(--pf-v6-c-page__sidebar--xl--Opacity);
12598
+ --pf-v6-c-page__sidebar--BorderInlineEndWidth: 0;
11856
12599
  }
11857
12600
  }
11858
12601
 
@@ -11873,6 +12616,51 @@ ul.pf-v6-c-list {
11873
12616
  grid-template-columns: var(--pf-v6-c-page__sidebar--Width) 1fr;
11874
12617
  }
11875
12618
  }
12619
+ .pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
12620
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
12621
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
12622
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
12623
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
12624
+ --pf-v6-c-button__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
12625
+ --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
12626
+ --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
12627
+ }
12628
+ .pf-v6-c-page:where(:has(> .pf-v6-c-page__sidebar.pf-m-expanded)) > .pf-v6-c-masthead .pf-v6-c-masthead__toggle :is(.pf-v6-c-button.pf-m-hamburger, .pf-v6-c-button.pf-m-hamburger:hover, .pf-v6-c-button.pf-m-hamburger:focus-visible) {
12629
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
12630
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
12631
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
12632
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
12633
+ --pf-v6-c-button__icon--ScaleX: 1;
12634
+ --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
12635
+ --pf-v6-c-button--hover__icon--ScaleX: 1;
12636
+ }
12637
+ @media (min-width: 75rem) {
12638
+ .pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger, .pf-v6-c-page:where(:has(> .pf-v6-c-page__sidebar.pf-m-expanded)) > .pf-v6-c-masthead .pf-v6-c-masthead__toggle :is(.pf-v6-c-button.pf-m-hamburger, .pf-v6-c-button.pf-m-hamburger:hover, .pf-v6-c-button.pf-m-hamburger:focus-visible) {
12639
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
12640
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
12641
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
12642
+ --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
12643
+ --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
12644
+ }
12645
+ .pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
12646
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
12647
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
12648
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
12649
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
12650
+ --pf-v6-c-button__icon--ScaleX: 1;
12651
+ --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
12652
+ --pf-v6-c-button--hover__icon--ScaleX: 1;
12653
+ }
12654
+ .pf-v6-c-page:where(:has(> .pf-v6-c-page__sidebar.pf-m-collapsed)) > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
12655
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
12656
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
12657
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
12658
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
12659
+ --pf-v6-c-button__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
12660
+ --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
12661
+ --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
12662
+ }
12663
+ }
11876
12664
 
11877
12665
  .pf-v6-c-page > .pf-v6-c-masthead {
11878
12666
  z-index: var(--pf-v6-c-page--c-masthead--ZIndex);
@@ -11901,7 +12689,9 @@ ul.pf-v6-c-list {
11901
12689
  overflow-y: auto;
11902
12690
  -webkit-overflow-scrolling: touch;
11903
12691
  background-color: var(--pf-v6-c-page__sidebar--BackgroundColor);
11904
- transition: transform var(--pf-v6-c-page__sidebar--TransitionDuration) var(--pf-v6-c-page__sidebar--TransitionTimingFunction);
12692
+ border-inline-end: var(--pf-v6-c-page__sidebar--BorderInlineEndWidth) solid var(--pf-v6-c-page__sidebar--BorderInlineEndColor);
12693
+ opacity: var(--pf-v6-c-page__sidebar--Opacity);
12694
+ transition: var(--pf-v6-c-page__sidebar--TransitionProperty) var(--pf-v6-c-page__sidebar--TransitionDuration) var(--pf-v6-c-page__sidebar--TransitionTimingFunction);
11905
12695
  transform: translateX(var(--pf-v6-c-page__sidebar--TranslateX)) translateZ(var(--pf-v6-c-page__sidebar--TranslateZ));
11906
12696
  }
11907
12697
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-page__sidebar {
@@ -11910,11 +12700,12 @@ ul.pf-v6-c-list {
11910
12700
 
11911
12701
  .pf-v6-c-page__sidebar.pf-m-expanded {
11912
12702
  --pf-v6-c-page__sidebar--TranslateX: var(--pf-v6-c-page__sidebar--m-expanded--TranslateX);
12703
+ --pf-v6-c-page__sidebar--Opacity: var(--pf-v6-c-page__sidebar--m-expanded--Opacity);
11913
12704
  box-shadow: var(--pf-v6-c-page__sidebar--BoxShadow);
11914
12705
  }
11915
12706
  @media screen and (min-width: 75rem) {
11916
12707
  .pf-v6-c-page__sidebar.pf-m-expanded {
11917
- --pf-v6-c-page__sidebar--BoxShadow: none;
12708
+ --pf-v6-c-page__sidebar--BoxShadow: var(--pf-v6-c-page__sidebar--BoxShadow);
11918
12709
  }
11919
12710
  }
11920
12711
  .pf-v6-c-page__sidebar.pf-m-collapsed {
@@ -12011,6 +12802,7 @@ ul.pf-v6-c-list {
12011
12802
  .pf-v6-c-page__main-group.pf-m-shadow-bottom,
12012
12803
  .pf-v6-c-page__main-subnav.pf-m-shadow-bottom {
12013
12804
  z-index: var(--pf-v6-c-page--section--m-shadow-bottom--ZIndex);
12805
+ border-block-end: var(--pf-v6-c-page--section--m-shadow-bottom--BorderBlockEndWidth) solid var(--pf-v6-c-page--section--m-shadow-bottom--BorderBlockEndColor);
12014
12806
  box-shadow: var(--pf-v6-c-page--section--m-shadow-bottom--BoxShadow);
12015
12807
  }
12016
12808
  .pf-v6-c-page__main-breadcrumb.pf-m-shadow-top,
@@ -12020,6 +12812,7 @@ ul.pf-v6-c-list {
12020
12812
  .pf-v6-c-page__main-group.pf-m-shadow-top,
12021
12813
  .pf-v6-c-page__main-subnav.pf-m-shadow-top {
12022
12814
  z-index: var(--pf-v6-c-page--section--m-shadow-top--ZIndex);
12815
+ border-block-start: var(--pf-v6-c-page--section--m-shadow-top--BorderBlockStartWidth) solid var(--pf-v6-c-page--section--m-shadow-top--BorderBlockStartColor);
12023
12816
  box-shadow: var(--pf-v6-c-page--section--m-shadow-top--BoxShadow);
12024
12817
  }
12025
12818
  .pf-v6-c-page__main-breadcrumb.pf-m-sticky-top,
@@ -12031,6 +12824,7 @@ ul.pf-v6-c-list {
12031
12824
  position: sticky;
12032
12825
  inset-block-start: 0;
12033
12826
  z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
12827
+ border-block-end: var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndWidth) solid var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndColor);
12034
12828
  box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
12035
12829
  }
12036
12830
  .pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom,
@@ -12042,6 +12836,7 @@ ul.pf-v6-c-list {
12042
12836
  position: sticky;
12043
12837
  inset-block-end: 0;
12044
12838
  z-index: var(--pf-v6-c-page--section--m-sticky-bottom--ZIndex);
12839
+ border-block-start: var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartWidth) solid var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartColor);
12045
12840
  box-shadow: var(--pf-v6-c-page--section--m-sticky-bottom--BoxShadow);
12046
12841
  }
12047
12842
  @media (min-height: 0) {
@@ -12054,6 +12849,7 @@ ul.pf-v6-c-list {
12054
12849
  position: sticky;
12055
12850
  inset-block-start: 0;
12056
12851
  z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
12852
+ border-block-end: var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndWidth) solid var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndColor);
12057
12853
  box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
12058
12854
  }
12059
12855
  .pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-sm-height,
@@ -12065,6 +12861,7 @@ ul.pf-v6-c-list {
12065
12861
  position: sticky;
12066
12862
  inset-block-end: 0;
12067
12863
  z-index: var(--pf-v6-c-page--section--m-sticky-bottom--ZIndex);
12864
+ border-block-start: var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartWidth) solid var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartColor);
12068
12865
  box-shadow: var(--pf-v6-c-page--section--m-sticky-bottom--BoxShadow);
12069
12866
  }
12070
12867
  }
@@ -12078,6 +12875,7 @@ ul.pf-v6-c-list {
12078
12875
  position: sticky;
12079
12876
  inset-block-start: 0;
12080
12877
  z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
12878
+ border-block-end: var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndWidth) solid var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndColor);
12081
12879
  box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
12082
12880
  }
12083
12881
  .pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-md-height,
@@ -12089,6 +12887,7 @@ ul.pf-v6-c-list {
12089
12887
  position: sticky;
12090
12888
  inset-block-end: 0;
12091
12889
  z-index: var(--pf-v6-c-page--section--m-sticky-bottom--ZIndex);
12890
+ border-block-start: var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartWidth) solid var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartColor);
12092
12891
  box-shadow: var(--pf-v6-c-page--section--m-sticky-bottom--BoxShadow);
12093
12892
  }
12094
12893
  }
@@ -12102,6 +12901,7 @@ ul.pf-v6-c-list {
12102
12901
  position: sticky;
12103
12902
  inset-block-start: 0;
12104
12903
  z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
12904
+ border-block-end: var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndWidth) solid var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndColor);
12105
12905
  box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
12106
12906
  }
12107
12907
  .pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-lg-height,
@@ -12113,6 +12913,7 @@ ul.pf-v6-c-list {
12113
12913
  position: sticky;
12114
12914
  inset-block-end: 0;
12115
12915
  z-index: var(--pf-v6-c-page--section--m-sticky-bottom--ZIndex);
12916
+ border-block-start: var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartWidth) solid var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartColor);
12116
12917
  box-shadow: var(--pf-v6-c-page--section--m-sticky-bottom--BoxShadow);
12117
12918
  }
12118
12919
  }
@@ -12126,6 +12927,7 @@ ul.pf-v6-c-list {
12126
12927
  position: sticky;
12127
12928
  inset-block-start: 0;
12128
12929
  z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
12930
+ border-block-end: var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndWidth) solid var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndColor);
12129
12931
  box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
12130
12932
  }
12131
12933
  .pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-xl-height,
@@ -12137,6 +12939,7 @@ ul.pf-v6-c-list {
12137
12939
  position: sticky;
12138
12940
  inset-block-end: 0;
12139
12941
  z-index: var(--pf-v6-c-page--section--m-sticky-bottom--ZIndex);
12942
+ border-block-start: var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartWidth) solid var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartColor);
12140
12943
  box-shadow: var(--pf-v6-c-page--section--m-sticky-bottom--BoxShadow);
12141
12944
  }
12142
12945
  }
@@ -12150,6 +12953,7 @@ ul.pf-v6-c-list {
12150
12953
  position: sticky;
12151
12954
  inset-block-start: 0;
12152
12955
  z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
12956
+ border-block-end: var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndWidth) solid var(--pf-v6-c-page--section--m-sticky-top--BorderBlockEndColor);
12153
12957
  box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
12154
12958
  }
12155
12959
  .pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-2xl-height,
@@ -12161,6 +12965,7 @@ ul.pf-v6-c-list {
12161
12965
  position: sticky;
12162
12966
  inset-block-end: 0;
12163
12967
  z-index: var(--pf-v6-c-page--section--m-sticky-bottom--ZIndex);
12968
+ border-block-start: var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartWidth) solid var(--pf-v6-c-page--section--m-sticky-bottom--BorderBlockStartColor);
12164
12969
  box-shadow: var(--pf-v6-c-page--section--m-sticky-bottom--BoxShadow);
12165
12970
  }
12166
12971
  }
@@ -12173,7 +12978,11 @@ ul.pf-v6-c-list {
12173
12978
  margin-inline-start: var(--pf-v6-c-page__main-container--MarginInlineStart);
12174
12979
  margin-inline-end: var(--pf-v6-c-page__main-container--MarginInlineEnd);
12175
12980
  background: var(--pf-v6-c-page__main-container--BackgroundColor);
12176
- border: var(--pf-v6-c-page__main-container--BorderWidth) solid var(--pf-v6-c-page__main-container--BorderColor);
12981
+ border: solid var(--pf-v6-c-page__main-container--BorderColor);
12982
+ border-block-start-width: var(--pf-v6-c-page__main-container--BorderBlockStartWidth);
12983
+ border-block-end-width: var(--pf-v6-c-page__main-container--BorderBlockEndWidth);
12984
+ border-inline-start-width: var(--pf-v6-c-page__main-container--BorderInlineStartWidth);
12985
+ border-inline-end-width: var(--pf-v6-c-page__main-container--BorderInlineEndWidth);
12177
12986
  border-radius: var(--pf-v6-c-page__main-container--BorderRadius);
12178
12987
  }
12179
12988
  @media screen and (max-width: calc(48rem - 1px)) {
@@ -12183,6 +12992,9 @@ ul.pf-v6-c-list {
12183
12992
  --pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page__main-container--xs--MarginInlineEnd);
12184
12993
  --pf-v6-c-page__main-container--MaxHeight: var(--pf-v6-c-page__main-container--xs--MaxHeight);
12185
12994
  --pf-v6-c-page__main-container--BorderRadius: var(--pf-v6-c-page__main-container--xs--BorderRadius);
12995
+ --pf-v6-c-page__main-container--BorderBlockEndWidth: var(--pf-v6-c-page__main-container--xs--BorderBlockEndWidth);
12996
+ --pf-v6-c-page__main-container--BorderInlineStartWidth: var(--pf-v6-c-page__main-container--xs--BorderInlineStartWidth);
12997
+ --pf-v6-c-page__main-container--BorderInlineEndWidth: var(--pf-v6-c-page__main-container--xs--BorderInlineEndWidth);
12186
12998
  }
12187
12999
  }
12188
13000
 
@@ -12303,8 +13115,8 @@ ul.pf-v6-c-list {
12303
13115
  gap: var(--pf-v6-c-page__main-section--RowGap);
12304
13116
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12305
13117
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12306
- padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12307
- padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
13118
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderInlineStartWidth));
13119
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderInlineEndWidth));
12308
13120
  background-color: var(--pf-v6-c-page__main-section--BackgroundColor);
12309
13121
  }
12310
13122
  .pf-v6-c-page__main-section.pf-m-secondary {
@@ -12313,8 +13125,8 @@ ul.pf-v6-c-list {
12313
13125
  .pf-v6-c-page__main-section.pf-m-padding {
12314
13126
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12315
13127
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12316
- padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12317
- padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
13128
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderInlineStartWidth));
13129
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderInlineEndWidth));
12318
13130
  }
12319
13131
  .pf-v6-c-page__main-section.pf-m-no-padding {
12320
13132
  padding: 0;
@@ -12323,8 +13135,8 @@ ul.pf-v6-c-list {
12323
13135
  .pf-v6-c-page__main-section.pf-m-padding-on-sm {
12324
13136
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12325
13137
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12326
- padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12327
- padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
13138
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderInlineStartWidth));
13139
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderInlineEndWidth));
12328
13140
  }
12329
13141
  .pf-v6-c-page__main-section.pf-m-no-padding-on-sm {
12330
13142
  padding: 0;
@@ -12334,8 +13146,8 @@ ul.pf-v6-c-list {
12334
13146
  .pf-v6-c-page__main-section.pf-m-padding-on-md {
12335
13147
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12336
13148
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12337
- padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12338
- padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
13149
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderInlineStartWidth));
13150
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderInlineEndWidth));
12339
13151
  }
12340
13152
  .pf-v6-c-page__main-section.pf-m-no-padding-on-md {
12341
13153
  padding: 0;
@@ -12345,8 +13157,8 @@ ul.pf-v6-c-list {
12345
13157
  .pf-v6-c-page__main-section.pf-m-padding-on-lg {
12346
13158
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12347
13159
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12348
- padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12349
- padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
13160
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderInlineStartWidth));
13161
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderInlineEndWidth));
12350
13162
  }
12351
13163
  .pf-v6-c-page__main-section.pf-m-no-padding-on-lg {
12352
13164
  padding: 0;
@@ -12356,8 +13168,8 @@ ul.pf-v6-c-list {
12356
13168
  .pf-v6-c-page__main-section.pf-m-padding-on-xl {
12357
13169
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12358
13170
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12359
- padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12360
- padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
13171
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderInlineStartWidth));
13172
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderInlineEndWidth));
12361
13173
  }
12362
13174
  .pf-v6-c-page__main-section.pf-m-no-padding-on-xl {
12363
13175
  padding: 0;
@@ -12367,8 +13179,8 @@ ul.pf-v6-c-list {
12367
13179
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl {
12368
13180
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12369
13181
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12370
- padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12371
- padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
13182
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderInlineStartWidth));
13183
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderInlineEndWidth));
12372
13184
  }
12373
13185
  .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl {
12374
13186
  padding: 0;
@@ -12403,6 +13215,9 @@ ul.pf-v6-c-list {
12403
13215
  .pf-v6-c-pagination {
12404
13216
  --pf-v6-c-pagination--inset: 0;
12405
13217
  --pf-v6-c-pagination--ColumnGap: var(--pf-t--global--spacer--lg);
13218
+ --pf-v6-c-pagination--BorderColor: var(--pf-t--global--border--color--high-contrast);
13219
+ --pf-v6-c-pagination--BorderBlockStartWidth: 0;
13220
+ --pf-v6-c-pagination--BorderBlockEndWidth: 0;
12406
13221
  --pf-v6-c-pagination--m-page-insets--inset: var(--pf-t--global--spacer--lg);
12407
13222
  --pf-v6-c-pagination__nav--Display: none;
12408
13223
  --pf-v6-c-pagination--m-display-summary__nav--Display: none;
@@ -12424,14 +13239,17 @@ ul.pf-v6-c-list {
12424
13239
  --pf-v6-c-pagination--m-sticky--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
12425
13240
  --pf-v6-c-pagination--m-sticky--ZIndex: var(--pf-t--global--z-index--xs);
12426
13241
  --pf-v6-c-pagination--m-sticky--InsetBlockStart: 0;
13242
+ --pf-v6-c-pagination--m-sticky--BorderBlockEndWidth: var(--pf-t--global--border--width--high-contrast--regular);
12427
13243
  --pf-v6-c-pagination--m-bottom--BackgroundColor: var(--pf-t--global--background--color--primary--default);
12428
13244
  --pf-v6-c-pagination--m-bottom--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
12429
13245
  --pf-v6-c-pagination--m-bottom--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
12430
13246
  --pf-v6-c-pagination--m-bottom--InsetBlockEnd: 0;
13247
+ --pf-v6-c-pagination--m-bottom--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
12431
13248
  --pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockStart: var(--pf-t--global--spacer--sm);
12432
13249
  --pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
12433
13250
  --pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineStart: var(--pf-t--global--spacer--sm);
12434
13251
  --pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
13252
+ --pf-v6-c-pagination--m-bottom--m-sticky--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
12435
13253
  --pf-v6-c-pagination--m-bottom--m-static--PaddingBlockStart: var(--pf-t--global--spacer--gap--group--vertical);
12436
13254
  --pf-v6-c-pagination--m-bottom--m-static--PaddingBlockEnd: 0;
12437
13255
  --pf-v6-c-pagination--m-bottom--m-static--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -12446,6 +13264,7 @@ ul.pf-v6-c-list {
12446
13264
  @media screen and (min-width: 48rem) {
12447
13265
  .pf-v6-c-pagination {
12448
13266
  --pf-v6-c-pagination--m-bottom--BoxShadow: none;
13267
+ --pf-v6-c-pagination--m-bottom--BorderBlockStartWidth: 0;
12449
13268
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination__page-menu--md--Display);
12450
13269
  --pf-v6-c-pagination__nav--Display: inline-flex;
12451
13270
  --pf-v6-c-pagination__total-items--Display: none;
@@ -12465,6 +13284,9 @@ ul.pf-v6-c-list {
12465
13284
  justify-content: flex-end;
12466
13285
  padding-inline-start: var(--pf-v6-c-pagination--inset);
12467
13286
  padding-inline-end: var(--pf-v6-c-pagination--inset);
13287
+ border: 0 solid var(--pf-v6-c-pagination--BorderColor);
13288
+ border-block-start-width: var(--pf-v6-c-pagination--BorderBlockStartWidth);
13289
+ border-block-end-width: var(--pf-v6-c-pagination--BorderBlockEndWidth);
12468
13290
  }
12469
13291
  .pf-v6-c-pagination .pf-v6-c-pagination__page-menu {
12470
13292
  display: var(--pf-v6-c-pagination__page-menu--Display);
@@ -12472,6 +13294,7 @@ ul.pf-v6-c-list {
12472
13294
  .pf-v6-c-pagination.pf-m-bottom {
12473
13295
  --pf-v6-c-pagination--m-sticky--BoxShadow: var(--pf-v6-c-pagination--m-bottom--m-sticky--BoxShadow);
12474
13296
  --pf-v6-c-pagination--m-sticky--InsetBlockStart: auto;
13297
+ --pf-v6-c-pagination--BorderBlockStartWidth: var(--pf-v6-c-pagination--m-bottom--BorderBlockStartWidth);
12475
13298
  position: sticky;
12476
13299
  inset-block-end: var(--pf-v6-c-pagination--m-bottom--InsetBlockEnd);
12477
13300
  justify-content: center;
@@ -12498,7 +13321,6 @@ ul.pf-v6-c-list {
12498
13321
  }
12499
13322
  @media screen and (min-width: 48rem) {
12500
13323
  .pf-v6-c-pagination.pf-m-bottom {
12501
- --pf-v6-c-pagination--m-bottom--BorderBlockStartWidth: 0;
12502
13324
  --pf-v6-c-pagination--m-bottom--MarginBlockStart: 0;
12503
13325
  --pf-v6-c-pagination--m-bottom--InsetBlockEnd: auto;
12504
13326
  position: relative;
@@ -12530,10 +13352,13 @@ ul.pf-v6-c-list {
12530
13352
  padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingBlockEnd);
12531
13353
  padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineStart);
12532
13354
  padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineEnd);
13355
+ border: 0;
12533
13356
  box-shadow: none;
12534
13357
  }
12535
13358
  .pf-v6-c-pagination.pf-m-sticky {
12536
13359
  --pf-v6-c-pagination--m-bottom--InsetBlockEnd: 0;
13360
+ --pf-v6-c-pagination--BorderBlockEndWidth: var(--pf-v6-c-pagination--m-sticky--BorderBlockEndWidth);
13361
+ --pf-v6-c-pagination--m-bottom--BorderBlockStartWidth: var(--pf-v6-c-pagination--m-bottom--m-sticky--BorderBlockStartWidth);
12537
13362
  position: sticky;
12538
13363
  inset-block-start: var(--pf-v6-c-pagination--m-sticky--InsetBlockStart);
12539
13364
  z-index: var(--pf-v6-c-pagination--m-sticky--ZIndex);
@@ -12769,11 +13594,14 @@ ul.pf-v6-c-list {
12769
13594
  --pf-v6-c-panel--BoxShadow: none;
12770
13595
  --pf-v6-c-panel--BorderRadius: var(--pf-t--global--border--radius--small);
12771
13596
  --pf-v6-c-panel--before--BorderWidth: 0;
12772
- --pf-v6-c-panel--before--BorderColor: var(--pf-t--global--border--color--default);
13597
+ --pf-v6-c-panel--before--BorderColor: var(--pf-t--global--border--color--high-contrast);
12773
13598
  --pf-v6-c-panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
13599
+ --pf-v6-c-panel--m-secondary--before--BorderWidth: var(--pf-t--global--border--width--box--default);
12774
13600
  --pf-v6-c-panel--m-bordered--before--BorderWidth: var(--pf-t--global--border--width--box--default);
13601
+ --pf-v6-c-panel--m-bordered--before--BorderColor: var(--pf-t--global--border--color--default);
12775
13602
  --pf-v6-c-panel--m-raised--BoxShadow: var(--pf-t--global--box-shadow--md);
12776
13603
  --pf-v6-c-panel--m-raised--BackgroundColor: var(--pf-t--global--background--color--floating--default);
13604
+ --pf-v6-c-panel--m-raised--before--BorderWidth: var(--pf-t--global--border--width--box--default);
12777
13605
  --pf-v6-c-panel__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
12778
13606
  --pf-v6-c-panel__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
12779
13607
  --pf-v6-c-panel__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
@@ -12815,13 +13643,16 @@ ul.pf-v6-c-list {
12815
13643
  }
12816
13644
  .pf-v6-c-panel.pf-m-bordered {
12817
13645
  --pf-v6-c-panel--before--BorderWidth: var(--pf-v6-c-panel--m-bordered--before--BorderWidth);
13646
+ --pf-v6-c-panel--before--BorderColor: var(--pf-v6-c-panel--m-bordered--before--BorderColor);
12818
13647
  }
12819
13648
  .pf-v6-c-panel.pf-m-secondary {
12820
13649
  --pf-v6-c-panel--BackgroundColor: var(--pf-v6-c-panel--m-secondary--BackgroundColor);
13650
+ --pf-v6-c-panel--before--BorderWidth: var(--pf-v6-c-panel--m-secondary--before--BorderWidth);
12821
13651
  }
12822
13652
  .pf-v6-c-panel.pf-m-raised {
12823
13653
  --pf-v6-c-panel--BackgroundColor: var(--pf-v6-c-panel--m-raised--BackgroundColor);
12824
13654
  --pf-v6-c-panel--BoxShadow: var(--pf-v6-c-panel--m-raised--BoxShadow);
13655
+ --pf-v6-c-panel--before--BorderWidth: var(--pf-v6-c-panel--m-raised--before--BorderWidth);
12825
13656
  }
12826
13657
  .pf-v6-c-panel.pf-m-scrollable {
12827
13658
  --pf-v6-c-panel__main--MaxHeight: var(--pf-v6-c-panel--m-scrollable__main--MaxHeight);
@@ -12863,6 +13694,8 @@ ul.pf-v6-c-list {
12863
13694
  --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
12864
13695
  --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
12865
13696
  --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
13697
+ --pf-v6-c-popover--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
13698
+ --pf-v6-c-popover--BorderColor: var(--pf-t--global--border--color--high-contrast);
12866
13699
  --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
12867
13700
  --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
12868
13701
  --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
@@ -12913,6 +13746,7 @@ ul.pf-v6-c-list {
12913
13746
  min-width: var(--pf-v6-c-popover--MinWidth);
12914
13747
  max-width: var(--pf-v6-c-popover--MaxWidth);
12915
13748
  font-size: var(--pf-v6-c-popover--FontSize);
13749
+ border: var(--pf-v6-c-popover--BorderWidth) solid var(--pf-v6-c-popover--BorderColor);
12916
13750
  border-radius: var(--pf-v6-c-popover--BorderRadius);
12917
13751
  box-shadow: var(--pf-v6-c-popover--BoxShadow);
12918
13752
  }
@@ -13027,6 +13861,7 @@ ul.pf-v6-c-list {
13027
13861
  height: var(--pf-v6-c-popover__arrow--Height);
13028
13862
  pointer-events: none;
13029
13863
  background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
13864
+ border: var(--pf-v6-c-popover--BorderWidth) solid var(--pf-v6-c-popover--BorderColor);
13030
13865
  box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
13031
13866
  transform: translateX(var(--pf-v6-c-popover__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-popover__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-popover__arrow--Rotate, 0));
13032
13867
  }
@@ -13067,6 +13902,8 @@ ul.pf-v6-c-list {
13067
13902
  --pf-v6-c-progress__bar--Height: var(--pf-t--global--spacer--md);
13068
13903
  --pf-v6-c-progress__bar--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
13069
13904
  --pf-v6-c-progress__bar--BorderRadius: var(--pf-t--global--border--radius--medium);
13905
+ --pf-v6-c-progress__bar--BorderColor: var(--pf-t--global--border--color--high-contrast);
13906
+ --pf-v6-c-progress__bar--BorderWidth: var(--pf-t--global--border--width--regular);
13070
13907
  --pf-v6-c-progress__measure--m-static-width--MinWidth: 4.5ch;
13071
13908
  --pf-v6-c-progress__status--Gap: var(--pf-t--global--spacer--sm);
13072
13909
  --pf-v6-c-progress__status-icon--Color: var(--pf-t--global--icon--color--regular);
@@ -13170,6 +14007,22 @@ ul.pf-v6-c-list {
13170
14007
  --pf-v6-c-progress__status-icon--Color: var(--pf-v6-c-progress--m-danger__status-icon--Color);
13171
14008
  --pf-v6-c-progress--m-inside__measure--Color: var(--pf-v6-c-progress--m-danger--m-inside__measure--Color);
13172
14009
  }
14010
+ @media (prefers-reduced-motion: no-preference) {
14011
+ .pf-v6-c-progress.pf-m-danger .pf-v6-c-progress__bar {
14012
+ translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
14013
+ animation-name: pf-v6-global-danger-jiggle-motion;
14014
+ animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
14015
+ animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
14016
+ animation-fill-mode: both;
14017
+ }
14018
+ }
14019
+ .pf-v6-c-progress.pf-m-danger .pf-v6-c-progress__status-icon {
14020
+ --pf-v6-c-progress--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
14021
+ --pf-v6-c-progress--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
14022
+ animation-name: pf-v6-global-fade-in;
14023
+ animation-duration: var(--pf-v6-c-progress--TransitionDuration--Opacity);
14024
+ animation-timing-function: var(--pf-v6-c-progress--TransitionTimingFunction--Opacity);
14025
+ }
13173
14026
 
13174
14027
  .pf-v6-c-progress__description {
13175
14028
  grid-column: 1/2;
@@ -13212,6 +14065,14 @@ ul.pf-v6-c-list {
13212
14065
  background-color: var(--pf-v6-c-progress__bar--BackgroundColor);
13213
14066
  border-radius: var(--pf-v6-c-progress__bar--BorderRadius);
13214
14067
  }
14068
+ .pf-v6-c-progress__bar::before {
14069
+ position: absolute;
14070
+ inset: 0;
14071
+ pointer-events: none;
14072
+ content: "";
14073
+ border: var(--pf-v6-c-progress__bar--BorderWidth) solid var(--pf-v6-c-progress__bar--BorderColor);
14074
+ border-radius: inherit;
14075
+ }
13215
14076
 
13216
14077
  .pf-v6-c-progress__indicator {
13217
14078
  position: absolute;
@@ -14278,6 +15139,10 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14278
15139
  --pf-v6-c-simple-list__item-link--hover--Color: var(--pf-t--global--text--color--subtle);
14279
15140
  --pf-v6-c-simple-list__item-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
14280
15141
  --pf-v6-c-simple-list__item-link--BorderRadius: var(--pf-t--global--border--radius--tiny);
15142
+ --pf-v6-c-simple-list__item-link--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
15143
+ --pf-v6-c-simple-list__item-link--BorderColor: var(--pf-t--global--border--color--high-contrast);
15144
+ --pf-v6-c-simple-list__item-link--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
15145
+ --pf-v6-c-simple-list__item-link--m-current--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
14281
15146
  --pf-v6-c-simple-list__item-link--m-link--Color: var(--pf-t--global--text--color--link--default);
14282
15147
  --pf-v6-c-simple-list__item-link--m-link--m-current--Color: var(--pf-t--global--text--color--link--hover);
14283
15148
  --pf-v6-c-simple-list__item-link--m-link--hover--Color: var(--pf-t--global--text--color--link--hover);
@@ -14292,6 +15157,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14292
15157
  }
14293
15158
 
14294
15159
  .pf-v6-c-simple-list__item-link {
15160
+ position: relative;
14295
15161
  display: block;
14296
15162
  width: 100%;
14297
15163
  padding-block-start: var(--pf-v6-c-simple-list__item-link--PaddingBlockStart);
@@ -14306,6 +15172,14 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14306
15172
  border: none;
14307
15173
  border-radius: var(--pf-v6-c-simple-list__item-link--BorderRadius);
14308
15174
  }
15175
+ .pf-v6-c-simple-list__item-link::after {
15176
+ position: absolute;
15177
+ inset: 0;
15178
+ pointer-events: none;
15179
+ content: "";
15180
+ border: var(--pf-v6-c-simple-list__item-link--BorderWidth) solid var(--pf-v6-c-simple-list__item-link--BorderColor);
15181
+ border-radius: inherit;
15182
+ }
14309
15183
  .pf-v6-c-simple-list__item-link.pf-m-link {
14310
15184
  --pf-v6-c-simple-list__item-link--Color: var(--pf-v6-c-simple-list__item-link--m-link--Color);
14311
15185
  --pf-v6-c-simple-list__item-link--hover--Color: var(--pf-v6-c-simple-list__item-link--m-link--m-current--Color);
@@ -14314,11 +15188,13 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14314
15188
  .pf-v6-c-simple-list__item-link:is(:hover, :focus) {
14315
15189
  --pf-v6-c-simple-list__item-link--BackgroundColor: var(--pf-v6-c-simple-list__item-link--hover--BackgroundColor);
14316
15190
  --pf-v6-c-simple-list__item-link--Color: var(--pf-v6-c-simple-list__item-link--hover--Color);
15191
+ --pf-v6-c-simple-list__item-link--BorderWidth: var(--pf-v6-c-simple-list__item-link--hover--BorderWidth);
14317
15192
  text-decoration-line: none;
14318
15193
  }
14319
15194
  .pf-v6-c-simple-list__item-link.pf-m-current {
14320
15195
  --pf-v6-c-simple-list__item-link--BackgroundColor: var(--pf-v6-c-simple-list__item-link--m-current--BackgroundColor);
14321
15196
  --pf-v6-c-simple-list__item-link--Color: var(--pf-v6-c-simple-list__item-link--m-current--Color);
15197
+ --pf-v6-c-simple-list__item-link--BorderWidth: var(--pf-v6-c-simple-list__item-link--m-current--BorderWidth);
14322
15198
  }
14323
15199
 
14324
15200
  .pf-v6-c-simple-list__title {
@@ -14347,8 +15223,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14347
15223
  --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
14348
15224
  --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
14349
15225
  --pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
14350
- --pf-v6-c-skeleton--after--TranslateX: -100%;
14351
- --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
15226
+ --pf-v6-c-skeleton--after--TranslateX: 0;
15227
+ --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading-reduced-motion;
14352
15228
  --pf-v6-c-skeleton--after--AnimationDuration: 3s;
14353
15229
  --pf-v6-c-skeleton--after--AnimationIterationCount: infinite;
14354
15230
  --pf-v6-c-skeleton--after--AnimationTimingFunction: linear;
@@ -14380,6 +15256,15 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14380
15256
  --pf-v6-c-skeleton--m-height-75--Height: 75%;
14381
15257
  --pf-v6-c-skeleton--m-height-100--Height: 100%;
14382
15258
  }
15259
+ @media screen and (prefers-reduced-motion: no-preference) {
15260
+ .pf-v6-c-skeleton {
15261
+ --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
15262
+ --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
15263
+ --pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
15264
+ --pf-v6-c-skeleton--after--TranslateX: -100%;
15265
+ --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
15266
+ }
15267
+ }
14383
15268
 
14384
15269
  .pf-v6-c-skeleton {
14385
15270
  position: relative;
@@ -14500,6 +15385,17 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14500
15385
  transform: translateX(100%);
14501
15386
  }
14502
15387
  }
15388
+ @keyframes pf-v6-c-skeleton-loading-reduced-motion {
15389
+ 0% {
15390
+ opacity: 0.25;
15391
+ }
15392
+ 60% {
15393
+ opacity: 1;
15394
+ }
15395
+ 100% {
15396
+ opacity: 0.25;
15397
+ }
15398
+ }
14503
15399
  .pf-v6-c-skip-to-content {
14504
15400
  --pf-v6-c-skip-to-content--InsetBlockStart: var(--pf-t--global--spacer--md);
14505
15401
  --pf-v6-c-skip-to-content--ZIndex: var(--pf-t--global--z-index--2xl);
@@ -14747,6 +15643,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14747
15643
  --pf-v6-c-spinner--StrokeWidth: 10;
14748
15644
  --pf-v6-c-spinner__path--StrokeWidth: var(--pf-v6-c-spinner--StrokeWidth);
14749
15645
  --pf-v6-c-spinner__path--AnimationTimingFunction: ease-in-out;
15646
+ --pf-v6-c-spinner--m-xs--diameter: var(--pf-t--global--icon--size--sm);
14750
15647
  --pf-v6-c-spinner--m-sm--diameter: var(--pf-t--global--icon--size--md);
14751
15648
  --pf-v6-c-spinner--m-md--diameter: var(--pf-t--global--icon--size--lg);
14752
15649
  --pf-v6-c-spinner--m-lg--diameter: var(--pf-t--global--icon--size--xl);
@@ -14763,6 +15660,10 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14763
15660
  .pf-v6-c-spinner.pf-m-inline {
14764
15661
  --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-inline--diameter);
14765
15662
  }
15663
+ .pf-v6-c-spinner.pf-m-xs {
15664
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xs--diameter);
15665
+ --pf-v6-c-spinner--StrokeWidth: 15;
15666
+ }
14766
15667
  .pf-v6-c-spinner.pf-m-sm {
14767
15668
  --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-sm--diameter);
14768
15669
  }
@@ -15044,6 +15945,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15044
15945
  --pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart: var(--pf-t--global--spacer--sm);
15045
15946
  --pf-v6-c-table--cell--responsive--PaddingInlineEnd: 0;
15046
15947
  --pf-v6-c-table--cell--responsive--PaddingInlineStart: 0;
15948
+ --pf-v6-c-table--cell--responsive--th--FontWeight: var(--pf-t--global--font--weight--body--bold);
15047
15949
  --pf-v6-c-table--m-compact__tr--responsive--PaddingBlockStart: var(--pf-t--global--spacer--sm);
15048
15950
  --pf-v6-c-table--m-compact__tr--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
15049
15951
  --pf-v6-c-table--m-compact__tr__td--responsive--PaddingBlockStart: var(--pf-t--global--spacer--xs);
@@ -15107,6 +16009,12 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15107
16009
  .pf-m-grid.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
15108
16010
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
15109
16011
  }
16012
+ .pf-m-grid.pf-v6-c-table.pf-m-animate-expand {
16013
+ --pf-v6-c-table__expandable-row--Display: block;
16014
+ }
16015
+ .pf-m-grid.pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th)[data-label]::before {
16016
+ content: none;
16017
+ }
15110
16018
  .pf-m-grid.pf-v6-c-table.pf-m-expandable {
15111
16019
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
15112
16020
  }
@@ -15163,12 +16071,15 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15163
16071
  grid-template-columns: 1fr minmax(0, 1.5fr);
15164
16072
  align-items: start;
15165
16073
  }
16074
+ .pf-m-grid.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
16075
+ align-items: center;
16076
+ }
15166
16077
  .pf-m-grid.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
15167
16078
  grid-column: 2;
15168
16079
  }
15169
16080
  .pf-m-grid.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
15170
16081
  position: revert;
15171
- font-weight: bold;
16082
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
15172
16083
  text-align: start;
15173
16084
  content: attr(data-label);
15174
16085
  }
@@ -15407,6 +16318,12 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15407
16318
  .pf-m-grid-md.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
15408
16319
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
15409
16320
  }
16321
+ .pf-m-grid-md.pf-v6-c-table.pf-m-animate-expand {
16322
+ --pf-v6-c-table__expandable-row--Display: block;
16323
+ }
16324
+ .pf-m-grid-md.pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th)[data-label]::before {
16325
+ content: none;
16326
+ }
15410
16327
  .pf-m-grid-md.pf-v6-c-table.pf-m-expandable {
15411
16328
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
15412
16329
  }
@@ -15463,12 +16380,15 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15463
16380
  grid-template-columns: 1fr minmax(0, 1.5fr);
15464
16381
  align-items: start;
15465
16382
  }
16383
+ .pf-m-grid-md.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
16384
+ align-items: center;
16385
+ }
15466
16386
  .pf-m-grid-md.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
15467
16387
  grid-column: 2;
15468
16388
  }
15469
16389
  .pf-m-grid-md.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
15470
16390
  position: revert;
15471
- font-weight: bold;
16391
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
15472
16392
  text-align: start;
15473
16393
  content: attr(data-label);
15474
16394
  }
@@ -15710,6 +16630,12 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15710
16630
  .pf-m-grid-lg.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
15711
16631
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
15712
16632
  }
16633
+ .pf-m-grid-lg.pf-v6-c-table.pf-m-animate-expand {
16634
+ --pf-v6-c-table__expandable-row--Display: block;
16635
+ }
16636
+ .pf-m-grid-lg.pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th)[data-label]::before {
16637
+ content: none;
16638
+ }
15713
16639
  .pf-m-grid-lg.pf-v6-c-table.pf-m-expandable {
15714
16640
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
15715
16641
  }
@@ -15766,12 +16692,15 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15766
16692
  grid-template-columns: 1fr minmax(0, 1.5fr);
15767
16693
  align-items: start;
15768
16694
  }
16695
+ .pf-m-grid-lg.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
16696
+ align-items: center;
16697
+ }
15769
16698
  .pf-m-grid-lg.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
15770
16699
  grid-column: 2;
15771
16700
  }
15772
16701
  .pf-m-grid-lg.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
15773
16702
  position: revert;
15774
- font-weight: bold;
16703
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
15775
16704
  text-align: start;
15776
16705
  content: attr(data-label);
15777
16706
  }
@@ -16013,6 +16942,12 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16013
16942
  .pf-m-grid-xl.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
16014
16943
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
16015
16944
  }
16945
+ .pf-m-grid-xl.pf-v6-c-table.pf-m-animate-expand {
16946
+ --pf-v6-c-table__expandable-row--Display: block;
16947
+ }
16948
+ .pf-m-grid-xl.pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th)[data-label]::before {
16949
+ content: none;
16950
+ }
16016
16951
  .pf-m-grid-xl.pf-v6-c-table.pf-m-expandable {
16017
16952
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
16018
16953
  }
@@ -16069,12 +17004,15 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16069
17004
  grid-template-columns: 1fr minmax(0, 1.5fr);
16070
17005
  align-items: start;
16071
17006
  }
17007
+ .pf-m-grid-xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
17008
+ align-items: center;
17009
+ }
16072
17010
  .pf-m-grid-xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
16073
17011
  grid-column: 2;
16074
17012
  }
16075
17013
  .pf-m-grid-xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
16076
17014
  position: revert;
16077
- font-weight: bold;
17015
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
16078
17016
  text-align: start;
16079
17017
  content: attr(data-label);
16080
17018
  }
@@ -16316,6 +17254,12 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16316
17254
  .pf-m-grid-2xl.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
16317
17255
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
16318
17256
  }
17257
+ .pf-m-grid-2xl.pf-v6-c-table.pf-m-animate-expand {
17258
+ --pf-v6-c-table__expandable-row--Display: block;
17259
+ }
17260
+ .pf-m-grid-2xl.pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th)[data-label]::before {
17261
+ content: none;
17262
+ }
16319
17263
  .pf-m-grid-2xl.pf-v6-c-table.pf-m-expandable {
16320
17264
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
16321
17265
  }
@@ -16372,12 +17316,15 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16372
17316
  grid-template-columns: 1fr minmax(0, 1.5fr);
16373
17317
  align-items: start;
16374
17318
  }
17319
+ .pf-m-grid-2xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
17320
+ align-items: center;
17321
+ }
16375
17322
  .pf-m-grid-2xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
16376
17323
  grid-column: 2;
16377
17324
  }
16378
17325
  .pf-m-grid-2xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
16379
17326
  position: revert;
16380
- font-weight: bold;
17327
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
16381
17328
  text-align: start;
16382
17329
  content: attr(data-label);
16383
17330
  }
@@ -16591,7 +17538,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16591
17538
  --pf-v6-c-table__caption--PaddingInlineStart: var(--pf-t--global--spacer--inset--page-chrome);
16592
17539
  --pf-v6-c-table__thead--cell--FontSize: var(--pf-t--global--font--size--body--sm);
16593
17540
  --pf-v6-c-table__thead--cell--FontWeight: var(--pf-t--global--font--weight--body--bold);
16594
- --pf-v6-c-table__thead__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
17541
+ --pf-v6-c-table__thead__toggle--PaddingBlockStart: var(--pf-v6-c-table--cell--Padding--base);
17542
+ --pf-v6-c-table__thead__toggle--PaddingBlockEnd: var(--pf-v6-c-table--cell--Padding--base);
16595
17543
  --pf-v6-c-table__tbody--cell--PaddingBlockStart: var(--pf-v6-c-table--cell--Padding--base);
16596
17544
  --pf-v6-c-table__tbody--cell--PaddingBlockEnd: var(--pf-v6-c-table--cell--Padding--base);
16597
17545
  --pf-v6-c-table__tbody--cell--FontSize: var(--pf-t--global--font--size--body--default);
@@ -16641,6 +17589,9 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16641
17589
  --pf-v6-c-table__button--Color: var(--pf-t--global--text--color--regular);
16642
17590
  --pf-v6-c-table__button--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
16643
17591
  --pf-v6-c-table__button--OutlineOffset: calc(var(--pf-t--global--border--width--strong) * -1);
17592
+ --pf-v6-c-table__button--BorderColor: var(--pf-t--global--border--color--high-contrast);
17593
+ --pf-v6-c-table__button--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
17594
+ --pf-v6-c-table__button--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
16644
17595
  --pf-v6-c-table__button--BorderRadius: var(--pf-t--global--border--radius--small);
16645
17596
  --pf-v6-c-table__button--hover--Color: var(--pf-t--global--text--color--regular);
16646
17597
  --pf-v6-c-table__button--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
@@ -16655,12 +17606,23 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16655
17606
  --pf-v6-c-table__action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
16656
17607
  --pf-v6-c-table__action--PaddingInlineStart: var(--pf-t--global--spacer--sm);
16657
17608
  --pf-v6-c-table__action--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
17609
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: 0s;
17610
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
17611
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: 0s;
17612
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
17613
+ --pf-v6-c-table__expandable-row--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
17614
+ --pf-v6-c-table__expandable-row--Opacity: 0;
17615
+ --pf-v6-c-table__tbody--m-expanded__expandable-row--Opacity: 1;
17616
+ --pf-v6-c-table__expandable-row--TranslateY: 0;
17617
+ --pf-v6-c-table__tbody--m-expanded__expandable-row--TranslateY: 0;
16658
17618
  --pf-v6-c-table__expandable-row-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
16659
17619
  --pf-v6-c-table__expandable-row-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
16660
17620
  --pf-v6-c-table__expandable-row-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
16661
17621
  --pf-v6-c-table__expandable-row-content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
16662
17622
  --pf-v6-c-table__expandable-row-content--BorderRadius: var(--pf-t--global--border--radius--small);
16663
17623
  --pf-v6-c-table__expandable-row-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
17624
+ --pf-v6-c-table__expandable-row-content--BorderColor: var(--pf-t--global--border--color--high-contrast);
17625
+ --pf-v6-c-table__expandable-row-content--BorderWidth: 0;
16664
17626
  --pf-v6-c-table__control-row--BackgroundColor: var(--pf-t--global--background--color--primary--default);
16665
17627
  --pf-v6-c-table__control-row--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
16666
17628
  --pf-v6-c-table__control-row__tbody--BorderBlockEndColor: var(--pf-t--global--border--color--default);
@@ -16682,14 +17644,20 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16682
17644
  --pf-v6-c-table__compound-expansion-toggle__button--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
16683
17645
  --pf-v6-c-table__compound-expansion-toggle__button--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
16684
17646
  --pf-v6-c-table__compound-expansion-toggle__button--after--BorderColor: var(--pf-t--global--border--color--clicked);
17647
+ --pf-v6-c-table__compound-expansion-toggle__button--after--BorderRadius: inherit;
16685
17648
  --pf-v6-c-table__compound-expansion-toggle__button--after--BorderBlockStartWidth: 0;
16686
17649
  --pf-v6-c-table__compound-expansion-toggle__button--hover--after--BorderBlockStartWidth: var(--pf-t--global--border--width--strong);
16687
17650
  --pf-v6-c-table__compound-expansion-toggle--m-expanded__button--after--BorderBlockStartWidth: var(--pf-t--global--border--width--strong);
16688
17651
  --pf-v6-c-table--compound-expansion--m-expanded--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
17652
+ --pf-v6-c-table--compound-expansion--m-expanded--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
16689
17653
  --pf-v6-c-table--m-compact__th--PaddingBlockStart: calc(var(--pf-t--global--spacer--sm) + var(--pf-t--global--spacer--xs));
16690
17654
  --pf-v6-c-table--m-compact__th--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
16691
17655
  --pf-v6-c-table--m-compact--cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
16692
17656
  --pf-v6-c-table--m-compact--cell--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
17657
+ --pf-v6-c-table__td--m-action--PaddingBlockStart: var(--pf-t--global--spacer--sm);
17658
+ --pf-v6-c-table__td--m-action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
17659
+ --pf-v6-c-table--m-compact__td--m-action--PaddingBlockStart: var(--pf-t--global--spacer--xs);
17660
+ --pf-v6-c-table--m-compact__td--m-action--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
16693
17661
  --pf-v6-c-table--m-compact__action--PaddingBlockStart: var(--pf-t--global--spacer--xs);
16694
17662
  --pf-v6-c-table--m-compact__action--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
16695
17663
  --pf-v6-c-table__expandable-row--m-expanded--BorderBlockEndColor: var(--pf-t--global--border--color--default);
@@ -16715,6 +17683,13 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16715
17683
  --pf-v6-c-table--m-sticky-header--ZIndex: calc(var(--pf-t--global--z-index--xs) + 1);
16716
17684
  --pf-v6-c-table--m-sticky-header--border--ZIndex: calc(var(--pf-t--global--z-index--xs) + 2);
16717
17685
  }
17686
+ @media screen and (prefers-reduced-motion: no-preference) {
17687
+ .pf-v6-c-table {
17688
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
17689
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
17690
+ --pf-v6-c-table__expandable-row--TranslateY: -.5rem;
17691
+ }
17692
+ }
16718
17693
 
16719
17694
  .pf-v6-c-table {
16720
17695
  width: 100%;
@@ -16911,6 +17886,10 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16911
17886
  .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) > tr:where(.pf-v6-c-table__tr) > :where(th, td) {
16912
17887
  overflow-wrap: break-word;
16913
17888
  }
17889
+ .pf-v6-c-table .pf-v6-c-table__td.pf-m-action {
17890
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table__td--m-action--PaddingBlockStart);
17891
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table__td--m-action--PaddingBlockEnd);
17892
+ }
16914
17893
  .pf-v6-c-table .pf-v6-c-table__sort {
16915
17894
  min-width: var(--pf-v6-c-table__sort--MinWidth);
16916
17895
  }
@@ -16979,6 +17958,51 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16979
17958
  .pf-v6-c-table .pf-v6-c-button .pf-v6-c-table__sort-indicator {
16980
17959
  --pf-v6-c-table__sort-indicator--MarginInlineStart: 0;
16981
17960
  }
17961
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody.pf-m-expanded > .pf-v6-c-table__control-row {
17962
+ border-block-end: 0;
17963
+ }
17964
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row {
17965
+ display: var(--pf-v6-c-table__expandable-row--Display, revert);
17966
+ visibility: hidden;
17967
+ opacity: var(--pf-v6-c-table__expandable-row--Opacity);
17968
+ transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
17969
+ transition-timing-function: var(--pf-v6-c-table__expandable-row--TransitionTimingFunction);
17970
+ transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s, 0s;
17971
+ transition-property: opacity, translate, visibility, background-color;
17972
+ translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
17973
+ }
17974
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row[hidden] {
17975
+ display: var(--pf-v6-c-table__expandable-row--Display, revert);
17976
+ }
17977
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row.pf-m-expanded {
17978
+ visibility: visible;
17979
+ opacity: var(--pf-v6-c-table__tbody--m-expanded__expandable-row--Opacity);
17980
+ transition-delay: 0s;
17981
+ transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--expand--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--expand--slide), 0s, 0s;
17982
+ translate: 0 var(--pf-v6-c-table__tbody--m-expanded__expandable-row--TranslateY);
17983
+ }
17984
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row.pf-m-expanded > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
17985
+ max-height: 99999px;
17986
+ }
17987
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th),
17988
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
17989
+ padding: 0;
17990
+ overflow: hidden;
17991
+ transition-delay: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
17992
+ transition-property: padding, max-height, overflow;
17993
+ }
17994
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
17995
+ max-height: 0;
17996
+ }
17997
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__tr:has(~ .pf-v6-c-table__expandable-row) {
17998
+ border-block-end: 0;
17999
+ }
18000
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__control-row.pf-m-no-animate-expand ~ .pf-v6-c-table__expandable-row {
18001
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade: 0s;
18002
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: 0s;
18003
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--fade: 0s;
18004
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: 0s;
18005
+ }
16982
18006
 
16983
18007
  [class*=pf-v6-c-table].pf-m-truncate {
16984
18008
  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
@@ -17037,6 +18061,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
17037
18061
  }
17038
18062
 
17039
18063
  .pf-v6-c-table__button {
18064
+ position: relative;
17040
18065
  width: auto;
17041
18066
  padding-block-start: var(--pf-v6-c-table__button--PaddingBlockStart);
17042
18067
  padding-block-end: var(--pf-v6-c-table__button--PaddingBlockEnd);
@@ -17055,6 +18080,14 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
17055
18080
  border-radius: var(--pf-v6-c-table__button--BorderRadius);
17056
18081
  outline-offset: var(--pf-v6-c-table__button--OutlineOffset);
17057
18082
  }
18083
+ .pf-v6-c-table__button::after {
18084
+ position: absolute;
18085
+ inset: 0;
18086
+ pointer-events: none;
18087
+ content: "";
18088
+ border: var(--pf-v6-c-table__button--BorderWidth) solid var(--pf-v6-c-table__button--BorderColor);
18089
+ border-radius: inherit;
18090
+ }
17058
18091
  .pf-v6-c-table .pf-v6-c-table .pf-v6-c-table__button {
17059
18092
  margin-block-end: 0;
17060
18093
  }
@@ -17125,6 +18158,12 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
17125
18158
  --pf-v6-c-table--cell--PaddingInlineStart: var(--pf-v6-c-table__toggle--PaddingInlineStart);
17126
18159
  --pf-v6-c-table--cell--PaddingInlineEnd: var(--pf-v6-c-table__toggle--PaddingInlineEnd);
17127
18160
  }
18161
+ .pf-v6-c-table__thead .pf-v6-c-table__toggle .pf-v6-c-button {
18162
+ margin-block-start: calc(var(--pf-v6-c-button--PaddingBlockStart) * -1);
18163
+ margin-block-end: calc(var(--pf-v6-c-button--PaddingBlockEnd) * -1);
18164
+ line-height: 1lh;
18165
+ }
18166
+
17128
18167
  .pf-v6-c-table__toggle .pf-v6-c-button.pf-m-expanded .pf-v6-c-table__toggle-icon {
17129
18168
  transform: rotate(var(--pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate));
17130
18169
  }
@@ -17224,6 +18263,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17224
18263
  content: "";
17225
18264
  border: 0;
17226
18265
  border-block-start: var(--pf-v6-c-table__compound-expansion-toggle__button--after--BorderBlockStartWidth) solid var(--pf-v6-c-table__compound-expansion-toggle__button--after--BorderColor);
18266
+ border-radius: var(--pf-v6-c-table__compound-expansion-toggle__button--after--BorderRadius);
17227
18267
  }
17228
18268
  .pf-v6-c-table__compound-expansion-toggle:hover, .pf-v6-c-table__compound-expansion-toggle:focus-within {
17229
18269
  --pf-v6-c-table__compound-expansion-toggle__button--BackgroundColor: var(--pf-v6-c-table__compound-expansion-toggle__button--hover--BackgroundColor);
@@ -17247,6 +18287,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17247
18287
  align-self: last baseline;
17248
18288
  margin-inline-start: var(--pf-v6-c-table__column-help--MarginInlineStart);
17249
18289
  }
18290
+ .pf-v6-c-table__column-help-action .pf-v6-c-button {
18291
+ line-height: 1lh;
18292
+ }
17250
18293
 
17251
18294
  .pf-v6-c-table__sort {
17252
18295
  vertical-align: bottom;
@@ -17255,6 +18298,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17255
18298
  --pf-v6-c-table__sort-indicator--Color: var(--pf-v6-c-table__sort__button--hover__sort-indicator--Color);
17256
18299
  --pf-v6-c-table__sort__button__text--Color: var(--pf-v6-c-table__sort__button--hover__text--Color);
17257
18300
  --pf-v6-c-table__button--BackgroundColor: var(--pf-v6-c-table__button--hover--BackgroundColor);
18301
+ --pf-v6-c-table__button--BorderWidth: var(--pf-v6-c-table__button--hover--BorderWidth);
17258
18302
  }
17259
18303
  .pf-v6-c-table__sort .pf-v6-c-table__button .pf-v6-c-table__text {
17260
18304
  color: var(--pf-v6-c-table__sort__button__text--Color);
@@ -17288,7 +18332,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17288
18332
  :not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__td {
17289
18333
  padding-block-start: 0;
17290
18334
  }
17291
-
18335
+ .pf-v6-c-table__control-row ~ .pf-v6-c-table__expandable-row.pf-m-expanded > :is(.pf-v6-c-table__th, .pf-v6-c-table__td):not(.pf-m-no-padding) {
18336
+ padding-block-start: var(--pf-v6-c-table--cell--PaddingBlockStart);
18337
+ }
17292
18338
  .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding,
17293
18339
  .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding {
17294
18340
  padding-block-start: 0;
@@ -17299,15 +18345,29 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17299
18345
  .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
17300
18346
  .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
17301
18347
  padding: 0;
18348
+ border-radius: 0;
17302
18349
  }
17303
18350
  .pf-v6-c-table__expandable-row .pf-v6-c-table__expandable-row-content {
18351
+ position: relative;
17304
18352
  padding-block-start: var(--pf-v6-c-table__expandable-row-content--PaddingBlockStart);
17305
18353
  padding-block-end: var(--pf-v6-c-table__expandable-row-content--PaddingBlockEnd);
17306
18354
  padding-inline-start: var(--pf-v6-c-table__expandable-row-content--PaddingInlineStart);
17307
18355
  padding-inline-end: var(--pf-v6-c-table__expandable-row-content--PaddingInlineEnd);
17308
18356
  background-color: var(--pf-v6-c-table__expandable-row-content--BackgroundColor);
18357
+ border: 0;
17309
18358
  border-radius: var(--pf-v6-c-table__expandable-row-content--BorderRadius);
17310
18359
  }
18360
+ .pf-v6-c-table__expandable-row .pf-v6-c-table__expandable-row-content.pf-m-no-background {
18361
+ background-color: transparent;
18362
+ }
18363
+ .pf-v6-c-table__expandable-row .pf-v6-c-table__td:not(.pf-m-no-padding) > .pf-v6-c-table__expandable-row-content::after {
18364
+ position: absolute;
18365
+ inset: 0;
18366
+ pointer-events: none;
18367
+ content: "";
18368
+ border: var(--pf-v6-c-table__expandable-row-content--BorderWidth) solid var(--pf-v6-c-table__expandable-row-content--BorderColor);
18369
+ border-radius: inherit;
18370
+ }
17311
18371
  .pf-v6-c-table__expandable-row.pf-m-expanded {
17312
18372
  border-block-end-color: var(--pf-v6-c-table__expandable-row--m-expanded--BorderBlockEndColor);
17313
18373
  border-block-end-width: var(--pf-v6-c-table--border-width--base);
@@ -17339,6 +18399,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17339
18399
  --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--m-compact__action--PaddingBlockStart);
17340
18400
  --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact__action--PaddingBlockEnd);
17341
18401
  }
18402
+ .pf-v6-c-table.pf-m-compact .pf-v6-c-table__td.pf-m-action {
18403
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--m-compact__td--m-action--PaddingBlockStart);
18404
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact__td--m-action--PaddingBlockEnd);
18405
+ }
17342
18406
  .pf-v6-c-table.pf-m-compact .pf-v6-c-table__icon {
17343
18407
  width: auto;
17344
18408
  min-width: 0;
@@ -17347,6 +18411,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17347
18411
 
17348
18412
  .pf-v6-c-table__thead {
17349
18413
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
18414
+ --pf-v6-c-table__toggle--PaddingBlockStart: var(--pf-v6-c-table__thead__toggle--PaddingBlockStart);
17350
18415
  --pf-v6-c-table__toggle--PaddingBlockEnd: var(--pf-v6-c-table__thead__toggle--PaddingBlockEnd);
17351
18416
  vertical-align: bottom;
17352
18417
  }
@@ -17360,6 +18425,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17360
18425
  vertical-align: top;
17361
18426
  }
17362
18427
  .pf-v6-c-table__tbody .pf-v6-c-table__control-row ~ .pf-v6-c-table__expandable-row.pf-m-expanded {
18428
+ --pf-v6-c-table__expandable-row-content--BorderWidth: var(--pf-v6-c-table--compound-expansion--m-expanded--BorderWidth);
17363
18429
  background-color: var(--pf-v6-c-table--compound-expansion--m-expanded--BackgroundColor);
17364
18430
  }
17365
18431
 
@@ -17376,6 +18442,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17376
18442
  background-color: var(--pf-v6-c-table__control-row--BackgroundColor);
17377
18443
  border-block-end: var(--pf-v6-c-table__control-row--BorderBlockEndWidth) solid var(--pf-v6-c-table__control-row__tbody--BorderBlockEndColor);
17378
18444
  }
18445
+ .pf-v6-c-table.pf-m-expandable .pf-v6-c-table__tbody.pf-m-expanded .pf-v6-c-table__control-row.pf-m-expanded {
18446
+ border-block-end: 0;
18447
+ }
17379
18448
 
17380
18449
  .pf-v6-c-table__tr {
17381
18450
  border-block-end: var(--pf-v6-c-table__tr--BorderBlockEndWidth) solid var(--pf-v6-c-table__tr--BorderBlockEndColor);
@@ -18383,6 +19452,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18383
19452
  --pf-v6-c-tabs__link--FontSize: var(--pf-t--global--font--size--sm);
18384
19453
  --pf-v6-c-tabs__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
18385
19454
  --pf-v6-c-tabs__link--BorderRadius: var(--pf-t--global--border--radius--small);
19455
+ --pf-v6-c-tabs__link--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
19456
+ --pf-v6-c-tabs__link--BorderColor: transparent;
19457
+ --pf-v6-c-tabs__link--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
19458
+ --pf-v6-c-tabs__link--disabled--BorderColor: transparent;
18386
19459
  --pf-v6-c-tabs__link--PaddingBlockStart: var(--pf-t--global--spacer--xs);
18387
19460
  --pf-v6-c-tabs__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
18388
19461
  --pf-v6-c-tabs__link--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
@@ -18433,25 +19506,28 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18433
19506
  --pf-v6-c-tabs__item--m-current__link--after--BorderColor: var(--pf-t--global--border--color--clicked);
18434
19507
  --pf-v6-c-tabs__item--m-current__link--after--BorderWidth: var(--pf-t--global--border--width--extra-strong);
18435
19508
  --pf-v6-c-tabs--link-accent--start: 0;
18436
- --pf-v6-c-tabs--link-accent--length: auto;
19509
+ --pf-v6-c-tabs--link-accent--length: 0;
18437
19510
  --pf-v6-c-tabs--link-accent--color: var(--pf-v6-c-tabs__item--m-current__link--after--BorderColor);
18438
19511
  --pf-v6-c-tabs--link-accent--border-size: var(--pf-v6-c-tabs__item--m-current__link--after--BorderWidth);
19512
+ --pf-v6-c-tabs--link-accent--TransitionDuration: var(--pf-t--global--motion--duration--md);
19513
+ --pf-v6-c-tabs--link-accent--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
18439
19514
  --pf-v6-c-tabs--link-accent--InsetBlockStart: auto;
18440
19515
  --pf-v6-c-tabs--link-accent--InsetBlockEnd: 0;
18441
- --pf-v6-c-tabs--link-accent--InsetInlineStart: initial;
19516
+ --pf-v6-c-tabs--link-accent--InsetInlineStart: 0;
18442
19517
  --pf-v6-c-tabs--link-accent--Width: initial;
18443
19518
  --pf-v6-c-tabs--link-accent--Height: 0;
18444
19519
  --pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--link-accent--border-size);
18445
19520
  --pf-v6-c-tabs--link-accent--BorderInlineStartWidth: 0;
18446
- --pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart: initial;
19521
+ --pf-v6-c-tabs--link-accent--TranslateX: var(--pf-v6-c-tabs--link-accent--start);
19522
+ --pf-v6-c-tabs--link-accent--TranslateY: 0;
19523
+ --pf-v6-c-tabs--link-accent--TransformOrigin: 0 center;
19524
+ --pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart: 0;
18447
19525
  --pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd: auto;
18448
- --pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart: 0;
18449
- --pf-v6-c-tabs--m-vertical--link-accent--Width: 0;
18450
- --pf-v6-c-tabs--m-vertical--link-accent--Height: initial;
18451
19526
  --pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth: 0;
18452
19527
  --pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--link-accent--border-size);
18453
- --pf-v6-c-tabs--link-accent--TransitionDuration: var(--pf-t--global--motion--duration--md);
18454
- --pf-v6-c-tabs--link-accent--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
19528
+ --pf-v6-c-tabs--m-vertical--link-accent--TranslateX: 0;
19529
+ --pf-v6-c-tabs--m-vertical--link-accent--TranslateY: var(--pf-v6-c-tabs--link-accent--start);
19530
+ --pf-v6-c-tabs--m-vertical--link-accent--TransformOrigin: center 0;
18455
19531
  --pf-v6-c-tabs__scroll-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
18456
19532
  --pf-v6-c-tabs__scroll-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
18457
19533
  --pf-v6-c-tabs__scroll-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -18611,11 +19687,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18611
19687
  --pf-v6-c-tabs__list--ScrollSnapTypeAxis: var(--pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis);
18612
19688
  --pf-v6-c-tabs--link-accent--InsetBlockStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart);
18613
19689
  --pf-v6-c-tabs--link-accent--InsetBlockEnd: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd);
18614
- --pf-v6-c-tabs--link-accent--InsetInlineStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart);
18615
19690
  --pf-v6-c-tabs--link-accent--Width: var(--pf-v6-c-tabs--m-vertical--link-accent--Width);
18616
19691
  --pf-v6-c-tabs--link-accent--Height: var(--pf-v6-c-tabs--m-vertical--link-accent--Height);
18617
19692
  --pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth);
18618
19693
  --pf-v6-c-tabs--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth);
19694
+ --pf-v6-c-tabs--link-accent--TranslateX: var(--pf-v6-c-tabs--m-vertical--link-accent--TranslateX);
19695
+ --pf-v6-c-tabs--link-accent--TranslateY: var(--pf-v6-c-tabs--m-vertical--link-accent--TranslateY);
19696
+ --pf-v6-c-tabs--link-accent--TransformOrigin: var(--pf-v6-c-tabs--m-vertical--link-accent--TransformOrigin);
18619
19697
  display: inline-flex;
18620
19698
  flex-direction: column;
18621
19699
  height: 100%;
@@ -18877,6 +19955,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18877
19955
  color: var(--pf-v6-c-tabs__link--Color);
18878
19956
  text-decoration-line: none;
18879
19957
  background-color: var(--pf-v6-c-tabs__link--BackgroundColor);
19958
+ border: var(--pf-v6-c-tabs__link--BorderWidth) solid var(--pf-v6-c-tabs__link--BorderColor);
18880
19959
  border-radius: var(--pf-v6-c-tabs__link--BorderRadius);
18881
19960
  transition: background-color var(--pf-v6-c-tabs__link--TransitionDuration--background-color) var(--pf-v6-c-tabs__link--TransitionTimingFunction--background-color);
18882
19961
  }
@@ -18910,6 +19989,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18910
19989
 
18911
19990
  .pf-v6-c-tabs__link:where(:hover, :focus) {
18912
19991
  --pf-v6-c-tabs__link--BackgroundColor: var(--pf-v6-c-tabs__link--hover--BackgroundColor);
19992
+ --pf-v6-c-tabs__link--BorderColor: var(--pf-v6-c-tabs__link--hover--BorderColor);
18913
19993
  }
18914
19994
  .pf-v6-c-tabs__link:disabled, .pf-v6-c-tabs__link.pf-m-disabled {
18915
19995
  pointer-events: none;
@@ -18924,6 +20004,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18924
20004
 
18925
20005
  .pf-v6-c-tabs__link:is(:disabled, .pf-m-disabled, .pf-m-aria-disabled) {
18926
20006
  --pf-v6-c-tabs__link--BackgroundColor: var(--pf-v6-c-tabs__link--disabled--BackgroundColor);
20007
+ --pf-v6-c-tabs__link--BorderColor: var(--pf-v6-c-tabs__link--disabled--BorderColor);
18927
20008
  }
18928
20009
  .pf-v6-c-tabs__item.pf-m-action.pf-m-disabled {
18929
20010
  --pf-v6-c-tabs__link--BackgroundColor: transparent;
@@ -19192,15 +20273,15 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19192
20273
  }
19193
20274
 
19194
20275
  @media (prefers-reduced-motion: no-preference) {
19195
- .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__link::after,
19196
- .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__item.pf-m-action::after {
20276
+ .pf-v6-c-tabs.pf-m-animate-current:not(.pf-m-box) .pf-v6-c-tabs__link::after,
20277
+ .pf-v6-c-tabs.pf-m-animate-current:not(.pf-m-box) .pf-v6-c-tabs__item.pf-m-action::after {
19197
20278
  content: revert;
19198
20279
  }
19199
- .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__list::after {
20280
+ .pf-v6-c-tabs.pf-m-animate-current:not(.pf-m-box) .pf-v6-c-tabs__list::after {
19200
20281
  position: absolute;
19201
- inset-block-start: var(--pf-v6-c-tabs--link-accent--InsetBlockStart, var(--pf-v6-c-tabs--link-accent--start));
20282
+ inset-block-start: var(--pf-v6-c-tabs--link-accent--InsetBlockStart);
19202
20283
  inset-block-end: var(--pf-v6-c-tabs--link-accent--InsetBlockEnd);
19203
- inset-inline-start: var(--pf-v6-c-tabs--link-accent--InsetInlineStart, var(--pf-v6-c-tabs--link-accent--start));
20284
+ inset-inline-start: var(--pf-v6-c-tabs--link-accent--InsetInlineStart);
19204
20285
  width: var(--pf-v6-c-tabs--link-accent--Width, var(--pf-v6-c-tabs--link-accent--length));
19205
20286
  height: var(--pf-v6-c-tabs--link-accent--Height, var(--pf-v6-c-tabs--link-accent--length));
19206
20287
  content: "";
@@ -19209,7 +20290,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19209
20290
  border-inline-start-width: var(--pf-v6-c-tabs--link-accent--BorderInlineStartWidth);
19210
20291
  transition-timing-function: var(--pf-v6-c-tabs--link-accent--TransitionTimingFunction);
19211
20292
  transition-duration: var(--pf-v6-c-tabs--link-accent--TransitionDuration);
19212
- transition-property: --pf-v6-c-tabs--link-accent--length, --pf-v6-c-tabs--link-accent--start, width;
20293
+ transition-property: width, height, translate;
20294
+ transform-origin: var(--pf-v6-c-tabs--link-accent--TransformOrigin);
20295
+ translate: var(--pf-v6-c-tabs--link-accent--TranslateX) var(--pf-v6-c-tabs--link-accent--TranslateY);
20296
+ }
20297
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-tabs.pf-m-animate-current:not(.pf-m-box) .pf-v6-c-tabs__list::after {
20298
+ translate: calc(var(--pf-v6-c-tabs--link-accent--TranslateX) * var(--pf-v6-global--inverse--multiplier)) var(--pf-v6-c-tabs--link-accent--TranslateY);
19213
20299
  }
19214
20300
  .pf-v6-c-tabs.pf-m-initializing-accent {
19215
20301
  --pf-v6-c-tabs--link-accent--TransitionDuration: 0;
@@ -19248,6 +20334,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19248
20334
  --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
19249
20335
  --pf-v6-c-text-input-group__text-input--MinWidth: 12ch;
19250
20336
  --pf-v6-c-text-input-group__text-input--m-hint--Color: var(--pf-t--global--text--color--placeholder);
20337
+ --pf-v6-c-text-input-group__text-input--Color: var(--pf-t--global--text--color--regular);
19251
20338
  --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-t--global--text--color--placeholder);
19252
20339
  --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
19253
20340
  --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
@@ -19294,6 +20381,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19294
20381
  }
19295
20382
  .pf-v6-c-text-input-group.pf-m-disabled {
19296
20383
  --pf-v6-c-text-input-group--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
20384
+ --pf-v6-c-text-input-group__text-input--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
20385
+ --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
19297
20386
  --pf-v6-c-text-input-group__icon--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--Color);
19298
20387
  --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--m-status--Color);
19299
20388
  --pf-v6-c-text-input-group--BackgroundColor: var(--pf-v6-c-text-input-group--m-disabled--BackgroundColor);
@@ -19320,12 +20409,31 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19320
20409
  --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-error--BorderColor);
19321
20410
  --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-error__icon--m-status--Color);
19322
20411
  }
20412
+ @media (prefers-reduced-motion: no-preference) {
20413
+ .pf-v6-c-text-input-group.pf-m-error {
20414
+ translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
20415
+ animation-name: pf-v6-global-danger-jiggle-motion;
20416
+ animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
20417
+ animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
20418
+ animation-fill-mode: both;
20419
+ }
20420
+ }
20421
+ .pf-v6-c-text-input-group.pf-m-error .pf-v6-c-text-input-group__icon.pf-m-status {
20422
+ --pf-v6-c-text-input-group--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
20423
+ --pf-v6-c-text-input-group--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
20424
+ animation-name: pf-v6-global-fade-in;
20425
+ animation-duration: var(--pf-v6-c-text-input-group--TransitionDuration--Opacity);
20426
+ animation-timing-function: var(--pf-v6-c-text-input-group--TransitionTimingFunction--Opacity);
20427
+ }
19323
20428
  .pf-v6-c-text-input-group:hover {
19324
20429
  --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-hover--BorderColor);
19325
20430
  }
19326
20431
  .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) {
19327
20432
  --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd);
19328
20433
  }
20434
+ .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) .pf-v6-c-text-input-group__text {
20435
+ --pf-v6-c-text-input-group__text--Position: relative;
20436
+ }
19329
20437
  .pf-v6-c-text-input-group:has(> .pf-v6-c-text-input-group__utilities) {
19330
20438
  --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd);
19331
20439
  --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd);
@@ -19388,6 +20496,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19388
20496
  padding-block-end: var(--pf-v6-c-text-input-group__text-input--PaddingBlockEnd);
19389
20497
  padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
19390
20498
  padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
20499
+ color: var(--pf-v6-c-text-input-group__text-input--Color);
19391
20500
  background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
19392
20501
  border: 0;
19393
20502
  outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
@@ -19551,6 +20660,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19551
20660
  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle);
19552
20661
  }
19553
20662
 
20663
+ .pf-v6-c-timestamp__text {
20664
+ text-decoration: inherit;
20665
+ }
20666
+
19554
20667
  .pf-v6-c-title {
19555
20668
  --pf-v6-c-title--FontFamily: var(--pf-t--global--font--family--heading);
19556
20669
  --pf-v6-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
@@ -21825,6 +22938,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21825
22938
  grid-auto-flow: column;
21826
22939
  align-items: baseline;
21827
22940
  min-width: var(--pf-v6-c-truncate--MinWidth);
22941
+ text-decoration: inherit;
21828
22942
  }
21829
22943
  .pf-v6-c-truncate.pf-m-fixed {
21830
22944
  display: inline;
@@ -21915,12 +23029,28 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21915
23029
  --pf-v6-c-tree-view__node--PaddingInlineStart: var(--pf-v6-c-tree-view__node--indent--base);
21916
23030
  --pf-v6-c-tree-view__node--Color: var(--pf-t--global--text--color--subtle);
21917
23031
  --pf-v6-c-tree-view__node--BackgroundColor: transparent;
23032
+ --pf-v6-c-tree-view__node--BorderRadius: var(--pf-v6-c-tree-view__content--BorderRadius);
23033
+ --pf-v6-c-tree-view__node--BorderColor: var(--pf-t--global--border--color--high-contrast);
23034
+ --pf-v6-c-tree-view__node--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
23035
+ --pf-v6-c-tree-view__node--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
23036
+ --pf-v6-c-tree-view__node--m-current--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
21918
23037
  --pf-v6-c-tree-view__node--m-current--Color: var(--pf-t--global--text--color--regular);
21919
23038
  --pf-v6-c-tree-view__node--m-current--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
21920
23039
  --pf-v6-c-tree-view__node--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
21921
23040
  --pf-v6-c-tree-view__node-container--Display: contents;
21922
23041
  --pf-v6-c-tree-view__node-content--RowGap: var(--pf-t--global--spacer--sm);
21923
23042
  --pf-v6-c-tree-view__node-content--Overflow: visible;
23043
+ --pf-v6-c-tree-view__list--TransitionDuration--expand--slide: 0s;
23044
+ --pf-v6-c-tree-view__list--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
23045
+ --pf-v6-c-tree-view__list--TransitionDuration--collapse--slide: 0s;
23046
+ --pf-v6-c-tree-view__list--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
23047
+ --pf-v6-c-tree-view__list--TransitionDuration--slide: var(--pf-v6-c-tree-view__list--TransitionDuration--collapse--slide);
23048
+ --pf-v6-c-tree-view__list--TransitionDuration--fade: var(--pf-v6-c-tree-view__list--TransitionDuration--collapse--fade);
23049
+ --pf-v6-c-tree-view__list--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
23050
+ --pf-v6-c-tree-view__list--Opacity: 0;
23051
+ --pf-v6-c-tree-view--m-expanded__list--Opacity: 1;
23052
+ --pf-v6-c-tree-view__list--TranslateY: 0;
23053
+ --pf-v6-c-tree-view--m-expanded__list--TranslateY: 0;
21924
23054
  --pf-v6-c-tree-view__list-item__list-item__node-toggle--InsetBlockStart: var(--pf-v6-c-tree-view__node--PaddingBlockStart);
21925
23055
  --pf-v6-c-tree-view__list-item__list-item__node-toggle--InsetInlineStart: var(--pf-v6-c-tree-view__node--PaddingInlineStart);
21926
23056
  --pf-v6-c-tree-view__list-item__list-item__node-toggle--TranslateX: -100%;
@@ -21936,6 +23066,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21936
23066
  --pf-v6-c-tree-view__node-toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
21937
23067
  --pf-v6-c-tree-view__node-toggle--MarginBlockStart: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingBlockStart) * -1);
21938
23068
  --pf-v6-c-tree-view__node-toggle--MarginBlockEnd: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingBlockStart) * -1);
23069
+ --pf-v6-c-tree-view__node-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
23070
+ --pf-v6-c-tree-view__node-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
21939
23071
  --pf-v6-c-tree-view__node-check--MarginInlineEnd: var(--pf-t--global--spacer--sm);
21940
23072
  --pf-v6-c-tree-view__node-count--MarginInlineStart: var(--pf-t--global--spacer--sm);
21941
23073
  --pf-v6-c-tree-view__search--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -22011,6 +23143,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
22011
23143
  --pf-v6-c-tree-view--m-compact--m-no-background__node--nested--PaddingBlockEnd: 0;
22012
23144
  --pf-v6-c-tree-view--m-compact--m-no-background__node--before--InsetBlockStart: calc(var(--pf-v6-c-tree-view--m-compact__node-container--nested--PaddingBlockStart) + var(--pf-v6-c-tree-view--m-compact__node--nested--PaddingBlockStart) + 0.25rem);
22013
23145
  }
23146
+ @media screen and (prefers-reduced-motion: no-preference) {
23147
+ .pf-v6-c-tree-view {
23148
+ --pf-v6-c-tree-view__list--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
23149
+ --pf-v6-c-tree-view__list--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
23150
+ --pf-v6-c-tree-view__list--TranslateY: -.5rem;
23151
+ }
23152
+ }
22014
23153
 
22015
23154
  .pf-v6-c-tree-view.pf-m-compact .pf-v6-c-tree-view__list-item, .pf-v6-c-tree-view.pf-m-guides .pf-v6-c-tree-view__list-item {
22016
23155
  position: relative;
@@ -22126,12 +23265,23 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
22126
23265
  display: inline-block;
22127
23266
  min-width: var(--pf-v6-c-tree-view__node-toggle-icon--MinWidth);
22128
23267
  text-align: center;
23268
+ transition: transform var(--pf-v6-c-tree-view__node-toggle-icon--TransitionDuration) var(--pf-v6-c-tree-view__node-toggle-icon--TransitionTimingFunction);
22129
23269
  transform: rotate(var(--pf-v6-c-tree-view__node-toggle-icon--Rotate));
22130
23270
  }
22131
23271
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-tree-view__node-toggle-icon {
22132
23272
  scale: -1 1;
22133
23273
  }
22134
23274
 
23275
+ .pf-v6-c-tree-view__list-item .pf-v6-c-tree-view__list {
23276
+ max-height: 0;
23277
+ visibility: hidden;
23278
+ opacity: var(--pf-v6-c-tree-view__list--Opacity);
23279
+ transition-delay: 0s, 0s, var(--pf-v6-c-tree-view__list--TransitionDuration--fade), var(--pf-v6-c-tree-view__list--TransitionDuration--fade);
23280
+ transition-timing-function: var(--pf-v6-c-tree-view__list--TransitionTimingFunction);
23281
+ transition-duration: var(--pf-v6-c-tree-view__list--TransitionDuration--fade), var(--pf-v6-c-tree-view__list--TransitionDuration--slide), 0s, 0s;
23282
+ transition-property: opacity, translate, visibility, max-height;
23283
+ translate: 0 var(--pf-v6-c-tree-view__list--TranslateY);
23284
+ }
22135
23285
  .pf-v6-c-tree-view__list-item .pf-v6-c-tree-view__list-item {
22136
23286
  --pf-v6-c-tree-view__node-toggle-icon--Rotate: var(--pf-v6-c-tree-view__node-toggle-icon--base--Rotate);
22137
23287
  --pf-v6-c-tree-view__node-toggle--Color: var(--pf-v6-c-tree-view__node-toggle--Color--base);
@@ -22140,6 +23290,14 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
22140
23290
  --pf-v6-c-tree-view__node-toggle--Color: var(--pf-v6-c-tree-view__list-item--m-expanded__node-toggle--Color);
22141
23291
  --pf-v6-c-tree-view__node-toggle-icon--Rotate: var(--pf-v6-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate);
22142
23292
  }
23293
+ .pf-v6-c-tree-view__list-item.pf-m-expanded > .pf-v6-c-tree-view__list {
23294
+ max-height: 99999px;
23295
+ visibility: revert;
23296
+ opacity: var(--pf-v6-c-tree-view--m-expanded__list--Opacity);
23297
+ transition-delay: 0s;
23298
+ transition-duration: var(--pf-v6-c-tree-view__list--TransitionDuration--expand--fade), var(--pf-v6-c-tree-view__list--TransitionDuration--expand--slide), 0s, 0s;
23299
+ translate: 0 var(--pf-v6-c-tree-view--m-expanded__list--TranslateY);
23300
+ }
22143
23301
 
22144
23302
  .pf-v6-c-tree-view__node,
22145
23303
  .pf-v6-c-tree-view__node-container {
@@ -22161,8 +23319,17 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
22161
23319
  color: var(--pf-v6-c-tree-view__node--Color);
22162
23320
  background-color: var(--pf-v6-c-tree-view__node--BackgroundColor);
22163
23321
  }
23322
+ .pf-v6-c-tree-view__node::after {
23323
+ position: absolute;
23324
+ inset: 0;
23325
+ pointer-events: none;
23326
+ content: "";
23327
+ border: var(--pf-v6-c-tree-view__node--BorderWidth) solid var(--pf-v6-c-tree-view__node--BorderColor);
23328
+ border-radius: var(--pf-v6-c-tree-view__node--BorderRadius);
23329
+ }
22164
23330
  .pf-v6-c-tree-view__node.pf-m-current {
22165
23331
  --pf-v6-c-tree-view__node--Color: var(--pf-v6-c-tree-view__node--m-current--Color);
23332
+ --pf-v6-c-tree-view__node--BorderWidth: var(--pf-v6-c-tree-view__node--m-current--BorderWidth);
22166
23333
  }
22167
23334
  .pf-v6-c-tree-view__node .pf-v6-c-tree-view__node-count {
22168
23335
  margin-inline-start: var(--pf-v6-c-tree-view__node-count--MarginInlineStart);
@@ -22260,6 +23427,7 @@ label.pf-v6-c-tree-view__node-text {
22260
23427
 
22261
23428
  .pf-v6-c-tree-view__content:hover,
22262
23429
  .pf-v6-c-tree-view__content:focus-within {
23430
+ --pf-v6-c-tree-view__node--BorderWidth: var(--pf-v6-c-tree-view__node--hover--BorderWidth);
22263
23431
  background-color: var(--pf-v6-c-tree-view__node--hover--BackgroundColor);
22264
23432
  }
22265
23433
 
@@ -22396,6 +23564,10 @@ label.pf-v6-c-tree-view__node-text {
22396
23564
  --pf-v6-c-wizard__nav-link-main--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
22397
23565
  --pf-v6-c-wizard__nav-link-main--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
22398
23566
  --pf-v6-c-wizard__nav-link-main--BorderRadius: var(--pf-t--global--border--radius--small);
23567
+ --pf-v6-c-wizard__nav-link-main--BorderColor: var(--pf-t--global--border--color--high-contrast);
23568
+ --pf-v6-c-wizard__nav-link-main--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
23569
+ --pf-v6-c-wizard__nav-link--hover__nav-link-main--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
23570
+ --pf-v6-c-wizard__nav-link--m-current__nav-link-main--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
22399
23571
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
22400
23572
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
22401
23573
  --pf-v6-c-wizard__nav-link-toggle--Color: var(--pf-t--global--icon--color--regular);
@@ -22407,15 +23579,20 @@ label.pf-v6-c-tree-view__node-text {
22407
23579
  --pf-v6-c-wizard__nav-link--before--Height: var(--pf-t--global--icon--size--font--xl);
22408
23580
  --pf-v6-c-wizard__nav-link--before--InsetBlockStart: var(--pf-t--global--spacer--sm);
22409
23581
  --pf-v6-c-wizard__nav-link--before--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
23582
+ --pf-v6-c-wizard__nav-link--before--BorderColor: var(--pf-t--global--border--color--high-contrast);
23583
+ --pf-v6-c-wizard__nav-link--before--BorderWidth: var(--pf-t--global--border--width--regular);
22410
23584
  --pf-v6-c-wizard__nav-link--before--BorderRadius: var(--pf-t--global--border--radius--large);
22411
23585
  --pf-v6-c-wizard__nav-link--before--Color: var(--pf-t--global--text--color--regular);
22412
23586
  --pf-v6-c-wizard__nav-link--before--FontSize: var(--pf-t--global--font--size--body--default);
22413
23587
  --pf-v6-c-wizard__nav-link--m-current--before--BackgroundColor: var(--pf-t--global--color--brand--default);
22414
23588
  --pf-v6-c-wizard__nav-link--m-current--before--Color: var(--pf-t--global--text--color--on-brand--default);
23589
+ --pf-v6-c-wizard__nav-link--m-current--before--BorderColor: transparent;
22415
23590
  --pf-v6-c-wizard__nav-link--m-disabled--before--BackgroundColor: transparent;
22416
23591
  --pf-v6-c-wizard__nav-link--m-disabled--before--Color: var(--pf-t--global--text--color--disabled);
23592
+ --pf-v6-c-wizard__nav-link--m-disabled--before--BorderColor: transparent;
22417
23593
  --pf-v6-c-wizard__nav-link-status-icon--Color: var(--pf-t--global--icon--color--regular);
22418
23594
  --pf-v6-c-wizard__nav-link--m-danger__nav-link-status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
23595
+ --pf-v6-c-wizard__nav-link--m-warning__nav-link-status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
22419
23596
  --pf-v6-c-wizard__nav-link--m-success__nav-link-status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
22420
23597
  --pf-v6-c-wizard__nav-link-status-icon--InsetBlockStart: 4px;
22421
23598
  --pf-v6-c-wizard__nav-link-status-icon--FontSize: var(--pf-t--global--icon--size--font--xl);
@@ -22434,6 +23611,7 @@ label.pf-v6-c-tree-view__node-text {
22434
23611
  --pf-v6-c-wizard__nav-link-status-icon--LineHeight: 1;
22435
23612
  --pf-v6-c-wizard__toggle-status-icon--Color: var(--pf-t--global--icon--color--regular);
22436
23613
  --pf-v6-c-wizard__toggle-list-item--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
23614
+ --pf-v6-c-wizard__toggle-list-item--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
22437
23615
  --pf-v6-c-wizard__toggle-list-item--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
22438
23616
  --pf-v6-c-wizard__toggle-status-icon--InsetBlockStart: 2px;
22439
23617
  --pf-v6-c-wizard__toggle-status-icon--FontSize: var(--pf-t--global--icon--size--font--xl);
@@ -22594,6 +23772,9 @@ label.pf-v6-c-tree-view__node-text {
22594
23772
  .pf-v6-c-wizard__toggle-list-item.pf-m-danger {
22595
23773
  --pf-v6-c-wizard__toggle-status-icon--Color: var(--pf-v6-c-wizard__toggle-list-item--m-danger__status-icon--Color);
22596
23774
  }
23775
+ .pf-v6-c-wizard__toggle-list-item.pf-m-warning {
23776
+ --pf-v6-c-wizard__toggle-status-icon--Color: var(--pf-v6-c-wizard__toggle-list-item--m-warning__status-icon--Color);
23777
+ }
22597
23778
  .pf-v6-c-wizard__toggle-list-item.pf-m-success {
22598
23779
  --pf-v6-c-wizard__toggle-status-icon--Color: var(--pf-v6-c-wizard__toggle-list-item--m-success__status-icon--Color);
22599
23780
  }
@@ -22727,6 +23908,7 @@ label.pf-v6-c-tree-view__node-text {
22727
23908
  .pf-v6-c-wizard__toggle-num, .pf-v6-c-wizard__nav-link::before {
22728
23909
  position: relative;
22729
23910
  display: inline-flex;
23911
+ flex-shrink: 0;
22730
23912
  align-items: center;
22731
23913
  justify-content: center;
22732
23914
  width: var(--pf-v6-c-wizard__nav-link--before--Width);
@@ -22741,28 +23923,35 @@ label.pf-v6-c-tree-view__node-text {
22741
23923
  .pf-v6-c-wizard__nav-link::before {
22742
23924
  inset-block-start: var(--pf-v6-c-wizard__nav-link--before--InsetBlockStart);
22743
23925
  content: counter(wizard-nav-count);
23926
+ border: var(--pf-v6-c-wizard__nav-link--before--BorderWidth) solid var(--pf-v6-c-wizard__nav-link--before--BorderColor);
22744
23927
  }
22745
23928
  .pf-v6-c-wizard__nav-link.pf-m-current {
22746
23929
  --pf-v6-c-wizard__nav-link--Color: var(--pf-v6-c-wizard__nav-link--m-current--Color);
22747
23930
  --pf-v6-c-wizard__nav-link-main--BackgroundColor: var(--pf-v6-c-wizard__nav-link--m-current--BackgroundColor);
23931
+ --pf-v6-c-wizard__nav-link-main--BorderWidth: var(--pf-v6-c-wizard__nav-link--m-current__nav-link-main--BorderWidth);
22748
23932
  }
22749
23933
  .pf-v6-c-wizard__toggle-num, .pf-v6-c-wizard__nav-link.pf-m-current::before {
22750
23934
  --pf-v6-c-wizard__nav-link--before--BackgroundColor: var(--pf-v6-c-wizard__nav-link--m-current--before--BackgroundColor);
22751
23935
  --pf-v6-c-wizard__nav-link--before--Color: var(--pf-v6-c-wizard__nav-link--m-current--before--Color);
23936
+ --pf-v6-c-wizard__nav-link--before--BorderColor: var(--pf-v6-c-wizard__nav-link--m-current--before--BorderColor);
22752
23937
  }
22753
23938
 
22754
- .pf-v6-c-wizard__nav-link:is(.pf-m-success, .pf-m-danger)::before {
23939
+ .pf-v6-c-wizard__nav-link:is(.pf-m-success, .pf-m-warning, .pf-m-danger)::before {
22755
23940
  display: none;
22756
23941
  }
22757
23942
  .pf-v6-c-wizard__nav-link.pf-m-success {
22758
23943
  --pf-v6-c-wizard__nav-link-status-icon--Color: var(--pf-v6-c-wizard__nav-link--m-success__nav-link-status-icon--Color);
22759
23944
  }
23945
+ .pf-v6-c-wizard__nav-link.pf-m-warning {
23946
+ --pf-v6-c-wizard__nav-link-status-icon--Color: var(--pf-v6-c-wizard__nav-link--m-warning__nav-link-status-icon--Color);
23947
+ }
22760
23948
  .pf-v6-c-wizard__nav-link.pf-m-danger {
22761
23949
  --pf-v6-c-wizard__nav-link-status-icon--Color: var(--pf-v6-c-wizard__nav-link--m-danger__nav-link-status-icon--Color);
22762
23950
  }
22763
23951
  .pf-v6-c-wizard__nav-link:where(:hover, :focus) {
22764
23952
  --pf-v6-c-wizard__nav-link--Color: var(--pf-v6-c-wizard__nav-link--hover--Color);
22765
23953
  --pf-v6-c-wizard__nav-link-main--BackgroundColor: var(--pf-v6-c-wizard__nav-link--hover--BackgroundColor);
23954
+ --pf-v6-c-wizard__nav-link-main--BorderWidth: var(--pf-v6-c-wizard__nav-link--hover__nav-link-main--BorderWidth);
22766
23955
  }
22767
23956
  .pf-v6-c-wizard__nav-link:disabled, .pf-v6-c-wizard__nav-link.pf-m-disabled {
22768
23957
  --pf-v6-c-wizard__nav-link--Color: var(--pf-v6-c-wizard__nav-link--m-disabled--Color);
@@ -22772,23 +23961,29 @@ label.pf-v6-c-tree-view__node-text {
22772
23961
  .pf-v6-c-wizard__nav-link:disabled::before, .pf-v6-c-wizard__nav-link.pf-m-disabled::before {
22773
23962
  --pf-v6-c-wizard__nav-link--before--BackgroundColor: var(--pf-v6-c-wizard__nav-link--m-disabled--before--BackgroundColor);
22774
23963
  --pf-v6-c-wizard__nav-link--before--Color: var(--pf-v6-c-wizard__nav-link--m-disabled--before--Color);
22775
- }
22776
-
22777
- .pf-v6-c-wizard__nav-link-text {
22778
- flex-grow: 1;
23964
+ --pf-v6-c-wizard__nav-link--before--BorderColor: var(--pf-v6-c-wizard__nav-link--m-disabled--before--BorderColor);
22779
23965
  }
22780
23966
 
22781
23967
  .pf-v6-c-wizard__nav-link-main {
23968
+ position: relative;
22782
23969
  display: flex;
23970
+ flex-grow: 1;
22783
23971
  justify-content: space-between;
22784
23972
  padding-block-start: var(--pf-v6-c-wizard__nav-link-main--PaddingBlockStart);
22785
23973
  padding-block-end: var(--pf-v6-c-wizard__nav-link-main--PaddingBlockEnd);
22786
23974
  padding-inline-start: var(--pf-v6-c-wizard__nav-link-main--PaddingInlineStart);
22787
23975
  padding-inline-end: var(--pf-v6-c-wizard__nav-link-main--PaddingInlineEnd);
22788
23976
  background-color: var(--pf-v6-c-wizard__nav-link-main--BackgroundColor);
22789
- border: none;
22790
23977
  border-radius: var(--pf-v6-c-wizard__nav-link-main--BorderRadius);
22791
23978
  }
23979
+ .pf-v6-c-wizard__nav-link-main::after {
23980
+ position: absolute;
23981
+ inset: 0;
23982
+ pointer-events: none;
23983
+ content: "";
23984
+ border: var(--pf-v6-c-wizard__nav-link-main--BorderWidth) solid var(--pf-v6-c-wizard__nav-link-main--BorderColor);
23985
+ border-radius: inherit;
23986
+ }
22792
23987
 
22793
23988
  .pf-v6-c-wizard__nav-link-status-icon {
22794
23989
  position: relative;