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

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 +4 -0
  2. package/css/components/AboutModalBox/about-modal-box.css +18 -13
  3. package/css/components/Accordion/accordion.css +2 -1
  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 +2 -1
  17. package/css/components/Card/card.css +5 -3
  18. package/css/components/Check/check.css +2 -1
  19. package/css/components/ClipboardCopy/clipboard-copy.css +2 -4
  20. package/css/components/CodeBlock/code-block.css +2 -1
  21. package/css/components/CodeEditor/code-editor.css +2 -1
  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 +14 -7
  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 +6 -3
  29. package/css/components/DualListSelector/dual-list-selector.css +5 -3
  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 +2 -1
  33. package/css/components/Form/form.css +5 -3
  34. package/css/components/FormControl/form-control.css +2 -1
  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 +2 -1
  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 +2 -1
  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 +306 -187
  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,7 +198,8 @@
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);
@@ -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);
@@ -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;
@@ -2216,7 +2239,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
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,7 +2544,8 @@ 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) {
2547
+ :root,
2548
+ .pf-v6-c-check {
2524
2549
  --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
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));
@@ -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);
@@ -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,7 +2775,8 @@ 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
2781
  --pf-v6-c-code-editor__controls--Gap: var(--pf-t--global--spacer--xs);
2757
2782
  --pf-v6-c-code-editor__header--before--BorderBlockEndWidth: var(--pf-t--global--border--width--box--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,7 +4058,8 @@ ul) {
4029
4058
  padding: 0;
4030
4059
  }
4031
4060
 
4032
- :where(:root, .pf-v6-c-description-list) {
4061
+ :root,
4062
+ .pf-v6-c-description-list {
4033
4063
  --pf-v6-c-description-list--RowGap: var(--pf-t--global--spacer--lg);
4034
4064
  --pf-v6-c-description-list--ColumnGap: var(--pf-t--global--spacer--lg);
4035
4065
  --pf-v6-c-description-list--GridTemplateColumns--count: 1;
@@ -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;
@@ -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%;
@@ -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,7 +6217,8 @@ 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) {
6220
+ :root,
6221
+ .pf-v6-c-file-upload {
6174
6222
  --pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--sm);
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);
@@ -6227,7 +6275,8 @@ ul) {
6227
6275
  transform: translate(-50%, -50%);
6228
6276
  }
6229
6277
 
6230
- :where(:root, .pf-v6-c-form) {
6278
+ :root,
6279
+ .pf-v6-c-form {
6231
6280
  --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--lg);
6232
6281
  --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--sm);
6233
6282
  --pf-v6-c-form__group--m-action--MarginBlockStart: var(--pf-t--global--spacer--xl);
@@ -6286,7 +6335,8 @@ ul) {
6286
6335
  --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
6336
  --pf-v6-c-form__field-group-toggle-button--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
6288
6337
  --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);
6338
+ --pf-v6-c-form__field-group-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
6339
+ --pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
6290
6340
  --pf-v6-c-form__field-group-toggle-icon--MinWidth: var(--pf-t--global--font--size--body--default);
6291
6341
  --pf-v6-c-form__field-group-toggle-icon--Rotate: 0;
6292
6342
  --pf-v6-c-form__field-group--m-expanded__toggle-icon--Rotate: 90deg;
@@ -6691,7 +6741,7 @@ ul) {
6691
6741
  display: inline-block;
6692
6742
  min-width: var(--pf-v6-c-form__field-group-toggle-icon--MinWidth);
6693
6743
  text-align: center;
6694
- transition: var(--pf-v6-c-form__field-group-toggle-icon--Transition);
6744
+ transition: transform var(--pf-v6-c-form__field-group-toggle-icon--TransitionDuration) var(--pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction);
6695
6745
  transform: rotate(var(--pf-v6-c-form__field-group-toggle-icon--Rotate));
6696
6746
  }
6697
6747
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-form__field-group-toggle-icon {
@@ -6746,7 +6796,8 @@ ul) {
6746
6796
  margin-block-end: var(--pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd);
6747
6797
  }
6748
6798
 
