@patternfly/react-styles 6.0.0-prerelease.1 → 6.0.0-prerelease.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (101) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/css/components/AboutModalBox/about-modal-box.css +18 -13
  3. package/css/components/Accordion/accordion.css +4 -3
  4. package/css/components/ActionList/action-list.css +2 -1
  5. package/css/components/Alert/alert-group.css +2 -1
  6. package/css/components/Alert/alert.css +5 -3
  7. package/css/components/Avatar/avatar.css +2 -1
  8. package/css/components/BackToTop/back-to-top.css +4 -2
  9. package/css/components/Backdrop/backdrop.css +2 -1
  10. package/css/components/BackgroundImage/background-image.css +2 -1
  11. package/css/components/Badge/badge.css +2 -1
  12. package/css/components/Banner/banner.css +4 -2
  13. package/css/components/Brand/brand.css +2 -1
  14. package/css/components/Breadcrumb/breadcrumb.css +2 -1
  15. package/css/components/Button/button.css +4 -3
  16. package/css/components/CalendarMonth/calendar-month.css +3 -2
  17. package/css/components/Card/card.css +6 -4
  18. package/css/components/Check/check.css +3 -2
  19. package/css/components/ClipboardCopy/clipboard-copy.css +5 -7
  20. package/css/components/CodeBlock/code-block.css +2 -1
  21. package/css/components/CodeEditor/code-editor.css +3 -2
  22. package/css/components/Content/content.css +2 -1
  23. package/css/components/DataList/data-list.css +6 -3
  24. package/css/components/DatePicker/date-picker.css +2 -1
  25. package/css/components/DescriptionList/description-list.css +20 -13
  26. package/css/components/Divider/divider.css +2 -1
  27. package/css/components/DragDrop/drag-drop.css +4 -2
  28. package/css/components/Drawer/drawer.css +7 -4
  29. package/css/components/DualListSelector/dual-list-selector.css +6 -4
  30. package/css/components/EmptyState/empty-state.css +2 -1
  31. package/css/components/ExpandableSection/expandable-section.css +2 -1
  32. package/css/components/FileUpload/file-upload.css +3 -2
  33. package/css/components/Form/form.css +14 -18
  34. package/css/components/FormControl/form-control.css +4 -3
  35. package/css/components/HelperText/helper-text.css +2 -1
  36. package/css/components/Hint/hint.css +2 -1
  37. package/css/components/Icon/icon.css +2 -1
  38. package/css/components/InlineEdit/inline-edit.css +2 -1
  39. package/css/components/InputGroup/input-group.css +3 -2
  40. package/css/components/JumpLinks/jump-links.css +5 -3
  41. package/css/components/Label/label-group.css +2 -1
  42. package/css/components/Label/label.css +3 -2
  43. package/css/components/List/list.css +2 -1
  44. package/css/components/Login/login.css +18 -9
  45. package/css/components/Masthead/masthead.css +2 -1
  46. package/css/components/Menu/menu.css +6 -5
  47. package/css/components/MenuToggle/menu-toggle.css +2 -1
  48. package/css/components/ModalBox/modal-box.css +4 -2
  49. package/css/components/MultipleFileUpload/multiple-file-upload.css +2 -1
  50. package/css/components/Nav/nav.css +2 -1
  51. package/css/components/NotificationDrawer/notification-drawer.css +2 -1
  52. package/css/components/NumberInput/number-input.css +2 -1
  53. package/css/components/OverflowMenu/overflow-menu.css +2 -1
  54. package/css/components/Page/page.css +7 -4
  55. package/css/components/Pagination/pagination.css +6 -3
  56. package/css/components/Panel/panel.css +2 -1
  57. package/css/components/Popover/popover.css +2 -1
  58. package/css/components/Progress/progress.css +2 -1
  59. package/css/components/ProgressStepper/progress-stepper.css +4 -2
  60. package/css/components/Radio/radio.css +2 -1
  61. package/css/components/Sidebar/sidebar.css +2 -1
  62. package/css/components/SimpleList/simple-list.css +2 -1
  63. package/css/components/Skeleton/skeleton.css +2 -1
  64. package/css/components/SkipToContent/skip-to-content.css +2 -1
  65. package/css/components/Slider/slider.css +2 -1
  66. package/css/components/Spinner/spinner.css +2 -1
  67. package/css/components/Switch/switch.css +2 -1
  68. package/css/components/TabContent/tab-content.css +2 -1
  69. package/css/components/Table/table-grid.css +2 -1
  70. package/css/components/Table/table-scrollable.css +2 -1
  71. package/css/components/Table/table-tree-view.css +2 -1
  72. package/css/components/Table/table.css +44 -42
  73. package/css/components/Table/table.d.ts +5 -5
  74. package/css/components/Table/table.js +5 -5
  75. package/css/components/Table/table.mjs +5 -5
  76. package/css/components/Tabs/tabs.css +2 -1
  77. package/css/components/TextInputGroup/text-input-group.css +2 -1
  78. package/css/components/Tile/tile.css +2 -1
  79. package/css/components/Timestamp/timestamp.css +2 -1
  80. package/css/components/Title/title.css +2 -1
  81. package/css/components/ToggleGroup/toggle-group.css +2 -1
  82. package/css/components/Toolbar/toolbar.css +5 -3
  83. package/css/components/Tooltip/tooltip.css +2 -1
  84. package/css/components/TreeView/tree-view.css +2 -1
  85. package/css/components/Truncate/truncate.css +2 -1
  86. package/css/components/Wizard/wizard.css +7 -4
  87. package/css/components/_index.css +337 -224
  88. package/css/components/_index.d.ts +1 -1
  89. package/css/components/_index.js +1 -1
  90. package/css/components/_index.mjs +1 -1
  91. package/css/layouts/Bullseye/bullseye.css +2 -1
  92. package/css/layouts/Flex/flex.css +2 -1
  93. package/css/layouts/Gallery/gallery.css +2 -1
  94. package/css/layouts/Grid/grid.css +2 -1
  95. package/css/layouts/Level/level.css +2 -1
  96. package/css/layouts/Split/split.css +2 -1
  97. package/css/layouts/Stack/stack.css +2 -1
  98. package/css/layouts/_index.css +14 -7
  99. package/css/utilities/Text/text.css +6 -6
  100. package/css/utilities/_index.css +6 -6
  101. package/package.json +3 -3
@@ -1,8 +1,8 @@
1
1
  @charset "UTF-8";