6749
- :where(:root, .pf-v6-c-form-control) {
6799
+ :root,
6800
+ .pf-v6-c-form-control {
6750
6801
  --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--sm);
6751
6802
  --pf-v6-c-form-control--Color: var(--pf-t--global--text--color--regular);
6752
6803
  --pf-v6-c-form-control--FontSize: var(--pf-t--global--font--size--body--default);
@@ -7014,7 +7065,8 @@ select ~ .pf-v6-c-form-control__utilities {
7014
7065
  --pf-v6-c-form-control__utilities--PaddingInlineEnd: 0;
7015
7066
  }
7016
7067
 
7017
- :where(:root, .pf-v6-c-hint) {
7068
+ :root,
7069
+ .pf-v6-c-hint {
7018
7070
  --pf-v6-c-hint--GridRowGap: var(--pf-t--global--spacer--sm);
7019
7071
  --pf-v6-c-hint--PaddingBlockStart: var(--pf-t--global--spacer--lg);
7020
7072
  --pf-v6-c-hint--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -7089,7 +7141,8 @@ select ~ .pf-v6-c-form-control__utilities {
7089
7141
  margin-inline-end: var(--pf-v6-c-hint__footer--child--MarginInlineEnd);
7090
7142
  }
7091
7143
 
7092
- :where(:root, .pf-v6-c-helper-text) {
7144
+ :root,
7145
+ .pf-v6-c-helper-text {
7093
7146
  --pf-v6-c-helper-text--Gap: var(--pf-t--global--spacer--xs);
7094
7147
  --pf-v6-c-helper-text--FontSize: var(--pf-t--global--font--size--body--sm);
7095
7148
  --pf-v6-c-helper-text__item-icon--Color: var(--pf-t--global--icon--color--regular);
@@ -7161,7 +7214,8 @@ select ~ .pf-v6-c-form-control__utilities {
7161
7214
  color: var(--pf-v6-c-helper-text__item-text--Color);
7162
7215
  }
7163
7216
 
7164
- :where(:root, .pf-v6-c-icon) {
7217
+ :root,
7218
+ .pf-v6-c-icon {
7165
7219
  --pf-v6-c-icon--Width: var(--pf-t--global--icon--size--font--body--default);
7166
7220
  --pf-v6-c-icon--Height: var(--pf-t--global--icon--size--font--body--default);
7167
7221
  --pf-v6-c-icon--m-sm--Width: var(--pf-t--global--icon--size--sm);
@@ -7417,7 +7471,8 @@ select ~ .pf-v6-c-form-control__utilities {
7417
7471
  transform: translateY(calc(-50% - 0.5 * var(--pf-v6-c-icon__content--svg--VerticalAlign)));
7418
7472
  }
7419
7473
 
7420
- :where(:root, .pf-v6-c-inline-edit) {
7474
+ :root,
7475
+ .pf-v6-c-inline-edit {
7421
7476
  --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
7422
7477
  --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
7423
7478
  --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
@@ -7500,7 +7555,8 @@ select ~ .pf-v6-c-form-control__utilities {
7500
7555
  display: none;
7501
7556
  }
7502
7557
 
7503
- :where(:root, .pf-v6-c-input-group) {
7558
+ :root,
7559
+ .pf-v6-c-input-group {
7504
7560
  --pf-v6-c-input-group--Gap: var(--pf-t--global--spacer--xs);
7505
7561
  --pf-v6-c-input-group__item--offset: var(--pf-t--global--border--width--control--default);
7506
7562
  --pf-v6-c-input-group__item--BorderWidth--base: var(--pf-t--global--border--width--control--default);
@@ -7573,7 +7629,8 @@ label.pf-v6-c-input-group__text {
7573
7629
  cursor: pointer;
7574
7630
  }
7575
7631
 
7576
- :where(:root, .pf-v6-c-jump-links) {
7632
+ :root,
7633
+ .pf-v6-c-jump-links {
7577
7634
  --pf-v6-c-jump-links__list--Display: flex;
7578
7635
  --pf-v6-c-jump-links__list--PaddingBlockStart: 0;
7579
7636
  --pf-v6-c-jump-links__list--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -7620,7 +7677,8 @@ label.pf-v6-c-input-group__text {
7620
7677
  --pf-v6-c-jump-links--m-expanded__toggle--MarginBlockEnd: var(--pf-t--global--spacer--sm);
7621
7678
  --pf-v6-c-jump-links__toggle--Display: none;
7622
7679
  --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);
7680
+ --pf-v6-c-jump-links__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
7681
+ --pf-v6-c-jump-links__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
7624
7682
  --pf-v6-c-jump-links__toggle-icon--Rotate: 0;
7625
7683
  --pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
7626
7684
  }
@@ -7811,14 +7869,15 @@ label.pf-v6-c-input-group__text {
7811
7869
  .pf-v6-c-jump-links__toggle-icon {
7812
7870
  display: inline-block;
7813
7871
  color: var(--pf-v6-c-jump-links__toggle-icon--Color);
7814
- transition: var(--pf-v6-c-jump-links__toggle-icon--Transition);
7872
+ transition: transform var(--pf-v6-c-jump-links__toggle-icon--TransitionDuration) var(--pf-v6-c-jump-links__toggle-icon--TransitionTimingFunction);
7815
7873
  transform: rotate(var(--pf-v6-c-jump-links__toggle-icon--Rotate));
7816
7874
  }
7817
7875
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-jump-links__toggle-icon {
7818
7876
  scale: -1 1;
7819
7877
  }
7820
7878
 
7821
- :where(:root, .pf-v6-c-label) {
7879
+ :root,
7880
+ .pf-v6-c-label {
7822
7881
  --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
7823
7882
  --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7824
7883
  --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
@@ -8312,7 +8371,8 @@ input.pf-v6-c-label__content {
8312
8371
  outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
8313
8372
  }
8314
8373
 
8315
- :where(:root, .pf-v6-c-label-group) {
8374
+ :root,
8375
+ .pf-v6-c-label-group {
8316
8376
  --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
8317
8377
  --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
8318
8378
  --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
@@ -8447,7 +8507,8 @@ input.pf-v6-c-label__content {
8447
8507
  display: none;
8448
8508
  }
8449
8509
 
8450
- :where(:root, .pf-v6-c-list) {
8510
+ :root,
8511
+ .pf-v6-c-list {
8451
8512
  --pf-v6-c-list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
8452
8513
  --pf-v6-c-list--ul--ListStyle: var(--pf-t--global--list-style);
8453
8514
  --pf-v6-c-list--Gap: var(--pf-t--global--spacer--sm);
@@ -8518,7 +8579,8 @@ ul.pf-v6-c-list {
8518
8579
  color: var(--pf-v6-c-list__item-icon--Color);
8519
8580
  }
8520
8581
 
8521
- :where(:root, .pf-v6-c-login) {
8582
+ :root,
8583
+ .pf-v6-c-login {
8522
8584
  --pf-v6-c-login--PaddingBlockStart: var(--pf-t--global--spacer--lg);
8523
8585
  --pf-v6-c-login--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
8524
8586
  --pf-v6-c-login__container--xl--GridColumnGap: var(--pf-t--global--spacer--3xl);
@@ -8574,48 +8636,56 @@ ul.pf-v6-c-list {
8574
8636
  --pf-v6-c-login__footer--c-list--xl--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
8575
8637
  }
8576
8638
  @media (min-width: 75rem) {
8577
- :where(:root, .pf-v6-c-login) {
8639
+ :root,
8640
+ .pf-v6-c-login {
8578
8641
  --pf-v6-c-login__container--MaxWidth: var(--pf-v6-c-login__container--xl--MaxWidth);
8579
8642
  }
8580
8643
  }
8581
8644
  @media (min-width: 36rem) {
8582
- :where(:root, .pf-v6-c-login) {
8645
+ :root,
8646
+ .pf-v6-c-login {
8583
8647
  --pf-v6-c-login__header--PaddingInlineEnd: 0;
8584
8648
  --pf-v6-c-login__header--PaddingInlineStart: 0;
8585
8649
  }
8586
8650
  }
8587
8651
  @media (min-width: 75rem) {
8588
- :where(:root, .pf-v6-c-login) {
8652
+ :root,
8653
+ .pf-v6-c-login {
8589
8654
  --pf-v6-c-login__header--MarginBlockEnd: var(--pf-v6-c-login__header--xl--MarginBlockEnd);
8590
8655
  --pf-v6-c-login__header--c-brand--MarginBlockEnd: var(--pf-v6-c-login__header--c-brand--xl--MarginBlockEnd);
8591
8656
  }
8592
8657
  }
8593
8658
  @media (min-width: 75rem) {
8594
- :where(:root, .pf-v6-c-login) {
8659
+ :root,
8660
+ .pf-v6-c-login {
8595
8661
  --pf-v6-c-login__main--MarginBlockEnd: 0;
8596
8662
  }
8597
8663
  }
8598
8664
  @media (min-width: 48rem) {
8599
- :where(:root, .pf-v6-c-login) {
8665
+ :root,
8666
+ .pf-v6-c-login {
8600
8667
  --pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-v6-c-login__main-header--md--PaddingInlineEnd);
8601
8668
  --pf-v6-c-login__main-header--PaddingInlineStart: var(--pf-v6-c-login__main-header--md--PaddingInlineStart);
8602
8669
  --pf-v6-c-login__main-header-desc--MarginBlockEnd: var(--pf-v6-c-login__main-header-desc--md--MarginBlockEnd);
8603
8670
  }
8604
8671
  }
8605
8672
  @media (min-width: 48rem) {
8606
- :where(:root, .pf-v6-c-login) {
8673
+ :root,
8674
+ .pf-v6-c-login {
8607
8675
  --pf-v6-c-login__main-body--PaddingInlineEnd: var(--pf-v6-c-login__main-body--md--PaddingInlineEnd);
8608
8676
  --pf-v6-c-login__main-body--PaddingInlineStart: var(--pf-v6-c-login__main-body--md--PaddingInlineStart);
8609
8677
  }
8610
8678
  }
8611
8679
  @media (min-width: 36rem) {
8612
- :where(:root, .pf-v6-c-login) {
8680
+ :root,
8681
+ .pf-v6-c-login {
8613
8682
  --pf-v6-c-login__footer--PaddingInlineEnd: 0;
8614
8683
  --pf-v6-c-login__footer--PaddingInlineStart: 0;
8615
8684
  }
8616
8685
  }
8617
8686
  @media (min-width: 75rem) {
8618
- :where(:root, .pf-v6-c-login) {
8687
+ :root,
8688
+ .pf-v6-c-login {
8619
8689
  --pf-v6-c-login__footer--c-list--PaddingBlockStart: var(--pf-v6-c-login__footer--c-list--xl--PaddingBlockStart);
8620
8690
  }
8621
8691
  }
@@ -8770,7 +8840,8 @@ ul.pf-v6-c-list {
8770
8840
  padding-block-start: var(--pf-v6-c-login__footer--c-list--PaddingBlockStart);
8771
8841
  }
8772
8842
 
8773
- :where(:root, .pf-v6-c-masthead) {
8843
+ :root,
8844
+ .pf-v6-c-masthead {
8774
8845
  --pf-v6-c-masthead--RowGap: var(--pf-t--global--spacer--sm);
8775
8846
  --pf-v6-c-masthead--ColumnGap: var(--pf-t--global--spacer--gutter--default);
8776
8847
  --pf-v6-c-masthead--BorderWidth: var(--pf-t--global--border--width--divider--default);
@@ -9305,7 +9376,8 @@ ul.pf-v6-c-list {
9305
9376
  padding-inline-end: var(--pf-t--global--spacer--2xl);
9306
9377
  }
9307
9378
 
9308
- :where(:root, .pf-v6-c-menu) {
9379
+ :root,
9380
+ .pf-v6-c-menu {
9309
9381
  --pf-v6-c-menu--RowGap: var(--pf-t--global--spacer--sm);
9310
9382
  --pf-v6-c-menu--Width: auto;
9311
9383
  --pf-v6-c-menu--MinWidth: auto;
@@ -9391,13 +9463,13 @@ ul.pf-v6-c-list {
9391
9463
  --pf-v6-c-menu--m-flyout__menu--InsetInlineStart: calc(100% + var(--pf-v6-c-menu--m-flyout__menu--left-offset));
9392
9464
  --pf-v6-c-menu--m-flyout__menu--m-top--InsetBlockEnd: calc(var(--pf-v6-c-menu__list--PaddingBlockStart) * -1);
9393
9465
  --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);
9466
+ --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--motion--duration--slide-in--default);
9467
+ --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
9396
9468
  --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
9469
  --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);
9470
+ --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
9399
9471
  --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);
9472
+ --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
9401
9473
  --pf-v6-c-menu--m-drilldown__list--Transition: transform var(--pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform);
9402
9474
  --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
9475
  }
@@ -9886,7 +9958,8 @@ ul.pf-v6-c-list {
9886
9958
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
9887
9959
  }
9888
9960
 
9889
- :where(:root, .pf-v6-c-menu-toggle) {
9961
+ :root,
9962
+ .pf-v6-c-menu-toggle {
9890
9963
  --pf-v6-c-menu-toggle--ColumnGap: var(--pf-t--global--spacer--sm);
9891
9964
  --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
9892
9965
  --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
@@ -10291,7 +10364,8 @@ ul.pf-v6-c-list {
10291
10364
  color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
10292
10365
  }
10293
10366
 
10294
- :where(:root, .pf-v6-c-modal-box) {
10367
+ :root,
10368
+ .pf-v6-c-modal-box {
10295
10369
  --pf-v6-c-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
10296
10370
  --pf-v6-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--large);
10297
10371
  --pf-v6-c-modal-box--BoxShadow: var(--pf-t--global--box-shadow--lg);
@@ -10344,7 +10418,8 @@ ul.pf-v6-c-list {
10344
10418
  --pf-v6-c-modal-box__footer--c-button--sm--MarginInlineEnd: calc(var(--pf-v6-c-modal-box__footer--c-button--MarginInlineEnd) / 2);
10345
10419
  }
10346
10420
  @media (min-width: 75rem) {
10347
- :where(:root, .pf-v6-c-modal-box) {
10421
+ :root,
10422
+ .pf-v6-c-modal-box {
10348
10423
  --pf-v6-c-modal-box--m-align-top--spacer: var(--pf-v6-c-modal-box--m-align-top--xl--spacer);
10349
10424
  }
10350
10425
  }
@@ -10496,7 +10571,8 @@ ul.pf-v6-c-list {
10496
10571
  }
10497
10572
  }
10498
10573
 
10499
- :where(:root, .pf-v6-c-multiple-file-upload) {
10574
+ :root,
10575
+ .pf-v6-c-multiple-file-upload {
10500
10576
  --pf-v6-c-multiple-file-upload--GridTemplateColumns: 1fr;
10501
10577
  --pf-v6-c-multiple-file-upload--Gap: var(--pf-t--global--spacer--md);
10502
10578
  --pf-v6-c-multiple-file-upload__main--TextAlign: center;
@@ -10706,7 +10782,8 @@ ul.pf-v6-c-list {
10706
10782
  color: var(--pf-v6-c-multiple-file-upload__status-item-progress-size--Color);
10707
10783
  }
10708
10784
 
10709
- :where(:root, .pf-v6-c-nav) {
10785
+ :root,
10786
+ .pf-v6-c-nav {
10710
10787
  --pf-v6-c-nav__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
10711
10788
  --pf-v6-c-nav__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
10712
10789
  --pf-v6-c-nav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -11014,7 +11091,8 @@ ul.pf-v6-c-list {
11014
11091
  --pf-v6-c-nav--m-horizontal__list--PaddingInlineEnd: var(--pf-v6-c-nav--m-horizontal--m-scrollable__list--PaddingInlineEnd);
11015
11092
  }
11016
11093
 
11017
- :where(:root, .pf-v6-c-notification-drawer) {
11094
+ :root,
11095
+ .pf-v6-c-notification-drawer {
11018
11096
  --pf-v6-c-notification-drawer--BackgroundColor: var(--pf-t--global--background--color--floating--default);
11019
11097
  --pf-v6-c-notification-drawer__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
11020
11098
  --pf-v6-c-notification-drawer__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -11289,7 +11367,8 @@ ul.pf-v6-c-list {
11289
11367
  transform: rotate(var(--pf-v6-c-notification-drawer__group--m-expanded__group-toggle-icon--Rotate));
11290
11368
  }
11291
11369
 
11292
- :where(:root, .pf-v6-c-overflow-menu) {
11370
+ :root,
11371
+ .pf-v6-c-overflow-menu {
11293
11372
  --pf-v6-c-overflow-menu--ColumnGap: var(--pf-t--global--spacer--md);
11294
11373
  --pf-v6-c-overflow-menu__group--ColumnGap: var(--pf-t--global--spacer--md);
11295
11374
  --pf-v6-c-overflow-menu__group--m-button-group--ColumnGap: var(--pf-t--global--spacer--sm);
@@ -11326,7 +11405,8 @@ ul.pf-v6-c-list {
11326
11405
  column-gap: var(--pf-v6-c-overflow-menu--ColumnGap);
11327
11406
  }
11328
11407
 
11329
- :where(:root, .pf-v6-c-page) {
11408
+ :root,
11409
+ .pf-v6-c-page {
11330
11410
  --pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
11331
11411
  --pf-v6-c-page--inset: var(--pf-t--global--spacer--inset--page-chrome);
11332
11412
  --pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
@@ -11334,7 +11414,8 @@ ul.pf-v6-c-list {
11334
11414
  --pf-v6-c-page__sidebar--Width: 18.125rem;
11335
11415
  --pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
11336
11416
  --pf-v6-c-page__sidebar--BoxShadow: none;
11337
- --pf-v6-c-page__sidebar--Transition: var(--pf-t--global--transition);
11417
+ --pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
11418
+ --pf-v6-c-page__sidebar--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
11338
11419
  --pf-v6-c-page__sidebar--TranslateX: -100%;
11339
11420
  --pf-v6-c-page__sidebar--TranslateZ: 0;
11340
11421
  --pf-v6-c-page__sidebar--m-expanded--TranslateX: 0;
@@ -11406,7 +11487,8 @@ ul.pf-v6-c-list {
11406
11487
  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
11407
11488
  }
11408
11489
  @media screen and (min-width: 75rem) {
11409
- :where(:root, .pf-v6-c-page) {
11490
+ :root,
11491
+ .pf-v6-c-page {
11410
11492
  --pf-v6-c-page__sidebar--TranslateX: var(--pf-v6-c-page__sidebar--xl--TranslateX);
11411
11493
  }
11412
11494
  }
@@ -11455,7 +11537,7 @@ ul.pf-v6-c-list {
11455
11537
  overflow-y: auto;
11456
11538
  -webkit-overflow-scrolling: touch;
11457
11539
  background-color: var(--pf-v6-c-page__sidebar--BackgroundColor);
11458
- transition: var(--pf-v6-c-page__sidebar--Transition);
11540
+ transition: transform var(--pf-v6-c-page__sidebar--TransitionDuration) var(--pf-v6-c-page__sidebar--TransitionTimingFunction);
11459
11541
  transform: translateX(var(--pf-v6-c-page__sidebar--TranslateX)) translateZ(var(--pf-v6-c-page__sidebar--TranslateZ));
11460
11542
  }
11461
11543
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-page__sidebar {
@@ -11935,7 +12017,8 @@ ul.pf-v6-c-list {
11935
12017
  flex: 1 0 auto;
11936
12018
  }
11937
12019
 
11938
- :where(:root, .pf-v6-c-pagination) {
12020
+ :root,
12021
+ .pf-v6-c-pagination {
11939
12022
  --pf-v6-c-pagination--inset: 0;
11940
12023
  --pf-v6-c-pagination--ColumnGap: var(--pf-t--global--spacer--lg);
11941
12024
  --pf-v6-c-pagination--m-page-insets--inset: var(--pf-t--global--spacer--lg);
@@ -11973,7 +12056,8 @@ ul.pf-v6-c-list {
11973
12056
  --pf-v6-c-pagination__page-menu--md--Display: var(--pf-v6-c-pagination__page-menu--Display--base);
11974
12057
  }
11975
12058
  @media screen and (min-width: 48rem) {
11976
- :where(:root, .pf-v6-c-pagination) {
12059
+ :root,
12060
+ .pf-v6-c-pagination {
11977
12061
  --pf-v6-c-pagination--m-bottom--BoxShadow: none;
11978
12062
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination__page-menu--md--Display);
11979
12063
  --pf-v6-c-pagination__nav--Display: inline-flex;
@@ -11981,7 +12065,8 @@ ul.pf-v6-c-list {
11981
12065
  }
11982
12066
  }
11983
12067
  @media screen and (min-width: 75rem) {
11984
- :where(:root, .pf-v6-c-pagination) {
12068
+ :root,
12069
+ .pf-v6-c-pagination {
11985
12070
  --pf-v6-c-pagination__scroll-button--Width: var(--pf-v6-c-pagination__scroll-button--xl--Width);
11986
12071
  }
11987
12072
  }
@@ -12282,7 +12367,8 @@ ul.pf-v6-c-list {
12282
12367
  }
12283
12368
  }
12284
12369
 
12285
- :where(:root, .pf-v6-c-panel) {
12370
+ :root,
12371
+ .pf-v6-c-panel {
12286
12372
  --pf-v6-c-panel--Width: auto;
12287
12373
  --pf-v6-c-panel--MinWidth: auto;
12288
12374
  --pf-v6-c-panel--MaxWidth: none;
@@ -12379,7 +12465,8 @@ ul.pf-v6-c-list {
12379
12465
  box-shadow: var(--pf-v6-c-panel__footer--BoxShadow);
12380
12466
  }
12381
12467
 
12382
- :where(:root, .pf-v6-c-popover) {
12468
+ :root,
12469
+ .pf-v6-c-popover {
12383
12470
  --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
12384
12471
  --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
12385
12472
  --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
@@ -12581,7 +12668,8 @@ ul.pf-v6-c-list {
12581
12668
  margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
12582
12669
  }
12583
12670
 
12584
- :where(:root, .pf-v6-c-progress) {
12671
+ :root,
12672
+ .pf-v6-c-progress {
12585
12673
  --pf-v6-c-progress--GridGap: var(--pf-t--global--spacer--md);
12586
12674
  --pf-v6-c-progress__bar--Height: var(--pf-t--global--spacer--md);
12587
12675
  --pf-v6-c-progress__bar--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
@@ -12745,7 +12833,8 @@ ul.pf-v6-c-list {
12745
12833
  font-variant-numeric: tabular-nums;
12746
12834
  }
12747
12835
 
12748
- :where(:root, .pf-v6-c-progress-stepper) {
12836
+ :root,
12837
+ .pf-v6-c-progress-stepper {
12749
12838
  --pf-v6-c-progress-stepper--m-vertical--GridAutoFlow: row;
12750
12839
  --pf-v6-c-progress-stepper--m-vertical--GridTemplateColumns: auto 1fr;
12751
12840
  --pf-v6-c-progress-stepper--m-vertical__step-connector--before--InsetBlockStart: 0;
@@ -12866,7 +12955,8 @@ ul.pf-v6-c-list {
12866
12955
  --pf-v6-c-progress-stepper--m-center__step-main--before--Content: "";
12867
12956
  }
12868
12957
  @media screen and (min-width: 48rem) {
12869
- :where(:root, .pf-v6-c-progress-stepper) {
12958
+ :root,
12959
+ .pf-v6-c-progress-stepper {
12870
12960
  --pf-v6-c-progress-stepper--GridAutoFlow: var(--pf-v6-c-progress-stepper--m-horizontal--GridAutoFlow);
12871
12961
  --pf-v6-c-progress-stepper--GridTemplateColumns: var(--pf-v6-c-progress-stepper--m-horizontal--GridTemplateColumns);
12872
12962
  --pf-v6-c-progress-stepper__step-connector--before--InsetBlockStart: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--InsetBlockStart);
@@ -13355,7 +13445,8 @@ ul.pf-v6-c-list {
13355
13445
  }
13356
13446
  }
13357
13447
 
13358
- :where(:root, .pf-v6-c-radio) {
13448
+ :root,
13449
+ .pf-v6-c-radio {
13359
13450
  --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
13360
13451
  --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
13361
13452
  --pf-v6-c-radio--Height: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
@@ -13436,7 +13527,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13436
13527
  cursor: not-allowed;
13437
13528
  }
13438
13529
 
13439
- :where(:root, .pf-v6-c-sidebar) {
13530
+ :root,
13531
+ .pf-v6-c-sidebar {
13440
13532
  --pf-v6-c-sidebar--inset: var(--pf-t--global--spacer--md);
13441
13533
  --pf-v6-c-sidebar--xl--inset: var(--pf-t--global--spacer--lg);
13442
13534
  --pf-v6-c-sidebar--BorderWidth--base: var(--pf-t--global--border--width--regular);
@@ -13780,7 +13872,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13780
13872
  --pf-v6-c-sidebar__panel--FlexBasis: 100%;
13781
13873
  }
13782
13874
  }
13783
- :where(:root, .pf-v6-c-simple-list) {
13875
+ :root,
13876
+ .pf-v6-c-simple-list {
13784
13877
  --pf-v6-c-simple-list__item-link--PaddingBlockStart: var(--pf-t--global--spacer--xs);
13785
13878
  --pf-v6-c-simple-list__item-link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
13786
13879
  --pf-v6-c-simple-list__item-link--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
@@ -13850,7 +13943,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13850
13943
  margin-block-start: var(--pf-v6-c-simple-list__section--section--MarginBlockStart);
13851
13944
  }
13852
13945
 
13853
- :where(:root, .pf-v6-c-skeleton) {
13946
+ :root,
13947
+ .pf-v6-c-skeleton {
13854
13948
  --pf-v6-c-skeleton--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
13855
13949
  --pf-v6-c-skeleton--Width: auto;
13856
13950
  --pf-v6-c-skeleton--Height: auto;
@@ -14015,7 +14109,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14015
14109
  transform: translateX(100%);
14016
14110
  }
14017
14111
  }
14018
- :where(:root, .pf-v6-c-skip-to-content) {
14112
+ :root,
14113
+ .pf-v6-c-skip-to-content {
14019
14114
  --pf-v6-c-skip-to-content--InsetBlockStart: var(--pf-t--global--spacer--md);
14020
14115
  --pf-v6-c-skip-to-content--ZIndex: var(--pf-t--global--z-index--2xl);
14021
14116
  --pf-v6-c-skip-to-content--focus--InsetInlineStart: var(--pf-t--global--spacer--md);
@@ -14031,7 +14126,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14031
14126
  inset-inline-start: var(--pf-v6-c-skip-to-content--focus--InsetInlineStart);
14032
14127
  }
14033
14128
 
14034
- :where(:root, .pf-v6-c-slider) {
14129
+ :root,
14130
+ .pf-v6-c-slider {
14035
14131
  --pf-v6-c-slider--value: 0;
14036
14132
  --pf-v6-c-slider__step--InsetInlineStart: 0;
14037
14133
  --pf-v6-c-slider__rail--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -14252,7 +14348,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14252
14348
  margin-inline-start: var(--pf-v6-c-slider__main--actions--MarginInlineStart);
14253
14349
  }
14254
14350
 
14255
- :where(:root, .pf-v6-c-spinner) {
14351
+ :root,
14352
+ .pf-v6-c-spinner {
14256
14353
  --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
14257
14354
  --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
14258
14355
  --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
@@ -14328,7 +14425,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14328
14425
  transform: rotate(720deg);
14329
14426
  }
14330
14427
  }
14331
- :where(:root, .pf-v6-c-switch) {
14428
+ :root,
14429
+ .pf-v6-c-switch {
14332
14430
  --pf-v6-c-switch--FontSize: var(--pf-t--global--font--size--sm);
14333
14431
  --pf-v6-c-switch--ColumnGap: var(--pf-t--global--spacer--sm);
14334
14432
  --pf-v6-c-switch__toggle-icon--FontSize: calc(var(--pf-v6-c-switch--FontSize) * .625);
@@ -14476,7 +14574,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14476
14574
  vertical-align: top;
14477
14575
  }
14478
14576
 
14479
- :where(:root, .pf-v6-c-tab-content) {
14577
+ :root,
14578
+ .pf-v6-c-tab-content {
14480
14579
  --pf-v6-c-tab-content__body--PaddingBlockStart: 0;
14481
14580
  --pf-v6-c-tab-content__body--PaddingInlineEnd: 0;
14482
14581
  --pf-v6-c-tab-content__body--PaddingBlockEnd: 0;
@@ -14521,7 +14620,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14521
14620
  --pf-v6-c-tab-content__body--PaddingInlineStart: var(--pf-v6-c-tab-content__body--m-padding--PaddingInlineStart);
14522
14621
  }
14523
14622
 
14524
- :where(:root, .pf-v6-c-table[class*=pf-m-grid]) {
14623
+ :root,
14624
+ .pf-v6-c-table {
14525
14625
  --pf-v6-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
14526
14626
  --pf-v6-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
14527
14627
  --pf-v6-c-table__tbody--after--border-width--base: var(--pf-t--global--border--width--extra-strong);
@@ -16085,7 +16185,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16085
16185
  }
16086
16186
  }
16087
16187
 
16088
- :where(:root, .pf-v6-c-table) {
16188
+ :root,
16189
+ .pf-v6-c-table {
16089
16190
  --pf-v6-c-table--BackgroundColor: var(--pf-t--global--background--color--primary--default);
16090
16191
  --pf-v6-c-table--BorderColor: var(--pf-t--global--border--color--default);
16091
16192
  --pf-v6-c-table--border-width--base: var(--pf-t--global--border--width--divider--default);
@@ -16135,7 +16236,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16135
16236
  --pf-v6-c-table__toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
16136
16237
  --pf-v6-c-table__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
16137
16238
  --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;
16239
+ --pf-v6-c-table__toggle--c-button__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
16240
+ --pf-v6-c-table__toggle--c-button__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
16139
16241
  --pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate: 360deg;
16140
16242
  --pf-v6-c-table__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
16141
16243
  --pf-v6-c-table__button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -16158,7 +16260,6 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16158
16260
  --pf-v6-c-table__action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
16159
16261
  --pf-v6-c-table__action--PaddingInlineStart: var(--pf-t--global--spacer--sm);
16160
16262
  --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
16263
  --pf-v6-c-table__expandable-row-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
16163
16264
  --pf-v6-c-table__expandable-row-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
16164
16265
  --pf-v6-c-table__expandable-row-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -16387,6 +16488,11 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16387
16488
  .pf-v6-c-table thead:where(.pf-v6-c-table__thead) {
16388
16489
  --pf-v6-c-table--cell--FontSize: var(--pf-v6-c-table__thead--cell--FontSize);
16389
16490
  --pf-v6-c-table--cell--FontWeight: var(--pf-v6-c-table__thead--cell--FontWeight);
16491
+ --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
16492
+ --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
16493
+ --pf-v6-c-table--cell--Overflow: hidden;
16494
+ --pf-v6-c-table--cell--TextOverflow: ellipsis;
16495
+ --pf-v6-c-table--cell--WhiteSpace: nowrap;
16390
16496
  }
16391
16497
  .pf-v6-c-table thead:where(.pf-v6-c-table__thead).pf-m-nested-column-header button:where(.pf-v6-c-button) {
16392
16498
  outline-offset: var(--pf-v6-c-table__thead--m-nested-column-header--button--OutlineOffset);
@@ -16413,40 +16519,6 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16413
16519
  .pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td).pf-m-help {
16414
16520
  min-width: var(--pf-v6-c-table__th--m-help--MinWidth);
16415
16521
  }
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
16522
  .pf-v6-c-table.pf-m-no-border-rows > tbody:where(.pf-v6-c-table__tbody) {
16451
16523
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
16452
16524
  --pf-v6-c-table__tbody--BorderBlockEndWidth: 0;
@@ -16510,6 +16582,40 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16510
16582
  --pf-v6-c-table__sort-indicator--MarginInlineStart: 0;
16511
16583
  }
16512
16584
 
16585
+ [class*=pf-v6-c-table].pf-m-truncate {
16586
+ --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
16587
+ --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
16588
+ --pf-v6-c-table--cell--Overflow: hidden;
16589
+ --pf-v6-c-table--cell--TextOverflow: ellipsis;
16590
+ --pf-v6-c-table--cell--WhiteSpace: nowrap;
16591
+ }
16592
+ [class*=pf-v6-c-table].pf-m-wrap {
16593
+ --pf-v6-c-table--cell--MinWidth: 0;
16594
+ --pf-v6-c-table--cell--MaxWidth: none;
16595
+ --pf-v6-c-table--cell--Overflow: visible;
16596
+ --pf-v6-c-table--cell--TextOverflow: clip;
16597
+ --pf-v6-c-table--cell--WhiteSpace: normal;
16598
+ }
16599
+ [class*=pf-v6-c-table].pf-m-nowrap {
16600
+ --pf-v6-c-table--cell--MinWidth: 0;
16601
+ --pf-v6-c-table--cell--MaxWidth: none;
16602
+ --pf-v6-c-table--cell--Overflow: visible;
16603
+ --pf-v6-c-table--cell--TextOverflow: clip;
16604
+ --pf-v6-c-table--cell--WhiteSpace: nowrap;
16605
+ }
16606
+ [class*=pf-v6-c-table] .pf-v6-c-table__icon, [class*=pf-v6-c-table].pf-m-fit-content {
16607
+ --pf-v6-c-table--cell--MinWidth: fit-content;
16608
+ --pf-v6-c-table--cell--MaxWidth: none;
16609
+ --pf-v6-c-table--cell--Width: 1%;
16610
+ --pf-v6-c-table--cell--Overflow: visible;
16611
+ --pf-v6-c-table--cell--TextOverflow: clip;
16612
+ --pf-v6-c-table--cell--WhiteSpace: nowrap;
16613
+ }
16614
+ [class*=pf-v6-c-table].pf-m-break-word {
16615
+ --pf-v6-c-table--cell--WordBreak: break-word;
16616
+ --pf-v6-c-table--cell--WhiteSpace: normal;
16617
+ }
16618
+
16513
16619
  .pf-v6-c-table__text {
16514
16620
  --pf-v6-c-table--cell--MaxWidth: 100%;
16515
16621
  position: relative;
@@ -16624,7 +16730,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16624
16730
  transform: rotate(var(--pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate));
16625
16731
  }
16626
16732
  .pf-v6-c-table__toggle .pf-v6-c-table__toggle-icon {
16627
- transition: var(--pf-v6-c-table__toggle--c-button__toggle-icon--Transition);
16733
+ 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
16734
  transform: rotate(var(--pf-v6-c-table__toggle--c-button__toggle-icon--Rotate));
16629
16735
  }
16630
16736
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-table__toggle .pf-v6-c-table__toggle-icon {
@@ -16776,10 +16882,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
16776
16882
  position: relative;
16777
16883
  border-block-end: 0 solid transparent;
16778
16884
  }
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
16885
  :not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__th,
16784
16886
  :not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__td {
16785
16887
  padding-block-start: 0;
@@ -16947,7 +17049,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
16947
17049
  --pf-v6-c-table--cell--Width: 100%;
16948
17050
  }
16949
17051
 
16950
- :where(:root, .pf-v6-c-table) {
17052
+ :root,
17053
+ .pf-v6-c-table {
16951
17054
  --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
16952
17055
  --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
16953
17056
  --pf-v6-c-table__sticky-cell--ZIndex: var(--pf-t--global--z-index--xs);
@@ -17011,7 +17114,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17011
17114
  overflow: auto;
17012
17115
  }
17013
17116
 
17014
- :where(:root, .pf-v6-c-table) {
17117
+ :root,
17118
+ .pf-v6-c-table {
17015
17119
  --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
17120
  --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
17121
  --pf-v6-c-table__tree-view-main--c-button--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -17831,7 +17935,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
17831
17935
  }
17832
17936
  }
17833
17937
 
17834
- :where(:root, .pf-v6-c-tabs) {
17938
+ :root,
17939
+ .pf-v6-c-tabs {
17835
17940
  --pf-v6-c-tabs--inset: 0;
17836
17941
  --pf-v6-c-tabs--Width: auto;
17837
17942
  --pf-v6-c-tabs--before--BorderColor: var(--pf-t--global--border--color--default);
@@ -18643,7 +18748,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18643
18748
  }
18644
18749
  }
18645
18750
 
18646
- :where(:root, .pf-v6-c-text-input-group) {
18751
+ :root,
18752
+ .pf-v6-c-text-input-group {
18647
18753
  --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
18648
18754
  --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
18649
18755
  --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
@@ -18844,7 +18950,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18844
18950
  display: flex;
18845
18951
  }
18846
18952
 
18847
- :where(:root, .pf-v6-c-tile) {
18953
+ :root,
18954
+ .pf-v6-c-tile {
18848
18955
  --pf-v6-c-tile--PaddingBlockStart: var(--pf-t--global--spacer--lg);
18849
18956
  --pf-v6-c-tile--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
18850
18957
  --pf-v6-c-tile--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
@@ -18947,7 +19054,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18947
19054
  color: var(--pf-v6-c-tile__icon--Color);
18948
19055
  }
18949
19056
 
18950
- :where(:root, .pf-v6-c-timestamp) {
19057
+ :root,
19058
+ .pf-v6-c-timestamp {
18951
19059
  --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
18952
19060
  --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--regular);
18953
19061
  --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
@@ -18978,7 +19086,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18978
19086
  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle);
18979
19087
  }
18980
19088
 
18981
- :where(:root, .pf-v6-c-title) {
19089
+ :root,
19090
+ .pf-v6-c-title {
18982
19091
  --pf-v6-c-title--FontFamily: var(--pf-t--global--font--family--heading);
18983
19092
  --pf-v6-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
18984
19093
  --pf-v6-c-title--m-4xl--FontSize: var(--pf-t--global--font--size--heading--2xl);
@@ -19083,7 +19192,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19083
19192
  line-height: var(--pf-v6-c-title--m-h6--LineHeight);
19084
19193
  }
19085
19194
 
19086
- :where(:root, .pf-v6-c-toggle-group) {
19195
+ :root,
19196
+ .pf-v6-c-toggle-group {
19087
19197
  --pf-v6-c-toggle-group__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
19088
19198
  --pf-v6-c-toggle-group__button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
19089
19199
  --pf-v6-c-toggle-group__button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -19206,7 +19316,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19206
19316
  margin-inline-start: var(--pf-v6-c-toggle-group__icon--text--MarginInlineStart);
19207
19317
  }
19208
19318
 
19209
- :where(:root, .pf-v6-c-toolbar) {
19319
+ :root,
19320
+ .pf-v6-c-toolbar {
19210
19321
  --pf-v6-c-toolbar--RowGap: var(--pf-t--global--spacer--md);
19211
19322
  --pf-v6-c-toolbar--PaddingBlockStart: 0;
19212
19323
  --pf-v6-c-toolbar--PaddingBlockEnd: var(--pf-t--global--spacer--md);
@@ -19245,7 +19356,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19245
19356
  --pf-v6-c-toolbar--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
19246
19357
  --pf-v6-c-toolbar--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
19247
19358
  --pf-v6-c-toolbar__expand-all-icon--Rotate: 0;
19248
- --pf-v6-c-toolbar__expand-all-icon--Transition: var(--pf-t--global--transition);
19359
+ --pf-v6-c-toolbar__expand-all-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
19360
+ --pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
19249
19361
  --pf-v6-c-toolbar__item--m-expand-all--m-expanded__expand-all-icon--Rotate: 90deg;
19250
19362
  --pf-v6-c-toolbar__group--m-filter-group--ColumnGap: var(--pf-t--global--spacer--gap--control-to-control--default);
19251
19363
  --pf-v6-c-toolbar__item--m-label--FontWeight: var(--pf-t--global--font--weight--body--bold);
@@ -19577,7 +19689,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19577
19689
 
19578
19690
  .pf-v6-c-toolbar__expand-all-icon {
19579
19691
  display: inline-flex;
19580
- transition: var(--pf-v6-c-toolbar__expand-all-icon--Transition);
19692
+ transition: transform var(--pf-v6-c-toolbar__expand-all-icon--TransitionDuration) var(--pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction);
19581
19693
  transform: rotate(var(--pf-v6-c-toolbar__expand-all-icon--Rotate));
19582
19694
  }
19583
19695
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-toolbar__expand-all-icon {
@@ -21108,7 +21220,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21108
21220
  display: inline-flex;
21109
21221
  }
21110
21222
  }
21111
- :where(:root, .pf-v6-c-tooltip) {
21223
+ :root,
21224
+ .pf-v6-c-tooltip {
21112
21225
  --pf-v6-c-tooltip--MaxWidth: 18.75rem;
21113
21226
  --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
21114
21227
  --pf-v6-c-tooltip__content--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -21230,7 +21343,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21230
21343
  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
21344
  }
21232
21345
 
21233
- :where(:root, .pf-v6-c-truncate) {
21346
+ :root,
21347
+ .pf-v6-c-truncate {
21234
21348
  --pf-v6-c-truncate--MinWidth: 6ch;
21235
21349
  --pf-v6-c-truncate__start--MinWidth: 6ch;
21236
21350
  }
@@ -21276,7 +21390,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21276
21390
  direction: rtl;
21277
21391
  }
21278
21392
  }
21279
- :where(:root, .pf-v6-c-number-input) {
21393
+ :root,
21394
+ .pf-v6-c-number-input {
21280
21395
  --pf-v6-c-number-input__unit--c-input-group--MarginInlineStart: var(--pf-t--global--spacer--sm);
21281
21396
  --pf-v6-c-number-input__icon--FontSize: var(--pf-t--global--font--size--xs);
21282
21397
  --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 +21430,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21315
21430
  font-size: var(--pf-v6-c-number-input__icon--FontSize);
21316
21431
  }
21317
21432
 
21318
- :where(:root, .pf-v6-c-tree-view) {
21433
+ :root,
21434
+ .pf-v6-c-tree-view {
21319
21435
  --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
21436
  --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
21437
  --pf-v6-c-tree-view__content--BorderRadius: var(--pf-t--global--border--radius--small);
@@ -21768,7 +21884,8 @@ label.pf-v6-c-tree-view__node-text {
21768
21884
  --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
21885
  }
21770
21886
 
21771
- :where(:root, .pf-v6-c-wizard) {
21887
+ :root,
21888
+ .pf-v6-c-wizard {
21772
21889
  --pf-v6-c-wizard--Height: initial;
21773
21890
  --pf-v6-c-wizard--Height--base: 100%;
21774
21891
  --pf-v6-c-modal-box--c-wizard--Height--base: 47.625rem;
@@ -21809,7 +21926,8 @@ label.pf-v6-c-tree-view__node-text {
21809
21926
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
21810
21927
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
21811
21928
  --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);
21929
+ --pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
21930
+ --pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
21813
21931
  --pf-v6-c-wizard__nav-link-toggle-icon--Rotate: 0;
21814
21932
  --pf-v6-c-wizard__nav-item--m-expanded__link-toggle-icon--Rotate: 90deg;
21815
21933
  --pf-v6-c-wizard__nav-link--before--Width: var(--pf-t--global--icon--size--font--xl);
@@ -21883,7 +22001,8 @@ label.pf-v6-c-tree-view__node-text {
21883
22001
  --pf-v6-c-wizard__footer--BorderBlockStartColor: var(--pf-t--global--border--color--default);
21884
22002
  }
21885
22003
  @media screen and (min-width: 62rem) {
21886
- :where(:root, .pf-v6-c-wizard) {
22004
+ :root,
22005
+ .pf-v6-c-wizard {
21887
22006
  --pf-v6-c-wizard__nav--Width: var(--pf-v6-c-wizard__nav--lg--Width);
21888
22007
  --pf-v6-c-wizard__nav--BoxShadow: none;
21889
22008
  }
@@ -22214,7 +22333,7 @@ label.pf-v6-c-tree-view__node-text {
22214
22333
 
22215
22334
  .pf-v6-c-wizard__nav-link-toggle-icon {
22216
22335
  display: inline-block;
22217
- transition: var(--pf-v6-c-wizard__nav-link-toggle-icon--Transition);
22336
+ transition: transform var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration) var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction);
22218
22337
  transform: rotate(var(--pf-v6-c-wizard__nav-link-toggle-icon--Rotate));
22219
22338
  }
22220
22339
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-wizard__nav-link-toggle-icon {