2
- :where(:root, .pf-v6-c-about-modal-box) {
2
+ :root,
3
+ .pf-v6-c-about-modal-box {
3
4
  --pf-v6-c-about-modal-box--BackgroundImage: none;
4
5
  --pf-v6-c-about-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5
- --pf-v6-c-about-modal-box--BackgroundPosition: bottom right;
6
6
  --pf-v6-c-about-modal-box--BackgroundSize--min-width: 200px;
7
7
  --pf-v6-c-about-modal-box--BackgroundSize--width: 60%;
8
8
  --pf-v6-c-about-modal-box--BackgroundSize--max-width: 600px;
@@ -12,7 +12,6 @@
12
12
  --pf-v6-c-about-modal-box--Width: 100%;
13
13
  --pf-v6-c-about-modal-box--sm--GridTemplateColumns: 5fr 1fr;
14
14
  --pf-v6-c-about-modal-box--lg--GridTemplateColumns: 1fr .6fr;
15
- --pf-v6-c-about-modal-box--BackgroundPosition: bottom right;
16
15
  --pf-v6-c-about-modal-box__brand--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
17
16
  --pf-v6-c-about-modal-box__brand--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
18
17
  --pf-v6-c-about-modal-box__brand--PaddingInlineStart: var(--pf-t--global--spacer--xl);
@@ -46,40 +45,42 @@
46
45
  --pf-v6-c-about-modal-box__content--sm--MarginBlockEnd: var(--pf-t--global--spacer--2xl);
47
46
  --pf-v6-c-about-modal-box__content--sm--MarginInlineStart: var(--pf-t--global--spacer--3xl);
48
47
  }
49
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) :where(:root, .pf-v6-c-about-modal-box) {
50
- --pf-v6-c-about-modal-box--BackgroundPosition: bottom left;
51
- }
52
-
53
48
  @media screen and (min-width: 36rem) {
54
- :where(:root, .pf-v6-c-about-modal-box) {
49
+ :root,
50
+ .pf-v6-c-about-modal-box {
55
51
  --pf-v6-c-about-modal-box__brand--PaddingInlineEnd: var(--pf-v6-c-about-modal-box__brand--sm--PaddingInlineEnd);
56
52
  --pf-v6-c-about-modal-box__brand--PaddingInlineStart: var(--pf-v6-c-about-modal-box__brand--sm--PaddingInlineStart);
57
53
  --pf-v6-c-about-modal-box__brand--PaddingBlockEnd: var(--pf-v6-c-about-modal-box__brand--sm--PaddingBlockEnd);
58
54
  }
59
55
  }
60
56
  @media only screen and (min-width: 36rem) {
61
- :where(:root, .pf-v6-c-about-modal-box) {
57
+ :root,
58
+ .pf-v6-c-about-modal-box {
62
59
  --pf-v6-c-about-modal-box__close--PaddingBlockEnd: var(--pf-v6-c-about-modal-box__close--sm--PaddingBlockEnd);
63
60
  }
64
61
  }
65
62
  @media only screen and (min-width: 62rem) {
66
- :where(:root, .pf-v6-c-about-modal-box) {
63
+ :root,
64
+ .pf-v6-c-about-modal-box {
67
65
  --pf-v6-c-about-modal-box__close--PaddingInlineEnd: var(--pf-v6-c-about-modal-box__close--lg--PaddingInlineEnd);
68
66
  }
69
67
  }
70
68
  @media only screen and (min-width: 36rem) {
71
- :where(:root, .pf-v6-c-about-modal-box) {
69
+ :root,
70
+ .pf-v6-c-about-modal-box {
72
71
  --pf-v6-c-about-modal-box__header--PaddingInlineEnd: var(--pf-v6-c-about-modal-box__header--sm--PaddingInlineEnd);
73
72
  --pf-v6-c-about-modal-box__header--PaddingInlineStart: var(--pf-v6-c-about-modal-box__header--sm--PaddingInlineStart);
74
73
  }
75
74
  }
76
75
  @media only screen and (min-width: 36rem) {
77
- :where(:root, .pf-v6-c-about-modal-box) {
76
+ :root,
77
+ .pf-v6-c-about-modal-box {
78
78
  --pf-v6-c-about-modal-box__strapline--PaddingBlockStart: var(--pf-v6-c-about-modal-box__strapline--sm--PaddingBlockStart);
79
79
  }
80
80
  }
81
81
  @media only screen and (min-width: 36rem) {
82
- :where(:root, .pf-v6-c-about-modal-box) {
82
+ :root,
83
+ .pf-v6-c-about-modal-box {
83
84
  --pf-v6-c-about-modal-box__content--MarginBlockStart: var(--pf-v6-c-about-modal-box__content--sm--MarginBlockStart);
84
85
  --pf-v6-c-about-modal-box__content--MarginInlineEnd: var(--pf-v6-c-about-modal-box__content--sm--MarginInlineEnd);
85
86
  --pf-v6-c-about-modal-box__content--MarginBlockEnd: var(--pf-v6-c-about-modal-box__content--sm--MarginBlockEnd);
@@ -101,6 +102,7 @@
101
102
  background-repeat: no-repeat;
102
103
  background-position: var(--pf-v6-c-about-modal-box--BackgroundPosition);
103
104
  background-size: var(--pf-v6-c-about-modal-box--BackgroundSize);
105
+ --pf-v6-c-about-modal-box--BackgroundPosition: bottom right;
104
106
  }
105
107
  @media only screen and (min-width: 36rem) {
106
108
  .pf-v6-c-about-modal-box {
@@ -116,6 +118,9 @@
116
118
  grid-template-columns: var(--pf-v6-c-about-modal-box--lg--GridTemplateColumns);
117
119
  }
118
120
  }
121
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-about-modal-box {
122
+ --pf-v6-c-about-modal-box--BackgroundPosition: bottom left;
123
+ }
119
124
 
120
125
  .pf-v6-c-about-modal-box__brand {
121
126
  display: flex;
@@ -193,12 +198,13 @@
193
198
  font-size: var(--pf-v6-c-about-modal-box__close--c-button--FontSize);
194
199
  }
195
200
 
196
- :where(:root, .pf-v6-c-accordion) {
201
+ :root,
202
+ .pf-v6-c-accordion {
197
203
  --pf-v6-c-accordion--BackgroundColor: var(--pf-t--global--background--color--primary--default);
198
204
  --pf-v6-c-accordion--RowGap: var(--pf-t--global--spacer--xs);
199
205
  --pf-v6-c-accordion__item--BorderRadius: var(--pf-t--global--border--radius--200);
200
206
  --pf-v6-c-accordion__item--m-expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
201
- --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-t--global--spacer--sm);
207
+ --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
202
208
  --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
203
209
  --pf-v6-c-accordion__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
204
210
  --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -207,7 +213,7 @@
207
213
  --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
208
214
  --pf-v6-c-accordion__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
209
215
  --pf-v6-c-accordion__toggle--BorderRadius: var(--pf-t--global--border--radius--small);
210
- --pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-t--global--spacer--md);
216
+ --pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
211
217
  --pf-v6-c-accordion__toggle-text--Color: var(--pf-t--global--text--color--regular);
212
218
  --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--default);
213
219
  --pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
@@ -345,7 +351,8 @@
345
351
  --pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart);
346
352
  }
347
353
 
348
- :where(:root, .pf-v6-c-action-list) {
354
+ :root,
355
+ .pf-v6-c-action-list {
349
356
  --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
350
357
  --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal);
351
358
  --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default);
@@ -375,7 +382,8 @@
375
382
  column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
376
383
  }
377
384
 
378
- :where(:root, .pf-v6-c-alert) {
385
+ :root,
386
+ .pf-v6-c-alert {
379
387
  --pf-v6-c-alert--BoxShadow: var(--pf-t--global--box-shadow--lg);
380
388
  --pf-v6-c-alert--BackgroundColor: var(--pf-t--global--background--color--floating--default);
381
389
  --pf-v6-c-alert--GridTemplateColumns: max-content 1fr max-content;
@@ -395,7 +403,8 @@
395
403
  --pf-v6-c-alert__toggle--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
396
404
  --pf-v6-c-alert__toggle--MarginInlineEnd: var(--pf-t--global--spacer--sm);
397
405
  --pf-v6-c-alert__toggle-icon--Rotate: 0;
398
- --pf-v6-c-alert__toggle-icon--Transition: var(--pf-t--global--transition);
406
+ --pf-v6-c-alert__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
407
+ --pf-v6-c-alert__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
399
408
  --pf-v6-c-alert__icon--Color: var(--pf-t--global--icon--color--regular);
400
409
  --pf-v6-c-alert__icon--MarginBlockStart: 0.25rem;
401
410
  --pf-v6-c-alert__icon--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
@@ -516,7 +525,7 @@
516
525
 
517
526
  .pf-v6-c-alert__toggle-icon {
518
527
  display: inline-block;
519
- transition: var(--pf-v6-c-alert__toggle-icon--Transition);
528
+ transition: transform var(--pf-v6-c-alert__toggle-icon--TransitionDuration) var(--pf-v6-c-alert__toggle-icon--TransitionTimingFunction);
520
529
  transform: rotate(var(--pf-v6-c-alert__toggle-icon--Rotate));
521
530
  }
522
531
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-alert__toggle-icon {
@@ -573,7 +582,8 @@
573
582
  margin-inline-end: var(--pf-v6-c-alert__action-group__c-button--not-last-child--MarginInlineEnd);
574
583
  }
575
584
 
576
- :where(:root, .pf-v6-c-alert-group) {
585
+ :root,
586
+ .pf-v6-c-alert-group {
577
587
  --pf-v6-c-alert-group__item--MarginBlockStart: var(--pf-t--global--spacer--gap--group--vertical);
578
588
  --pf-v6-c-alert-group--m-toast--InsetBlockStart: var(--pf-t--global--spacer--2xl);
579
589
  --pf-v6-c-alert-group--m-toast--InsetInlineEnd: var(--pf-t--global--spacer--xl);
@@ -687,7 +697,8 @@
687
697
  --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--active--BoxShadow);
688
698
  }
689
699
 
690
- :where(:root, .pf-v6-c-avatar) {
700
+ :root,
701
+ .pf-v6-c-avatar {
691
702
  --pf-v6-c-avatar--BorderColor: transparent;
692
703
  --pf-v6-c-avatar--BorderWidth: 0;
693
704
  --pf-v6-c-avatar--BorderRadius: var(--pf-t--global--border--radius--pill);
@@ -932,7 +943,8 @@
932
943
  }
933
944
  }
934
945
 
935
- :where(:root, .pf-v6-c-backdrop) {
946
+ :root,
947
+ .pf-v6-c-backdrop {
936
948
  --pf-v6-c-backdrop--Position: fixed;
937
949
  --pf-v6-c-backdrop--ZIndex: var(--pf-t--global--z-index--lg);
938
950
  --pf-v6-c-backdrop--BackgroundColor: var(--pf-t--global--background--color--backdrop--default);
@@ -952,7 +964,8 @@
952
964
  overflow: hidden;
953
965
  }
954
966
 
955
- :where(:root, .pf-v6-c-background-image) {
967
+ :root,
968
+ .pf-v6-c-background-image {
956
969
  --pf-v6-c-background-image--BackgroundColor: var(--pf-t--global--background--color--primary--default);
957
970
  --pf-v6-c-background-image--BackgroundImage: none;
958
971
  --pf-v6-c-background-image--BackgroundSize--min-width: 200px;
@@ -979,7 +992,8 @@
979
992
  --pf-v6-c-background-image--BackgroundPosition: bottom left;
980
993
  }
981
994
 
982
- :where(:root, .pf-v6-c-back-to-top) {
995
+ :root,
996
+ .pf-v6-c-back-to-top {
983
997
  --pf-v6-c-back-to-top--InsetInlineEnd: var(--pf-t--global--spacer--2xl);
984
998
  --pf-v6-c-back-to-top--InsetBlockEnd: var(--pf-t--global--spacer--lg);
985
999
  --pf-v6-c-back-to-top--md--InsetBlockEnd: var(--pf-t--global--spacer--2xl);
@@ -991,7 +1005,8 @@
991
1005
  --pf-v6-c-back-to-top--c-button--BoxShadow: var(--pf-t--global--box-shadow--sm);
992
1006
  }
993
1007
  @media (min-width: 48rem) {
994
- :where(:root, .pf-v6-c-back-to-top) {
1008
+ :root,
1009
+ .pf-v6-c-back-to-top {
995
1010
  --pf-v6-c-back-to-top--InsetBlockEnd: var(--pf-v6-c-back-to-top--md--InsetBlockEnd);
996
1011
  }
997
1012
  }
@@ -1013,7 +1028,8 @@
1013
1028
  box-shadow: var(--pf-v6-c-back-to-top--c-button--BoxShadow);
1014
1029
  }
1015
1030
 
1016
- :where(:root, .pf-v6-c-badge) {
1031
+ :root,
1032
+ .pf-v6-c-badge {
1017
1033
  --pf-v6-c-badge--BorderColor: transparent;
1018
1034
  --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
1019
1035
  --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
@@ -1081,7 +1097,8 @@
1081
1097
  color: var(--pf-v6-c-badge__toggle-icon--Color);
1082
1098
  }
1083
1099
 
1084
- :where(:root, .pf-v6-c-banner) {
1100
+ :root,
1101
+ .pf-v6-c-banner {
1085
1102
  --pf-v6-c-banner--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1086
1103
  --pf-v6-c-banner--PaddingInlineEnd: var(--pf-t--global--spacer--md);
1087
1104
  --pf-v6-c-banner--md--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -1125,7 +1142,8 @@
1125
1142
  --pf-v6-c-banner--m-purple--Color: var(--pf-t--global--text--color--nonstatus--on-purple--default);
1126
1143
  }
1127
1144
  @media (min-width: 48rem) {
1128
- :where(:root, .pf-v6-c-banner) {
1145
+ :root,
1146
+ .pf-v6-c-banner {
1129
1147
  --pf-v6-c-banner--PaddingInlineEnd: var(--pf-v6-c-banner--md--PaddingInlineEnd);
1130
1148
  --pf-v6-c-banner--PaddingInlineStart: var(--pf-v6-c-banner--md--PaddingInlineStart);
1131
1149
  }
@@ -1221,7 +1239,8 @@
1221
1239
  cursor: not-allowed;
1222
1240
  }
1223
1241
 
1224
- :where(:root, .pf-v6-c-brand) {
1242
+ :root,
1243
+ .pf-v6-c-brand {
1225
1244
  --pf-v6-c-brand--Width: auto;
1226
1245
  --pf-v6-c-brand--Height: auto;
1227
1246
  }
@@ -1287,7 +1306,8 @@
1287
1306
  max-width: 100%;
1288
1307
  }
1289
1308
 
1290
- :where(:root, .pf-v6-c-breadcrumb) {
1309
+ :root,
1310
+ .pf-v6-c-breadcrumb {
1291
1311
  --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
1292
1312
  --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
1293
1313
  --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -1395,11 +1415,13 @@ button.pf-v6-c-breadcrumb__link {
1395
1415
  display: none;
1396
1416
  }
1397
1417
 
1398
- :where(:root, .pf-v6-c-button) {
1418
+ :root,
1419
+ .pf-v6-c-button {
1399
1420
  --pf-v6-c-button--Display: inline-flex;
1400
1421
  --pf-v6-c-button--AlignItems: baseline;
1401
1422
  --pf-v6-c-button--JustifyContent: center;
1402
1423
  --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
1424
+ --pf-v6-c-button--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--PaddingBlockStart) + var(--pf-v6-c-button--PaddingBlockEnd));
1403
1425
  --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
1404
1426
  --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
1405
1427
  --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
@@ -1508,7 +1530,6 @@ button.pf-v6-c-breadcrumb__link {
1508
1530
  --pf-v6-c-button--m-plain--Color: var(--pf-t--global--icon--color--regular);
1509
1531
  --pf-v6-c-button--m-plain__icon--Color: var(--pf-t--global--text--color--regular);
1510
1532
  --pf-v6-c-button--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
1511
- --pf-v6-c-button--m-plain--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--PaddingBlockStart) + var(--pf-v6-c-button--PaddingBlockEnd));
1512
1533
  --pf-v6-c-button--m-plain--hover--Color: var(--pf-t--global--icon--color--regular);
1513
1534
  --pf-v6-c-button--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
1514
1535
  --pf-v6-c-button--m-plain--m-clicked--Color: var(--pf-t--global--icon--color--regular);
@@ -1636,6 +1657,7 @@ button.pf-v6-c-breadcrumb__link {
1636
1657
  gap: var(--pf-v6-c-button--Gap);
1637
1658
  align-items: var(--pf-v6-c-button--AlignItems);
1638
1659
  justify-content: var(--pf-v6-c-button--JustifyContent);
1660
+ min-width: var(--pf-v6-c-button--MinWidth);
1639
1661
  padding-block-start: var(--pf-v6-c-button--PaddingBlockStart);
1640
1662
  padding-block-end: var(--pf-v6-c-button--PaddingBlockEnd);
1641
1663
  padding-inline-start: var(--pf-v6-c-button--PaddingInlineStart);
@@ -1872,7 +1894,6 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1872
1894
  --pf-v6-c-button--disabled--BackgroundColor: var(--pf-v6-c-button--m-plain--disabled--BackgroundColor);
1873
1895
  --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineEnd);
1874
1896
  --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineStart);
1875
- min-width: var(--pf-v6-c-button--m-plain--MinWidth);
1876
1897
  }
1877
1898
  .pf-v6-c-button.pf-m-plain.pf-m-no-padding {
1878
1899
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--BackgroundColor);
@@ -1982,7 +2003,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1982
2003
  align-items: center;
1983
2004
  }
1984
2005
 
1985
- :where(:root, .pf-v6-c-calendar-month) {
2006
+ :root,
2007
+ .pf-v6-c-calendar-month {
1986
2008
  --pf-v6-c-calendar-month--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1987
2009
  --pf-v6-c-calendar-month--PaddingBlockStart: var(--pf-t--global--spacer--lg);
1988
2010
  --pf-v6-c-calendar-month--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -1990,7 +2012,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1990
2012
  --pf-v6-c-calendar-month--PaddingInlineStart: var(--pf-t--global--spacer--lg);
1991
2013
  --pf-v6-c-calendar-month--FontSize: var(--pf-t--global--font--size--sm);
1992
2014
  --pf-v6-c-calendar-month__header--MarginBlockEnd: var(--pf-t--global--spacer--md);
1993
- --pf-v6-c-calendar-month__header--Gap: var(--pf-t--global--spacer--xs);
2015
+ --pf-v6-c-calendar-month__header--Gap: var(--pf-t--global--spacer--gap--control-to-control--default);
1994
2016
  --pf-v6-c-calendar-month__header-year--Width: 9ch;
1995
2017
  --pf-v6-c-calendar-month__header-nav-control--MarginInlineEnd: 0;
1996
2018
  --pf-v6-c-calendar-month__header-nav-control--MarginInlineStart: 0;
@@ -2187,7 +2209,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2187
2209
  pointer-events: none;
2188
2210
  }
2189
2211
 
2190
- :where(:root, .pf-v6-c-card) {
2212
+ :root,
2213
+ .pf-v6-c-card {
2191
2214
  --pf-v6-c-card--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2192
2215
  --pf-v6-c-card--BorderColor: var(--pf-t--global--border--color--default);
2193
2216
  --pf-v6-c-card--BorderStyle: solid;
@@ -2209,14 +2232,15 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2209
2232
  --pf-v6-c-card__footer--FontSize: var(--pf-t--global--font--size--body--default);
2210
2233
  --pf-v6-c-card__footer--Color: var(--pf-t--global--text--color--subtle);
2211
2234
  --pf-v6-c-card__actions--PaddingInlineStart: var(--pf-t--global--spacer--md);
2212
- --pf-v6-c-card__actions--Gap: var(--pf-t--global--spacer--sm);
2235
+ --pf-v6-c-card__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--default);
2213
2236
  --pf-v6-c-card__actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2214
2237
  --pf-v6-c-card__actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2215
2238
  --pf-v6-c-card__header-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2216
2239
  --pf-v6-c-card__header-toggle--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
2217
2240
  --pf-v6-c-card__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2218
2241
  --pf-v6-c-card__header-toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1);
2219
- --pf-v6-c-card__header-toggle-icon--Transition: var(--pf-t--global--transition);
2242
+ --pf-v6-c-card__header-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
2243
+ --pf-v6-c-card__header-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
2220
2244
  --pf-v6-c-card--m-expanded__header-toggle-icon--Rotate: 90deg;
2221
2245
  --pf-v6-c-card--m-selectable--BorderWidth: var(--pf-v6-c-card--BorderWidth);
2222
2246
  --pf-v6-c-card--m-clickable--m-current--BorderColor: var(--pf-t--global--border--color--clicked);
@@ -2389,7 +2413,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2389
2413
 
2390
2414
  .pf-v6-c-card__header-toggle-icon {
2391
2415
  display: inline-block;
2392
- transition: var(--pf-v6-c-card__header-toggle-icon--Transition);
2416
+ transition: transform var(--pf-v6-c-card__header-toggle-icon--TransitionDuration) var(--pf-v6-c-card__header-toggle-icon--TransitionTimingFunction);
2393
2417
  }
2394
2418
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-card__header-toggle-icon {
2395
2419
  scale: -1 1;
@@ -2520,8 +2544,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2520
2544
  color: var(--pf-v6-c-card__footer--Color);
2521
2545
  }
2522
2546
 
2523
- :where(:root, .pf-v6-c-check) {
2524
- --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
2547
+ :root,
2548
+ .pf-v6-c-check {
2549
+ --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
2525
2550
  --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
2526
2551
  --pf-v6-c-check--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
2527
2552
  --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
@@ -2599,7 +2624,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2599
2624
  color: var(--pf-v6-c-check__label-required--Color);
2600
2625
  }
2601
2626
 
2602
- :where(:root, .pf-v6-c-clipboard-copy) {
2627
+ :root,
2628
+ .pf-v6-c-clipboard-copy {
2603
2629
  --pf-v6-c-clipboard-copy__toggle-icon--Transition: .2s ease-in 0s;
2604
2630
  --pf-v6-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
2605
2631
  --pf-v6-c-clipboard-copy__expandable-content--MarginBlockStart: var(--pf-t--global--spacer--xs);
@@ -2615,12 +2641,12 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2615
2641
  --pf-v6-c-clipboard-copy__expandable-content--BorderColor: var(--pf-t--global--border--color--default);
2616
2642
  --pf-v6-c-clipboard-copy__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
2617
2643
  --pf-v6-c-clipboard-copy__expandable-content--OutlineOffset: var(--pf-t--global--spacer--xs);
2618
- --pf-v6-c-clipboard-copy__group--Gap: var(--pf-t--global--spacer--xs);
2644
+ --pf-v6-c-clipboard-copy__group--Gap: var(--pf-t--global--spacer--gap--control-to-control--default);
2619
2645
  --pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart: var(--pf-t--global--spacer--xs);
2620
2646
  --pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
2621
2647
  --pf-v6-c-clipboard-copy--m-inline--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2622
- --pf-v6-c-clipboard-copy__actions--Gap: var(--pf-t--global--spacer--sm);
2623
- --pf-v6-c-clipboard-copy__actions--MarginInlineStart: var(--pf-t--global--spacer--xs);
2648
+ --pf-v6-c-clipboard-copy__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--plain);
2649
+ --pf-v6-c-clipboard-copy__actions--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--compact);
2624
2650
  --pf-v6-c-clipboard-copy__actions-item--button--Color: var(--pf-t--global--icon--color--subtle);
2625
2651
  --pf-v6-c-clipboard-copy__actions-item--button--hover--Color: var(--pf-t--global--icon--color--regular);
2626
2652
  --pf-v6-c-clipboard-copy__text--m-code--FontFamily: var(--pf-t--global--font--family--mono);
@@ -2645,9 +2671,6 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2645
2671
  display: flex;
2646
2672
  gap: var(--pf-v6-c-clipboard-copy__group--Gap);
2647
2673
  }
2648
- .pf-v6-c-clipboard-copy__group > * + * {
2649
- margin-inline-start: -1px;
2650
- }
2651
2674
 
2652
2675
  .pf-v6-c-clipboard-copy__toggle-icon {
2653
2676
  transition: var(--pf-v6-c-clipboard-copy__toggle-icon--Transition);
@@ -2697,7 +2720,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2697
2720
  --pf-v6-c-button--m-plain--hover__icon--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--hover--Color);
2698
2721
  }
2699
2722
 
2700
- :where(:root, .pf-v6-c-code-block) {
2723
+ :root,
2724
+ .pf-v6-c-code-block {
2701
2725
  --pf-v6-c-code-block--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2702
2726
  --pf-v6-c-code-block--BorderRadius: var(--pf-t--global--border--radius--medium);
2703
2727
  --pf-v6-c-code-block__header--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
@@ -2751,9 +2775,10 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2751
2775
  font-family: var(--pf-v6-c-code-block__code--FontFamily, inherit);
2752
2776
  }
2753
2777
 
2754
- :where(:root, .pf-v6-c-code-editor) {
2778
+ :root,
2779
+ .pf-v6-c-code-editor {
2755
2780
  --pf-v6-c-code-editor__controls--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2756
- --pf-v6-c-code-editor__controls--Gap: var(--pf-t--global--spacer--xs);
2781
+ --pf-v6-c-code-editor__controls--Gap: var(--pf-t--global--spacer--gap--action-to-action--plain);
2757
2782
  --pf-v6-c-code-editor__header--before--BorderBlockEndWidth: var(--pf-t--global--border--width--box--default);
2758
2783
  --pf-v6-c-code-editor__header--before--BorderBlockEndColor: var(--pf-t--global--border--color--default);
2759
2784
  --pf-v6-c-code-editor__header-content--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
@@ -2928,7 +2953,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2928
2953
  margin-inline-start: var(--pf-v6-c-code-editor__tab-icon--text--MarginInlineStart);
2929
2954
  }
2930
2955
 
2931
- :where(:root, .pf-v6-c-content) {
2956
+ :root,
2957
+ .pf-v6-c-content {
2932
2958
  --pf-v6-c-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
2933
2959
  --pf-v6-c-content--LineHeight: var(--pf-t--global--font--line-height--body);
2934
2960
  --pf-v6-c-content--FontSize: var(--pf-t--global--font--size--body--default);
@@ -3604,7 +3630,8 @@ ul) {
3604
3630
  }
3605
3631
  }
3606
3632
 
3607
- :where(:root, .pf-v6-c-data-list) {
3633
+ :root,
3634
+ .pf-v6-c-data-list {
3608
3635
  --pf-v6-c-data-list--FontSize: var( --pf-t--global--font--size--body);
3609
3636
  --pf-v6-c-data-list--LineHeight: var(--pf-t--global--font--line-height--body);
3610
3637
  --pf-v6-c-data-list--BorderBlockStartColor: var(--pf-t--global--border--color--default);
@@ -3714,13 +3741,15 @@ ul) {
3714
3741
  --pf-v6-c-data-list--m-compact__cell--m-icon--cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
3715
3742
  }
3716
3743
  @media screen and (min-width: 36rem) {
3717
- :where(:root, .pf-v6-c-data-list) {
3744
+ :root,
3745
+ .pf-v6-c-data-list {
3718
3746
  --pf-v6-c-data-list--BorderBlockStartColor: var(--pf-v6-c-data-list--sm--BorderBlockStartColor);
3719
3747
  --pf-v6-c-data-list--BorderBlockStartWidth: var(--pf-v6-c-data-list--sm--BorderBlockStartWidth);
3720
3748
  }
3721
3749
  }
3722
3750
  @media screen and (min-width: 36rem) {
3723
- :where(:root, .pf-v6-c-data-list) {
3751
+ :root,
3752
+ .pf-v6-c-data-list {
3724
3753
  --pf-v6-c-data-list__item--BorderBlockEndWidth: var(--pf-v6-c-data-list__item--sm--BorderBlockEndWidth);
3725
3754
  --pf-v6-c-data-list__item--BorderBlockEndColor: var(--pf-v6-c-data-list__item--sm--BorderBlockEndColor);
3726
3755
  }
@@ -4029,19 +4058,20 @@ ul) {
4029
4058
  padding: 0;
4030
4059
  }
4031
4060
 
4032
- :where(:root, .pf-v6-c-description-list) {
4033
- --pf-v6-c-description-list--RowGap: var(--pf-t--global--spacer--lg);
4034
- --pf-v6-c-description-list--ColumnGap: var(--pf-t--global--spacer--lg);
4061
+ :root,
4062
+ .pf-v6-c-description-list {
4063
+ --pf-v6-c-description-list--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical);
4064
+ --pf-v6-c-description-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal);
4035
4065
  --pf-v6-c-description-list--GridTemplateColumns--count: 1;
4036
4066
  --pf-v6-c-description-list--GridTemplateColumns--width: 1fr;
4037
4067
  --pf-v6-c-description-list--GridTemplateColumns--min: 0;
4038
- --pf-v6-c-description-list__group--RowGap: var(--pf-t--global--spacer--sm);
4039
- --pf-v6-c-description-list__group--ColumnGap: var(--pf-t--global--spacer--sm);
4068
+ --pf-v6-c-description-list__group--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
4069
+ --pf-v6-c-description-list__group--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
4040
4070
  --pf-v6-c-description-list__group--GridTemplateColumns: auto;
4041
4071
  --pf-v6-c-description-list__group--GridTemplateRows: auto 1fr;
4042
4072
  --pf-v6-c-description-list__group--GridColumn: auto;
4043
- --pf-v6-c-description-list--m-compact--RowGap: var(--pf-t--global--spacer--md);
4044
- --pf-v6-c-description-list--m-compact--ColumnGap: var(--pf-t--global--spacer--sm);
4073
+ --pf-v6-c-description-list--m-compact--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--compact);
4074
+ --pf-v6-c-description-list--m-compact--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--compact);
4045
4075
  --pf-v6-c-description-list__term--Display: inline;
4046
4076
  --pf-v6-c-description-list__term--sm--Display: flex;
4047
4077
  --pf-v6-c-description-list__term--FontWeight: var(--pf-t--global--font--weight--body--bold);
@@ -4076,32 +4106,38 @@ ul) {
4076
4106
  --pf-v6-c-description-list__term--width: var(--pf-v6-c-description-list--m-horizontal__term--width);
4077
4107
  }
4078
4108
  @media screen and (min-width: 36rem) {
4079
- :where(:root, .pf-v6-c-description-list) {
4109
+ :root,
4110
+ .pf-v6-c-description-list {
4080
4111
  --pf-v6-c-description-list__term--Display: var(--pf-v6-c-description-list__term--sm--Display);
4081
4112
  }
4082
4113
  }
4083
4114
  @media (min-width: 36rem) {
4084
- :where(:root, .pf-v6-c-description-list) {
4115
+ :root,
4116
+ .pf-v6-c-description-list {
4085
4117
  --pf-v6-c-description-list__term--width: var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width));
4086
4118
  }
4087
4119
  }
4088
4120
  @media (min-width: 48rem) {
4089
- :where(:root, .pf-v6-c-description-list) {
4121
+ :root,
4122
+ .pf-v6-c-description-list {
4090
4123
  --pf-v6-c-description-list__term--width: var(--pf-v6-c-description-list--m-horizontal__term--width-on-md, var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width)));
4091
4124
  }
4092
4125
  }
4093
4126
  @media (min-width: 62rem) {
4094
- :where(:root, .pf-v6-c-description-list) {
4127
+ :root,
4128
+ .pf-v6-c-description-list {
4095
4129
  --pf-v6-c-description-list__term--width: var(--pf-v6-c-description-list--m-horizontal__term--width-on-lg, var(--pf-v6-c-description-list--m-horizontal__term--width-on-md, var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width))));
4096
4130
  }
4097
4131
  }
4098
4132
  @media (min-width: 75rem) {
4099
- :where(:root, .pf-v6-c-description-list) {
4133
+ :root,
4134
+ .pf-v6-c-description-list {
4100
4135
  --pf-v6-c-description-list__term--width: var(--pf-v6-c-description-list--m-horizontal__term--width-on-xl, var(--pf-v6-c-description-list--m-horizontal__term--width-on-lg, var(--pf-v6-c-description-list--m-horizontal__term--width-on-md, var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width)))));
4101
4136
  }
4102
4137
  }
4103
4138
  @media (min-width: 90.625rem) {
4104
- :where(:root, .pf-v6-c-description-list) {
4139
+ :root,
4140
+ .pf-v6-c-description-list {
4105
4141
  --pf-v6-c-description-list__term--width: var(--pf-v6-c-description-list--m-horizontal__term--width-on-2xl, var(--pf-v6-c-description-list--m-horizontal__term--width-on-xl, var(--pf-v6-c-description-list--m-horizontal__term--width-on-lg, var(--pf-v6-c-description-list--m-horizontal__term--width-on-md, var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width))))));
4106
4142
  }
4107
4143
  }
@@ -4349,7 +4385,8 @@ ul) {
4349
4385
  }
4350
4386
  }
4351
4387
 
4352
- :where(:root, .pf-v6-c-draggable) {
4388
+ :root,
4389
+ .pf-v6-c-draggable {
4353
4390
  --pf-v6-c-draggable--Cursor: auto;
4354
4391
  --pf-v6-c-draggable--m-dragging--Cursor: grabbing;
4355
4392
  --pf-v6-c-draggable--m-dragging--BoxShadow: var(--pf-t--global--box-shadow--md);
@@ -4385,7 +4422,8 @@ ul) {
4385
4422
  --pf-v6-c-draggable--m-dragging--after--BorderColor: var(--pf-v6-c-draggable--m-drag-outside--after--BorderColor);
4386
4423
  }
4387
4424
 
4388
- :where(:root, .pf-v6-c-droppable) {
4425
+ :root,
4426
+ .pf-v6-c-droppable {
4389
4427
  --pf-v6-c-droppable--before--BackgroundColor: transparent;
4390
4428
  --pf-v6-c-droppable--before--Opacity: 0;
4391
4429
  --pf-v6-c-droppable--after--BorderWidth: 0;
@@ -4426,7 +4464,8 @@ ul) {
4426
4464
  --pf-v6-c-droppable--m-dragging--after--BorderColor: var(--pf-v6-c-droppable--m-drag-outside--after--BorderColor);
4427
4465
  }
4428
4466
 
4429
- :where(:root, .pf-v6-c-dual-list-selector) {
4467
+ :root,
4468
+ .pf-v6-c-dual-list-selector {
4430
4469
  --pf-v6-c-dual-list-selector__header--GridArea: pane-header;
4431
4470
  --pf-v6-c-dual-list-selector__tools--GridArea: pane-tools;
4432
4471
  --pf-v6-c-dual-list-selector__status--GridArea: pane-status;
@@ -4471,7 +4510,7 @@ ul) {
4471
4510
  --pf-v6-c-dual-list-selector__status-text--Color: var(--pf-t--global--text--color--subtle);
4472
4511
  --pf-v6-c-dual-list-selector__controls--PaddingInlineEnd: var(--pf-t--global--spacer--md);
4473
4512
  --pf-v6-c-dual-list-selector__controls--PaddingInlineStart: var(--pf-t--global--spacer--md);
4474
- --pf-v6-c-dual-list-selector__controls--Gap: var(--pf-t--global--spacer--sm);
4513
+ --pf-v6-c-dual-list-selector__controls--Gap: var(--pf-t--global--spacer--gap--action-to-action--plain);
4475
4514
  --pf-v6-c-dual-list-selector__controls--MarginBlockStart: var(--pf-t--global--spacer--md);
4476
4515
  --pf-v6-c-dual-list-selector__item-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
4477
4516
  --pf-v6-c-dual-list-selector__list__list__item-toggle--InsetInlineStart: 0;
@@ -4481,7 +4520,8 @@ ul) {
4481
4520
  --pf-v6-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
4482
4521
  --pf-v6-c-dual-list-selector__item-toggle-icon--Rotate: 0;
4483
4522
  --pf-v6-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
4484
- --pf-v6-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-t--global--transition);
4523
+ --pf-v6-c-dual-list-selector__item-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
4524
+ --pf-v6-c-dual-list-selector__item-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
4485
4525
  --pf-v6-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-v6-c-dual-list-selector__list-item-row--FontSize);
4486
4526
  --pf-v6-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
4487
4527
  }
@@ -4704,7 +4744,7 @@ ul) {
4704
4744
  min-width: var(--pf-v6-c-dual-list-selector__item-toggle-icon--MinWidth);
4705
4745
  color: var(--pf-v6-c-dual-list-selector__item-toggle-icon--Color, inherit);
4706
4746
  text-align: center;
4707
- transition: var(--pf-v6-c-dual-list-selector__item-toggle-icon--Transition);
4747
+ transition: transform var(--pf-v6-c-dual-list-selector__item-toggle-icon--TransitionDuration) var(--pf-v6-c-dual-list-selector__item-toggle-icon--TransitionTimingFunction);
4708
4748
  transform: rotate(var(--pf-v6-c-dual-list-selector__item-toggle-icon--Rotate));
4709
4749
  }
4710
4750
 
@@ -4749,7 +4789,8 @@ ul) {
4749
4789
  --pf-v6-c-dual-list-selector__list__list__item-toggle--InsetInlineStart: var(--pf-v6-c-dual-list-selector__item--PaddingInlineStart);
4750
4790
  }
4751
4791
 
4752
- :where(:root, .pf-v6-c-date-picker) {
4792
+ :root,
4793
+ .pf-v6-c-date-picker {
4753
4794
  --pf-v6-c-date-picker--m-top__calendar--InsetBlockStart: 0;
4754
4795
  --pf-v6-c-date-picker--m-top__calendar--TranslateY: calc(-100% - var(--pf-t--global--spacer--xs));
4755
4796
  --pf-v6-c-date-picker__helper-text--MarginBlockStart: var(--pf-t--global--spacer--sm);
@@ -4807,7 +4848,8 @@ ul) {
4807
4848
  min-width: min-content;
4808
4849
  }
4809
4850
 
4810
- :where(:root, .pf-v6-c-divider) {
4851
+ :root,
4852
+ .pf-v6-c-divider {
4811
4853
  --pf-v6-c-divider--Display: flex;
4812
4854
  --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
4813
4855
  --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
@@ -5112,7 +5154,8 @@ ul) {
5112
5154
  }
5113
5155
  }
5114
5156
 
5115
- :where(:root, .pf-v6-c-drawer) {
5157
+ :root,
5158
+ .pf-v6-c-drawer {
5116
5159
  --pf-v6-c-drawer__section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
5117
5160
  --pf-v6-c-drawer__section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
5118
5161
  --pf-v6-c-drawer__content--FlexBasis: 100%;
@@ -5145,7 +5188,7 @@ ul) {
5145
5188
  --pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--FlexDirection: column;
5146
5189
  --pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--md--FlexBasis--min: 1.5rem;
5147
5190
  --pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--MinHeight: 1.5rem;
5148
- --pf-v6-c-drawer__head--ColumnGap: var(--pf-t--global--spacer--sm);
5191
+ --pf-v6-c-drawer__head--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
5149
5192
  --pf-v6-c-drawer__head--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5150
5193
  --pf-v6-c-drawer__head--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
5151
5194
  --pf-v6-c-drawer__head--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -5220,10 +5263,12 @@ ul) {
5220
5263
  --pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart: var(--pf-v6-c-drawer__panel--after--Width);
5221
5264
  }
5222
5265
  @media screen and (min-width: 75rem) {
5223
- :where(:root, .pf-v6-c-drawer) {
5266
+ :root,
5267
+ .pf-v6-c-drawer {
5224
5268
  --pf-v6-c-drawer__panel--MinWidth: var(--pf-v6-c-drawer__panel--xl--MinWidth);
5225
5269
  }
5226
- :where(:root, .pf-v6-c-drawer).pf-m-panel-bottom {
5270
+ :root.pf-m-panel-bottom,
5271
+ .pf-v6-c-drawer.pf-m-panel-bottom {
5227
5272
  --pf-v6-c-drawer__panel--MinWidth: auto;
5228
5273
  --pf-v6-c-drawer__panel--MinHeight: var(--pf-v6-c-drawer--m-panel-bottom__panel--xl--MinHeight);
5229
5274
  }
@@ -5950,7 +5995,8 @@ ul) {
5950
5995
  display: none;
5951
5996
  }
5952
5997
  }
5953
- :where(:root, .pf-v6-c-empty-state) {
5998
+ :root,
5999
+ .pf-v6-c-empty-state {
5954
6000
  --pf-v6-c-empty-state--PaddingBlockStart: var(--pf-t--global--spacer--xl);
5955
6001
  --pf-v6-c-empty-state--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
5956
6002
  --pf-v6-c-empty-state--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
@@ -6089,7 +6135,8 @@ ul) {
6089
6135
  justify-content: center;
6090
6136
  }
6091
6137
 
6092
- :where(:root, .pf-v6-c-expandable-section) {
6138
+ :root,
6139
+ .pf-v6-c-expandable-section {
6093
6140
  --pf-v6-c-expandable-section--Gap: var(--pf-t--global--spacer--sm);
6094
6141
  --pf-v6-c-expandable-section__toggle-icon--MinWidth: 1em;
6095
6142
  --pf-v6-c-expandable-section__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
@@ -6170,8 +6217,9 @@ ul) {
6170
6217
  padding-inline-start: var(--pf-v6-c-expandable-section__content--PaddingInlineStart, 0);
6171
6218
  }
6172
6219
 
6173
- :where(:root, .pf-v6-c-file-upload) {
6174
- --pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--sm);
6220
+ :root,
6221
+ .pf-v6-c-file-upload {
6222
+ --pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
6175
6223
  --pf-v6-c-file-upload--PaddingBlockStart: var(--pf-t--global--spacer--sm);
6176
6224
  --pf-v6-c-file-upload--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
6177
6225
  --pf-v6-c-file-upload--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -6227,12 +6275,13 @@ ul) {
6227
6275
  transform: translate(-50%, -50%);
6228
6276
  }
6229
6277
 
6230
- :where(:root, .pf-v6-c-form) {
6231
- --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--lg);
6232
- --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--sm);
6278
+ :root,
6279
+ .pf-v6-c-form {
6280
+ --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--gap--group-to-group--vertical);
6281
+ --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--gap--group--vertical);
6233
6282
  --pf-v6-c-form__group--m-action--MarginBlockStart: var(--pf-t--global--spacer--xl);
6234
6283
  --pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth: 9.375rem;
6235
- --pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap: var(--pf-t--global--spacer--md);
6284
+ --pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
6236
6285
  --pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth: 1fr;
6237
6286
  --pf-v6-c-form--m-limit-width--MaxWidth: 55rem;
6238
6287
  --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: calc((((((var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body)) + (2 * var(--pf-t--global--border--width--control--default))) - var(--pf-t--global--font--size--body--default)) / 2) + var(--pf-t--global--font--size--body--default)) - ((((var(--pf-t--global--font--size--body--sm) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--sm)) / 2) + var(--pf-t--global--font--size--body--sm)) + var(--pf-t--global--border--width--control--default));
@@ -6249,13 +6298,12 @@ ul) {
6249
6298
  --pf-v6-c-form__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
6250
6299
  --pf-v6-c-form__label-required--Color: var(--pf-t--global--color--status--danger--default);
6251
6300
  --pf-v6-c-form__group-label-help--FontSize: var(--pf-t--global--font--size--body--sm);
6252
- --pf-v6-c-form__group-label--m-info--Gap: var(--pf-t--global--spacer--sm);
6301
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--horizontal);
6253
6302
  --pf-v6-c-form__group-label-info--FontSize: var(--pf-t--global--font--size--body--sm);
6254
- --pf-v6-c-form--m-horizontal__group-label--m-info--Gap: var(--pf-t--global--spacer--sm);
6255
- --pf-v6-c-form__group-control--m-inline--child--MarginInlineEnd: var(--pf-t--global--spacer--lg);
6303
+ --pf-v6-c-form--m-horizontal__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--group--vertical);
6304
+ --pf-v6-c-form__group-control--m-inline--Gap: var(--pf-t--global--spacer--gap--group--horizontal);
6256
6305
  --pf-v6-c-form__group-control__helper-text--MarginBlockEnd: var(--pf-t--global--spacer--xs);
6257
- --pf-v6-c-form__group-control--Gap: var(--pf-t--global--spacer--sm);
6258
- --pf-v6-c-form__group-control--m-stack--Gap: var(--pf-t--global--spacer--sm);
6306
+ --pf-v6-c-form__group-control--m-stack--Gap: var(--pf-t--global--spacer--gap--group--vertical);
6259
6307
  --pf-v6-c-form__group-control--m-stack__helper-text--MarginBlockStart: calc(var(--pf-v6-c-form__group-control--m-stack--Gap) * -1 + var(--pf-v6-c-form__helper-text--MarginBlockStart--base));
6260
6308
  --pf-v6-c-form__actions--child--MarginBlockStart: var(--pf-t--global--spacer--sm);
6261
6309
  --pf-v6-c-form__actions--child--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -6268,7 +6316,7 @@ ul) {
6268
6316
  --pf-v6-c-form__helper-text--MarginBlockStart--base: var(--pf-t--global--spacer--xs);
6269
6317
  --pf-v6-c-form__helper-text--MarginBlockStart: var(--pf-v6-c-form__helper-text--MarginBlockStart--base);
6270
6318
  --pf-v6-c-form__section--MarginBlockStart: var(--pf-t--global--spacer--xl);
6271
- --pf-v6-c-form__section--Gap: var(--pf-t--global--spacer--md);
6319
+ --pf-v6-c-form__section--Gap: var(--pf-v6-c-form--GridGap);
6272
6320
  --pf-v6-c-form__section-title--FontSize: var(--pf-t--global--font--size--heading--xs);
6273
6321
  --pf-v6-c-form__section-title--FontWeight: var(--pf-t--global--font--weight--heading--default);
6274
6322
  --pf-v6-c-form__section-title--MarginBlockEnd: calc(var(--pf-t--global--spacer--sm) * -1);
@@ -6286,7 +6334,8 @@ ul) {
6286
6334
  --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);
6287
6335
  --pf-v6-c-form__field-group-toggle-button--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
6288
6336
  --pf-v6-c-form__field-group-toggle-button--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
6289
- --pf-v6-c-form__field-group-toggle-icon--Transition: var(--pf-t--global--transition);
6337
+ --pf-v6-c-form__field-group-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
6338
+ --pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
6290
6339
  --pf-v6-c-form__field-group-toggle-icon--MinWidth: var(--pf-t--global--font--size--body--default);
6291
6340
  --pf-v6-c-form__field-group-toggle-icon--Rotate: 0;
6292
6341
  --pf-v6-c-form__field-group--m-expanded__toggle-icon--Rotate: 90deg;
@@ -6595,12 +6644,7 @@ ul) {
6595
6644
  .pf-v6-c-form__group-control.pf-m-inline {
6596
6645
  display: flex;
6597
6646
  flex-flow: row wrap;
6598
- }
6599
- .pf-v6-c-form__group-control.pf-m-inline > * {
6600
- margin-inline-end: var(--pf-v6-c-form__group-control--m-inline--child--MarginInlineEnd);
6601
- }
6602
- .pf-v6-c-form__group-control.pf-m-inline > :last-child {
6603
- --pf-v6-c-form__group-control--m-inline--child--MarginInlineEnd: 0;
6647
+ gap: var(--pf-v6-c-form__group-control--m-inline--Gap);
6604
6648
  }
6605
6649
  .pf-v6-c-form__group-control.pf-m-stack {
6606
6650
  --pf-v6-c-form__helper-text--MarginBlockStart: var(--pf-v6-c-form__group-control--m-stack__helper-text--MarginBlockStart);
@@ -6691,7 +6735,7 @@ ul) {
6691
6735
  display: inline-block;
6692
6736
  min-width: var(--pf-v6-c-form__field-group-toggle-icon--MinWidth);
6693
6737
  text-align: center;
6694
- transition: var(--pf-v6-c-form__field-group-toggle-icon--Transition);
6738
+ transition: transform var(--pf-v6-c-form__field-group-toggle-icon--TransitionDuration) var(--pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction);
6695
6739
  transform: rotate(var(--pf-v6-c-form__field-group-toggle-icon--Rotate));
6696
6740
  }
6697
6741
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-form__field-group-toggle-icon {
@@ -6746,8 +6790,9 @@ ul) {
6746
6790
  margin-block-end: var(--pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd);
6747
6791
  }
6748
6792
 
6749
- :where(:root, .pf-v6-c-form-control) {
6750
- --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--sm);
6793
+ :root,
6794
+ .pf-v6-c-form-control {
6795
+ --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
6751
6796
  --pf-v6-c-form-control--Color: var(--pf-t--global--text--color--regular);
6752
6797
  --pf-v6-c-form-control--FontSize: var(--pf-t--global--font--size--body--default);
6753
6798
  --pf-v6-c-form-control--LineHeight: var(--pf-t--global--font--line-height--body);
@@ -6812,7 +6857,7 @@ ul) {
6812
6857
  --pf-v6-c-form-control--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
6813
6858
  --pf-v6-c-form-control--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
6814
6859
  --pf-v6-c-form-control--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
6815
- --pf-v6-c-form-control__utilities--Gap: var(--pf-t--global--spacer--sm);
6860
+ --pf-v6-c-form-control__utilities--Gap: var(--pf-t--global--spacer--gap--group--horizontal);
6816
6861
  --pf-v6-c-form-control__utilities--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
6817
6862
  --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
6818
6863
  --pf-v6-c-form-control__toggle-icon--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
@@ -7014,7 +7059,8 @@ select ~ .pf-v6-c-form-control__utilities {
7014
7059
  --pf-v6-c-form-control__utilities--PaddingInlineEnd: 0;
7015
7060
  }
7016
7061
 
7017
- :where(:root, .pf-v6-c-hint) {
7062
+ :root,
7063
+ .pf-v6-c-hint {
7018
7064
  --pf-v6-c-hint--GridRowGap: var(--pf-t--global--spacer--sm);
7019
7065
  --pf-v6-c-hint--PaddingBlockStart: var(--pf-t--global--spacer--lg);
7020
7066
  --pf-v6-c-hint--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -7089,7 +7135,8 @@ select ~ .pf-v6-c-form-control__utilities {
7089
7135
  margin-inline-end: var(--pf-v6-c-hint__footer--child--MarginInlineEnd);
7090
7136
  }
7091
7137
 
7092
- :where(:root, .pf-v6-c-helper-text) {
7138
+ :root,
7139
+ .pf-v6-c-helper-text {
7093
7140
  --pf-v6-c-helper-text--Gap: var(--pf-t--global--spacer--xs);
7094
7141
  --pf-v6-c-helper-text--FontSize: var(--pf-t--global--font--size--body--sm);
7095
7142
  --pf-v6-c-helper-text__item-icon--Color: var(--pf-t--global--icon--color--regular);
@@ -7161,7 +7208,8 @@ select ~ .pf-v6-c-form-control__utilities {
7161
7208
  color: var(--pf-v6-c-helper-text__item-text--Color);
7162
7209
  }
7163
7210
 
7164
- :where(:root, .pf-v6-c-icon) {
7211
+ :root,
7212
+ .pf-v6-c-icon {
7165
7213
  --pf-v6-c-icon--Width: var(--pf-t--global--icon--size--font--body--default);
7166
7214
  --pf-v6-c-icon--Height: var(--pf-t--global--icon--size--font--body--default);
7167
7215
  --pf-v6-c-icon--m-sm--Width: var(--pf-t--global--icon--size--sm);
@@ -7417,7 +7465,8 @@ select ~ .pf-v6-c-form-control__utilities {
7417
7465
  transform: translateY(calc(-50% - 0.5 * var(--pf-v6-c-icon__content--svg--VerticalAlign)));
7418
7466
  }
7419
7467
 
7420
- :where(:root, .pf-v6-c-inline-edit) {
7468
+ :root,
7469
+ .pf-v6-c-inline-edit {
7421
7470
  --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
7422
7471
  --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
7423
7472
  --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
@@ -7500,8 +7549,9 @@ select ~ .pf-v6-c-form-control__utilities {
7500
7549
  display: none;
7501
7550
  }
7502
7551
 
7503
- :where(:root, .pf-v6-c-input-group) {
7504
- --pf-v6-c-input-group--Gap: var(--pf-t--global--spacer--xs);
7552
+ :root,
7553
+ .pf-v6-c-input-group {
7554
+ --pf-v6-c-input-group--Gap: var(--pf-t--global--spacer--gap--control-to-control--default);
7505
7555
  --pf-v6-c-input-group__item--offset: var(--pf-t--global--border--width--control--default);
7506
7556
  --pf-v6-c-input-group__item--BorderWidth--base: var(--pf-t--global--border--width--control--default);
7507
7557
  --pf-v6-c-input-group__item--BorderColor--base: var(--pf-t--global--border--color--default);
@@ -7573,7 +7623,8 @@ label.pf-v6-c-input-group__text {
7573
7623
  cursor: pointer;
7574
7624
  }
7575
7625
 
7576
- :where(:root, .pf-v6-c-jump-links) {
7626
+ :root,
7627
+ .pf-v6-c-jump-links {
7577
7628
  --pf-v6-c-jump-links__list--Display: flex;
7578
7629
  --pf-v6-c-jump-links__list--PaddingBlockStart: 0;
7579
7630
  --pf-v6-c-jump-links__list--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -7620,7 +7671,8 @@ label.pf-v6-c-input-group__text {
7620
7671
  --pf-v6-c-jump-links--m-expanded__toggle--MarginBlockEnd: var(--pf-t--global--spacer--sm);
7621
7672
  --pf-v6-c-jump-links__toggle--Display: none;
7622
7673
  --pf-v6-c-jump-links__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
7623
- --pf-v6-c-jump-links__toggle-icon--Transition: var(--pf-t--global--transition);
7674
+ --pf-v6-c-jump-links__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
7675
+ --pf-v6-c-jump-links__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
7624
7676
  --pf-v6-c-jump-links__toggle-icon--Rotate: 0;
7625
7677
  --pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
7626
7678
  }
@@ -7811,14 +7863,15 @@ label.pf-v6-c-input-group__text {
7811
7863
  .pf-v6-c-jump-links__toggle-icon {
7812
7864
  display: inline-block;
7813
7865
  color: var(--pf-v6-c-jump-links__toggle-icon--Color);
7814
- transition: var(--pf-v6-c-jump-links__toggle-icon--Transition);
7866
+ transition: transform var(--pf-v6-c-jump-links__toggle-icon--TransitionDuration) var(--pf-v6-c-jump-links__toggle-icon--TransitionTimingFunction);
7815
7867
  transform: rotate(var(--pf-v6-c-jump-links__toggle-icon--Rotate));
7816
7868
  }
7817
7869
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-jump-links__toggle-icon {
7818
7870
  scale: -1 1;
7819
7871
  }
7820
7872
 
7821
- :where(:root, .pf-v6-c-label) {
7873
+ :root,
7874
+ .pf-v6-c-label {
7822
7875
  --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
7823
7876
  --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7824
7877
  --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
@@ -7981,7 +8034,7 @@ label.pf-v6-c-input-group__text {
7981
8034
  --pf-v6-c-label--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
7982
8035
  --pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset: 0.0625rem;
7983
8036
  --pf-v6-c-label__content--MaxWidth: 100%;
7984
- --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--xs);
8037
+ --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
7985
8038
  --pf-v6-c-label__content--Cursor: initial;
7986
8039
  --pf-v6-c-label__icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
7987
8040
  --pf-v6-c-label__text--MaxWidth: 100%;
@@ -8312,7 +8365,8 @@ input.pf-v6-c-label__content {
8312
8365
  outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
8313
8366
  }
8314
8367
 
8315
- :where(:root, .pf-v6-c-label-group) {
8368
+ :root,
8369
+ .pf-v6-c-label-group {
8316
8370
  --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
8317
8371
  --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
8318
8372
  --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
@@ -8447,7 +8501,8 @@ input.pf-v6-c-label__content {
8447
8501
  display: none;
8448
8502
  }
8449
8503
 
8450
- :where(:root, .pf-v6-c-list) {
8504
+ :root,
8505
+ .pf-v6-c-list {
8451
8506
  --pf-v6-c-list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
8452
8507
  --pf-v6-c-list--ul--ListStyle: var(--pf-t--global--list-style);
8453
8508
  --pf-v6-c-list--Gap: var(--pf-t--global--spacer--sm);
@@ -8518,7 +8573,8 @@ ul.pf-v6-c-list {
8518
8573
  color: var(--pf-v6-c-list__item-icon--Color);
8519
8574
  }
8520
8575
 
8521
- :where(:root, .pf-v6-c-login) {
8576
+ :root,
8577
+ .pf-v6-c-login {
8522
8578
  --pf-v6-c-login--PaddingBlockStart: var(--pf-t--global--spacer--lg);
8523
8579
  --pf-v6-c-login--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
8524
8580
  --pf-v6-c-login__container--xl--GridColumnGap: var(--pf-t--global--spacer--3xl);
@@ -8574,48 +8630,56 @@ ul.pf-v6-c-list {
8574
8630
  --pf-v6-c-login__footer--c-list--xl--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
8575
8631
  }
8576
8632
  @media (min-width: 75rem) {
8577
- :where(:root, .pf-v6-c-login) {
8633
+ :root,
8634
+ .pf-v6-c-login {
8578
8635
  --pf-v6-c-login__container--MaxWidth: var(--pf-v6-c-login__container--xl--MaxWidth);
8579
8636
  }
8580
8637
  }
8581
8638
  @media (min-width: 36rem) {
8582
- :where(:root, .pf-v6-c-login) {
8639
+ :root,
8640
+ .pf-v6-c-login {
8583
8641
  --pf-v6-c-login__header--PaddingInlineEnd: 0;
8584
8642
  --pf-v6-c-login__header--PaddingInlineStart: 0;
8585
8643
  }
8586
8644
  }
8587
8645
  @media (min-width: 75rem) {
8588
- :where(:root, .pf-v6-c-login) {
8646
+ :root,
8647
+ .pf-v6-c-login {
8589
8648
  --pf-v6-c-login__header--MarginBlockEnd: var(--pf-v6-c-login__header--xl--MarginBlockEnd);
8590
8649
  --pf-v6-c-login__header--c-brand--MarginBlockEnd: var(--pf-v6-c-login__header--c-brand--xl--MarginBlockEnd);
8591
8650
  }
8592
8651
  }
8593
8652
  @media (min-width: 75rem) {
8594
- :where(:root, .pf-v6-c-login) {
8653
+ :root,
8654
+ .pf-v6-c-login {
8595
8655
  --pf-v6-c-login__main--MarginBlockEnd: 0;
8596
8656
  }
8597
8657
  }
8598
8658
  @media (min-width: 48rem) {
8599
- :where(:root, .pf-v6-c-login) {
8659
+ :root,
8660
+ .pf-v6-c-login {
8600
8661
  --pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-v6-c-login__main-header--md--PaddingInlineEnd);
8601
8662
  --pf-v6-c-login__main-header--PaddingInlineStart: var(--pf-v6-c-login__main-header--md--PaddingInlineStart);
8602
8663
  --pf-v6-c-login__main-header-desc--MarginBlockEnd: var(--pf-v6-c-login__main-header-desc--md--MarginBlockEnd);
8603
8664
  }
8604
8665
  }
8605
8666
  @media (min-width: 48rem) {
8606
- :where(:root, .pf-v6-c-login) {
8667
+ :root,
8668
+ .pf-v6-c-login {
8607
8669
  --pf-v6-c-login__main-body--PaddingInlineEnd: var(--pf-v6-c-login__main-body--md--PaddingInlineEnd);
8608
8670
  --pf-v6-c-login__main-body--PaddingInlineStart: var(--pf-v6-c-login__main-body--md--PaddingInlineStart);
8609
8671
  }
8610
8672
  }
8611
8673
  @media (min-width: 36rem) {
8612
- :where(:root, .pf-v6-c-login) {
8674
+ :root,
8675
+ .pf-v6-c-login {
8613
8676
  --pf-v6-c-login__footer--PaddingInlineEnd: 0;
8614
8677
  --pf-v6-c-login__footer--PaddingInlineStart: 0;
8615
8678
  }
8616
8679
  }
8617
8680
  @media (min-width: 75rem) {
8618
- :where(:root, .pf-v6-c-login) {
8681
+ :root,
8682
+ .pf-v6-c-login {
8619
8683
  --pf-v6-c-login__footer--c-list--PaddingBlockStart: var(--pf-v6-c-login__footer--c-list--xl--PaddingBlockStart);
8620
8684
  }
8621
8685
  }
@@ -8770,7 +8834,8 @@ ul.pf-v6-c-list {
8770
8834
  padding-block-start: var(--pf-v6-c-login__footer--c-list--PaddingBlockStart);
8771
8835
  }
8772
8836
 
8773
- :where(:root, .pf-v6-c-masthead) {
8837
+ :root,
8838
+ .pf-v6-c-masthead {
8774
8839
  --pf-v6-c-masthead--RowGap: var(--pf-t--global--spacer--sm);
8775
8840
  --pf-v6-c-masthead--ColumnGap: var(--pf-t--global--spacer--gutter--default);
8776
8841
  --pf-v6-c-masthead--BorderWidth: var(--pf-t--global--border--width--divider--default);
@@ -9305,7 +9370,8 @@ ul.pf-v6-c-list {
9305
9370
  padding-inline-end: var(--pf-t--global--spacer--2xl);
9306
9371
  }
9307
9372
 
9308
- :where(:root, .pf-v6-c-menu) {
9373
+ :root,
9374
+ .pf-v6-c-menu {
9309
9375
  --pf-v6-c-menu--RowGap: var(--pf-t--global--spacer--sm);
9310
9376
  --pf-v6-c-menu--Width: auto;
9311
9377
  --pf-v6-c-menu--MinWidth: auto;
@@ -9391,13 +9457,13 @@ ul.pf-v6-c-list {
9391
9457
  --pf-v6-c-menu--m-flyout__menu--InsetInlineStart: calc(100% + var(--pf-v6-c-menu--m-flyout__menu--left-offset));
9392
9458
  --pf-v6-c-menu--m-flyout__menu--m-top--InsetBlockEnd: calc(var(--pf-v6-c-menu__list--PaddingBlockStart) * -1);
9393
9459
  --pf-v6-c-menu--m-flyout__menu--m-left--InsetInlineEnd: calc(100% + var(--pf-v6-c-menu--m-flyout__menu--m-left--right-offset));
9394
- --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--transition--duration);
9395
- --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--transition--duration);
9460
+ --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--motion--duration--slide-in--default);
9461
+ --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
9396
9462
  --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);
9397
9463
  --pf-v6-c-menu--m-drilldown--c-menu--InsetBlockStart: 0;
9398
- --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--transition--duration);
9464
+ --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
9399
9465
  --pf-v6-c-menu--m-drilldown--c-menu--Transition: transform var(--pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform);
9400
- --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--transition--duration);
9466
+ --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
9401
9467
  --pf-v6-c-menu--m-drilldown__list--Transition: transform var(--pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform);
9402
9468
  --pf-v6-c-menu--m-drilled-in--c-menu__list-item--m-current-path--c-menu--ZIndex: var(--pf-t--global--z-index--xs);
9403
9469
  }
@@ -9886,7 +9952,8 @@ ul.pf-v6-c-list {
9886
9952
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
9887
9953
  }
9888
9954
 
9889
- :where(:root, .pf-v6-c-menu-toggle) {
9955
+ :root,
9956
+ .pf-v6-c-menu-toggle {
9890
9957
  --pf-v6-c-menu-toggle--ColumnGap: var(--pf-t--global--spacer--sm);
9891
9958
  --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
9892
9959
  --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
@@ -10291,7 +10358,8 @@ ul.pf-v6-c-list {
10291
10358
  color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
10292
10359
  }
10293
10360
 
10294
- :where(:root, .pf-v6-c-modal-box) {
10361
+ :root,
10362
+ .pf-v6-c-modal-box {
10295
10363
  --pf-v6-c-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
10296
10364
  --pf-v6-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--large);
10297
10365
  --pf-v6-c-modal-box--BoxShadow: var(--pf-t--global--box-shadow--lg);
@@ -10344,7 +10412,8 @@ ul.pf-v6-c-list {
10344
10412
  --pf-v6-c-modal-box__footer--c-button--sm--MarginInlineEnd: calc(var(--pf-v6-c-modal-box__footer--c-button--MarginInlineEnd) / 2);
10345
10413
  }
10346
10414
  @media (min-width: 75rem) {
10347
- :where(:root, .pf-v6-c-modal-box) {
10415
+ :root,
10416
+ .pf-v6-c-modal-box {
10348
10417
  --pf-v6-c-modal-box--m-align-top--spacer: var(--pf-v6-c-modal-box--m-align-top--xl--spacer);
10349
10418
  }
10350
10419
  }
@@ -10496,7 +10565,8 @@ ul.pf-v6-c-list {
10496
10565
  }
10497
10566
  }
10498
10567
 
10499
- :where(:root, .pf-v6-c-multiple-file-upload) {
10568
+ :root,
10569
+ .pf-v6-c-multiple-file-upload {
10500
10570
  --pf-v6-c-multiple-file-upload--GridTemplateColumns: 1fr;
10501
10571
  --pf-v6-c-multiple-file-upload--Gap: var(--pf-t--global--spacer--md);
10502
10572
  --pf-v6-c-multiple-file-upload__main--TextAlign: center;
@@ -10706,7 +10776,8 @@ ul.pf-v6-c-list {
10706
10776
  color: var(--pf-v6-c-multiple-file-upload__status-item-progress-size--Color);
10707
10777
  }
10708
10778
 
10709
- :where(:root, .pf-v6-c-nav) {
10779
+ :root,
10780
+ .pf-v6-c-nav {
10710
10781
  --pf-v6-c-nav__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
10711
10782
  --pf-v6-c-nav__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
10712
10783
  --pf-v6-c-nav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -11014,7 +11085,8 @@ ul.pf-v6-c-list {
11014
11085
  --pf-v6-c-nav--m-horizontal__list--PaddingInlineEnd: var(--pf-v6-c-nav--m-horizontal--m-scrollable__list--PaddingInlineEnd);
11015
11086
  }
11016
11087
 
11017
- :where(:root, .pf-v6-c-notification-drawer) {
11088
+ :root,
11089
+ .pf-v6-c-notification-drawer {
11018
11090
  --pf-v6-c-notification-drawer--BackgroundColor: var(--pf-t--global--background--color--floating--default);
11019
11091
  --pf-v6-c-notification-drawer__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
11020
11092
  --pf-v6-c-notification-drawer__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -11289,7 +11361,8 @@ ul.pf-v6-c-list {
11289
11361
  transform: rotate(var(--pf-v6-c-notification-drawer__group--m-expanded__group-toggle-icon--Rotate));
11290
11362
  }
11291
11363
 
11292
- :where(:root, .pf-v6-c-overflow-menu) {
11364
+ :root,
11365
+ .pf-v6-c-overflow-menu {
11293
11366
  --pf-v6-c-overflow-menu--ColumnGap: var(--pf-t--global--spacer--md);
11294
11367
  --pf-v6-c-overflow-menu__group--ColumnGap: var(--pf-t--global--spacer--md);
11295
11368
  --pf-v6-c-overflow-menu__group--m-button-group--ColumnGap: var(--pf-t--global--spacer--sm);
@@ -11326,7 +11399,8 @@ ul.pf-v6-c-list {
11326
11399
  column-gap: var(--pf-v6-c-overflow-menu--ColumnGap);
11327
11400
  }
11328
11401
 
11329
- :where(:root, .pf-v6-c-page) {
11402
+ :root,
11403
+ .pf-v6-c-page {
11330
11404
  --pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
11331
11405
  --pf-v6-c-page--inset: var(--pf-t--global--spacer--inset--page-chrome);
11332
11406
  --pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
@@ -11334,7 +11408,8 @@ ul.pf-v6-c-list {
11334
11408
  --pf-v6-c-page__sidebar--Width: 18.125rem;
11335
11409
  --pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
11336
11410
  --pf-v6-c-page__sidebar--BoxShadow: none;
11337
- --pf-v6-c-page__sidebar--Transition: var(--pf-t--global--transition);
11411
+ --pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
11412
+ --pf-v6-c-page__sidebar--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
11338
11413
  --pf-v6-c-page__sidebar--TranslateX: -100%;
11339
11414
  --pf-v6-c-page__sidebar--TranslateZ: 0;
11340
11415
  --pf-v6-c-page__sidebar--m-expanded--TranslateX: 0;
@@ -11406,7 +11481,8 @@ ul.pf-v6-c-list {
11406
11481
  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
11407
11482
  }
11408
11483
  @media screen and (min-width: 75rem) {
11409
- :where(:root, .pf-v6-c-page) {
11484
+ :root,
11485
+ .pf-v6-c-page {
11410
11486
  --pf-v6-c-page__sidebar--TranslateX: var(--pf-v6-c-page__sidebar--xl--TranslateX);
11411
11487
  }
11412
11488
  }
@@ -11455,7 +11531,7 @@ ul.pf-v6-c-list {
11455
11531
  overflow-y: auto;
11456
11532
  -webkit-overflow-scrolling: touch;
11457
11533
  background-color: var(--pf-v6-c-page__sidebar--BackgroundColor);
11458
- transition: var(--pf-v6-c-page__sidebar--Transition);
11534
+ transition: transform var(--pf-v6-c-page__sidebar--TransitionDuration) var(--pf-v6-c-page__sidebar--TransitionTimingFunction);
11459
11535
  transform: translateX(var(--pf-v6-c-page__sidebar--TranslateX)) translateZ(var(--pf-v6-c-page__sidebar--TranslateZ));
11460
11536
  }
11461
11537
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-page__sidebar {
@@ -11935,7 +12011,8 @@ ul.pf-v6-c-list {
11935
12011
  flex: 1 0 auto;
11936
12012
  }
11937
12013
 
11938
- :where(:root, .pf-v6-c-pagination) {
12014
+ :root,
12015
+ .pf-v6-c-pagination {
11939
12016
  --pf-v6-c-pagination--inset: 0;
11940
12017
  --pf-v6-c-pagination--ColumnGap: var(--pf-t--global--spacer--lg);
11941
12018
  --pf-v6-c-pagination--m-page-insets--inset: var(--pf-t--global--spacer--lg);
@@ -11973,7 +12050,8 @@ ul.pf-v6-c-list {
11973
12050
  --pf-v6-c-pagination__page-menu--md--Display: var(--pf-v6-c-pagination__page-menu--Display--base);
11974
12051
  }
11975
12052
  @media screen and (min-width: 48rem) {
11976
- :where(:root, .pf-v6-c-pagination) {
12053
+ :root,
12054
+ .pf-v6-c-pagination {
11977
12055
  --pf-v6-c-pagination--m-bottom--BoxShadow: none;
11978
12056
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination__page-menu--md--Display);
11979
12057
  --pf-v6-c-pagination__nav--Display: inline-flex;
@@ -11981,7 +12059,8 @@ ul.pf-v6-c-list {
11981
12059
  }
11982
12060
  }
11983
12061
  @media screen and (min-width: 75rem) {
11984
- :where(:root, .pf-v6-c-pagination) {
12062
+ :root,
12063
+ .pf-v6-c-pagination {
11985
12064
  --pf-v6-c-pagination__scroll-button--Width: var(--pf-v6-c-pagination__scroll-button--xl--Width);
11986
12065
  }
11987
12066
  }
@@ -12282,7 +12361,8 @@ ul.pf-v6-c-list {
12282
12361
  }
12283
12362
  }
12284
12363
 
12285
- :where(:root, .pf-v6-c-panel) {
12364
+ :root,
12365
+ .pf-v6-c-panel {
12286
12366
  --pf-v6-c-panel--Width: auto;
12287
12367
  --pf-v6-c-panel--MinWidth: auto;
12288
12368
  --pf-v6-c-panel--MaxWidth: none;
@@ -12379,7 +12459,8 @@ ul.pf-v6-c-list {
12379
12459
  box-shadow: var(--pf-v6-c-panel__footer--BoxShadow);
12380
12460
  }
12381
12461
 
12382
- :where(:root, .pf-v6-c-popover) {
12462
+ :root,
12463
+ .pf-v6-c-popover {
12383
12464
  --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
12384
12465
  --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
12385
12466
  --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
@@ -12581,7 +12662,8 @@ ul.pf-v6-c-list {
12581
12662
  margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
12582
12663
  }
12583
12664
 
12584
- :where(:root, .pf-v6-c-progress) {
12665
+ :root,
12666
+ .pf-v6-c-progress {
12585
12667
  --pf-v6-c-progress--GridGap: var(--pf-t--global--spacer--md);
12586
12668
  --pf-v6-c-progress__bar--Height: var(--pf-t--global--spacer--md);
12587
12669
  --pf-v6-c-progress__bar--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
@@ -12745,7 +12827,8 @@ ul.pf-v6-c-list {
12745
12827
  font-variant-numeric: tabular-nums;
12746
12828
  }
12747
12829
 
12748
- :where(:root, .pf-v6-c-progress-stepper) {
12830
+ :root,
12831
+ .pf-v6-c-progress-stepper {
12749
12832
  --pf-v6-c-progress-stepper--m-vertical--GridAutoFlow: row;
12750
12833
  --pf-v6-c-progress-stepper--m-vertical--GridTemplateColumns: auto 1fr;
12751
12834
  --pf-v6-c-progress-stepper--m-vertical__step-connector--before--InsetBlockStart: 0;
@@ -12866,7 +12949,8 @@ ul.pf-v6-c-list {
12866
12949
  --pf-v6-c-progress-stepper--m-center__step-main--before--Content: "";
12867
12950
  }
12868
12951
  @media screen and (min-width: 48rem) {
12869
- :where(:root, .pf-v6-c-progress-stepper) {
12952
+ :root,
12953
+ .pf-v6-c-progress-stepper {
12870
12954
  --pf-v6-c-progress-stepper--GridAutoFlow: var(--pf-v6-c-progress-stepper--m-horizontal--GridAutoFlow);
12871
12955
  --pf-v6-c-progress-stepper--GridTemplateColumns: var(--pf-v6-c-progress-stepper--m-horizontal--GridTemplateColumns);
12872
12956
  --pf-v6-c-progress-stepper__step-connector--before--InsetBlockStart: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--InsetBlockStart);
@@ -13355,7 +13439,8 @@ ul.pf-v6-c-list {
13355
13439
  }
13356
13440
  }
13357
13441
 
13358
- :where(:root, .pf-v6-c-radio) {
13442
+ :root,
13443
+ .pf-v6-c-radio {
13359
13444
  --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
13360
13445
  --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
13361
13446
  --pf-v6-c-radio--Height: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
@@ -13436,7 +13521,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13436
13521
  cursor: not-allowed;
13437
13522
  }
13438
13523
 
13439
- :where(:root, .pf-v6-c-sidebar) {
13524
+ :root,
13525
+ .pf-v6-c-sidebar {
13440
13526
  --pf-v6-c-sidebar--inset: var(--pf-t--global--spacer--md);
13441
13527
  --pf-v6-c-sidebar--xl--inset: var(--pf-t--global--spacer--lg);
13442
13528
  --pf-v6-c-sidebar--BorderWidth--base: var(--pf-t--global--border--width--regular);
@@ -13780,7 +13866,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13780
13866
  --pf-v6-c-sidebar__panel--FlexBasis: 100%;
13781
13867
  }
13782
13868
  }
13783
- :where(:root, .pf-v6-c-simple-list) {
13869
+ :root,
13870
+ .pf-v6-c-simple-list {
13784
13871
  --pf-v6-c-simple-list__item-link--PaddingBlockStart: var(--pf-t--global--spacer--xs);
13785
13872
  --pf-v6-c-simple-list__item-link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
13786
13873
  --pf-v6-c-simple-list__item-link--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
@@ -13850,7 +13937,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13850
13937
  margin-block-start: var(--pf-v6-c-simple-list__section--section--MarginBlockStart);
13851
13938
  }
13852
13939
 
13853
- :where(:root, .pf-v6-c-skeleton) {
13940
+ :root,
13941
+ .pf-v6-c-skeleton {
13854
13942
  --pf-v6-c-skeleton--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
13855
13943
  --pf-v6-c-skeleton--Width: auto;
13856
13944
  --pf-v6-c-skeleton--Height: auto;
@@ -14015,7 +14103,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14015
14103
  transform: translateX(100%);
14016
14104
  }
14017
14105
  }
14018
- :where(:root, .pf-v6-c-skip-to-content) {
14106
+ :root,
14107
+ .pf-v6-c-skip-to-content {
14019
14108
  --pf-v6-c-skip-to-content--InsetBlockStart: var(--pf-t--global--spacer--md);
14020
14109
  --pf-v6-c-skip-to-content--ZIndex: var(--pf-t--global--z-index--2xl);
14021
14110
  --pf-v6-c-skip-to-content--focus--InsetInlineStart: var(--pf-t--global--spacer--md);
@@ -14031,7 +14120,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14031
14120
  inset-inline-start: var(--pf-v6-c-skip-to-content--focus--InsetInlineStart);
14032
14121
  }
14033
14122
 
14034
- :where(:root, .pf-v6-c-slider) {
14123
+ :root,
14124
+ .pf-v6-c-slider {
14035
14125
  --pf-v6-c-slider--value: 0;
14036
14126
  --pf-v6-c-slider__step--InsetInlineStart: 0;
14037
14127
  --pf-v6-c-slider__rail--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -14252,7 +14342,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14252
14342
  margin-inline-start: var(--pf-v6-c-slider__main--actions--MarginInlineStart);
14253
14343
  }
14254
14344
 
14255
- :where(:root, .pf-v6-c-spinner) {
14345
+ :root,
14346
+ .pf-v6-c-spinner {
14256
14347
  --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
14257
14348
  --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
14258
14349
  --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
@@ -14328,7 +14419,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14328
14419
  transform: rotate(720deg);
14329
14420
  }
14330
14421
  }
14331
- :where(:root, .pf-v6-c-switch) {
14422
+ :root,
14423
+ .pf-v6-c-switch {
14332
14424
  --pf-v6-c-switch--FontSize: var(--pf-t--global--font--size--sm);
14333
14425
  --pf-v6-c-switch--ColumnGap: var(--pf-t--global--spacer--sm);
14334
14426
  --pf-v6-c-switch__toggle-icon--FontSize: calc(var(--pf-v6-c-switch--FontSize) * .625);
@@ -14476,7 +14568,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14476
14568
  vertical-align: top;
14477
14569
  }
14478
14570
 
14479
- :where(:root, .pf-v6-c-tab-content) {
14571
+ :root,
14572
+ .pf-v6-c-tab-content {
14480
14573
  --pf-v6-c-tab-content__body--PaddingBlockStart: 0;
14481
14574
  --pf-v6-c-tab-content__body--PaddingInlineEnd: 0;
14482
14575
  --pf-v6-c-tab-content__body--PaddingBlockEnd: 0;
@@ -14521,7 +14614,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14521
14614
  --pf-v6-c-tab-content__body--PaddingInlineStart: var(--pf-v6-c-tab-content__body--m-padding--PaddingInlineStart);
14522
14615
  }
14523
14616
 
14524
- :where(:root, .pf-v6-c-table[class*=pf-m-grid]) {
14617
+ :root,
14618
+ .pf-v6-c-table {
14525
14619
  --pf-v6-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
14526
14620
  --pf-v6-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
14527
14621
  --pf-v6-c-table__tbody--after--border-width--base: var(--pf-t--global--border--width--extra-strong);
@@ -16085,7 +16179,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16085
16179
  }
16086
16180
  }
16087
16181
 
16088
- :where(:root, .pf-v6-c-table) {
16182
+ :root,
16183
+ .pf-v6-c-table {
16089
16184
  --pf-v6-c-table--BackgroundColor: var(--pf-t--global--background--color--primary--default);
16090
16185
  --pf-v6-c-table--BorderColor: var(--pf-t--global--border--color--default);
16091
16186
  --pf-v6-c-table--border-width--base: var(--pf-t--global--border--width--divider--default);
@@ -16135,7 +16230,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16135
16230
  --pf-v6-c-table__toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
16136
16231
  --pf-v6-c-table__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
16137
16232
  --pf-v6-c-table__toggle--c-button__toggle-icon--Rotate: 270deg;
16138
- --pf-v6-c-table__toggle--c-button__toggle-icon--Transition: .2s ease-in 0s;
16233
+ --pf-v6-c-table__toggle--c-button__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
16234
+ --pf-v6-c-table__toggle--c-button__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
16139
16235
  --pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate: 360deg;
16140
16236
  --pf-v6-c-table__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
16141
16237
  --pf-v6-c-table__button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -16158,7 +16254,6 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16158
16254
  --pf-v6-c-table__action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
16159
16255
  --pf-v6-c-table__action--PaddingInlineStart: var(--pf-t--global--spacer--sm);
16160
16256
  --pf-v6-c-table__action--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
16161
- --pf-v6-c-table__expandable-row--Transition: var(--pf-t--global--transition);
16162
16257
  --pf-v6-c-table__expandable-row-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
16163
16258
  --pf-v6-c-table__expandable-row-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
16164
16259
  --pf-v6-c-table__expandable-row-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -16387,6 +16482,11 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16387
16482
  .pf-v6-c-table thead:where(.pf-v6-c-table__thead) {
16388
16483
  --pf-v6-c-table--cell--FontSize: var(--pf-v6-c-table__thead--cell--FontSize);
16389
16484
  --pf-v6-c-table--cell--FontWeight: var(--pf-v6-c-table__thead--cell--FontWeight);
16485
+ --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
16486
+ --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
16487
+ --pf-v6-c-table--cell--Overflow: hidden;
16488
+ --pf-v6-c-table--cell--TextOverflow: ellipsis;
16489
+ --pf-v6-c-table--cell--WhiteSpace: nowrap;
16390
16490
  }
16391
16491
  .pf-v6-c-table thead:where(.pf-v6-c-table__thead).pf-m-nested-column-header button:where(.pf-v6-c-button) {
16392
16492
  outline-offset: var(--pf-v6-c-table__thead--m-nested-column-header--button--OutlineOffset);
@@ -16413,40 +16513,6 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16413
16513
  .pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td).pf-m-help {
16414
16514
  min-width: var(--pf-v6-c-table__th--m-help--MinWidth);
16415
16515
  }
16416
- .pf-v6-c-table > thead, .pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-truncate, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-truncate {
16417
- --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
16418
- --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
16419
- --pf-v6-c-table--cell--Overflow: hidden;
16420
- --pf-v6-c-table--cell--TextOverflow: ellipsis;
16421
- --pf-v6-c-table--cell--WhiteSpace: nowrap;
16422
- }
16423
-
16424
- .pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-wrap, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-wrap {
16425
- --pf-v6-c-table--cell--MinWidth: 0;
16426
- --pf-v6-c-table--cell--MaxWidth: none;
16427
- --pf-v6-c-table--cell--Overflow: visible;
16428
- --pf-v6-c-table--cell--TextOverflow: clip;
16429
- --pf-v6-c-table--cell--WhiteSpace: normal;
16430
- }
16431
- .pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-nowrap, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-nowrap {
16432
- --pf-v6-c-table--cell--MinWidth: 0;
16433
- --pf-v6-c-table--cell--MaxWidth: none;
16434
- --pf-v6-c-table--cell--Overflow: visible;
16435
- --pf-v6-c-table--cell--TextOverflow: clip;
16436
- --pf-v6-c-table--cell--WhiteSpace: nowrap;
16437
- }
16438
- .pf-v6-c-table :where([class*=pf-v6-c-table]) .pf-v6-c-table__icon, .pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-fit-content, :where(.pf-v6-c-table) > :is(thead, tbody) .pf-v6-c-table__icon, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-fit-content {
16439
- --pf-v6-c-table--cell--MinWidth: fit-content;
16440
- --pf-v6-c-table--cell--MaxWidth: none;
16441
- --pf-v6-c-table--cell--Width: 1%;
16442
- --pf-v6-c-table--cell--Overflow: visible;
16443
- --pf-v6-c-table--cell--TextOverflow: clip;
16444
- --pf-v6-c-table--cell--WhiteSpace: nowrap;
16445
- }
16446
- .pf-v6-c-table :where([class*=pf-v6-c-table]).pf-m-break-word, :where(.pf-v6-c-table) > :is(thead, tbody).pf-m-break-word {
16447
- --pf-v6-c-table--cell--WordBreak: break-word;
16448
- --pf-v6-c-table--cell--WhiteSpace: normal;
16449
- }
16450
16516
  .pf-v6-c-table.pf-m-no-border-rows > tbody:where(.pf-v6-c-table__tbody) {
16451
16517
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
16452
16518
  --pf-v6-c-table__tbody--BorderBlockEndWidth: 0;
@@ -16510,6 +16576,40 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16510
16576
  --pf-v6-c-table__sort-indicator--MarginInlineStart: 0;
16511
16577
  }
16512
16578
 
16579
+ [class*=pf-v6-c-table].pf-m-truncate {
16580
+ --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
16581
+ --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
16582
+ --pf-v6-c-table--cell--Overflow: hidden;
16583
+ --pf-v6-c-table--cell--TextOverflow: ellipsis;
16584
+ --pf-v6-c-table--cell--WhiteSpace: nowrap;
16585
+ }
16586
+ [class*=pf-v6-c-table].pf-m-wrap {
16587
+ --pf-v6-c-table--cell--MinWidth: 0;
16588
+ --pf-v6-c-table--cell--MaxWidth: none;
16589
+ --pf-v6-c-table--cell--Overflow: visible;
16590
+ --pf-v6-c-table--cell--TextOverflow: clip;
16591
+ --pf-v6-c-table--cell--WhiteSpace: normal;
16592
+ }
16593
+ [class*=pf-v6-c-table].pf-m-nowrap {
16594
+ --pf-v6-c-table--cell--MinWidth: 0;
16595
+ --pf-v6-c-table--cell--MaxWidth: none;
16596
+ --pf-v6-c-table--cell--Overflow: visible;
16597
+ --pf-v6-c-table--cell--TextOverflow: clip;
16598
+ --pf-v6-c-table--cell--WhiteSpace: nowrap;
16599
+ }
16600
+ [class*=pf-v6-c-table] .pf-v6-c-table__icon, [class*=pf-v6-c-table].pf-m-fit-content {
16601
+ --pf-v6-c-table--cell--MinWidth: fit-content;
16602
+ --pf-v6-c-table--cell--MaxWidth: none;
16603
+ --pf-v6-c-table--cell--Width: 1%;
16604
+ --pf-v6-c-table--cell--Overflow: visible;
16605
+ --pf-v6-c-table--cell--TextOverflow: clip;
16606
+ --pf-v6-c-table--cell--WhiteSpace: nowrap;
16607
+ }
16608
+ [class*=pf-v6-c-table].pf-m-break-word {
16609
+ --pf-v6-c-table--cell--WordBreak: break-word;
16610
+ --pf-v6-c-table--cell--WhiteSpace: normal;
16611
+ }
16612
+
16513
16613
  .pf-v6-c-table__text {
16514
16614
  --pf-v6-c-table--cell--MaxWidth: 100%;
16515
16615
  position: relative;
@@ -16624,7 +16724,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16624
16724
  transform: rotate(var(--pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate));
16625
16725
  }
16626
16726
  .pf-v6-c-table__toggle .pf-v6-c-table__toggle-icon {
16627
- transition: var(--pf-v6-c-table__toggle--c-button__toggle-icon--Transition);
16727
+ transition: transform var(--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionDuration) var(--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionTimingFunction);
16628
16728
  transform: rotate(var(--pf-v6-c-table__toggle--c-button__toggle-icon--Rotate));
16629
16729
  }
16630
16730
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-table__toggle .pf-v6-c-table__toggle-icon {
@@ -16776,10 +16876,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
16776
16876
  position: relative;
16777
16877
  border-block-end: 0 solid transparent;
16778
16878
  }
16779
- .pf-v6-c-table__expandable-row,
16780
- .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td):first-child::after {
16781
- transition: var(--pf-v6-c-table__expandable-row--Transition);
16782
- }
16783
16879
  :not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__th,
16784
16880
  :not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__td {
16785
16881
  padding-block-start: 0;
@@ -16947,7 +17043,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
16947
17043
  --pf-v6-c-table--cell--Width: 100%;
16948
17044
  }
16949
17045
 
16950
- :where(:root, .pf-v6-c-table) {
17046
+ :root,
17047
+ .pf-v6-c-table {
16951
17048
  --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
16952
17049
  --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
16953
17050
  --pf-v6-c-table__sticky-cell--ZIndex: var(--pf-t--global--z-index--xs);
@@ -17011,7 +17108,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17011
17108
  overflow: auto;
17012
17109
  }
17013
17110
 
17014
- :where(:root, .pf-v6-c-table) {
17111
+ :root,
17112
+ .pf-v6-c-table {
17015
17113
  --pf-v6-c-table__tree-view-main--indent--base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-table__tree-view-icon--MinWidth));
17016
17114
  --pf-v6-c-table__tree-view-main--nested-indent--base: calc(var(--pf-v6-c-table__tree-view-main--indent--base) - var(--pf-t--global--spacer--md));
17017
17115
  --pf-v6-c-table__tree-view-main--c-button--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -17831,7 +17929,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17831
17929
  }
17832
17930
  }
17833
17931
 
17834
- :where(:root, .pf-v6-c-tabs) {
17932
+ :root,
17933
+ .pf-v6-c-tabs {
17835
17934
  --pf-v6-c-tabs--inset: 0;
17836
17935
  --pf-v6-c-tabs--Width: auto;
17837
17936
  --pf-v6-c-tabs--before--BorderColor: var(--pf-t--global--border--color--default);
@@ -18643,7 +18742,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18643
18742
  }
18644
18743
  }
18645
18744
 
18646
- :where(:root, .pf-v6-c-text-input-group) {
18745
+ :root,
18746
+ .pf-v6-c-text-input-group {
18647
18747
  --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
18648
18748
  --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
18649
18749
  --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
@@ -18844,7 +18944,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18844
18944
  display: flex;
18845
18945
  }
18846
18946
 
18847
- :where(:root, .pf-v6-c-tile) {
18947
+ :root,
18948
+ .pf-v6-c-tile {
18848
18949
  --pf-v6-c-tile--PaddingBlockStart: var(--pf-t--global--spacer--lg);
18849
18950
  --pf-v6-c-tile--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
18850
18951
  --pf-v6-c-tile--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
@@ -18947,7 +19048,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18947
19048
  color: var(--pf-v6-c-tile__icon--Color);
18948
19049
  }
18949
19050
 
18950
- :where(:root, .pf-v6-c-timestamp) {
19051
+ :root,
19052
+ .pf-v6-c-timestamp {
18951
19053
  --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
18952
19054
  --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--regular);
18953
19055
  --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
@@ -18978,7 +19080,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18978
19080
  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle);
18979
19081
  }
18980
19082
 
18981
- :where(:root, .pf-v6-c-title) {
19083
+ :root,
19084
+ .pf-v6-c-title {
18982
19085
  --pf-v6-c-title--FontFamily: var(--pf-t--global--font--family--heading);
18983
19086
  --pf-v6-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
18984
19087
  --pf-v6-c-title--m-4xl--FontSize: var(--pf-t--global--font--size--heading--2xl);
@@ -19083,7 +19186,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19083
19186
  line-height: var(--pf-v6-c-title--m-h6--LineHeight);
19084
19187
  }
19085
19188
 
19086
- :where(:root, .pf-v6-c-toggle-group) {
19189
+ :root,
19190
+ .pf-v6-c-toggle-group {
19087
19191
  --pf-v6-c-toggle-group__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
19088
19192
  --pf-v6-c-toggle-group__button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
19089
19193
  --pf-v6-c-toggle-group__button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -19206,7 +19310,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19206
19310
  margin-inline-start: var(--pf-v6-c-toggle-group__icon--text--MarginInlineStart);
19207
19311
  }
19208
19312
 
19209
- :where(:root, .pf-v6-c-toolbar) {
19313
+ :root,
19314
+ .pf-v6-c-toolbar {
19210
19315
  --pf-v6-c-toolbar--RowGap: var(--pf-t--global--spacer--md);
19211
19316
  --pf-v6-c-toolbar--PaddingBlockStart: 0;
19212
19317
  --pf-v6-c-toolbar--PaddingBlockEnd: var(--pf-t--global--spacer--md);
@@ -19245,7 +19350,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19245
19350
  --pf-v6-c-toolbar--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
19246
19351
  --pf-v6-c-toolbar--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
19247
19352
  --pf-v6-c-toolbar__expand-all-icon--Rotate: 0;
19248
- --pf-v6-c-toolbar__expand-all-icon--Transition: var(--pf-t--global--transition);
19353
+ --pf-v6-c-toolbar__expand-all-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
19354
+ --pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
19249
19355
  --pf-v6-c-toolbar__item--m-expand-all--m-expanded__expand-all-icon--Rotate: 90deg;
19250
19356
  --pf-v6-c-toolbar__group--m-filter-group--ColumnGap: var(--pf-t--global--spacer--gap--control-to-control--default);
19251
19357
  --pf-v6-c-toolbar__item--m-label--FontWeight: var(--pf-t--global--font--weight--body--bold);
@@ -19577,7 +19683,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19577
19683
 
19578
19684
  .pf-v6-c-toolbar__expand-all-icon {
19579
19685
  display: inline-flex;
19580
- transition: var(--pf-v6-c-toolbar__expand-all-icon--Transition);
19686
+ transition: transform var(--pf-v6-c-toolbar__expand-all-icon--TransitionDuration) var(--pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction);
19581
19687
  transform: rotate(var(--pf-v6-c-toolbar__expand-all-icon--Rotate));
19582
19688
  }
19583
19689
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-toolbar__expand-all-icon {
@@ -21108,7 +21214,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21108
21214
  display: inline-flex;
21109
21215
  }
21110
21216
  }
21111
- :where(:root, .pf-v6-c-tooltip) {
21217
+ :root,
21218
+ .pf-v6-c-tooltip {
21112
21219
  --pf-v6-c-tooltip--MaxWidth: 18.75rem;
21113
21220
  --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
21114
21221
  --pf-v6-c-tooltip__content--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -21230,7 +21337,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21230
21337
  transform: translateX(var(--pf-v6-c-tooltip__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-tooltip__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-tooltip__arrow--Rotate, 0));
21231
21338
  }
21232
21339
 
21233
- :where(:root, .pf-v6-c-truncate) {
21340
+ :root,
21341
+ .pf-v6-c-truncate {
21234
21342
  --pf-v6-c-truncate--MinWidth: 6ch;
21235
21343
  --pf-v6-c-truncate__start--MinWidth: 6ch;
21236
21344
  }
@@ -21276,7 +21384,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21276
21384
  direction: rtl;
21277
21385
  }
21278
21386
  }
21279
- :where(:root, .pf-v6-c-number-input) {
21387
+ :root,
21388
+ .pf-v6-c-number-input {
21280
21389
  --pf-v6-c-number-input__unit--c-input-group--MarginInlineStart: var(--pf-t--global--spacer--sm);
21281
21390
  --pf-v6-c-number-input__icon--FontSize: var(--pf-t--global--font--size--xs);
21282
21391
  --pf-v6-c-number-input--c-form-control--width-base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-t--global--border--width--box--default) * 2);
@@ -21315,7 +21424,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21315
21424
  font-size: var(--pf-v6-c-number-input__icon--FontSize);
21316
21425
  }
21317
21426
 
21318
- :where(:root, .pf-v6-c-tree-view) {
21427
+ :root,
21428
+ .pf-v6-c-tree-view {
21319
21429
  --pf-v6-c-tree-view__node--indent--base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-tree-view__node-toggle-icon--MinWidth));
21320
21430
  --pf-v6-c-tree-view__node--nested-indent--base: calc(var(--pf-v6-c-tree-view__node--indent--base) - var(--pf-t--global--spacer--md));
21321
21431
  --pf-v6-c-tree-view__content--BorderRadius: var(--pf-t--global--border--radius--small);
@@ -21768,7 +21878,8 @@ label.pf-v6-c-tree-view__node-text {
21768
21878
  --pf-v6-c-tree-view--m-compact--m-no-background--border--nested--InsetInlineStart: calc(var(--pf-v6-c-tree-view__node--PaddingInlineStart) - var(--pf-v6-c-tree-view--m-compact--m-no-background--base-border--InsetInlineStart--offset));
21769
21879
  }
21770
21880
 
21771
- :where(:root, .pf-v6-c-wizard) {
21881
+ :root,
21882
+ .pf-v6-c-wizard {
21772
21883
  --pf-v6-c-wizard--Height: initial;
21773
21884
  --pf-v6-c-wizard--Height--base: 100%;
21774
21885
  --pf-v6-c-modal-box--c-wizard--Height--base: 47.625rem;
@@ -21809,7 +21920,8 @@ label.pf-v6-c-tree-view__node-text {
21809
21920
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
21810
21921
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
21811
21922
  --pf-v6-c-wizard__nav-link-toggle--Color: var(--pf-t--global--icon--color--regular);
21812
- --pf-v6-c-wizard__nav-link-toggle-icon--Transition: var(--pf-t--global--transition);
21923
+ --pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
21924
+ --pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
21813
21925
  --pf-v6-c-wizard__nav-link-toggle-icon--Rotate: 0;
21814
21926
  --pf-v6-c-wizard__nav-item--m-expanded__link-toggle-icon--Rotate: 90deg;
21815
21927
  --pf-v6-c-wizard__nav-link--before--Width: var(--pf-t--global--icon--size--font--xl);
@@ -21883,7 +21995,8 @@ label.pf-v6-c-tree-view__node-text {
21883
21995
  --pf-v6-c-wizard__footer--BorderBlockStartColor: var(--pf-t--global--border--color--default);
21884
21996
  }
21885
21997
  @media screen and (min-width: 62rem) {
21886
- :where(:root, .pf-v6-c-wizard) {
21998
+ :root,
21999
+ .pf-v6-c-wizard {
21887
22000
  --pf-v6-c-wizard__nav--Width: var(--pf-v6-c-wizard__nav--lg--Width);
21888
22001
  --pf-v6-c-wizard__nav--BoxShadow: none;
21889
22002
  }
@@ -22214,7 +22327,7 @@ label.pf-v6-c-tree-view__node-text {
22214
22327
 
22215
22328
  .pf-v6-c-wizard__nav-link-toggle-icon {
22216
22329
  display: inline-block;
22217
- transition: var(--pf-v6-c-wizard__nav-link-toggle-icon--Transition);
22330
+ transition: transform var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration) var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction);
22218
22331
  transform: rotate(var(--pf-v6-c-wizard__nav-link-toggle-icon--Rotate));
22219
22332
  }
22220
22333
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-wizard__nav-link-toggle-icon {