@patternfly/react-table 6.3.0-prerelease.3 → 6.3.0-prerelease.31

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (77) hide show
  1. package/CHANGELOG.md +120 -0
  2. package/components/package.json +1 -1
  3. package/deprecated/package.json +1 -1
  4. package/dist/dynamic/components/Table/package.json +1 -1
  5. package/dist/dynamic/components/Table/utils/decorators/package.json +1 -1
  6. package/dist/dynamic/components/Table/utils/package.json +1 -1
  7. package/dist/dynamic/deprecated/components/Table/base/package.json +1 -1
  8. package/dist/dynamic/deprecated/components/Table/package.json +1 -1
  9. package/dist/dynamic/deprecated/components/package.json +1 -1
  10. package/dist/esm/components/Table/ExpandableRowContent.d.ts +5 -0
  11. package/dist/esm/components/Table/ExpandableRowContent.d.ts.map +1 -1
  12. package/dist/esm/components/Table/ExpandableRowContent.js +2 -2
  13. package/dist/esm/components/Table/ExpandableRowContent.js.map +1 -1
  14. package/dist/esm/components/Table/Table.d.ts +6 -1
  15. package/dist/esm/components/Table/Table.d.ts.map +1 -1
  16. package/dist/esm/components/Table/Table.js +5 -4
  17. package/dist/esm/components/Table/Table.js.map +1 -1
  18. package/dist/esm/components/Table/Td.d.ts.map +1 -1
  19. package/dist/esm/components/Table/Td.js +23 -2
  20. package/dist/esm/components/Table/Td.js.map +1 -1
  21. package/dist/esm/components/Table/Tr.d.ts +3 -1
  22. package/dist/esm/components/Table/Tr.d.ts.map +1 -1
  23. package/dist/esm/components/Table/Tr.js +7 -4
  24. package/dist/esm/components/Table/Tr.js.map +1 -1
  25. package/dist/esm/demos/DashboardHeader.d.ts.map +1 -1
  26. package/dist/esm/demos/DashboardHeader.js +1 -2
  27. package/dist/esm/demos/DashboardHeader.js.map +1 -1
  28. package/dist/esm/demos/sampleData.d.ts.map +1 -1
  29. package/dist/esm/demos/sampleData.js +359 -360
  30. package/dist/esm/demos/sampleData.js.map +1 -1
  31. package/dist/js/components/Table/ExpandableRowContent.d.ts +5 -0
  32. package/dist/js/components/Table/ExpandableRowContent.d.ts.map +1 -1
  33. package/dist/js/components/Table/ExpandableRowContent.js +2 -2
  34. package/dist/js/components/Table/ExpandableRowContent.js.map +1 -1
  35. package/dist/js/components/Table/Table.d.ts +6 -1
  36. package/dist/js/components/Table/Table.d.ts.map +1 -1
  37. package/dist/js/components/Table/Table.js +5 -4
  38. package/dist/js/components/Table/Table.js.map +1 -1
  39. package/dist/js/components/Table/Td.d.ts.map +1 -1
  40. package/dist/js/components/Table/Td.js +22 -1
  41. package/dist/js/components/Table/Td.js.map +1 -1
  42. package/dist/js/components/Table/Tr.d.ts +3 -1
  43. package/dist/js/components/Table/Tr.d.ts.map +1 -1
  44. package/dist/js/components/Table/Tr.js +7 -4
  45. package/dist/js/components/Table/Tr.js.map +1 -1
  46. package/dist/js/demos/DashboardHeader.d.ts.map +1 -1
  47. package/dist/js/demos/DashboardHeader.js +1 -2
  48. package/dist/js/demos/DashboardHeader.js.map +1 -1
  49. package/dist/js/demos/sampleData.d.ts.map +1 -1
  50. package/dist/js/demos/sampleData.js +359 -360
  51. package/dist/js/demos/sampleData.js.map +1 -1
  52. package/dist/umd/assets/{output-CLV1g6to.css → output-CdHF2IFH.css} +1861 -1465
  53. package/dist/umd/react-table.min.js +2 -2
  54. package/package.json +6 -6
  55. package/src/components/Table/ExpandableRowContent.tsx +7 -1
  56. package/src/components/Table/Table.tsx +12 -4
  57. package/src/components/Table/Td.tsx +37 -2
  58. package/src/components/Table/Tr.tsx +10 -4
  59. package/src/components/Table/__tests__/ExpandableRowContent.test.tsx +39 -0
  60. package/src/components/Table/__tests__/Table.test.tsx +62 -0
  61. package/src/components/Table/__tests__/Tr.test.tsx +79 -0
  62. package/src/components/Table/__tests__/__snapshots__/ExpandableRowContent.test.tsx.snap +11 -0
  63. package/src/components/Table/__tests__/__snapshots__/Table.test.tsx.snap +13 -0
  64. package/src/components/Table/__tests__/__snapshots__/Tr.test.tsx.snap +35 -0
  65. package/src/components/Table/examples/Table.md +2 -0
  66. package/src/components/Table/examples/TableCompoundExpandable.tsx +23 -21
  67. package/src/components/Table/examples/TableExpandable.tsx +8 -3
  68. package/src/components/Table/examples/TableMisc.tsx +0 -1
  69. package/src/components/Table/examples/TableNestedExpandable.tsx +3 -3
  70. package/src/components/Table/examples/TableNestedTableExpandable.tsx +3 -3
  71. package/src/components/Table/examples/TableStripedExpandable.tsx +9 -3
  72. package/src/demos/DashboardHeader.tsx +2 -5
  73. package/src/demos/examples/TableCompoundExpansion.tsx +87 -84
  74. package/src/demos/examples/TableExpandCollapseAll.tsx +3 -3
  75. package/src/demos/sampleData.tsx +359 -361
  76. package/src/deprecated/components/Table/__tests__/__snapshots__/Table.test.tsx.snap +0 -17
  77. package/src/deprecated/components/Table/examples/LegacyTableMisc.tsx +0 -1
@@ -14,6 +14,8 @@
14
14
  --pf-v6-c-table__tbody--cell--PaddingBlockStart: var(--pf-v6-c-table--cell--Padding--base);
15
15
  --pf-v6-c-table__tbody--cell--PaddingBlockEnd: var(--pf-v6-c-table--cell--Padding--base);
16
16
  --pf-v6-c-table__tbody--cell--FontSize: var(--pf-t--global--font--size--body--default);
17
+ --pf-v6-c-table__tbody--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
18
+ --pf-v6-c-table__tbody--BorderBlockEndColor: var(--pf-t--global--border--color--default);
17
19
  --pf-v6-c-table__tr--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
18
20
  --pf-v6-c-table__tr--BorderBlockEndColor: var(--pf-t--global--border--color--default);
19
21
  --pf-v6-c-table--cell--Padding--base: var(--pf-t--global--spacer--md);
@@ -74,6 +76,15 @@
74
76
  --pf-v6-c-table__action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
75
77
  --pf-v6-c-table__action--PaddingInlineStart: var(--pf-t--global--spacer--sm);
76
78
  --pf-v6-c-table__action--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
79
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: 0s;
80
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
81
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: 0s;
82
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
83
+ --pf-v6-c-table__expandable-row--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
84
+ --pf-v6-c-table__expandable-row--Opacity: 0;
85
+ --pf-v6-c-table__tbody--m-expanded__expandable-row--Opacity: 1;
86
+ --pf-v6-c-table__expandable-row--TranslateY: 0;
87
+ --pf-v6-c-table__tbody--m-expanded__expandable-row--TranslateY: 0;
77
88
  --pf-v6-c-table__expandable-row-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
78
89
  --pf-v6-c-table__expandable-row-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
79
90
  --pf-v6-c-table__expandable-row-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -109,6 +120,10 @@
109
120
  --pf-v6-c-table--m-compact__th--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
110
121
  --pf-v6-c-table--m-compact--cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
111
122
  --pf-v6-c-table--m-compact--cell--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
123
+ --pf-v6-c-table__td--m-action--PaddingBlockStart: var(--pf-t--global--spacer--sm);
124
+ --pf-v6-c-table__td--m-action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
125
+ --pf-v6-c-table--m-compact__td--m-action--PaddingBlockStart: var(--pf-t--global--spacer--xs);
126
+ --pf-v6-c-table--m-compact__td--m-action--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
112
127
  --pf-v6-c-table--m-compact__action--PaddingBlockStart: var(--pf-t--global--spacer--xs);
113
128
  --pf-v6-c-table--m-compact__action--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
114
129
  --pf-v6-c-table__expandable-row--m-expanded--BorderBlockEndColor: var(--pf-t--global--border--color--default);
@@ -135,6 +150,13 @@
135
150
  --pf-v6-c-table--m-sticky-header--border--ZIndex: calc(var(--pf-t--global--z-index--xs) + 2);
136
151
  }
137
152
 
153
+ @media screen and (prefers-reduced-motion: no-preference) {
154
+ .pf-v6-c-table {
155
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
156
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
157
+ --pf-v6-c-table__expandable-row--TranslateY: -.5rem;
158
+ }
159
+ }
138
160
  .pf-v6-c-table {
139
161
  width: 100%;
140
162
  background-color: var(--pf-v6-c-table--BackgroundColor);
@@ -196,7 +218,7 @@
196
218
  background: var(--pf-v6-c-table--m-striped__tr--BackgroundColor);
197
219
  }
198
220
 
199
- .pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row).pf-m-ghost-row {
221
+ .pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))).pf-m-ghost-row {
200
222
  background-color: var(--pf-v6-c-table__tr--m-ghost-row--BackgroundColor);
201
223
  opacity: var(--pf-v6-c-table__tr--m-ghost-row--Opacity);
202
224
  }
@@ -360,6 +382,11 @@
360
382
  overflow-wrap: break-word;
361
383
  }
362
384
 
385
+ .pf-v6-c-table .pf-v6-c-table__td.pf-m-action {
386
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table__td--m-action--PaddingBlockStart);
387
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table__td--m-action--PaddingBlockEnd);
388
+ }
389
+
363
390
  .pf-v6-c-table .pf-v6-c-table__sort {
364
391
  min-width: var(--pf-v6-c-table__sort--MinWidth);
365
392
  }
@@ -426,7 +453,7 @@
426
453
  outline-offset: var(--pf-v6-c-table__tbody--m-selected--OutlineOffset);
427
454
  }
428
455
 
429
- .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody).pf-m-selected .pf-v6-c-table__tr.pf-m-expanded:not(.pf-v6-c-table__expandable-row) {
456
+ .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody).pf-m-selected .pf-v6-c-table__tr.pf-m-expanded:not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) {
430
457
  border: none;
431
458
  }
432
459
 
@@ -447,6 +474,56 @@
447
474
  --pf-v6-c-table__sort-indicator--MarginInlineStart: 0;
448
475
  }
449
476
 
477
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) {
478
+ display: var(--pf-v6-c-table__expandable-row--Display, revert);
479
+ visibility: hidden;
480
+ opacity: var(--pf-v6-c-table__expandable-row--Opacity);
481
+ transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
482
+ transition-timing-function: var(--pf-v6-c-table__expandable-row--TransitionTimingFunction);
483
+ transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s, 0s;
484
+ transition-property: opacity, translate, visibility, background-color;
485
+ translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
486
+ }
487
+
488
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:where(:nth-child(n+2))[hidden] {
489
+ display: var(--pf-v6-c-table__expandable-row--Display, revert);
490
+ }
491
+
492
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:where(:nth-child(n+2)).pf-m-expanded {
493
+ visibility: visible;
494
+ opacity: var(--pf-v6-c-table__tbody--m-expanded__expandable-row--Opacity);
495
+ transition-delay: 0s;
496
+ transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--expand--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--expand--slide), 0s, 0s;
497
+ translate: 0 var(--pf-v6-c-table__tbody--m-expanded__expandable-row--TranslateY);
498
+ }
499
+
500
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:where(:nth-child(n+2)).pf-m-expanded > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
501
+ max-height: 99999px;
502
+ }
503
+
504
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) {
505
+ --pf-v6-c-table--cell--responsive--label: none;
506
+ }
507
+
508
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th),
509
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
510
+ padding: 0;
511
+ overflow: hidden;
512
+ transition-delay: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
513
+ transition-property: padding, max-height, overflow;
514
+ }
515
+
516
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
517
+ max-height: 0;
518
+ }
519
+
520
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__control-row.pf-m-no-animate-expand ~ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) {
521
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade: 0s;
522
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: 0s;
523
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--fade: 0s;
524
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: 0s;
525
+ }
526
+
450
527
  [class*=pf-v6-c-table].pf-m-truncate {
451
528
  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
452
529
  --pf-v6-c-table--cell--MaxWidth: var(--pf-v6-c-table--m-truncate--cell--MaxWidth);
@@ -782,48 +859,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
782
859
  pointer-events: none;
783
860
  }
784
861
 
785
- .pf-v6-c-table__expandable-row {
786
- position: relative;
787
- border-block-end: 0 solid transparent;
788
- }
789
-
790
- :not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__th,
791
- :not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__td {
792
- padding-block-start: 0;
793
- }
794
-
795
- .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding,
796
- .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding {
797
- padding-block-start: 0;
798
- padding-block-end: 0;
799
- padding-inline-start: 0;
800
- padding-inline-end: 0;
801
- }
802
-
803
- .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
804
- .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
805
- padding: 0;
806
- }
807
-
808
- .pf-v6-c-table__expandable-row .pf-v6-c-table__expandable-row-content {
809
- padding-block-start: var(--pf-v6-c-table__expandable-row-content--PaddingBlockStart);
810
- padding-block-end: var(--pf-v6-c-table__expandable-row-content--PaddingBlockEnd);
811
- padding-inline-start: var(--pf-v6-c-table__expandable-row-content--PaddingInlineStart);
812
- padding-inline-end: var(--pf-v6-c-table__expandable-row-content--PaddingInlineEnd);
813
- background-color: var(--pf-v6-c-table__expandable-row-content--BackgroundColor);
814
- border-radius: var(--pf-v6-c-table__expandable-row-content--BorderRadius);
815
- }
816
-
817
- .pf-v6-c-table__expandable-row.pf-m-expanded {
818
- border-block-end-color: var(--pf-v6-c-table__expandable-row--m-expanded--BorderBlockEndColor);
819
- border-block-end-width: var(--pf-v6-c-table--border-width--base);
820
- }
821
-
822
- .pf-v6-c-table__expandable-row:not(.pf-m-expanded) {
823
- display: none;
824
- }
825
-
826
- .pf-v6-c-table__expandable-row tr:last-child {
862
+ .pf-v6-c-table__tr:has(~ .pf-v6-c-table__expandable-row.pf-m-expanded) {
827
863
  border-block-end: 0;
828
864
  }
829
865
 
@@ -832,7 +868,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
832
868
  --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact--cell--PaddingBlockEnd);
833
869
  }
834
870
 
835
- .pf-v6-c-table.pf-m-compact tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) {
871
+ .pf-v6-c-table.pf-m-compact tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) {
836
872
  --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--m-compact--cell--PaddingBlockStart);
837
873
  --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact--cell--PaddingBlockEnd);
838
874
  }
@@ -851,6 +887,11 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
851
887
  --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact__action--PaddingBlockEnd);
852
888
  }
853
889
 
890
+ .pf-v6-c-table.pf-m-compact .pf-v6-c-table__td.pf-m-action {
891
+ --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--m-compact__td--m-action--PaddingBlockStart);
892
+ --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--m-compact__td--m-action--PaddingBlockEnd);
893
+ }
894
+
854
895
  .pf-v6-c-table.pf-m-compact .pf-v6-c-table__icon {
855
896
  width: auto;
856
897
  min-width: 0;
@@ -877,21 +918,17 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
877
918
  background-color: var(--pf-v6-c-table--compound-expansion--m-expanded--BackgroundColor);
878
919
  }
879
920
 
880
- .pf-v6-c-table.pf-m-expandable .pf-v6-c-table__tr.pf-m-expanded {
921
+ .pf-v6-c-table__tr.pf-m-expanded:has(~ .pf-v6-c-table__expandable-row) {
881
922
  border-block-end: 0;
882
923
  }
883
924
 
884
- .pf-v6-c-table.pf-m-expandable .pf-v6-c-table__tbody {
885
- border-block-end: var(--pf-v6-c-table__tr--BorderBlockEndWidth) solid var(--pf-v6-c-table__tr--BorderBlockEndColor);
886
- }
887
-
888
- .pf-v6-c-table.pf-m-expandable .pf-v6-c-table__tbody.pf-m-expanded {
889
- border-block-end: var(--pf-v6-c-table__tr--BorderBlockEndWidth) solid var(--pf-v6-c-table__tr--BorderBlockEndColor);
925
+ .pf-v6-c-table__tbody.pf-m-expanded, .pf-v6-c-table__tbody:has(> .pf-v6-c-table__expandable-row.pf-m-expanded) {
926
+ border-block-end: var(--pf-v6-c-table__tbody--BorderBlockEndWidth) solid var(--pf-v6-c-table__tbody--BorderBlockEndColor);
890
927
  }
891
928
 
892
- .pf-v6-c-table.pf-m-expandable .pf-v6-c-table__tbody.pf-m-expanded .pf-v6-c-table__control-row {
929
+ .pf-v6-c-table__tbody.pf-m-expanded .pf-v6-c-table__control-row {
893
930
  background-color: var(--pf-v6-c-table__control-row--BackgroundColor);
894
- border-block-end: var(--pf-v6-c-table__control-row--BorderBlockEndWidth) solid var(--pf-v6-c-table__control-row__tbody--BorderBlockEndColor);
931
+ border-block-end: 0;
895
932
  }
896
933
 
897
934
  .pf-v6-c-table__tr {
@@ -906,6 +943,61 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
906
943
  border-block-end: var(--pf-v6-c-table--border-width--base) solid var(--pf-v6-c-table--BorderColor);
907
944
  }
908
945
 
946
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) {
947
+ position: relative;
948
+ border-block-end: 0 solid transparent;
949
+ }
950
+
951
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > .pf-v6-c-table__th,
952
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > .pf-v6-c-table__td {
953
+ padding-block-start: 0;
954
+ }
955
+
956
+ .pf-v6-c-table__control-row ~ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > .pf-v6-c-table__th,
957
+ .pf-v6-c-table__control-row ~ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > .pf-v6-c-table__td {
958
+ padding-block-start: var(--pf-v6-c-table--cell--PaddingBlockStart);
959
+ }
960
+
961
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__td.pf-m-no-padding,
962
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__th.pf-m-no-padding {
963
+ padding-block-start: 0;
964
+ padding-block-end: 0;
965
+ padding-inline-start: 0;
966
+ padding-inline-end: 0;
967
+ }
968
+
969
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__td.pf-m-no-padding .pf-v6-c-table__expandable-row-content,
970
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__th.pf-m-no-padding .pf-v6-c-table__expandable-row-content {
971
+ padding: 0;
972
+ border-radius: 0;
973
+ }
974
+
975
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__expandable-row-content {
976
+ padding-block-start: var(--pf-v6-c-table__expandable-row-content--PaddingBlockStart);
977
+ padding-block-end: var(--pf-v6-c-table__expandable-row-content--PaddingBlockEnd);
978
+ padding-inline-start: var(--pf-v6-c-table__expandable-row-content--PaddingInlineStart);
979
+ padding-inline-end: var(--pf-v6-c-table__expandable-row-content--PaddingInlineEnd);
980
+ background-color: var(--pf-v6-c-table__expandable-row-content--BackgroundColor);
981
+ border-radius: var(--pf-v6-c-table__expandable-row-content--BorderRadius);
982
+ }
983
+
984
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__expandable-row-content.pf-m-no-background {
985
+ background-color: transparent;
986
+ }
987
+
988
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)).pf-m-expanded {
989
+ border-block-end-color: var(--pf-v6-c-table__expandable-row--m-expanded--BorderBlockEndColor);
990
+ border-block-end-width: var(--pf-v6-c-table--border-width--base);
991
+ }
992
+
993
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) {
994
+ display: none;
995
+ }
996
+
997
+ .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) tr:last-child {
998
+ border-block-end: 0;
999
+ }
1000
+
909
1001
  .pf-v6-c-table__icon-inline {
910
1002
  display: flex;
911
1003
  align-items: center;
@@ -1900,6 +1992,98 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
1900
1992
  overflow: auto;
1901
1993
  }
1902
1994
 
1995
+ .pf-v6-c-inline-edit {
1996
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
1997
+ --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
1998
+ --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
1999
+ --pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--plain);
2000
+ --pf-v6-c-inline-edit__group--m-footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
2001
+ --pf-v6-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
2002
+ }
2003
+
2004
+ .pf-v6-c-inline-edit__group {
2005
+ display: flex;
2006
+ align-items: baseline;
2007
+ }
2008
+
2009
+ .pf-v6-c-inline-edit__group > * {
2010
+ margin-inline-end: var(--pf-v6-c-inline-edit__group--item--MarginInlineEnd);
2011
+ }
2012
+
2013
+ .pf-v6-c-inline-edit__group.pf-m-icon-group {
2014
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd);
2015
+ }
2016
+
2017
+ .pf-v6-c-inline-edit__group.pf-m-footer {
2018
+ margin-block-start: var(--pf-v6-c-inline-edit__group--m-footer--MarginBlockStart);
2019
+ }
2020
+
2021
+ .pf-v6-c-inline-edit__group.pf-m-column {
2022
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
2023
+ flex-direction: column;
2024
+ }
2025
+
2026
+ .pf-v6-c-inline-edit__group > :last-child {
2027
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
2028
+ }
2029
+
2030
+ .pf-v6-c-inline-edit__input {
2031
+ flex: 1;
2032
+ }
2033
+
2034
+ .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain {
2035
+ --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color);
2036
+ }
2037
+
2038
+ .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain:hover {
2039
+ --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color);
2040
+ }
2041
+
2042
+ .pf-v6-c-inline-edit__input,
2043
+ .pf-v6-c-inline-edit__action,
2044
+ .pf-v6-c-inline-edit__group.pf-m-action-group {
2045
+ display: none;
2046
+ }
2047
+
2048
+ .pf-v6-c-inline-edit__action.pf-m-enable-editable {
2049
+ display: inline-block;
2050
+ }
2051
+
2052
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__input,
2053
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__input {
2054
+ display: block;
2055
+ }
2056
+
2057
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action,
2058
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action {
2059
+ display: inline-block;
2060
+ }
2061
+
2062
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group,
2063
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group {
2064
+ display: inline-flex;
2065
+ }
2066
+
2067
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__value,
2068
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable,
2069
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__value,
2070
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable {
2071
+ display: none;
2072
+ }
2073
+
2074
+ .pf-v6-c-inline-edit__label + .pf-v6-c-inline-edit__action.pf-m-enable > .pf-v6-c-button {
2075
+ margin-block-start: calc(var(--pf-v6-c-button--PaddingBlockStart) * -1);
2076
+ margin-block-end: calc(var(--pf-v6-c-button--PaddingBlockEnd) * -1);
2077
+ }
2078
+
2079
+ .pf-v6-c-inline-edit__label.pf-m-bold {
2080
+ font-weight: var(--pf-v6-c-inline-edit__label--m-bold--FontWeight);
2081
+ }
2082
+
2083
+ .pf-v6-c-inline-edit__editable-text br {
2084
+ display: none;
2085
+ }
2086
+
1903
2087
  .pf-v6-c-form {
1904
2088
  --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
1905
2089
  --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--gap--group--vertical);
@@ -1953,7 +2137,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
1953
2137
  --pf-v6-c-form__field-group--GridTemplateColumns--toggle: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-form__field-group-toggle-icon--MinWidth) + var(--pf-t--global--spacer--xs));
1954
2138
  --pf-v6-c-form__field-group-toggle--PaddingBlockStart: var(--pf-v6-c-form__field-group-header--PaddingBlockStart);
1955
2139
  --pf-v6-c-form__field-group-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
1956
- --pf-v6-c-form__field-group__field-group__field-group-toggle--PaddingBlockStart: var(--pf-t--global--spacer--md);
2140
+ --pf-v6-c-form__field-group__field-group__field-group-toggle--PaddingBlockStart: var(--pf-t--global--spacer--lg);
1957
2141
  --pf-v6-c-form__field-group-header-toggle--BorderWidth--base: var(--pf-t--global--border--width--divider--default);
1958
2142
  --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);
1959
2143
  --pf-v6-c-form__field-group-toggle-button--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
@@ -1973,6 +2157,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
1973
2157
  --pf-v6-c-form__field-group-header-description--MarginBlockStart: var(--pf-t--global--spacer--xs);
1974
2158
  --pf-v6-c-form__field-group-header-description--Color: var(--pf-t--global--text--color--subtle);
1975
2159
  --pf-v6-c-form__field-group-header-actions--MarginInlineStart: var(--pf-t--global--spacer--sm);
2160
+ --pf-v6-c-form__field-group-header-actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
2161
+ --pf-v6-c-form__field-group-header-actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
1976
2162
  --pf-v6-c-form__field-group-body--PaddingBlockStart: var(--pf-t--global--spacer--lg);
1977
2163
  --pf-v6-c-form__field-group-body--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
1978
2164
  --pf-v6-c-form__field-group-body--Gap: var(--pf-v6-c-form--GridGap);
@@ -1980,8 +2166,21 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
1980
2166
  --pf-v6-c-form__field-group__field-group__field-group-body--GridColumn: 1 / 3;
1981
2167
  --pf-v6-c-form__field-group__field-group__field-group-toggle--field-group-body--GridColumn: 2 / 3;
1982
2168
  --pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd: calc(var(--pf-v6-c-form__field-group-body--PaddingBlockEnd) * -1);
2169
+ --pf-v6-c-form__field-group-body--TranslateY: 0;
2170
+ --pf-v6-c-form__field-group--m-expanded__field-group-body--TranslateY: 0;
2171
+ --pf-v6-c-form__field-group-body--TransitionDuration--expand--slide: 0s;
2172
+ --pf-v6-c-form__field-group-body--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
2173
+ --pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide: 0s;
2174
+ --pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
1983
2175
  }
1984
2176
 
2177
+ @media screen and (prefers-reduced-motion: no-preference) {
2178
+ .pf-v6-c-form {
2179
+ --pf-v6-c-form__field-group-body--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
2180
+ --pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
2181
+ --pf-v6-c-form__field-group-body--TranslateY: -.5rem;
2182
+ }
2183
+ }
1985
2184
  .pf-v6-c-form {
1986
2185
  display: grid;
1987
2186
  gap: var(--pf-v6-c-form--GridGap);
@@ -2357,6 +2556,17 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2357
2556
  --pf-v6-c-form__field-group-toggle-icon--Rotate: var(--pf-v6-c-form__field-group--m-expanded__toggle-icon--Rotate);
2358
2557
  }
2359
2558
 
2559
+ .pf-v6-c-form__field-group.pf-m-expanded.pf-m-expandable > .pf-v6-c-form__field-group-body {
2560
+ max-height: 99999px;
2561
+ padding-block-start: var(--pf-v6-c-form__field-group-body--PaddingBlockStart);
2562
+ padding-block-end: var(--pf-v6-c-form__field-group-body--PaddingBlockEnd);
2563
+ visibility: visible;
2564
+ opacity: 1;
2565
+ transition-delay: 0s;
2566
+ transition-duration: var(--pf-v6-c-form__field-group-body--TransitionDuration--expand--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--expand--slide), 0s, 0s, 0s, 0s;
2567
+ translate: 0 var(--pf-v6-c-form__field-group--m-expanded__field-group-body--TranslateY);
2568
+ }
2569
+
2360
2570
  .pf-v6-c-form__field-group-toggle {
2361
2571
  grid-row: 1/2;
2362
2572
  grid-column: 1/2;
@@ -2416,6 +2626,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2416
2626
  }
2417
2627
 
2418
2628
  .pf-v6-c-form__field-group-header-actions {
2629
+ margin-block-start: var(--pf-v6-c-form__field-group-header-actions--MarginBlockStart);
2630
+ margin-block-end: var(--pf-v6-c-form__field-group-header-actions--MarginBlockEnd);
2419
2631
  margin-inline-start: var(--pf-v6-c-form__field-group-header-actions--MarginInlineStart);
2420
2632
  white-space: nowrap;
2421
2633
  }
@@ -2428,6 +2640,18 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2428
2640
  padding-block-end: var(--pf-v6-c-form__field-group-body--PaddingBlockEnd);
2429
2641
  }
2430
2642
 
2643
+ .pf-v6-c-form__field-group.pf-m-expandable > .pf-v6-c-form__field-group-body {
2644
+ max-height: 0;
2645
+ padding-block-start: 0;
2646
+ padding-block-end: 0;
2647
+ visibility: hidden;
2648
+ opacity: 0;
2649
+ transition-delay: 0s, 0s, var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade);
2650
+ transition-duration: var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade), var(--pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide), 0s, 0s, 0s, 0s;
2651
+ transition-property: opacity, translate, visibility, max-height, padding-block-start, padding-block-end;
2652
+ translate: 0 var(--pf-v6-c-form__field-group-body--TranslateY);
2653
+ }
2654
+
2431
2655
  .pf-v6-c-form__field-group-body > .pf-v6-c-form__field-group:first-child {
2432
2656
  --pf-v6-c-form__field-group-toggle--PaddingBlockStart: 0;
2433
2657
  --pf-v6-c-form__field-group-header--PaddingBlockStart: 0;
@@ -2437,51 +2661,199 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2437
2661
  margin-block-end: var(--pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd);
2438
2662
  }
2439
2663
 
2440
- .pf-v6-c-table {
2441
- --pf-v6-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
2442
- --pf-v6-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
2443
- --pf-v6-c-table__tbody--after--border-width--base: var(--pf-t--global--border--width--extra-strong);
2444
- --pf-v6-c-table__tbody--after--BorderInlineStartWidth: 0;
2445
- --pf-v6-c-table__tbody--after--BorderColor: var(--pf-t--global--border--color--clicked);
2446
- --pf-v6-c-table__tbody--responsive--m-expandable--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
2447
- --pf-v6-c-table__tr--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
2448
- --pf-v6-c-table__tr--responsive--last-child--BorderBlockEndWidth: var(--pf-v6-c-table__tbody--responsive--border-width--base);
2449
- --pf-v6-c-table__tr--responsive--GridColumnGap: var(--pf-t--global--spacer--md);
2450
- --pf-v6-c-table__tr--responsive--MarginBlockStart: var(--pf-v6-c-table__tbody--responsive--border-width--base);
2451
- --pf-v6-c-table__tr--responsive--PaddingBlockStart: var(--pf-t--global--spacer--md);
2452
- --pf-v6-c-table__tr--responsive--PaddingInlineEnd: var(--pf-t--global--spacer--inset--page-chrome);
2453
- --pf-v6-c-table__tr--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--md);
2454
- --pf-v6-c-table__tr--responsive--PaddingInlineStart: var(--pf-t--global--spacer--inset--page-chrome);
2455
- --pf-v6-c-table__tr--responsive--nested-table--PaddingBlockStart: var(--pf-t--global--spacer--xl);
2456
- --pf-v6-c-table__tr--responsive--nested-table--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2457
- --pf-v6-c-table__tr--responsive--nested-table--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
2458
- --pf-v6-c-table__tr--responsive--nested-table--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2459
- --pf-v6-c-table__tbody--after__tr--BorderInlineStartWidth: 0;
2460
- --pf-v6-c-table__tbody--after__tr--BorderInlineStartColor: transparent;
2461
- --pf-v6-c-table__tbody--m-expanded--after__tr--BorderInlineStartWidth: var(--pf-v6-c-table__expandable-row--after--border-width--base);
2462
- --pf-v6-c-table__tbody--m-expanded--after__tr--BorderInlineStartColor: var(--pf-t--global--border--color--clicked);
2463
- --pf-v6-c-table__tbody--m-selected--after__tr--BorderInlineStartWidth: var(--pf-v6-c-table__expandable-row--after--border-width--base);
2464
- --pf-v6-c-table__tbody--m-selected--after__tr--BorderInlineStartColor: var(--pf-t--global--border--color--clicked);
2465
- --pf-v6-c-table--m-grid--cell--hidden-visible--Display: grid;
2466
- --pf-v6-c-table--m-grid--cell--PaddingBlockStart: 0;
2467
- --pf-v6-c-table--m-grid--cell--PaddingInlineEnd: 0;
2468
- --pf-v6-c-table--m-grid--cell--PaddingBlockEnd: 0;
2469
- --pf-v6-c-table--m-grid--cell--PaddingInlineStart: 0;
2470
- --pf-v6-c-table-td--responsive--GridColumnGap: var(--pf-t--global--spacer--md);
2471
- --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-t--global--spacer--md);
2472
- --pf-v6-c-table--cell--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2473
- --pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2474
- --pf-v6-c-table--cell--responsive--PaddingInlineEnd: 0;
2475
- --pf-v6-c-table--cell--responsive--PaddingInlineStart: 0;
2476
- --pf-v6-c-table--m-compact__tr--responsive--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2477
- --pf-v6-c-table--m-compact__tr--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2478
- --pf-v6-c-table--m-compact__tr__td--responsive--PaddingBlockStart: var(--pf-t--global--spacer--xs);
2479
- --pf-v6-c-table--m-compact__tr__td--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
2480
- --pf-v6-c-table--m-compact__check--responsive--MarginBlockStart: 0.4375rem;
2481
- --pf-v6-c-table--m-compact__action--responsive--MarginBlockStart: calc(var(--pf-t--global--spacer--xs) * -1);
2482
- --pf-v6-c-table--m-compact__action--responsive--MarginBlockEnd: calc(var(--pf-t--global--spacer--xs) * -1);
2483
- --pf-v6-c-table--m-compact__toggle--c-button--responsive--MarginBlockEnd: calc(var(--pf-t--global--spacer--xs) * -1);
2484
- --pf-v6-c-table__expandable-row-content--responsive--PaddingInlineEnd: var(--pf-t--global--spacer--inset--page-chrome);
2664
+ .pf-v6-u-screen-reader {
2665
+ position: fixed;
2666
+ inset-block-start: 0;
2667
+ inset-inline-start: 0;
2668
+ overflow: hidden;
2669
+ clip: rect(0, 0, 0, 0);
2670
+ white-space: nowrap;
2671
+ border: 0;
2672
+ }
2673
+
2674
+ .pf-v6-u-visible {
2675
+ position: static;
2676
+ overflow: visible;
2677
+ clip: auto;
2678
+ white-space: normal;
2679
+ border: inherit;
2680
+ }
2681
+
2682
+ .pf-v6-u-hidden {
2683
+ display: none !important;
2684
+ }
2685
+
2686
+ @media screen and (min-width: 36rem) {
2687
+ .pf-v6-u-screen-reader-on-sm {
2688
+ position: fixed;
2689
+ inset-block-start: 0;
2690
+ inset-inline-start: 0;
2691
+ overflow: hidden;
2692
+ clip: rect(0, 0, 0, 0);
2693
+ white-space: nowrap;
2694
+ border: 0;
2695
+ }
2696
+ }
2697
+ @media screen and (min-width: 36rem) {
2698
+ .pf-v6-u-visible-on-sm {
2699
+ position: static;
2700
+ overflow: visible;
2701
+ clip: auto;
2702
+ white-space: normal;
2703
+ border: inherit;
2704
+ }
2705
+ }
2706
+ @media screen and (min-width: 36rem) {
2707
+ .pf-v6-u-hidden-on-sm {
2708
+ display: none !important;
2709
+ }
2710
+ }
2711
+ @media screen and (min-width: 48rem) {
2712
+ .pf-v6-u-screen-reader-on-md {
2713
+ position: fixed;
2714
+ inset-block-start: 0;
2715
+ inset-inline-start: 0;
2716
+ overflow: hidden;
2717
+ clip: rect(0, 0, 0, 0);
2718
+ white-space: nowrap;
2719
+ border: 0;
2720
+ }
2721
+ }
2722
+ @media screen and (min-width: 48rem) {
2723
+ .pf-v6-u-visible-on-md {
2724
+ position: static;
2725
+ overflow: visible;
2726
+ clip: auto;
2727
+ white-space: normal;
2728
+ border: inherit;
2729
+ }
2730
+ }
2731
+ @media screen and (min-width: 48rem) {
2732
+ .pf-v6-u-hidden-on-md {
2733
+ display: none !important;
2734
+ }
2735
+ }
2736
+ @media screen and (min-width: 62rem) {
2737
+ .pf-v6-u-screen-reader-on-lg {
2738
+ position: fixed;
2739
+ inset-block-start: 0;
2740
+ inset-inline-start: 0;
2741
+ overflow: hidden;
2742
+ clip: rect(0, 0, 0, 0);
2743
+ white-space: nowrap;
2744
+ border: 0;
2745
+ }
2746
+ }
2747
+ @media screen and (min-width: 62rem) {
2748
+ .pf-v6-u-visible-on-lg {
2749
+ position: static;
2750
+ overflow: visible;
2751
+ clip: auto;
2752
+ white-space: normal;
2753
+ border: inherit;
2754
+ }
2755
+ }
2756
+ @media screen and (min-width: 62rem) {
2757
+ .pf-v6-u-hidden-on-lg {
2758
+ display: none !important;
2759
+ }
2760
+ }
2761
+ @media screen and (min-width: 75rem) {
2762
+ .pf-v6-u-screen-reader-on-xl {
2763
+ position: fixed;
2764
+ inset-block-start: 0;
2765
+ inset-inline-start: 0;
2766
+ overflow: hidden;
2767
+ clip: rect(0, 0, 0, 0);
2768
+ white-space: nowrap;
2769
+ border: 0;
2770
+ }
2771
+ }
2772
+ @media screen and (min-width: 75rem) {
2773
+ .pf-v6-u-visible-on-xl {
2774
+ position: static;
2775
+ overflow: visible;
2776
+ clip: auto;
2777
+ white-space: normal;
2778
+ border: inherit;
2779
+ }
2780
+ }
2781
+ @media screen and (min-width: 75rem) {
2782
+ .pf-v6-u-hidden-on-xl {
2783
+ display: none !important;
2784
+ }
2785
+ }
2786
+ @media screen and (min-width: 90.625rem) {
2787
+ .pf-v6-u-screen-reader-on-2xl {
2788
+ position: fixed;
2789
+ inset-block-start: 0;
2790
+ inset-inline-start: 0;
2791
+ overflow: hidden;
2792
+ clip: rect(0, 0, 0, 0);
2793
+ white-space: nowrap;
2794
+ border: 0;
2795
+ }
2796
+ }
2797
+ @media screen and (min-width: 90.625rem) {
2798
+ .pf-v6-u-visible-on-2xl {
2799
+ position: static;
2800
+ overflow: visible;
2801
+ clip: auto;
2802
+ white-space: normal;
2803
+ border: inherit;
2804
+ }
2805
+ }
2806
+ @media screen and (min-width: 90.625rem) {
2807
+ .pf-v6-u-hidden-on-2xl {
2808
+ display: none !important;
2809
+ }
2810
+ }
2811
+ .pf-v6-c-table {
2812
+ --pf-v6-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
2813
+ --pf-v6-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
2814
+ --pf-v6-c-table__tbody--after--border-width--base: var(--pf-t--global--border--width--extra-strong);
2815
+ --pf-v6-c-table__tbody--after--BorderInlineStartWidth: 0;
2816
+ --pf-v6-c-table__tbody--after--BorderColor: var(--pf-t--global--border--color--clicked);
2817
+ --pf-v6-c-table__tbody--responsive--m-expandable--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
2818
+ --pf-v6-c-table__tr--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
2819
+ --pf-v6-c-table__tr--responsive--last-child--BorderBlockEndWidth: var(--pf-v6-c-table__tbody--responsive--border-width--base);
2820
+ --pf-v6-c-table__tr--responsive--GridColumnGap: var(--pf-t--global--spacer--md);
2821
+ --pf-v6-c-table__tr--responsive--MarginBlockStart: var(--pf-v6-c-table__tbody--responsive--border-width--base);
2822
+ --pf-v6-c-table__tr--responsive--PaddingBlockStart: var(--pf-t--global--spacer--md);
2823
+ --pf-v6-c-table__tr--responsive--PaddingInlineEnd: var(--pf-t--global--spacer--inset--page-chrome);
2824
+ --pf-v6-c-table__tr--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--md);
2825
+ --pf-v6-c-table__tr--responsive--PaddingInlineStart: var(--pf-t--global--spacer--inset--page-chrome);
2826
+ --pf-v6-c-table__tr--responsive--nested-table--PaddingBlockStart: var(--pf-t--global--spacer--xl);
2827
+ --pf-v6-c-table__tr--responsive--nested-table--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2828
+ --pf-v6-c-table__tr--responsive--nested-table--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
2829
+ --pf-v6-c-table__tr--responsive--nested-table--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2830
+ --pf-v6-c-table__tbody--after__tr--BorderInlineStartWidth: 0;
2831
+ --pf-v6-c-table__tbody--after__tr--BorderInlineStartColor: transparent;
2832
+ --pf-v6-c-table__tbody--m-expanded--after__tr--BorderInlineStartWidth: var(--pf-v6-c-table__expandable-row--after--border-width--base);
2833
+ --pf-v6-c-table__tbody--m-expanded--after__tr--BorderInlineStartColor: var(--pf-t--global--border--color--clicked);
2834
+ --pf-v6-c-table__tbody--m-selected--after__tr--BorderInlineStartWidth: var(--pf-v6-c-table__expandable-row--after--border-width--base);
2835
+ --pf-v6-c-table__tbody--m-selected--after__tr--BorderInlineStartColor: var(--pf-t--global--border--color--clicked);
2836
+ --pf-v6-c-table--m-grid--cell--hidden-visible--Display: grid;
2837
+ --pf-v6-c-table--m-grid--cell--PaddingBlockStart: 0;
2838
+ --pf-v6-c-table--m-grid--cell--PaddingInlineEnd: 0;
2839
+ --pf-v6-c-table--m-grid--cell--PaddingBlockEnd: 0;
2840
+ --pf-v6-c-table--m-grid--cell--PaddingInlineStart: 0;
2841
+ --pf-v6-c-table-td--responsive--GridColumnGap: var(--pf-t--global--spacer--md);
2842
+ --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-t--global--spacer--md);
2843
+ --pf-v6-c-table--cell--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2844
+ --pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2845
+ --pf-v6-c-table--cell--responsive--PaddingInlineEnd: 0;
2846
+ --pf-v6-c-table--cell--responsive--PaddingInlineStart: 0;
2847
+ --pf-v6-c-table--cell--responsive--th--FontWeight: var(--pf-t--global--font--weight--body--bold);
2848
+ --pf-v6-c-table--m-compact__tr--responsive--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2849
+ --pf-v6-c-table--m-compact__tr--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2850
+ --pf-v6-c-table--m-compact__tr__td--responsive--PaddingBlockStart: var(--pf-t--global--spacer--xs);
2851
+ --pf-v6-c-table--m-compact__tr__td--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
2852
+ --pf-v6-c-table--m-compact__check--responsive--MarginBlockStart: 0.4375rem;
2853
+ --pf-v6-c-table--m-compact__action--responsive--MarginBlockStart: calc(var(--pf-t--global--spacer--xs) * -1);
2854
+ --pf-v6-c-table--m-compact__action--responsive--MarginBlockEnd: calc(var(--pf-t--global--spacer--xs) * -1);
2855
+ --pf-v6-c-table--m-compact__toggle--c-button--responsive--MarginBlockEnd: calc(var(--pf-t--global--spacer--xs) * -1);
2856
+ --pf-v6-c-table__expandable-row-content--responsive--PaddingInlineEnd: var(--pf-t--global--spacer--inset--page-chrome);
2485
2857
  --pf-v6-c-table__expandable-row-content--responsive--PaddingInlineStart: var(--pf-t--global--spacer--inset--page-chrome);
2486
2858
  --pf-v6-c-table__expandable-row-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2487
2859
  --pf-v6-c-table__check--responsive--MarginInlineStart: var(--pf-v6-c-table__tbody--responsive--border-width--base);
@@ -2542,6 +2914,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2542
2914
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
2543
2915
  }
2544
2916
 
2917
+ .pf-m-grid.pf-v6-c-table.pf-m-animate-expand {
2918
+ --pf-v6-c-table__expandable-row--Display: block;
2919
+ }
2920
+
2545
2921
  .pf-m-grid.pf-v6-c-table.pf-m-expandable {
2546
2922
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
2547
2923
  }
@@ -2556,7 +2932,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2556
2932
  --pf-v6-c-table__expandable-row--after--BorderColor: transparent;
2557
2933
  }
2558
2934
 
2559
- .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) {
2935
+ .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) {
2560
2936
  display: grid;
2561
2937
  grid-template-columns: 1fr;
2562
2938
  height: auto;
@@ -2568,14 +2944,14 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2568
2944
  padding-inline-start: var(--pf-v6-c-table__tr--responsive--PaddingInlineStart);
2569
2945
  }
2570
2946
 
2571
- .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td) {
2947
+ .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td) {
2572
2948
  padding-block-start: var(--pf-v6-c-table--cell--responsive--PaddingBlockStart);
2573
2949
  padding-inline-end: var(--pf-v6-c-table--cell--responsive--PaddingInlineEnd);
2574
2950
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
2575
2951
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
2576
2952
  }
2577
2953
 
2578
- .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child {
2954
+ .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td):first-child {
2579
2955
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
2580
2956
  }
2581
2957
 
@@ -2609,15 +2985,19 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2609
2985
  align-items: start;
2610
2986
  }
2611
2987
 
2988
+ .pf-m-grid.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
2989
+ align-items: center;
2990
+ }
2991
+
2612
2992
  .pf-m-grid.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
2613
2993
  grid-column: 2;
2614
2994
  }
2615
2995
 
2616
2996
  .pf-m-grid.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
2617
2997
  position: revert;
2618
- font-weight: bold;
2998
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
2619
2999
  text-align: start;
2620
- content: attr(data-label);
3000
+ content: var(--pf-v6-c-table--cell--responsive--label, attr(data-label));
2621
3001
  }
2622
3002
 
2623
3003
  .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td):first-child {
@@ -2671,7 +3051,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2671
3051
  background-color: transparent;
2672
3052
  }
2673
3053
 
2674
- .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row {
3054
+ .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) {
2675
3055
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: 0;
2676
3056
  --pf-v6-c-table--cell--responsive--PaddingInlineEnd: 0;
2677
3057
  --pf-v6-c-table--cell--responsive--PaddingBlockEnd: 0;
@@ -2684,29 +3064,29 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2684
3064
  border-block-end: none;
2685
3065
  }
2686
3066
 
2687
- .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row > :where(th, td) {
3067
+ .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :where(th, td) {
2688
3068
  position: static;
2689
3069
  display: block;
2690
3070
  }
2691
3071
 
2692
- .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row.pf-m-expanded {
3072
+ .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)).pf-m-expanded {
2693
3073
  border-block-start-color: var(--pf-v6-c-table--BorderColor);
2694
3074
  }
2695
3075
 
2696
- .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row > :first-child:not(.pf-v6-c-table__check)::after {
3076
+ .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :first-child:not(.pf-v6-c-table__check)::after {
2697
3077
  content: none;
2698
3078
  }
2699
3079
 
2700
- .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
2701
- .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
3080
+ .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
3081
+ .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
2702
3082
  padding: 0;
2703
3083
  }
2704
3084
 
2705
- .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row:not(.pf-m-expanded) {
3085
+ .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) {
2706
3086
  display: none;
2707
3087
  }
2708
3088
 
2709
- .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row .pf-v6-c-table__expandable-row-content {
3089
+ .pf-m-grid.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__expandable-row-content {
2710
3090
  padding-inline-end: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineEnd);
2711
3091
  padding-inline-start: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineStart);
2712
3092
  }
@@ -2751,10 +3131,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2751
3131
  background-color: var(--pf-v6-c-table__tr--m-selected--after--BorderInlineStartColor);
2752
3132
  }
2753
3133
 
2754
- .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__toggle,
2755
- .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__check,
2756
- .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__favorite,
2757
- .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__action {
3134
+ .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__toggle,
3135
+ .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__check,
3136
+ .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__favorite,
3137
+ .pf-m-grid.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__action {
2758
3138
  width: auto;
2759
3139
  padding: 0;
2760
3140
  }
@@ -2896,6 +3276,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2896
3276
  .pf-m-grid-md.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
2897
3277
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
2898
3278
  }
3279
+ .pf-m-grid-md.pf-v6-c-table.pf-m-animate-expand {
3280
+ --pf-v6-c-table__expandable-row--Display: block;
3281
+ }
2899
3282
  .pf-m-grid-md.pf-v6-c-table.pf-m-expandable {
2900
3283
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
2901
3284
  }
@@ -2907,7 +3290,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2907
3290
  --pf-v6-c-table__expandable-row--after--BorderInlineStartWidth: 0;
2908
3291
  --pf-v6-c-table__expandable-row--after--BorderColor: transparent;
2909
3292
  }
2910
- .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) {
3293
+ .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) {
2911
3294
  display: grid;
2912
3295
  grid-template-columns: 1fr;
2913
3296
  height: auto;
@@ -2918,13 +3301,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2918
3301
  padding-block-end: var(--pf-v6-c-table__tr--responsive--PaddingBlockEnd);
2919
3302
  padding-inline-start: var(--pf-v6-c-table__tr--responsive--PaddingInlineStart);
2920
3303
  }
2921
- .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td) {
3304
+ .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td) {
2922
3305
  padding-block-start: var(--pf-v6-c-table--cell--responsive--PaddingBlockStart);
2923
3306
  padding-inline-end: var(--pf-v6-c-table--cell--responsive--PaddingInlineEnd);
2924
3307
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
2925
3308
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
2926
3309
  }
2927
- .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child {
3310
+ .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td):first-child {
2928
3311
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
2929
3312
  }
2930
3313
  .pf-m-grid-md.pf-v6-c-table.pf-m-compact {
@@ -2952,14 +3335,17 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2952
3335
  grid-template-columns: 1fr minmax(0, 1.5fr);
2953
3336
  align-items: start;
2954
3337
  }
3338
+ .pf-m-grid-md.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
3339
+ align-items: center;
3340
+ }
2955
3341
  .pf-m-grid-md.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
2956
3342
  grid-column: 2;
2957
3343
  }
2958
3344
  .pf-m-grid-md.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
2959
3345
  position: revert;
2960
- font-weight: bold;
3346
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
2961
3347
  text-align: start;
2962
- content: attr(data-label);
3348
+ content: var(--pf-v6-c-table--cell--responsive--label, attr(data-label));
2963
3349
  }
2964
3350
  .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td):first-child {
2965
3351
  --pf-v6-c-table--cell--PaddingInlineStart: 0;
@@ -3003,7 +3389,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3003
3389
  width: auto;
3004
3390
  background-color: transparent;
3005
3391
  }
3006
- .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row {
3392
+ .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) {
3007
3393
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: 0;
3008
3394
  --pf-v6-c-table--cell--responsive--PaddingInlineEnd: 0;
3009
3395
  --pf-v6-c-table--cell--responsive--PaddingBlockEnd: 0;
@@ -3015,24 +3401,24 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3015
3401
  overflow-y: auto;
3016
3402
  border-block-end: none;
3017
3403
  }
3018
- .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row > :where(th, td) {
3404
+ .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :where(th, td) {
3019
3405
  position: static;
3020
3406
  display: block;
3021
3407
  }
3022
- .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row.pf-m-expanded {
3408
+ .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)).pf-m-expanded {
3023
3409
  border-block-start-color: var(--pf-v6-c-table--BorderColor);
3024
3410
  }
3025
- .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row > :first-child:not(.pf-v6-c-table__check)::after {
3411
+ .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :first-child:not(.pf-v6-c-table__check)::after {
3026
3412
  content: none;
3027
3413
  }
3028
- .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
3029
- .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
3414
+ .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
3415
+ .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
3030
3416
  padding: 0;
3031
3417
  }
3032
- .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row:not(.pf-m-expanded) {
3418
+ .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) {
3033
3419
  display: none;
3034
3420
  }
3035
- .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row .pf-v6-c-table__expandable-row-content {
3421
+ .pf-m-grid-md.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__expandable-row-content {
3036
3422
  padding-inline-end: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineEnd);
3037
3423
  padding-inline-start: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineStart);
3038
3424
  }
@@ -3070,10 +3456,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3070
3456
  width: var(--pf-v6-c-table__tr--m-selected--after--BorderInlineStartWidth);
3071
3457
  background-color: var(--pf-v6-c-table__tr--m-selected--after--BorderInlineStartColor);
3072
3458
  }
3073
- .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__toggle,
3074
- .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__check,
3075
- .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__favorite,
3076
- .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__action {
3459
+ .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__toggle,
3460
+ .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__check,
3461
+ .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__favorite,
3462
+ .pf-m-grid-md.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__action {
3077
3463
  width: auto;
3078
3464
  padding: 0;
3079
3465
  }
@@ -3198,6 +3584,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3198
3584
  .pf-m-grid-lg.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
3199
3585
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
3200
3586
  }
3587
+ .pf-m-grid-lg.pf-v6-c-table.pf-m-animate-expand {
3588
+ --pf-v6-c-table__expandable-row--Display: block;
3589
+ }
3201
3590
  .pf-m-grid-lg.pf-v6-c-table.pf-m-expandable {
3202
3591
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
3203
3592
  }
@@ -3209,7 +3598,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3209
3598
  --pf-v6-c-table__expandable-row--after--BorderInlineStartWidth: 0;
3210
3599
  --pf-v6-c-table__expandable-row--after--BorderColor: transparent;
3211
3600
  }
3212
- .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) {
3601
+ .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) {
3213
3602
  display: grid;
3214
3603
  grid-template-columns: 1fr;
3215
3604
  height: auto;
@@ -3220,13 +3609,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3220
3609
  padding-block-end: var(--pf-v6-c-table__tr--responsive--PaddingBlockEnd);
3221
3610
  padding-inline-start: var(--pf-v6-c-table__tr--responsive--PaddingInlineStart);
3222
3611
  }
3223
- .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td) {
3612
+ .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td) {
3224
3613
  padding-block-start: var(--pf-v6-c-table--cell--responsive--PaddingBlockStart);
3225
3614
  padding-inline-end: var(--pf-v6-c-table--cell--responsive--PaddingInlineEnd);
3226
3615
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
3227
3616
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
3228
3617
  }
3229
- .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child {
3618
+ .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td):first-child {
3230
3619
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
3231
3620
  }
3232
3621
  .pf-m-grid-lg.pf-v6-c-table.pf-m-compact {
@@ -3254,14 +3643,17 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3254
3643
  grid-template-columns: 1fr minmax(0, 1.5fr);
3255
3644
  align-items: start;
3256
3645
  }
3646
+ .pf-m-grid-lg.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
3647
+ align-items: center;
3648
+ }
3257
3649
  .pf-m-grid-lg.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
3258
3650
  grid-column: 2;
3259
3651
  }
3260
3652
  .pf-m-grid-lg.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
3261
3653
  position: revert;
3262
- font-weight: bold;
3654
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
3263
3655
  text-align: start;
3264
- content: attr(data-label);
3656
+ content: var(--pf-v6-c-table--cell--responsive--label, attr(data-label));
3265
3657
  }
3266
3658
  .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td):first-child {
3267
3659
  --pf-v6-c-table--cell--PaddingInlineStart: 0;
@@ -3305,7 +3697,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3305
3697
  width: auto;
3306
3698
  background-color: transparent;
3307
3699
  }
3308
- .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row {
3700
+ .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) {
3309
3701
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: 0;
3310
3702
  --pf-v6-c-table--cell--responsive--PaddingInlineEnd: 0;
3311
3703
  --pf-v6-c-table--cell--responsive--PaddingBlockEnd: 0;
@@ -3317,24 +3709,24 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3317
3709
  overflow-y: auto;
3318
3710
  border-block-end: none;
3319
3711
  }
3320
- .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row > :where(th, td) {
3712
+ .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :where(th, td) {
3321
3713
  position: static;
3322
3714
  display: block;
3323
3715
  }
3324
- .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row.pf-m-expanded {
3716
+ .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)).pf-m-expanded {
3325
3717
  border-block-start-color: var(--pf-v6-c-table--BorderColor);
3326
3718
  }
3327
- .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row > :first-child:not(.pf-v6-c-table__check)::after {
3719
+ .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :first-child:not(.pf-v6-c-table__check)::after {
3328
3720
  content: none;
3329
3721
  }
3330
- .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
3331
- .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
3722
+ .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
3723
+ .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
3332
3724
  padding: 0;
3333
3725
  }
3334
- .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row:not(.pf-m-expanded) {
3726
+ .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) {
3335
3727
  display: none;
3336
3728
  }
3337
- .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row .pf-v6-c-table__expandable-row-content {
3729
+ .pf-m-grid-lg.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__expandable-row-content {
3338
3730
  padding-inline-end: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineEnd);
3339
3731
  padding-inline-start: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineStart);
3340
3732
  }
@@ -3372,10 +3764,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3372
3764
  width: var(--pf-v6-c-table__tr--m-selected--after--BorderInlineStartWidth);
3373
3765
  background-color: var(--pf-v6-c-table__tr--m-selected--after--BorderInlineStartColor);
3374
3766
  }
3375
- .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__toggle,
3376
- .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__check,
3377
- .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__favorite,
3378
- .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__action {
3767
+ .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__toggle,
3768
+ .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__check,
3769
+ .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__favorite,
3770
+ .pf-m-grid-lg.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__action {
3379
3771
  width: auto;
3380
3772
  padding: 0;
3381
3773
  }
@@ -3500,6 +3892,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3500
3892
  .pf-m-grid-xl.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
3501
3893
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
3502
3894
  }
3895
+ .pf-m-grid-xl.pf-v6-c-table.pf-m-animate-expand {
3896
+ --pf-v6-c-table__expandable-row--Display: block;
3897
+ }
3503
3898
  .pf-m-grid-xl.pf-v6-c-table.pf-m-expandable {
3504
3899
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
3505
3900
  }
@@ -3511,7 +3906,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3511
3906
  --pf-v6-c-table__expandable-row--after--BorderInlineStartWidth: 0;
3512
3907
  --pf-v6-c-table__expandable-row--after--BorderColor: transparent;
3513
3908
  }
3514
- .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) {
3909
+ .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) {
3515
3910
  display: grid;
3516
3911
  grid-template-columns: 1fr;
3517
3912
  height: auto;
@@ -3522,13 +3917,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3522
3917
  padding-block-end: var(--pf-v6-c-table__tr--responsive--PaddingBlockEnd);
3523
3918
  padding-inline-start: var(--pf-v6-c-table__tr--responsive--PaddingInlineStart);
3524
3919
  }
3525
- .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td) {
3920
+ .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td) {
3526
3921
  padding-block-start: var(--pf-v6-c-table--cell--responsive--PaddingBlockStart);
3527
3922
  padding-inline-end: var(--pf-v6-c-table--cell--responsive--PaddingInlineEnd);
3528
3923
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
3529
3924
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
3530
3925
  }
3531
- .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child {
3926
+ .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td):first-child {
3532
3927
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
3533
3928
  }
3534
3929
  .pf-m-grid-xl.pf-v6-c-table.pf-m-compact {
@@ -3556,14 +3951,17 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3556
3951
  grid-template-columns: 1fr minmax(0, 1.5fr);
3557
3952
  align-items: start;
3558
3953
  }
3954
+ .pf-m-grid-xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
3955
+ align-items: center;
3956
+ }
3559
3957
  .pf-m-grid-xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
3560
3958
  grid-column: 2;
3561
3959
  }
3562
3960
  .pf-m-grid-xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
3563
3961
  position: revert;
3564
- font-weight: bold;
3962
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
3565
3963
  text-align: start;
3566
- content: attr(data-label);
3964
+ content: var(--pf-v6-c-table--cell--responsive--label, attr(data-label));
3567
3965
  }
3568
3966
  .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td):first-child {
3569
3967
  --pf-v6-c-table--cell--PaddingInlineStart: 0;
@@ -3607,7 +4005,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3607
4005
  width: auto;
3608
4006
  background-color: transparent;
3609
4007
  }
3610
- .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row {
4008
+ .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) {
3611
4009
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: 0;
3612
4010
  --pf-v6-c-table--cell--responsive--PaddingInlineEnd: 0;
3613
4011
  --pf-v6-c-table--cell--responsive--PaddingBlockEnd: 0;
@@ -3619,24 +4017,24 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3619
4017
  overflow-y: auto;
3620
4018
  border-block-end: none;
3621
4019
  }
3622
- .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row > :where(th, td) {
4020
+ .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :where(th, td) {
3623
4021
  position: static;
3624
4022
  display: block;
3625
4023
  }
3626
- .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row.pf-m-expanded {
4024
+ .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)).pf-m-expanded {
3627
4025
  border-block-start-color: var(--pf-v6-c-table--BorderColor);
3628
4026
  }
3629
- .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row > :first-child:not(.pf-v6-c-table__check)::after {
4027
+ .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :first-child:not(.pf-v6-c-table__check)::after {
3630
4028
  content: none;
3631
4029
  }
3632
- .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
3633
- .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
4030
+ .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
4031
+ .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
3634
4032
  padding: 0;
3635
4033
  }
3636
- .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row:not(.pf-m-expanded) {
4034
+ .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) {
3637
4035
  display: none;
3638
4036
  }
3639
- .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row .pf-v6-c-table__expandable-row-content {
4037
+ .pf-m-grid-xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__expandable-row-content {
3640
4038
  padding-inline-end: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineEnd);
3641
4039
  padding-inline-start: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineStart);
3642
4040
  }
@@ -3674,10 +4072,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3674
4072
  width: var(--pf-v6-c-table__tr--m-selected--after--BorderInlineStartWidth);
3675
4073
  background-color: var(--pf-v6-c-table__tr--m-selected--after--BorderInlineStartColor);
3676
4074
  }
3677
- .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__toggle,
3678
- .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__check,
3679
- .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__favorite,
3680
- .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__action {
4075
+ .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__toggle,
4076
+ .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__check,
4077
+ .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__favorite,
4078
+ .pf-m-grid-xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__action {
3681
4079
  width: auto;
3682
4080
  padding: 0;
3683
4081
  }
@@ -3802,6 +4200,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3802
4200
  .pf-m-grid-2xl.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
3803
4201
  border-block-start: var(--pf-v6-c-table__tbody--responsive--border-width--base) solid var(--pf-v6-c-table--responsive--BorderColor);
3804
4202
  }
4203
+ .pf-m-grid-2xl.pf-v6-c-table.pf-m-animate-expand {
4204
+ --pf-v6-c-table__expandable-row--Display: block;
4205
+ }
3805
4206
  .pf-m-grid-2xl.pf-v6-c-table.pf-m-expandable {
3806
4207
  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
3807
4208
  }
@@ -3813,7 +4214,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3813
4214
  --pf-v6-c-table__expandable-row--after--BorderInlineStartWidth: 0;
3814
4215
  --pf-v6-c-table__expandable-row--after--BorderColor: transparent;
3815
4216
  }
3816
- .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) {
4217
+ .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) {
3817
4218
  display: grid;
3818
4219
  grid-template-columns: 1fr;
3819
4220
  height: auto;
@@ -3824,13 +4225,13 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3824
4225
  padding-block-end: var(--pf-v6-c-table__tr--responsive--PaddingBlockEnd);
3825
4226
  padding-inline-start: var(--pf-v6-c-table__tr--responsive--PaddingInlineStart);
3826
4227
  }
3827
- .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td) {
4228
+ .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td) {
3828
4229
  padding-block-start: var(--pf-v6-c-table--cell--responsive--PaddingBlockStart);
3829
4230
  padding-inline-end: var(--pf-v6-c-table--cell--responsive--PaddingInlineEnd);
3830
4231
  padding-block-end: var(--pf-v6-c-table--cell--responsive--PaddingBlockEnd);
3831
4232
  padding-inline-start: var(--pf-v6-c-table--cell--responsive--PaddingInlineStart);
3832
4233
  }
3833
- .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) > :where(th, td):first-child {
4234
+ .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) > :where(th, td):first-child {
3834
4235
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart);
3835
4236
  }
3836
4237
  .pf-m-grid-2xl.pf-v6-c-table.pf-m-compact {
@@ -3858,14 +4259,17 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3858
4259
  grid-template-columns: 1fr minmax(0, 1.5fr);
3859
4260
  align-items: start;
3860
4261
  }
4262
+ .pf-m-grid-2xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label].pf-m-action {
4263
+ align-items: center;
4264
+ }
3861
4265
  .pf-m-grid-2xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label] > * {
3862
4266
  grid-column: 2;
3863
4267
  }
3864
4268
  .pf-m-grid-2xl.pf-v6-c-table :where(.pf-v6-c-table__th, .pf-v6-c-table__td)[data-label]::before {
3865
4269
  position: revert;
3866
- font-weight: bold;
4270
+ font-weight: var(--pf-v6-c-table--cell--responsive--th--FontWeight);
3867
4271
  text-align: start;
3868
- content: attr(data-label);
4272
+ content: var(--pf-v6-c-table--cell--responsive--label, attr(data-label));
3869
4273
  }
3870
4274
  .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr) > :where(th, td):first-child {
3871
4275
  --pf-v6-c-table--cell--PaddingInlineStart: 0;
@@ -3909,7 +4313,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3909
4313
  width: auto;
3910
4314
  background-color: transparent;
3911
4315
  }
3912
- .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row {
4316
+ .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) {
3913
4317
  --pf-v6-c-table--cell--responsive--PaddingBlockStart: 0;
3914
4318
  --pf-v6-c-table--cell--responsive--PaddingInlineEnd: 0;
3915
4319
  --pf-v6-c-table--cell--responsive--PaddingBlockEnd: 0;
@@ -3921,24 +4325,24 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3921
4325
  overflow-y: auto;
3922
4326
  border-block-end: none;
3923
4327
  }
3924
- .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row > :where(th, td) {
4328
+ .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :where(th, td) {
3925
4329
  position: static;
3926
4330
  display: block;
3927
4331
  }
3928
- .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row.pf-m-expanded {
4332
+ .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)).pf-m-expanded {
3929
4333
  border-block-start-color: var(--pf-v6-c-table--BorderColor);
3930
4334
  }
3931
- .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row > :first-child:not(.pf-v6-c-table__check)::after {
4335
+ .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) > :first-child:not(.pf-v6-c-table__check)::after {
3932
4336
  content: none;
3933
4337
  }
3934
- .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
3935
- .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
4338
+ .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) th:where(.pf-v6-c-table__th).pf-m-no-padding .pf-v6-c-table__expandable-row-content,
4339
+ .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) td:where(.pf-v6-c-table__td).pf-m-no-padding .pf-v6-c-table__expandable-row-content {
3936
4340
  padding: 0;
3937
4341
  }
3938
- .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row:not(.pf-m-expanded) {
4342
+ .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)):not(.pf-m-expanded) {
3939
4343
  display: none;
3940
4344
  }
3941
- .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row .pf-v6-c-table__expandable-row-content {
4345
+ .pf-m-grid-2xl.pf-v6-c-table .pf-v6-c-table__expandable-row:where(:nth-child(n+2)) .pf-v6-c-table__expandable-row-content {
3942
4346
  padding-inline-end: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineEnd);
3943
4347
  padding-inline-start: var(--pf-v6-c-table__expandable-row-content--responsive--PaddingInlineStart);
3944
4348
  }
@@ -3976,10 +4380,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3976
4380
  width: var(--pf-v6-c-table__tr--m-selected--after--BorderInlineStartWidth);
3977
4381
  background-color: var(--pf-v6-c-table__tr--m-selected--after--BorderInlineStartColor);
3978
4382
  }
3979
- .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__toggle,
3980
- .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__check,
3981
- .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__favorite,
3982
- .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row) .pf-v6-c-table__action {
4383
+ .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__toggle,
4384
+ .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__check,
4385
+ .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__favorite,
4386
+ .pf-m-grid-2xl.pf-v6-c-table tr:where(.pf-v6-c-table__tr):not(.pf-v6-c-table__expandable-row:where(:nth-child(n+2))) .pf-v6-c-table__action {
3983
4387
  width: auto;
3984
4388
  padding: 0;
3985
4389
  }
@@ -4064,278 +4468,39 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4064
4468
  --pf-v6-c-table--cell--Width: auto;
4065
4469
  }
4066
4470
  }
4067
- .pf-v6-c-inline-edit {
4068
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
4069
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
4070
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
4071
- --pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--plain);
4072
- --pf-v6-c-inline-edit__group--m-footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
4073
- --pf-v6-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
4074
- }
4075
-
4076
- .pf-v6-c-inline-edit__group {
4077
- display: flex;
4078
- align-items: baseline;
4471
+ .pf-v6-c-tooltip {
4472
+ --pf-v6-c-tooltip--MaxWidth: 18.75rem;
4473
+ --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
4474
+ --pf-v6-c-tooltip__content--PaddingBlockStart: var(--pf-t--global--spacer--sm);
4475
+ --pf-v6-c-tooltip__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
4476
+ --pf-v6-c-tooltip__content--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
4477
+ --pf-v6-c-tooltip__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
4478
+ --pf-v6-c-tooltip__content--Color: var(--pf-t--global--text--color--inverse);
4479
+ --pf-v6-c-tooltip__content--BackgroundColor: var(--pf-t--global--background--color--inverse--default);
4480
+ --pf-v6-c-tooltip__content--FontSize: var(--pf-t--global--font--size--body--sm);
4481
+ --pf-v6-c-tooltip__content--BorderRadius: var(--pf-t--global--border--radius--small);
4482
+ --pf-v6-c-tooltip__arrow--Width: 0.9375rem;
4483
+ --pf-v6-c-tooltip__arrow--Height: 0.9375rem;
4484
+ --pf-v6-c-tooltip__arrow--BackgroundColor: var(--pf-t--global--background--color--inverse--default);
4485
+ --pf-v6-c-tooltip__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
4486
+ --pf-v6-c-tooltip__arrow--m-top--TranslateX: -50%;
4487
+ --pf-v6-c-tooltip__arrow--m-top--TranslateY: 50%;
4488
+ --pf-v6-c-tooltip__arrow--m-top--Rotate: 45deg;
4489
+ --pf-v6-c-tooltip__arrow--m-right--TranslateX: -50%;
4490
+ --pf-v6-c-tooltip__arrow--m-right--TranslateY: -50%;
4491
+ --pf-v6-c-tooltip__arrow--m-right--Rotate: 45deg;
4492
+ --pf-v6-c-tooltip__arrow--m-bottom--TranslateX: -50%;
4493
+ --pf-v6-c-tooltip__arrow--m-bottom--TranslateY: -50%;
4494
+ --pf-v6-c-tooltip__arrow--m-bottom--Rotate: 45deg;
4495
+ --pf-v6-c-tooltip__arrow--m-left--TranslateX: 50%;
4496
+ --pf-v6-c-tooltip__arrow--m-left--TranslateY: -50%;
4497
+ --pf-v6-c-tooltip__arrow--m-left--Rotate: 45deg;
4079
4498
  }
4080
4499
 
4081
- .pf-v6-c-inline-edit__group > * {
4082
- margin-inline-end: var(--pf-v6-c-inline-edit__group--item--MarginInlineEnd);
4083
- }
4084
-
4085
- .pf-v6-c-inline-edit__group.pf-m-icon-group {
4086
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd);
4087
- }
4088
-
4089
- .pf-v6-c-inline-edit__group.pf-m-footer {
4090
- margin-block-start: var(--pf-v6-c-inline-edit__group--m-footer--MarginBlockStart);
4091
- }
4092
-
4093
- .pf-v6-c-inline-edit__group.pf-m-column {
4094
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
4095
- flex-direction: column;
4096
- }
4097
-
4098
- .pf-v6-c-inline-edit__group > :last-child {
4099
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
4100
- }
4101
-
4102
- .pf-v6-c-inline-edit__input {
4103
- flex: 1;
4104
- }
4105
-
4106
- .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain {
4107
- --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color);
4108
- }
4109
-
4110
- .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain:hover {
4111
- --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color);
4112
- }
4113
-
4114
- .pf-v6-c-inline-edit__input,
4115
- .pf-v6-c-inline-edit__action,
4116
- .pf-v6-c-inline-edit__group.pf-m-action-group {
4117
- display: none;
4118
- }
4119
-
4120
- .pf-v6-c-inline-edit__action.pf-m-enable-editable {
4121
- display: inline-block;
4122
- }
4123
-
4124
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__input,
4125
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__input {
4126
- display: block;
4127
- }
4128
-
4129
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action,
4130
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action {
4131
- display: inline-block;
4132
- }
4133
-
4134
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group,
4135
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group {
4136
- display: inline-flex;
4137
- }
4138
-
4139
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__value,
4140
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable,
4141
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__value,
4142
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable {
4143
- display: none;
4144
- }
4145
-
4146
- .pf-v6-c-inline-edit__label + .pf-v6-c-inline-edit__action.pf-m-enable > .pf-v6-c-button {
4147
- margin-block-start: calc(var(--pf-v6-c-button--PaddingBlockStart) * -1);
4148
- margin-block-end: calc(var(--pf-v6-c-button--PaddingBlockEnd) * -1);
4149
- }
4150
-
4151
- .pf-v6-c-inline-edit__label.pf-m-bold {
4152
- font-weight: var(--pf-v6-c-inline-edit__label--m-bold--FontWeight);
4153
- }
4154
-
4155
- .pf-v6-c-inline-edit__editable-text br {
4156
- display: none;
4157
- }
4158
-
4159
- .pf-v6-u-screen-reader {
4160
- position: fixed;
4161
- inset-block-start: 0;
4162
- inset-inline-start: 0;
4163
- overflow: hidden;
4164
- clip: rect(0, 0, 0, 0);
4165
- white-space: nowrap;
4166
- border: 0;
4167
- }
4168
-
4169
- .pf-v6-u-visible {
4170
- position: static;
4171
- overflow: visible;
4172
- clip: auto;
4173
- white-space: normal;
4174
- border: inherit;
4175
- }
4176
-
4177
- .pf-v6-u-hidden {
4178
- display: none !important;
4179
- }
4180
-
4181
- @media screen and (min-width: 36rem) {
4182
- .pf-v6-u-screen-reader-on-sm {
4183
- position: fixed;
4184
- inset-block-start: 0;
4185
- inset-inline-start: 0;
4186
- overflow: hidden;
4187
- clip: rect(0, 0, 0, 0);
4188
- white-space: nowrap;
4189
- border: 0;
4190
- }
4191
- }
4192
- @media screen and (min-width: 36rem) {
4193
- .pf-v6-u-visible-on-sm {
4194
- position: static;
4195
- overflow: visible;
4196
- clip: auto;
4197
- white-space: normal;
4198
- border: inherit;
4199
- }
4200
- }
4201
- @media screen and (min-width: 36rem) {
4202
- .pf-v6-u-hidden-on-sm {
4203
- display: none !important;
4204
- }
4205
- }
4206
- @media screen and (min-width: 48rem) {
4207
- .pf-v6-u-screen-reader-on-md {
4208
- position: fixed;
4209
- inset-block-start: 0;
4210
- inset-inline-start: 0;
4211
- overflow: hidden;
4212
- clip: rect(0, 0, 0, 0);
4213
- white-space: nowrap;
4214
- border: 0;
4215
- }
4216
- }
4217
- @media screen and (min-width: 48rem) {
4218
- .pf-v6-u-visible-on-md {
4219
- position: static;
4220
- overflow: visible;
4221
- clip: auto;
4222
- white-space: normal;
4223
- border: inherit;
4224
- }
4225
- }
4226
- @media screen and (min-width: 48rem) {
4227
- .pf-v6-u-hidden-on-md {
4228
- display: none !important;
4229
- }
4230
- }
4231
- @media screen and (min-width: 62rem) {
4232
- .pf-v6-u-screen-reader-on-lg {
4233
- position: fixed;
4234
- inset-block-start: 0;
4235
- inset-inline-start: 0;
4236
- overflow: hidden;
4237
- clip: rect(0, 0, 0, 0);
4238
- white-space: nowrap;
4239
- border: 0;
4240
- }
4241
- }
4242
- @media screen and (min-width: 62rem) {
4243
- .pf-v6-u-visible-on-lg {
4244
- position: static;
4245
- overflow: visible;
4246
- clip: auto;
4247
- white-space: normal;
4248
- border: inherit;
4249
- }
4250
- }
4251
- @media screen and (min-width: 62rem) {
4252
- .pf-v6-u-hidden-on-lg {
4253
- display: none !important;
4254
- }
4255
- }
4256
- @media screen and (min-width: 75rem) {
4257
- .pf-v6-u-screen-reader-on-xl {
4258
- position: fixed;
4259
- inset-block-start: 0;
4260
- inset-inline-start: 0;
4261
- overflow: hidden;
4262
- clip: rect(0, 0, 0, 0);
4263
- white-space: nowrap;
4264
- border: 0;
4265
- }
4266
- }
4267
- @media screen and (min-width: 75rem) {
4268
- .pf-v6-u-visible-on-xl {
4269
- position: static;
4270
- overflow: visible;
4271
- clip: auto;
4272
- white-space: normal;
4273
- border: inherit;
4274
- }
4275
- }
4276
- @media screen and (min-width: 75rem) {
4277
- .pf-v6-u-hidden-on-xl {
4278
- display: none !important;
4279
- }
4280
- }
4281
- @media screen and (min-width: 90.625rem) {
4282
- .pf-v6-u-screen-reader-on-2xl {
4283
- position: fixed;
4284
- inset-block-start: 0;
4285
- inset-inline-start: 0;
4286
- overflow: hidden;
4287
- clip: rect(0, 0, 0, 0);
4288
- white-space: nowrap;
4289
- border: 0;
4290
- }
4291
- }
4292
- @media screen and (min-width: 90.625rem) {
4293
- .pf-v6-u-visible-on-2xl {
4294
- position: static;
4295
- overflow: visible;
4296
- clip: auto;
4297
- white-space: normal;
4298
- border: inherit;
4299
- }
4300
- }
4301
- @media screen and (min-width: 90.625rem) {
4302
- .pf-v6-u-hidden-on-2xl {
4303
- display: none !important;
4304
- }
4305
- }
4306
- .pf-v6-c-tooltip {
4307
- --pf-v6-c-tooltip--MaxWidth: 18.75rem;
4308
- --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
4309
- --pf-v6-c-tooltip__content--PaddingBlockStart: var(--pf-t--global--spacer--sm);
4310
- --pf-v6-c-tooltip__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
4311
- --pf-v6-c-tooltip__content--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
4312
- --pf-v6-c-tooltip__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
4313
- --pf-v6-c-tooltip__content--Color: var(--pf-t--global--text--color--inverse);
4314
- --pf-v6-c-tooltip__content--BackgroundColor: var(--pf-t--global--background--color--inverse--default);
4315
- --pf-v6-c-tooltip__content--FontSize: var(--pf-t--global--font--size--body--sm);
4316
- --pf-v6-c-tooltip__content--BorderRadius: var(--pf-t--global--border--radius--small);
4317
- --pf-v6-c-tooltip__arrow--Width: 0.9375rem;
4318
- --pf-v6-c-tooltip__arrow--Height: 0.9375rem;
4319
- --pf-v6-c-tooltip__arrow--BackgroundColor: var(--pf-t--global--background--color--inverse--default);
4320
- --pf-v6-c-tooltip__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
4321
- --pf-v6-c-tooltip__arrow--m-top--TranslateX: -50%;
4322
- --pf-v6-c-tooltip__arrow--m-top--TranslateY: 50%;
4323
- --pf-v6-c-tooltip__arrow--m-top--Rotate: 45deg;
4324
- --pf-v6-c-tooltip__arrow--m-right--TranslateX: -50%;
4325
- --pf-v6-c-tooltip__arrow--m-right--TranslateY: -50%;
4326
- --pf-v6-c-tooltip__arrow--m-right--Rotate: 45deg;
4327
- --pf-v6-c-tooltip__arrow--m-bottom--TranslateX: -50%;
4328
- --pf-v6-c-tooltip__arrow--m-bottom--TranslateY: -50%;
4329
- --pf-v6-c-tooltip__arrow--m-bottom--Rotate: 45deg;
4330
- --pf-v6-c-tooltip__arrow--m-left--TranslateX: 50%;
4331
- --pf-v6-c-tooltip__arrow--m-left--TranslateY: -50%;
4332
- --pf-v6-c-tooltip__arrow--m-left--Rotate: 45deg;
4333
- }
4334
-
4335
- .pf-v6-c-tooltip {
4336
- position: relative;
4337
- max-width: var(--pf-v6-c-tooltip--MaxWidth);
4338
- box-shadow: var(--pf-v6-c-tooltip--BoxShadow);
4500
+ .pf-v6-c-tooltip {
4501
+ position: relative;
4502
+ max-width: var(--pf-v6-c-tooltip--MaxWidth);
4503
+ box-shadow: var(--pf-v6-c-tooltip--BoxShadow);
4339
4504
  }
4340
4505
 
4341
4506
  .pf-v6-c-tooltip:is(.pf-m-top,
@@ -4460,15 +4625,20 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4460
4625
  --pf-v6-c-button--TextDecorationLine: none;
4461
4626
  --pf-v6-c-button--TextDecorationStyle: none;
4462
4627
  --pf-v6-c-button--TextDecorationColor: currentcolor;
4628
+ --pf-v6-c-button--TransitionDelay: 0s;
4463
4629
  --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
4464
- --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
4465
- --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
4630
+ --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
4631
+ --pf-v6-c-button--TransitionProperty: color, background, border-width, border-color;
4632
+ --pf-v6-c-button--ScaleX: 1;
4633
+ --pf-v6-c-button--ScaleY: 1;
4466
4634
  --pf-v6-c-button--hover--BackgroundColor: transparent;
4467
4635
  --pf-v6-c-button--hover--BorderColor: transparent;
4468
4636
  --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
4469
4637
  --pf-v6-c-button--hover--TextDecorationLine: none;
4470
4638
  --pf-v6-c-button--hover--TextDecorationStyle: none;
4471
4639
  --pf-v6-c-button--hover--TextDecorationColor: currentcolor;
4640
+ --pf-v6-c-button--hover--ScaleX: 1;
4641
+ --pf-v6-c-button--hover--ScaleY: 1;
4472
4642
  --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
4473
4643
  --pf-v6-c-button--m-clicked--BorderColor: transparent;
4474
4644
  --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
@@ -4678,12 +4848,30 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4678
4848
  --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
4679
4849
  --pf-v6-c-button--m-notify__icon--AnimationDuration--notify: var(--pf-t--global--motion--duration--3xl);
4680
4850
  --pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify: var(--pf-t--global--motion--timing-function--default);
4851
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
4852
+ --pf-v6-c-button__icon--TransitionTimingFunction: auto;
4853
+ --pf-v6-c-button__icon--TransitionDuration: 0s;
4854
+ --pf-v6-c-button__icon--TransitionProperty: none;
4855
+ --pf-v6-c-button__icon--Rotate: 0deg;
4856
+ --pf-v6-c-button--hover__icon--TransitionTimingFunction: auto;
4857
+ --pf-v6-c-button--hover__icon--TransitionDuration: 0s;
4858
+ --pf-v6-c-button--hover__icon--TransitionProperty: none;
4859
+ --pf-v6-c-button--hover__icon--Rotate: 0deg;
4860
+ --pf-v6-c-button__icon--ScaleX: 1;
4861
+ --pf-v6-c-button__icon--ScaleY: 1;
4862
+ --pf-v6-c-button--hover__icon--ScaleX: 1;
4863
+ --pf-v6-c-button--hover__icon--ScaleY: 1;
4681
4864
  --pf-v6-c-button--m-favorite__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
4682
4865
  --pf-v6-c-button--m-favorite__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
4683
4866
  --pf-v6-c-button--m-favorited__icon--Color: var(--pf-t--global--color--favorite--default);
4684
4867
  --pf-v6-c-button--m-favorited--hover__icon--Color: var(--pf-t--global--color--favorite--hover);
4685
4868
  --pf-v6-c-button--m-favorited__icon--AnimationDuration: var(--pf-t--global--motion--duration--icon--long);
4686
4869
  --pf-v6-c-button--m-favorited__icon--AnimationTimingFunction: var(--pf-t--global--motion--timing-function--default);
4870
+ --pf-v6-c-button__icon--favorite--Opacity: 1;
4871
+ --pf-v6-c-button__icon--favorited--Opacity: 0;
4872
+ --pf-v6-c-button--m-favorited__icon--favorite--Opacity: 0;
4873
+ --pf-v6-c-button--m-favorited__icon--favorited--Opacity: 1;
4874
+ --pf-v6-c-button__icon--favorite--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
4687
4875
  --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
4688
4876
  --pf-v6-c-button__progress--Opacity: 0;
4689
4877
  --pf-v6-c-button__progress--TranslateY: -50%;
@@ -4698,9 +4886,28 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4698
4886
  --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
4699
4887
  --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
4700
4888
  --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
4889
+ --pf-v6-c-button--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
4890
+ --pf-v6-c-button--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
4891
+ --pf-v6-c-button--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
4892
+ --pf-v6-c-button--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
4893
+ --pf-v6-c-button--m-settings--hover__icon--Rotate: 60deg;
4701
4894
  --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
4702
4895
  --pf-v6-c-button--m-block--Display: flex;
4703
4896
  --pf-v6-c-button--m-block--Width: 100%;
4897
+ --pf-v6-c-button--hamburger-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
4898
+ --pf-v6-c-button--hamburger-icon--TransitionDuration: var(--pf-t--global--motion--duration--md);
4899
+ --pf-v6-c-button--hamburger-icon--top--path--base: path("M1,1 L9,1");
4900
+ --pf-v6-c-button--hamburger-icon--middle--path--base: path("M1,5 L9,5");
4901
+ --pf-v6-c-button--hamburger-icon--arrow--path--base: path("M1,5 L1,5 L1,5");
4902
+ --pf-v6-c-button--hamburger-icon--bottom--path--base: path("M9,9 L1,9");
4903
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
4904
+ --pf-v6-c-button--hamburger-icon--middle--path: var(--pf-v6-c-button--hamburger-icon--middle--path--base);
4905
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
4906
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
4907
+ --pf-v6-c-button--hamburger-icon--top--collapse--path: path("M5,1 L9,1");
4908
+ --pf-v6-c-button--hamburger-icon--arrow--collapse--path: path("M3,7 L1,5 L3,3");
4909
+ --pf-v6-c-button--hamburger-icon--bottom--collapse--path: path("M9,9 L5,9");
4910
+ --pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX: -1;
4704
4911
  }
4705
4912
 
4706
4913
  .pf-v6-c-button {
@@ -4724,16 +4931,19 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4724
4931
  text-decoration-color: var(--pf-v6-c-button--TextDecorationColor);
4725
4932
  white-space: nowrap;
4726
4933
  cursor: pointer;
4934
+ -webkit-user-select: none;
4727
4935
  user-select: none;
4728
- background-color: var(--pf-v6-c-button--BackgroundColor);
4936
+ background: var(--pf-v6-c-button--BackgroundColor) radial-gradient(circle, transparent 1%, color-mix(in srgb, currentcolor 15%, transparent) 1%) center/15000% 15000%;
4729
4937
  border: 0;
4730
4938
  border-start-start-radius: var(--pf-v6-c-button--BorderStartStartRadius, var(--pf-v6-c-button--BorderRadius));
4731
4939
  border-start-end-radius: var(--pf-v6-c-button--BorderStartEndRadius, var(--pf-v6-c-button--BorderRadius));
4732
4940
  border-end-start-radius: var(--pf-v6-c-button--BorderEndStartRadius, var(--pf-v6-c-button--BorderRadius));
4733
4941
  border-end-end-radius: var(--pf-v6-c-button--BorderEndEndRadius, var(--pf-v6-c-button--BorderRadius));
4942
+ transition-delay: var(--pf-v6-c-button--TransitionDelay);
4734
4943
  transition-timing-function: var(--pf-v6-c-button--TransitionTimingFunction);
4735
4944
  transition-duration: var(--pf-v6-c-button--TransitionDuration);
4736
4945
  transition-property: var(--pf-v6-c-button--TransitionProperty);
4946
+ scale: var(--pf-v6-c-button--ScaleX) var(--pf-v6-c-button--ScaleY);
4737
4947
  }
4738
4948
 
4739
4949
  .pf-v6-c-button::after {
@@ -4850,6 +5060,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4850
5060
  --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
4851
5061
  text-align: start;
4852
5062
  white-space: normal;
5063
+ background: transparent;
4853
5064
  outline-offset: 0.125rem;
4854
5065
  }
4855
5066
 
@@ -4994,6 +5205,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
4994
5205
  --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineEnd);
4995
5206
  --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineStart);
4996
5207
  min-width: var(--pf-v6-c-button--m-plain--m-no-padding--MinWidth);
5208
+ background: var(--pf-v6-c-button--BackgroundColor);
4997
5209
  }
4998
5210
 
4999
5211
  .pf-v6-c-button.pf-m-block {
@@ -5017,6 +5229,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5017
5229
  }
5018
5230
 
5019
5231
  .pf-v6-c-button.pf-m-favorite .pf-v6-c-button__icon {
5232
+ display: grid;
5020
5233
  transition-timing-function: var(--pf-v6-c-button--m-favorite__icon--TransitionTimingFunction);
5021
5234
  transition-duration: var(--pf-v6-c-button--m-favorite__icon--TransitionDuration);
5022
5235
  transition-property: color;
@@ -5024,7 +5237,11 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5024
5237
 
5025
5238
  .pf-v6-c-button.pf-m-favorited {
5026
5239
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
5240
+ --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
5027
5241
  --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
5242
+ --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
5243
+ --pf-v6-c-button__icon--favorite--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorite--Opacity);
5244
+ --pf-v6-c-button__icon--favorited--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorited--Opacity);
5028
5245
  }
5029
5246
 
5030
5247
  .pf-v6-c-button.pf-m-favorited .pf-v6-c-button__icon {
@@ -5033,19 +5250,66 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5033
5250
  animation-timing-function: var(--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction);
5034
5251
  }
5035
5252
 
5253
+ .pf-v6-c-button.pf-m-settings {
5254
+ --pf-v6-c-button__icon--TransitionProperty: rotate;
5255
+ --pf-v6-c-button__icon--TransitionDuration: var(--pf-v6-c-button--m-settings__icon--TransitionDuration);
5256
+ --pf-v6-c-button__icon--TransitionTimingFunction: var(--pf-v6-c-button--m-settings__icon--TransitionTimingFunction);
5257
+ --pf-v6-c-button--hover__icon--TransitionProperty: rotate;
5258
+ --pf-v6-c-button--hover__icon--TransitionDuration: var(--pf-v6-c-button--m-settings--hover__icon--TransitionDuration);
5259
+ --pf-v6-c-button--hover__icon--TransitionTimingFunction: var(--pf-v6-c-button--m-settings--hover__icon--TransitionTimingFunction);
5260
+ --pf-v6-c-button--hover__icon--Rotate: var(--pf-v6-c-button--m-settings--hover__icon--Rotate);
5261
+ }
5262
+
5263
+ .pf-v6-c-button.pf-m-hamburger {
5264
+ --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
5265
+ --pf-v6-c-button__icon--TransitionDuration: 0s;
5266
+ --pf-v6-c-button__icon--TransitionProperty: scale;
5267
+ --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
5268
+ --pf-v6-c-button--hover__icon--TransitionDuration: 0s;
5269
+ --pf-v6-c-button--hover__icon--TransitionProperty: scale;
5270
+ }
5271
+
5272
+ .pf-v6-c-button.pf-m-hamburger.pf-m-expand {
5273
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
5274
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
5275
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
5276
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
5277
+ --pf-v6-c-button__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
5278
+ --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
5279
+ --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
5280
+ }
5281
+
5282
+ .pf-v6-c-button.pf-m-hamburger.pf-m-collapse {
5283
+ --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
5284
+ --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
5285
+ --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
5286
+ --pf-v6-c-button__icon--TransitionDelay: 0s;
5287
+ --pf-v6-c-button__icon--ScaleX: 1;
5288
+ --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
5289
+ --pf-v6-c-button--hover__icon--ScaleX: 1;
5290
+ }
5291
+
5036
5292
  .pf-v6-c-button:hover, .pf-v6-c-button:focus {
5037
5293
  --pf-v6-c-button--Color: var(--pf-v6-c-button--hover--Color);
5038
5294
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
5039
5295
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--hover--BorderColor);
5040
5296
  --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
5297
+ --pf-v6-c-button--ScaleX: var(--pf-v6-c-button--hover--ScaleX);
5298
+ --pf-v6-c-button--ScaleY: var(--pf-v6-c-button--hover--ScaleY);
5041
5299
  --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color);
5042
5300
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
5301
+ --pf-v6-c-button__icon--TransitionTimingFunction: var(--pf-v6-c-button--hover__icon--TransitionTimingFunction);
5302
+ --pf-v6-c-button__icon--TransitionDuration: var(--pf-v6-c-button--hover__icon--TransitionDuration);
5303
+ --pf-v6-c-button__icon--TransitionProperty: var(--pf-v6-c-button--hover__icon--TransitionProperty);
5304
+ --pf-v6-c-button__icon--Rotate: var(--pf-v6-c-button--hover__icon--Rotate);
5305
+ --pf-v6-c-button__icon--ScaleX: var(--pf-v6-c-button--hover__icon--ScaleX);
5306
+ --pf-v6-c-button__icon--ScaleY: var(--pf-v6-c-button--hover__icon--ScaleY);
5043
5307
  text-decoration-line: var(--pf-v6-c-button--hover--TextDecorationLine);
5044
5308
  text-decoration-style: var(--pf-v6-c-button--hover--TextDecorationStyle);
5045
5309
  text-decoration-color: var(--pf-v6-c-button--hover--TextDecorationColor);
5046
5310
  }
5047
5311
 
5048
- .pf-v6-c-button.pf-m-clicked {
5312
+ .pf-v6-c-button:active, .pf-v6-c-button.pf-m-clicked {
5049
5313
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-clicked--Color);
5050
5314
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-clicked--BackgroundColor);
5051
5315
  --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--m-clicked--BorderWidth);
@@ -5053,6 +5317,11 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5053
5317
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-clicked__icon--Color);
5054
5318
  }
5055
5319
 
5320
+ .pf-v6-c-button:active {
5321
+ background-size: 100% 100%;
5322
+ transition-duration: 0s;
5323
+ }
5324
+
5056
5325
  .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled {
5057
5326
  pointer-events: none;
5058
5327
  }
@@ -5060,7 +5329,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5060
5329
  .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled, .pf-v6-c-button.pf-m-aria-disabled {
5061
5330
  color: var(--pf-v6-c-button--disabled--Color);
5062
5331
  text-decoration-color: var(--pf-v6-c-button--disabled--TextDecorationColor);
5063
- background-color: var(--pf-v6-c-button--disabled--BackgroundColor);
5332
+ background: var(--pf-v6-c-button--disabled--BackgroundColor);
5064
5333
  }
5065
5334
 
5066
5335
  .pf-v6-c-button:disabled::after, .pf-v6-c-button.pf-m-disabled::after, .pf-v6-c-button.pf-m-aria-disabled::after {
@@ -5110,6 +5379,12 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5110
5379
  margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
5111
5380
  margin-inline-end: var(--pf-v6-c-button__icon--MarginInlineEnd);
5112
5381
  color: var(--pf-v6-c-button__icon--Color);
5382
+ transition-delay: var(--pf-v6-c-button__icon--TransitionDelay);
5383
+ transition-timing-function: var(--pf-v6-c-button__icon--TransitionTimingFunction);
5384
+ transition-duration: var(--pf-v6-c-button__icon--TransitionDuration);
5385
+ transition-property: var(--pf-v6-c-button__icon--TransitionProperty);
5386
+ rotate: var(--pf-v6-c-button__icon--Rotate);
5387
+ scale: var(--pf-v6-c-button__icon--ScaleX) var(--pf-v6-c-button__icon--ScaleY);
5113
5388
  }
5114
5389
 
5115
5390
  .pf-v6-c-button__icon.pf-m-start {
@@ -5120,6 +5395,21 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5120
5395
  --pf-v6-c-button__icon--MarginInlineStart: var(--pf-v6-c-button__icon--m-end--MarginInlineStart);
5121
5396
  }
5122
5397
 
5398
+ .pf-v6-c-button__icon-favorite,
5399
+ .pf-v6-c-button__icon-favorited {
5400
+ grid-area: 1/1/1/1;
5401
+ transition-duration: var(--pf-v6-c-button__icon--favorite--TransitionDuration);
5402
+ transition-property: opacity;
5403
+ }
5404
+
5405
+ .pf-v6-c-button__icon-favorite {
5406
+ opacity: var(--pf-v6-c-button__icon--favorite--Opacity);
5407
+ }
5408
+
5409
+ .pf-v6-c-button__icon-favorited {
5410
+ opacity: var(--pf-v6-c-button__icon--favorited--Opacity);
5411
+ }
5412
+
5123
5413
  .pf-v6-c-button__progress {
5124
5414
  position: absolute;
5125
5415
  inset-block-start: var(--pf-v6-c-button__progress--InsetBlockStart);
@@ -5133,11 +5423,39 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5133
5423
  --pf-v6-c-spinner--Color: currentcolor;
5134
5424
  }
5135
5425
 
5426
+ .pf-v6-c-button__text {
5427
+ text-decoration: inherit;
5428
+ }
5429
+
5136
5430
  .pf-v6-c-button__count {
5137
5431
  display: inline-flex;
5138
5432
  align-items: center;
5139
5433
  }
5140
5434
 
5435
+ .pf-v6-c-button--hamburger-icon path {
5436
+ fill: none;
5437
+ stroke: currentcolor;
5438
+ stroke-linecap: round;
5439
+ stroke-linejoin: round;
5440
+ transition: d var(--pf-v6-c-button--hamburger-icon--TransitionDuration) var(--pf-v6-c-button--hamburger-icon--TransitionTimingFunction);
5441
+ }
5442
+
5443
+ .pf-v6-c-button--hamburger-icon--top {
5444
+ d: var(--pf-v6-c-button--hamburger-icon--top--path);
5445
+ }
5446
+
5447
+ .pf-v6-c-button--hamburger-icon--middle {
5448
+ d: var(--pf-v6-c-button--hamburger-icon--middle--path);
5449
+ }
5450
+
5451
+ .pf-v6-c-button--hamburger-icon--arrow {
5452
+ d: var(--pf-v6-c-button--hamburger-icon--arrow--path);
5453
+ }
5454
+
5455
+ .pf-v6-c-button--hamburger-icon--bottom {
5456
+ d: var(--pf-v6-c-button--hamburger-icon--bottom--path);
5457
+ }
5458
+
5141
5459
  @keyframes pf-v6-c-button-icon-notify {
5142
5460
  33% {
5143
5461
  transform: rotate(30deg);
@@ -5148,880 +5466,613 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5148
5466
  }
5149
5467
  @keyframes pf-v6-c-button-icon-favorited {
5150
5468
  50% {
5151
- transform: scale(1.5);
5469
+ scale: 1.5;
5152
5470
  }
5153
5471
  }
5154
- .pf-v6-c-popover {
5155
- --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
5156
- --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
5157
- --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
5158
- --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
5159
- --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
5160
- --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5161
- --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
5162
- --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
5163
- --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
5164
- --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
5165
- --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5166
- --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
5167
- --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
5168
- --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
5169
- --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
5170
- --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
5171
- --pf-v6-c-popover__arrow--Width: 0.9375rem;
5172
- --pf-v6-c-popover__arrow--Height: 0.9375rem;
5173
- --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
5174
- --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5175
- --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
5176
- --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
5177
- --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
5178
- --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
5179
- --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
5180
- --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
5181
- --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
5182
- --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
5183
- --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
5184
- --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
5185
- --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
5186
- --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
5187
- --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
5188
- --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
5189
- --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
5190
- --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
5191
- --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
5192
- --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
5193
- --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
5194
- --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
5195
- --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
5196
- --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
5197
- --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
5198
- --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
5199
- --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
5200
- --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
5201
- --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
5472
+ .pf-v6-c-menu-toggle {
5473
+ --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5474
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
5475
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5476
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
5477
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5478
+ --pf-v6-c-menu-toggle--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
5479
+ --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
5480
+ --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
5481
+ --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
5482
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
5483
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
5484
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
5485
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--action--default);
5486
+ --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
5487
+ --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
5488
+ --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5489
+ --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
5490
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
5491
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
5492
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--action--default);
5493
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
5494
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5495
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
5496
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
5497
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5498
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
5499
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5500
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
5501
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
5502
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
5503
+ --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
5504
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5505
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
5506
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
5507
+ --pf-v6-c-menu-toggle__icon--TransitionDelay: 0s;
5508
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: 0s;
5509
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: none;
5510
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDelay: 0s;
5511
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: 0s;
5512
+ --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: none;
5513
+ --pf-v6-c-menu-toggle__icon--Rotate: 0deg;
5514
+ --pf-v6-c-menu-toggle--hover__icon--Rotate: 0deg;
5515
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
5516
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5517
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5518
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5519
+ --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
5520
+ --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
5521
+ --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
5522
+ --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
5523
+ --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
5524
+ --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5525
+ --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
5526
+ --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
5527
+ --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5528
+ --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
5529
+ --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
5530
+ --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
5531
+ --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
5532
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
5533
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
5534
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5535
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5536
+ --pf-v6-c-menu-toggle--m-secondary--BackgroundColor: transparent;
5537
+ --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
5538
+ --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
5539
+ --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
5540
+ --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5541
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
5542
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
5543
+ --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
5544
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor: transparent;
5545
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5546
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
5547
+ --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
5548
+ --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
5549
+ --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5550
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
5551
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
5552
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
5553
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
5554
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
5555
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5556
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
5557
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
5558
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
5559
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
5560
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
5561
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
5562
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
5563
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
5564
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
5565
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5566
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
5567
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5568
+ --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
5569
+ --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
5570
+ --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5571
+ --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
5572
+ --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
5573
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
5574
+ --pf-v6-c-menu-toggle__button--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
5575
+ --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
5576
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5577
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5578
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5579
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5580
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5581
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5582
+ --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
5583
+ --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5584
+ --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
5585
+ --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
5586
+ --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5587
+ --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5588
+ --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
5589
+ --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5590
+ --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
5591
+ --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
5592
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5593
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5594
+ --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
5595
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
5596
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
5597
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5598
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5599
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
5600
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
5601
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
5602
+ --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
5603
+ --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
5604
+ --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
5605
+ --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
5606
+ --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
5607
+ --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5608
+ --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
5609
+ --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
5610
+ --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
5611
+ --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
5612
+ --pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
5613
+ --pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
5614
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
5615
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
5616
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate: 60deg;
5202
5617
  }
5203
5618
 
5204
- .pf-v6-c-popover {
5619
+ .pf-v6-c-menu-toggle {
5205
5620
  position: relative;
5206
- min-width: var(--pf-v6-c-popover--MinWidth);
5207
- max-width: var(--pf-v6-c-popover--MaxWidth);
5208
- font-size: var(--pf-v6-c-popover--FontSize);
5209
- border-radius: var(--pf-v6-c-popover--BorderRadius);
5210
- box-shadow: var(--pf-v6-c-popover--BoxShadow);
5621
+ display: inline-flex;
5622
+ gap: var(--pf-v6-c-menu-toggle--Gap);
5623
+ align-items: center;
5624
+ justify-content: center;
5625
+ min-width: var(--pf-v6-c-menu-toggle--MinWidth);
5626
+ max-width: 100%;
5627
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
5628
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
5629
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
5630
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
5631
+ font-size: var(--pf-v6-c-menu-toggle--FontSize);
5632
+ line-height: var(--pf-v6-c-menu-toggle--LineHeight);
5633
+ color: var(--pf-v6-c-menu-toggle--Color);
5634
+ cursor: pointer;
5635
+ background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
5636
+ border: 0;
5637
+ transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
5638
+ transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
5639
+ transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
5211
5640
  }
5212
5641
 
5213
- .pf-v6-c-popover.pf-m-no-padding {
5214
- --pf-v6-c-popover__content--PaddingBlockStart: 0px;
5215
- --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
5216
- --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
5217
- --pf-v6-c-popover__content--PaddingInlineStart: 0px;
5642
+ .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
5643
+ border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5218
5644
  }
5219
5645
 
5220
- .pf-v6-c-popover.pf-m-width-auto {
5221
- --pf-v6-c-popover--MinWidth: auto;
5222
- --pf-v6-c-popover--MaxWidth: none;
5646
+ .pf-v6-c-menu-toggle::before {
5647
+ position: absolute;
5648
+ inset-block-start: 0;
5649
+ inset-block-end: 0;
5650
+ inset-inline-start: 0;
5651
+ inset-inline-end: 0;
5652
+ z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
5653
+ pointer-events: none;
5654
+ content: "";
5655
+ border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
5656
+ transition: inherit;
5223
5657
  }
5224
5658
 
5225
- .pf-v6-c-popover:is(.pf-m-top,
5226
- .pf-m-top-left,
5227
- .pf-m-top-right) {
5228
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
5229
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
5230
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
5231
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
5232
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
5659
+ .pf-v6-c-menu-toggle.pf-m-primary {
5660
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
5661
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
5662
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
5663
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
5664
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
5665
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
5666
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
5667
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
5668
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
5669
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
5670
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
5671
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
5672
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
5673
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
5674
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
5675
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
5676
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
5233
5677
  }
5234
5678
 
5235
- .pf-v6-c-popover:is(.pf-m-bottom,
5236
- .pf-m-bottom-left,
5237
- .pf-m-bottom-right) {
5238
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
5239
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
5240
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
5241
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
5242
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
5679
+ .pf-v6-c-menu-toggle.pf-m-secondary {
5680
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
5681
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
5682
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
5683
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--BackgroundColor);
5684
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
5685
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
5686
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
5687
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
5688
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
5689
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
5690
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor);
5691
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
5692
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
5693
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
5694
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
5695
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
5696
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
5243
5697
  }
5244
5698
 
5245
- .pf-v6-c-popover:is(.pf-m-left,
5246
- .pf-m-left-top,
5247
- .pf-m-left-bottom) {
5248
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
5249
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
5250
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
5251
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
5252
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
5699
+ .pf-v6-c-menu-toggle.pf-m-full-height {
5700
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
5701
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
5702
+ --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
5703
+ align-items: center;
5704
+ height: 100%;
5253
5705
  }
5254
5706
 
5255
- .pf-v6-c-popover:is(.pf-m-right,
5256
- .pf-m-right-top,
5257
- .pf-m-right-bottom) {
5258
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
5259
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
5260
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
5261
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
5262
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
5707
+ .pf-v6-c-menu-toggle.pf-m-full-width {
5708
+ width: 100%;
5263
5709
  }
5264
5710
 
5265
- .pf-v6-c-popover:is(.pf-m-left-top,
5266
- .pf-m-right-top) {
5267
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
5268
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
5711
+ .pf-v6-c-menu-toggle.pf-m-plain {
5712
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
5713
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
5714
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
5715
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
5716
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
5717
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
5718
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
5719
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
5720
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
5721
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
5722
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
5723
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
5724
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
5725
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
5726
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
5269
5727
  }
5270
5728
 
5271
- .pf-v6-c-popover:is(.pf-m-left-bottom,
5272
- .pf-m-right-bottom) {
5273
- --pf-v6-c-popover__arrow--InsetBlockStart: auto;
5274
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
5729
+ .pf-v6-c-menu-toggle.pf-m-plain::before {
5730
+ border: none;
5275
5731
  }
5276
5732
 
5277
- .pf-v6-c-popover:is(.pf-m-top-left,
5278
- .pf-m-bottom-left) {
5279
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
5280
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
5733
+ .pf-v6-c-menu-toggle:is(:hover, :focus) {
5734
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
5735
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
5736
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
5737
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
5738
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
5739
+ --pf-v6-c-menu-toggle__icon--TransitionDelay: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDelay);
5740
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDuration);
5741
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: var(--pf-v6-c-menu-toggle--hover__icon--TransitionProperty);
5742
+ --pf-v6-c-menu-toggle__icon--Rotate: var(--pf-v6-c-menu-toggle--hover__icon--Rotate);
5281
5743
  }
5282
5744
 
5283
- .pf-v6-c-popover:is(.pf-m-top-right,
5284
- .pf-m-bottom-right) {
5285
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
5286
- --pf-v6-c-popover__arrow--InsetInlineStart: auto;
5745
+ .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
5746
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
5747
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
5748
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
5749
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
5750
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
5287
5751
  }
5288
5752
 
5289
- .pf-v6-c-popover.pf-m-danger {
5290
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
5753
+ .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
5754
+ border: 0;
5291
5755
  }
5292
5756
 
5293
- .pf-v6-c-popover.pf-m-warning {
5294
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
5757
+ .pf-v6-c-menu-toggle.pf-m-small {
5758
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
5759
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
5760
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
5761
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
5762
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
5763
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
5764
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset);
5765
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset);
5295
5766
  }
5296
5767
 
5297
- .pf-v6-c-popover.pf-m-success {
5298
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
5768
+ .pf-v6-c-menu-toggle.pf-m-success {
5769
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
5770
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
5299
5771
  }
5300
5772
 
5301
- .pf-v6-c-popover.pf-m-custom {
5302
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
5773
+ .pf-v6-c-menu-toggle.pf-m-warning {
5774
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
5775
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
5303
5776
  }
5304
5777
 
5305
- .pf-v6-c-popover.pf-m-info {
5306
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
5778
+ .pf-v6-c-menu-toggle.pf-m-danger {
5779
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
5780
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
5307
5781
  }
5308
5782
 
5309
- .pf-v6-c-popover__content {
5310
- position: relative;
5311
- padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
5312
- padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
5313
- padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
5314
- padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
5315
- background-color: var(--pf-v6-c-popover__content--BackgroundColor);
5316
- border-radius: var(--pf-v6-c-popover__content--BorderRadius);
5783
+ @media screen and (prefers-reduced-motion: no-preference) {
5784
+ .pf-v6-c-menu-toggle.pf-m-danger {
5785
+ transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
5786
+ animation-name: pf-v6-c-menu-toggle-m-danger-motion;
5787
+ animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
5788
+ animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
5789
+ animation-fill-mode: both;
5790
+ }
5317
5791
  }
5318
-
5319
- .pf-v6-c-popover__close {
5320
- position: absolute;
5321
- inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
5322
- inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
5792
+ .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
5793
+ animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
5794
+ animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
5795
+ animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
5323
5796
  }
5324
5797
 
5325
- .pf-v6-c-popover__close + * {
5326
- padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
5798
+ @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
5799
+ from {
5800
+ opacity: 0;
5801
+ }
5802
+ to {
5803
+ opacity: 1;
5804
+ }
5327
5805
  }
5328
-
5329
- .pf-v6-c-popover__arrow {
5330
- position: absolute;
5331
- top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
5332
- right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
5333
- bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
5334
- left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
5335
- width: var(--pf-v6-c-popover__arrow--Width);
5336
- height: var(--pf-v6-c-popover__arrow--Height);
5337
- pointer-events: none;
5338
- background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
5339
- box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
5340
- transform: translateX(var(--pf-v6-c-popover__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-popover__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-popover__arrow--Rotate, 0));
5806
+ .pf-v6-c-menu-toggle.pf-m-settings {
5807
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: rotate;
5808
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration);
5809
+ --pf-v6-c-menu-toggle__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction);
5810
+ --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: rotate;
5811
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration);
5812
+ --pf-v6-c-menu-toggle--hover__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction);
5813
+ --pf-v6-c-menu-toggle--hover__icon--Rotate: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate);
5341
5814
  }
5342
5815
 
5343
- .pf-v6-c-popover__header {
5344
- margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
5816
+ .pf-v6-c-menu-toggle.pf-m-placeholder {
5817
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
5345
5818
  }
5346
5819
 
5347
- .pf-v6-c-popover__title {
5348
- display: flex;
5349
- flex: 0 0 auto;
5820
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
5821
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
5822
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
5823
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
5824
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
5825
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
5350
5826
  }
5351
5827
 
5352
- .pf-v6-c-popover__title-icon {
5353
- margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
5354
- font-size: var(--pf-v6-c-popover__title-icon--FontSize);
5355
- color: var(--pf-v6-c-popover__title-icon--Color);
5828
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
5829
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
5830
+ pointer-events: none;
5356
5831
  }
5357
5832
 
5358
- .pf-v6-c-popover__title-text {
5359
- min-width: 0;
5360
- font-size: var(--pf-v6-c-popover__title-text--FontSize);
5361
- font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
5362
- color: var(--pf-v6-c-popover__title-text--Color);
5363
- overflow-wrap: break-word;
5833
+ @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
5834
+ syntax: "<length>";
5835
+ inherits: false;
5836
+ initial-value: 0;
5364
5837
  }
5365
-
5366
- .pf-v6-c-popover__body {
5367
- word-wrap: break-word;
5838
+ @media (prefers-reduced-motion: no-preference) {
5839
+ @keyframes pf-v6-c-menu-toggle-m-danger-motion {
5840
+ 33% {
5841
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
5842
+ }
5843
+ 66% {
5844
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
5845
+ }
5846
+ }
5847
+ }
5848
+ .pf-v6-c-menu-toggle.pf-m-split-button {
5849
+ --pf-v6-c-menu-toggle--Gap: 0;
5850
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
5851
+ padding: 0;
5368
5852
  }
5369
5853
 
5370
- .pf-v6-c-popover__footer {
5371
- margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
5854
+ .pf-v6-c-menu-toggle.pf-m-split-button > * {
5855
+ position: relative;
5856
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
5857
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
5858
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
5859
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
5372
5860
  }
5373
5861
 
5374
- .pf-v6-c-check {
5375
- --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
5376
- --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
5377
- --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
5378
- --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
5379
- --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
5380
- --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
5381
- --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
5382
- --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
5383
- --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
5384
- --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
5385
- --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
5386
- --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
5387
- --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
5388
- --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
5862
+ .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
5863
+ border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5864
+ border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5389
5865
  }
5390
5866
 
5391
- .pf-v6-c-check {
5392
- display: grid;
5393
- grid-template-columns: auto 1fr;
5394
- grid-gap: var(--pf-v6-c-check--GridGap);
5395
- accent-color: var(--pf-v6-c-check--AccentColor);
5867
+ .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
5868
+ border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5869
+ border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5396
5870
  }
5397
5871
 
5398
- .pf-v6-c-check.pf-m-standalone {
5399
- display: inline-grid;
5400
- grid-template-columns: auto;
5401
- min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
5872
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
5873
+ --pf-v6-c-check__label--Color: currentcolor;
5874
+ --pf-v6-c-check__label--disabled--Color: currentcolor;
5875
+ align-items: center;
5876
+ align-self: stretch;
5402
5877
  }
5403
5878
 
5404
- .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
5879
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
5880
+ --pf-v6-c-check__input--TranslateY: 0;
5405
5881
  align-self: center;
5406
- transform: none;
5407
5882
  }
5408
5883
 
5409
- .pf-v6-c-check__input {
5410
- align-self: start;
5411
- font-size: var(--pf-v6-c-check__label--FontSize);
5412
- line-height: var(--pf-v6-c-check__label--LineHeight);
5413
- transform: translateY(var(--pf-v6-c-check__input--TranslateY));
5884
+ .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
5885
+ border-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth) solid var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor);
5414
5886
  }
5415
5887
 
5416
- .pf-v6-c-check__label {
5417
- font-size: var(--pf-v6-c-check__label--FontSize);
5418
- font-weight: var(--pf-v6-c-check__label--FontWeight);
5419
- line-height: var(--pf-v6-c-check__label--LineHeight);
5420
- color: var(--pf-v6-c-check__label--Color);
5888
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
5889
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
5421
5890
  }
5422
5891
 
5423
- .pf-v6-c-check__description {
5424
- grid-column: 2;
5425
- font-size: var(--pf-v6-c-check__description--FontSize);
5426
- color: var(--pf-v6-c-check__description--Color);
5892
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
5893
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
5894
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
5427
5895
  }
5428
5896
 
5429
- .pf-v6-c-check__body {
5430
- grid-column: 2;
5897
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
5898
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
5899
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor);
5431
5900
  }
5432
5901
 
5433
- .pf-v6-c-check__label,
5434
- .pf-v6-c-check__input {
5435
- justify-self: start;
5902
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
5903
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor);
5436
5904
  }
5437
5905
 
5438
- label.pf-v6-c-check, .pf-v6-c-check__label,
5439
- .pf-v6-c-check__input {
5440
- cursor: pointer;
5906
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
5907
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
5441
5908
  }
5442
5909
 
5443
- .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
5444
- .pf-v6-c-check__input:disabled,
5445
- .pf-v6-c-check__input.pf-m-disabled {
5446
- --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
5447
- cursor: not-allowed;
5910
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
5911
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):first-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
5912
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
5913
+ padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
5448
5914
  }
5449
5915
 
5450
- .pf-v6-c-check__label-required {
5451
- margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
5452
- font-size: var(--pf-v6-c-check__label-required--FontSize);
5453
- color: var(--pf-v6-c-check__label-required--Color);
5916
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
5917
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):last-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
5918
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
5919
+ padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
5454
5920
  }
5455
5921
 
5456
- .pf-v6-c-menu-toggle {
5457
- --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5458
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
5459
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5460
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
5461
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5462
- --pf-v6-c-menu-toggle--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
5463
- --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
5464
- --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
5465
- --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
5466
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
5467
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
5468
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
5469
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--action--default);
5470
- --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
5471
- --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
5472
- --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5473
- --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
5474
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
5475
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
5476
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--action--default);
5477
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
5478
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5479
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
5480
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
5481
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5482
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
5483
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5484
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
5485
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
5486
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
5487
- --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
5488
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5489
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
5490
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
5491
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
5492
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5493
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5494
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5495
- --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
5496
- --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
5497
- --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
5498
- --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
5499
- --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
5500
- --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5501
- --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
5502
- --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
5503
- --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5504
- --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
5505
- --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
5506
- --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
5507
- --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
5508
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
5509
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
5510
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5511
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5512
- --pf-v6-c-menu-toggle--m-secondary--BackgroundColor: transparent;
5513
- --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
5514
- --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
5515
- --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
5516
- --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5517
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
5518
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
5519
- --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
5520
- --pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor: transparent;
5521
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5522
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
5523
- --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
5524
- --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
5525
- --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5526
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
5527
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
5528
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
5529
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
5530
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
5531
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5532
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
5533
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
5534
- --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
5535
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
5536
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
5537
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
5538
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
5539
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
5540
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
5541
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5542
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
5543
- --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5544
- --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
5545
- --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
5546
- --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5547
- --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
5548
- --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
5549
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
5550
- --pf-v6-c-menu-toggle__button--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
5551
- --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
5552
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5553
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5554
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5555
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5556
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5557
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5558
- --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
5559
- --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5560
- --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
5561
- --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
5562
- --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5563
- --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5564
- --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
5565
- --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5566
- --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
5567
- --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
5568
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5569
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5570
- --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
5571
- --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
5572
- --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
5573
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5574
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5575
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
5576
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
5577
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
5578
- --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
5579
- --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
5580
- --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
5581
- --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
5582
- --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
5583
- --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5584
- --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
5585
- --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
5586
- --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
5587
- --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
5922
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
5923
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
5588
5924
  }
5589
5925
 
5590
- .pf-v6-c-menu-toggle {
5591
- position: relative;
5592
- display: inline-flex;
5593
- gap: var(--pf-v6-c-menu-toggle--Gap);
5594
- align-items: center;
5595
- justify-content: center;
5596
- min-width: var(--pf-v6-c-menu-toggle--MinWidth);
5597
- max-width: 100%;
5598
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
5599
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
5600
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
5601
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
5602
- font-size: var(--pf-v6-c-menu-toggle--FontSize);
5603
- line-height: var(--pf-v6-c-menu-toggle--LineHeight);
5604
- color: var(--pf-v6-c-menu-toggle--Color);
5605
- cursor: pointer;
5606
- background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
5607
- border: 0;
5608
- transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
5609
- transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
5610
- transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
5926
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
5927
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
5928
+ color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
5929
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
5611
5930
  }
5612
5931
 
5613
- .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
5614
- border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5932
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
5933
+ content: none;
5615
5934
  }
5616
5935
 
5617
- .pf-v6-c-menu-toggle::before {
5618
- position: absolute;
5619
- inset-block-start: 0;
5620
- inset-block-end: 0;
5621
- inset-inline-start: 0;
5622
- inset-inline-end: 0;
5623
- z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
5624
- pointer-events: none;
5625
- content: "";
5626
- border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
5627
- transition: inherit;
5936
+ .pf-v6-c-menu-toggle.pf-m-typeahead {
5937
+ --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
5938
+ --pf-v6-c-menu-toggle--Gap: 0;
5939
+ align-items: stretch;
5940
+ padding: 0;
5628
5941
  }
5629
5942
 
5630
- .pf-v6-c-menu-toggle.pf-m-primary {
5631
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
5632
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
5633
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
5634
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
5635
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
5636
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
5637
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
5638
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
5639
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
5640
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
5641
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
5642
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
5643
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
5644
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
5645
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
5646
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
5647
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
5943
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
5944
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
5648
5945
  }
5649
5946
 
5650
- .pf-v6-c-menu-toggle.pf-m-secondary {
5651
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
5652
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
5653
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
5654
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--BackgroundColor);
5655
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
5656
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
5657
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
5658
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
5659
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
5660
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
5661
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor);
5662
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
5663
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
5664
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
5665
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
5666
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
5667
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
5947
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
5948
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
5949
+ display: flex;
5950
+ align-items: stretch;
5668
5951
  }
5669
5952
 
5670
- .pf-v6-c-menu-toggle.pf-m-full-height {
5671
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
5672
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
5673
- --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
5674
- align-items: center;
5675
- height: 100%;
5953
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
5954
+ --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
5955
+ flex: 1;
5676
5956
  }
5677
5957
 
5678
- .pf-v6-c-menu-toggle.pf-m-full-width {
5679
- width: 100%;
5958
+ .pf-v6-c-menu-toggle__button {
5959
+ gap: var(--pf-v6-c-menu-toggle__button--Gap);
5960
+ align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
5961
+ min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
5962
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
5963
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
5964
+ color: inherit;
5965
+ background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
5966
+ border: 0;
5680
5967
  }
5681
5968
 
5682
- .pf-v6-c-menu-toggle.pf-m-plain {
5683
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
5684
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
5685
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
5686
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
5687
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
5688
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
5689
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
5690
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
5691
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
5692
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
5693
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
5694
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
5695
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
5696
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
5697
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
5969
+ .pf-v6-c-menu-toggle__button.pf-m-text {
5970
+ display: inline-flex;
5971
+ align-items: baseline;
5698
5972
  }
5699
5973
 
5700
- .pf-v6-c-menu-toggle.pf-m-plain::before {
5701
- border: none;
5974
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check.pf-m-standalone, .pf-v6-c-menu-toggle__button:has(> .pf-v6-c-menu-toggle__controls:only-child) {
5975
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
5976
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
5702
5977
  }
5703
5978
 
5704
- .pf-v6-c-menu-toggle:is(:hover, :focus) {
5705
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
5706
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
5707
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
5708
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
5709
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
5979
+ .pf-v6-c-menu-toggle__text {
5980
+ overflow: hidden;
5981
+ text-overflow: ellipsis;
5982
+ white-space: nowrap;
5983
+ min-width: 0;
5710
5984
  }
5711
5985
 
5712
- .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
5713
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
5714
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
5715
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
5716
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
5717
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
5986
+ .pf-v6-c-menu-toggle__count {
5987
+ display: flex;
5988
+ flex-wrap: nowrap;
5718
5989
  }
5719
5990
 
5720
- .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
5721
- border: 0;
5991
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
5992
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
5993
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar svg, .pf-v6-c-menu-toggle:not(.pf-m-plain) .pf-v6-c-menu-toggle__icon {
5994
+ margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
5995
+ margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
5722
5996
  }
5723
5997
 
5724
- .pf-v6-c-menu-toggle.pf-m-small {
5725
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
5726
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
5727
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
5728
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
5729
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
5730
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
5731
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset);
5732
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset);
5998
+ .pf-v6-c-menu-toggle__icon {
5999
+ flex-shrink: 0;
6000
+ transition-delay: var(--pf-v6-c-menu-toggle__icon--TransitionDelay);
6001
+ transition-duration: var(--pf-v6-c-menu-toggle__icon--TransitionDuration);
6002
+ transition-property: var(--pf-v6-c-menu-toggle__icon--TransitionProperty);
6003
+ rotate: var(--pf-v6-c-menu-toggle__icon--Rotate);
5733
6004
  }
5734
6005
 
5735
- .pf-v6-c-menu-toggle.pf-m-success {
5736
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
5737
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
6006
+ .pf-v6-c-menu-toggle__icon :where(picture, img) {
6007
+ vertical-align: middle;
5738
6008
  }
5739
6009
 
5740
- .pf-v6-c-menu-toggle.pf-m-warning {
5741
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
5742
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
6010
+ .pf-v6-c-menu-toggle__controls {
6011
+ display: flex;
6012
+ gap: var(--pf-v6-c-menu-toggle__controls--Gap);
6013
+ align-items: center;
6014
+ justify-content: center;
6015
+ margin-inline-start: auto;
5743
6016
  }
5744
6017
 
5745
- .pf-v6-c-menu-toggle.pf-m-danger {
5746
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
5747
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
6018
+ .pf-v6-c-menu-toggle__toggle-icon {
6019
+ min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
6020
+ color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
5748
6021
  }
5749
6022
 
5750
- @media screen and (prefers-reduced-motion: no-preference) {
5751
- .pf-v6-c-menu-toggle.pf-m-danger {
5752
- transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
5753
- animation-name: pf-v6-c-menu-toggle-m-danger-motion;
5754
- animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
5755
- animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
5756
- animation-fill-mode: both;
5757
- }
5758
- }
5759
- .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
5760
- animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
5761
- animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
5762
- animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
6023
+ .pf-v6-c-menu-toggle__status-icon {
6024
+ color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
5763
6025
  }
5764
6026
 
5765
- @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
5766
- from {
5767
- opacity: 0;
5768
- }
5769
- to {
5770
- opacity: 1;
5771
- }
5772
- }
5773
- .pf-v6-c-menu-toggle.pf-m-placeholder {
5774
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
6027
+ .pf-v6-c-divider {
6028
+ --pf-v6-c-divider--Display: flex;
6029
+ --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
6030
+ --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
6031
+ --pf-v6-c-divider--before--FlexBasis: 100%;
5775
6032
  }
5776
6033
 
5777
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
5778
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
5779
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
5780
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
5781
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
5782
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
6034
+ .pf-v6-c-divider {
6035
+ flex-direction: row;
6036
+ width: 100%;
6037
+ height: var(--pf-v6-c-divider--Size);
6038
+ --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
6039
+ --pf-v6-hidden-visible--hidden--Display: none;
6040
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6041
+ display: var(--pf-v6-hidden-visible--Display);
6042
+ flex-shrink: 0;
6043
+ align-items: stretch;
6044
+ align-self: stretch;
6045
+ justify-content: center;
6046
+ border: 0;
5783
6047
  }
5784
6048
 
5785
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
5786
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
5787
- pointer-events: none;
6049
+ .pf-v6-c-divider.pf-m-hidden {
6050
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5788
6051
  }
5789
6052
 
5790
- @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
5791
- syntax: "<length>";
5792
- inherits: false;
5793
- initial-value: 0;
5794
- }
5795
- @media (prefers-reduced-motion: no-preference) {
5796
- @keyframes pf-v6-c-menu-toggle-m-danger-motion {
5797
- 33% {
5798
- --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
5799
- }
5800
- 66% {
5801
- --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
5802
- }
6053
+ @media screen and (min-width: 36rem) {
6054
+ .pf-v6-c-divider.pf-m-hidden-on-sm {
6055
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6056
+ }
6057
+ .pf-v6-c-divider.pf-m-visible-on-sm {
6058
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5803
6059
  }
5804
6060
  }
5805
- .pf-v6-c-menu-toggle.pf-m-split-button {
5806
- --pf-v6-c-menu-toggle--Gap: 0;
5807
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
5808
- padding: 0;
6061
+ @media screen and (min-width: 48rem) {
6062
+ .pf-v6-c-divider.pf-m-hidden-on-md {
6063
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6064
+ }
6065
+ .pf-v6-c-divider.pf-m-visible-on-md {
6066
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6067
+ }
5809
6068
  }
5810
-
5811
- .pf-v6-c-menu-toggle.pf-m-split-button > * {
5812
- position: relative;
5813
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
5814
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
5815
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
5816
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
5817
- }
5818
-
5819
- .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
5820
- border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5821
- border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5822
- }
5823
-
5824
- .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
5825
- border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5826
- border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5827
- }
5828
-
5829
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
5830
- --pf-v6-c-check__label--Color: currentcolor;
5831
- --pf-v6-c-check__label--disabled--Color: currentcolor;
5832
- align-items: center;
5833
- align-self: stretch;
5834
- }
5835
-
5836
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
5837
- --pf-v6-c-check__input--TranslateY: 0;
5838
- align-self: center;
5839
- }
5840
-
5841
- .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
5842
- border-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth) solid var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor);
5843
- }
5844
-
5845
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
5846
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
5847
- }
5848
-
5849
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
5850
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
5851
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
5852
- }
5853
-
5854
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
5855
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
5856
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor);
5857
- }
5858
-
5859
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
5860
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor);
5861
- }
5862
-
5863
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
5864
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
5865
- }
5866
-
5867
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
5868
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):first-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
5869
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
5870
- padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
5871
- }
5872
-
5873
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
5874
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):last-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
5875
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
5876
- padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
5877
- }
5878
-
5879
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
5880
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
5881
- }
5882
-
5883
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
5884
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
5885
- color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
5886
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
5887
- }
5888
-
5889
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
5890
- content: none;
5891
- }
5892
-
5893
- .pf-v6-c-menu-toggle.pf-m-typeahead {
5894
- --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
5895
- --pf-v6-c-menu-toggle--Gap: 0;
5896
- align-items: stretch;
5897
- padding: 0;
5898
- }
5899
-
5900
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
5901
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
5902
- }
5903
-
5904
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
5905
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
5906
- display: flex;
5907
- align-items: stretch;
5908
- }
5909
-
5910
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
5911
- --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
5912
- flex: 1;
5913
- }
5914
-
5915
- .pf-v6-c-menu-toggle__button {
5916
- gap: var(--pf-v6-c-menu-toggle__button--Gap);
5917
- align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
5918
- min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
5919
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
5920
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
5921
- color: inherit;
5922
- background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
5923
- border: 0;
5924
- }
5925
-
5926
- .pf-v6-c-menu-toggle__button.pf-m-text {
5927
- display: inline-flex;
5928
- align-items: baseline;
5929
- }
5930
-
5931
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check.pf-m-standalone, .pf-v6-c-menu-toggle__button:has(> .pf-v6-c-menu-toggle__controls:only-child) {
5932
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
5933
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
5934
- }
5935
-
5936
- .pf-v6-c-menu-toggle__text {
5937
- overflow: hidden;
5938
- text-overflow: ellipsis;
5939
- white-space: nowrap;
5940
- min-width: 0;
5941
- }
5942
-
5943
- .pf-v6-c-menu-toggle__count {
5944
- display: flex;
5945
- flex-wrap: nowrap;
5946
- }
5947
-
5948
- .pf-v6-c-menu-toggle__icon {
5949
- flex-shrink: 0;
5950
- }
5951
-
5952
- .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
5953
- .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
5954
- .pf-v6-c-menu-toggle__icon.pf-m-avatar svg {
5955
- margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
5956
- margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
5957
- }
5958
-
5959
- .pf-v6-c-menu-toggle__controls {
5960
- display: flex;
5961
- gap: var(--pf-v6-c-menu-toggle__controls--Gap);
5962
- align-items: center;
5963
- justify-content: center;
5964
- margin-inline-start: auto;
5965
- }
5966
-
5967
- .pf-v6-c-menu-toggle__toggle-icon {
5968
- min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
5969
- color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
5970
- }
5971
-
5972
- .pf-v6-c-menu-toggle__status-icon {
5973
- color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
5974
- }
5975
-
5976
- .pf-v6-c-divider {
5977
- --pf-v6-c-divider--Display: flex;
5978
- --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
5979
- --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
5980
- --pf-v6-c-divider--before--FlexBasis: 100%;
5981
- }
5982
-
5983
- .pf-v6-c-divider {
5984
- flex-direction: row;
5985
- width: 100%;
5986
- height: var(--pf-v6-c-divider--Size);
5987
- --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
5988
- --pf-v6-hidden-visible--hidden--Display: none;
5989
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5990
- display: var(--pf-v6-hidden-visible--Display);
5991
- flex-shrink: 0;
5992
- align-items: stretch;
5993
- align-self: stretch;
5994
- justify-content: center;
5995
- border: 0;
5996
- }
5997
-
5998
- .pf-v6-c-divider.pf-m-hidden {
5999
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6000
- }
6001
-
6002
- @media screen and (min-width: 36rem) {
6003
- .pf-v6-c-divider.pf-m-hidden-on-sm {
6004
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6005
- }
6006
- .pf-v6-c-divider.pf-m-visible-on-sm {
6007
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6008
- }
6009
- }
6010
- @media screen and (min-width: 48rem) {
6011
- .pf-v6-c-divider.pf-m-hidden-on-md {
6012
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6013
- }
6014
- .pf-v6-c-divider.pf-m-visible-on-md {
6015
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6016
- }
6017
- }
6018
- @media screen and (min-width: 62rem) {
6019
- .pf-v6-c-divider.pf-m-hidden-on-lg {
6020
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6021
- }
6022
- .pf-v6-c-divider.pf-m-visible-on-lg {
6023
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6024
- }
6069
+ @media screen and (min-width: 62rem) {
6070
+ .pf-v6-c-divider.pf-m-hidden-on-lg {
6071
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6072
+ }
6073
+ .pf-v6-c-divider.pf-m-visible-on-lg {
6074
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6075
+ }
6025
6076
  }
6026
6077
  @media screen and (min-width: 75rem) {
6027
6078
  .pf-v6-c-divider.pf-m-hidden-on-xl {
@@ -6263,62 +6314,364 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
6263
6314
  height: inherit;
6264
6315
  }
6265
6316
  }
6266
- @media (min-width: 90.625rem) {
6267
- .pf-v6-c-divider.pf-m-inset-none-on-2xl {
6268
- --pf-v6-c-divider--before--FlexBasis: 100%;
6269
- }
6270
- .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
6271
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
6272
- }
6273
- .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
6274
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
6275
- }
6276
- .pf-v6-c-divider.pf-m-inset-md-on-2xl {
6277
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
6278
- }
6279
- .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
6280
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
6281
- }
6282
- .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
6283
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
6284
- }
6285
- .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
6286
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
6287
- }
6288
- .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
6289
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6290
- }
6317
+ @media (min-width: 90.625rem) {
6318
+ .pf-v6-c-divider.pf-m-inset-none-on-2xl {
6319
+ --pf-v6-c-divider--before--FlexBasis: 100%;
6320
+ }
6321
+ .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
6322
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
6323
+ }
6324
+ .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
6325
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
6326
+ }
6327
+ .pf-v6-c-divider.pf-m-inset-md-on-2xl {
6328
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
6329
+ }
6330
+ .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
6331
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
6332
+ }
6333
+ .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
6334
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
6335
+ }
6336
+ .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
6337
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
6338
+ }
6339
+ .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
6340
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6341
+ }
6342
+ }
6343
+ .pf-v6-c-action-list {
6344
+ --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
6345
+ --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--default);
6346
+ --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default);
6347
+ --pf-v6-c-action-list--m-icons--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
6348
+ }
6349
+
6350
+ .pf-v6-c-action-list,
6351
+ .pf-v6-c-action-list__group {
6352
+ display: flex;
6353
+ align-items: start;
6354
+ }
6355
+
6356
+ .pf-v6-c-action-list {
6357
+ row-gap: var(--pf-v6-c-action-list--RowGap);
6358
+ column-gap: var(--pf-v6-c-action-list--ColumnGap);
6359
+ }
6360
+
6361
+ .pf-v6-c-action-list.pf-m-icons {
6362
+ --pf-v6-c-action-list__group--ColumnGap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6363
+ column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6364
+ }
6365
+
6366
+ .pf-v6-c-action-list__group {
6367
+ row-gap: var(--pf-v6-c-action-list__group--RowGap, var(--pf-v6-c-action-list--RowGap));
6368
+ column-gap: var(--pf-v6-c-action-list__group--ColumnGap);
6369
+ }
6370
+
6371
+ .pf-v6-c-action-list__group.pf-m-icons {
6372
+ column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6373
+ }
6374
+
6375
+ .pf-v6-c-popover {
6376
+ --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
6377
+ --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
6378
+ --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
6379
+ --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
6380
+ --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
6381
+ --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
6382
+ --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
6383
+ --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
6384
+ --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
6385
+ --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
6386
+ --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
6387
+ --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
6388
+ --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
6389
+ --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
6390
+ --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
6391
+ --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
6392
+ --pf-v6-c-popover__arrow--Width: 0.9375rem;
6393
+ --pf-v6-c-popover__arrow--Height: 0.9375rem;
6394
+ --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
6395
+ --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
6396
+ --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
6397
+ --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
6398
+ --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
6399
+ --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
6400
+ --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
6401
+ --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
6402
+ --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
6403
+ --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
6404
+ --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
6405
+ --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
6406
+ --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
6407
+ --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
6408
+ --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
6409
+ --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
6410
+ --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
6411
+ --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
6412
+ --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
6413
+ --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6414
+ --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
6415
+ --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
6416
+ --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
6417
+ --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
6418
+ --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
6419
+ --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
6420
+ --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
6421
+ --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
6422
+ --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
6423
+ }
6424
+
6425
+ .pf-v6-c-popover {
6426
+ position: relative;
6427
+ min-width: var(--pf-v6-c-popover--MinWidth);
6428
+ max-width: var(--pf-v6-c-popover--MaxWidth);
6429
+ font-size: var(--pf-v6-c-popover--FontSize);
6430
+ border-radius: var(--pf-v6-c-popover--BorderRadius);
6431
+ box-shadow: var(--pf-v6-c-popover--BoxShadow);
6432
+ }
6433
+
6434
+ .pf-v6-c-popover.pf-m-no-padding {
6435
+ --pf-v6-c-popover__content--PaddingBlockStart: 0px;
6436
+ --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
6437
+ --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
6438
+ --pf-v6-c-popover__content--PaddingInlineStart: 0px;
6439
+ }
6440
+
6441
+ .pf-v6-c-popover.pf-m-width-auto {
6442
+ --pf-v6-c-popover--MinWidth: auto;
6443
+ --pf-v6-c-popover--MaxWidth: none;
6444
+ }
6445
+
6446
+ .pf-v6-c-popover:is(.pf-m-top,
6447
+ .pf-m-top-left,
6448
+ .pf-m-top-right) {
6449
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
6450
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
6451
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
6452
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6453
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
6454
+ }
6455
+
6456
+ .pf-v6-c-popover:is(.pf-m-bottom,
6457
+ .pf-m-bottom-left,
6458
+ .pf-m-bottom-right) {
6459
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
6460
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
6461
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
6462
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
6463
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
6464
+ }
6465
+
6466
+ .pf-v6-c-popover:is(.pf-m-left,
6467
+ .pf-m-left-top,
6468
+ .pf-m-left-bottom) {
6469
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
6470
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
6471
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
6472
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
6473
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
6474
+ }
6475
+
6476
+ .pf-v6-c-popover:is(.pf-m-right,
6477
+ .pf-m-right-top,
6478
+ .pf-m-right-bottom) {
6479
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
6480
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
6481
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
6482
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
6483
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
6484
+ }
6485
+
6486
+ .pf-v6-c-popover:is(.pf-m-left-top,
6487
+ .pf-m-right-top) {
6488
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
6489
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6490
+ }
6491
+
6492
+ .pf-v6-c-popover:is(.pf-m-left-bottom,
6493
+ .pf-m-right-bottom) {
6494
+ --pf-v6-c-popover__arrow--InsetBlockStart: auto;
6495
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
6496
+ }
6497
+
6498
+ .pf-v6-c-popover:is(.pf-m-top-left,
6499
+ .pf-m-bottom-left) {
6500
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
6501
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
6502
+ }
6503
+
6504
+ .pf-v6-c-popover:is(.pf-m-top-right,
6505
+ .pf-m-bottom-right) {
6506
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
6507
+ --pf-v6-c-popover__arrow--InsetInlineStart: auto;
6508
+ }
6509
+
6510
+ .pf-v6-c-popover.pf-m-danger {
6511
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
6512
+ }
6513
+
6514
+ .pf-v6-c-popover.pf-m-warning {
6515
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
6516
+ }
6517
+
6518
+ .pf-v6-c-popover.pf-m-success {
6519
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
6520
+ }
6521
+
6522
+ .pf-v6-c-popover.pf-m-custom {
6523
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
6524
+ }
6525
+
6526
+ .pf-v6-c-popover.pf-m-info {
6527
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
6528
+ }
6529
+
6530
+ .pf-v6-c-popover__content {
6531
+ position: relative;
6532
+ padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
6533
+ padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
6534
+ padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
6535
+ padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6536
+ background-color: var(--pf-v6-c-popover__content--BackgroundColor);
6537
+ border-radius: var(--pf-v6-c-popover__content--BorderRadius);
6538
+ }
6539
+
6540
+ .pf-v6-c-popover__close {
6541
+ position: absolute;
6542
+ inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
6543
+ inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
6544
+ }
6545
+
6546
+ .pf-v6-c-popover__close + * {
6547
+ padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
6548
+ }
6549
+
6550
+ .pf-v6-c-popover__arrow {
6551
+ position: absolute;
6552
+ top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
6553
+ right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
6554
+ bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
6555
+ left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
6556
+ width: var(--pf-v6-c-popover__arrow--Width);
6557
+ height: var(--pf-v6-c-popover__arrow--Height);
6558
+ pointer-events: none;
6559
+ background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
6560
+ box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
6561
+ transform: translateX(var(--pf-v6-c-popover__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-popover__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-popover__arrow--Rotate, 0));
6562
+ }
6563
+
6564
+ .pf-v6-c-popover__header {
6565
+ margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
6566
+ }
6567
+
6568
+ .pf-v6-c-popover__title {
6569
+ display: flex;
6570
+ flex: 0 0 auto;
6571
+ }
6572
+
6573
+ .pf-v6-c-popover__title-icon {
6574
+ margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
6575
+ font-size: var(--pf-v6-c-popover__title-icon--FontSize);
6576
+ color: var(--pf-v6-c-popover__title-icon--Color);
6577
+ }
6578
+
6579
+ .pf-v6-c-popover__title-text {
6580
+ min-width: 0;
6581
+ font-size: var(--pf-v6-c-popover__title-text--FontSize);
6582
+ font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
6583
+ color: var(--pf-v6-c-popover__title-text--Color);
6584
+ overflow-wrap: break-word;
6585
+ }
6586
+
6587
+ .pf-v6-c-popover__body {
6588
+ word-wrap: break-word;
6589
+ }
6590
+
6591
+ .pf-v6-c-popover__footer {
6592
+ margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
6593
+ }
6594
+
6595
+ .pf-v6-c-check {
6596
+ --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
6597
+ --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
6598
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
6599
+ --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
6600
+ --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
6601
+ --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
6602
+ --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
6603
+ --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
6604
+ --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
6605
+ --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
6606
+ --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
6607
+ --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
6608
+ --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
6609
+ --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
6610
+ }
6611
+
6612
+ .pf-v6-c-check {
6613
+ display: grid;
6614
+ grid-template-columns: auto 1fr;
6615
+ grid-gap: var(--pf-v6-c-check--GridGap);
6616
+ accent-color: var(--pf-v6-c-check--AccentColor);
6617
+ }
6618
+
6619
+ .pf-v6-c-check.pf-m-standalone {
6620
+ display: inline-grid;
6621
+ grid-template-columns: auto;
6622
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
6623
+ }
6624
+
6625
+ .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
6626
+ align-self: center;
6627
+ transform: none;
6628
+ }
6629
+
6630
+ .pf-v6-c-check__input {
6631
+ align-self: start;
6632
+ font-size: var(--pf-v6-c-check__label--FontSize);
6633
+ line-height: var(--pf-v6-c-check__label--LineHeight);
6634
+ transform: translateY(var(--pf-v6-c-check__input--TranslateY));
6291
6635
  }
6292
- .pf-v6-c-action-list {
6293
- --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
6294
- --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--default);
6295
- --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default);
6296
- --pf-v6-c-action-list--m-icons--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
6636
+
6637
+ .pf-v6-c-check__label {
6638
+ font-size: var(--pf-v6-c-check__label--FontSize);
6639
+ font-weight: var(--pf-v6-c-check__label--FontWeight);
6640
+ line-height: var(--pf-v6-c-check__label--LineHeight);
6641
+ color: var(--pf-v6-c-check__label--Color);
6297
6642
  }
6298
6643
 
6299
- .pf-v6-c-action-list,
6300
- .pf-v6-c-action-list__group {
6301
- display: flex;
6302
- align-items: start;
6644
+ .pf-v6-c-check__description {
6645
+ grid-column: 2;
6646
+ font-size: var(--pf-v6-c-check__description--FontSize);
6647
+ color: var(--pf-v6-c-check__description--Color);
6303
6648
  }
6304
6649
 
6305
- .pf-v6-c-action-list {
6306
- row-gap: var(--pf-v6-c-action-list--RowGap);
6307
- column-gap: var(--pf-v6-c-action-list--ColumnGap);
6650
+ .pf-v6-c-check__body {
6651
+ grid-column: 2;
6308
6652
  }
6309
6653
 
6310
- .pf-v6-c-action-list.pf-m-icons {
6311
- --pf-v6-c-action-list__group--ColumnGap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6312
- column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6654
+ .pf-v6-c-check__label,
6655
+ .pf-v6-c-check__input {
6656
+ justify-self: start;
6313
6657
  }
6314
6658
 
6315
- .pf-v6-c-action-list__group {
6316
- row-gap: var(--pf-v6-c-action-list__group--RowGap, var(--pf-v6-c-action-list--RowGap));
6317
- column-gap: var(--pf-v6-c-action-list__group--ColumnGap);
6659
+ label.pf-v6-c-check, .pf-v6-c-check__label,
6660
+ .pf-v6-c-check__input {
6661
+ cursor: pointer;
6318
6662
  }
6319
6663
 
6320
- .pf-v6-c-action-list__group.pf-m-icons {
6321
- column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6664
+ .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
6665
+ .pf-v6-c-check__input:disabled,
6666
+ .pf-v6-c-check__input.pf-m-disabled {
6667
+ --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
6668
+ cursor: not-allowed;
6669
+ }
6670
+
6671
+ .pf-v6-c-check__label-required {
6672
+ margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
6673
+ font-size: var(--pf-v6-c-check__label-required--FontSize);
6674
+ color: var(--pf-v6-c-check__label-required--Color);
6322
6675
  }
6323
6676
 
6324
6677
  .pf-v6-c-form-control {
@@ -6568,6 +6921,23 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
6568
6921
  --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
6569
6922
  }
6570
6923
 
6924
+ @media (prefers-reduced-motion: no-preference) {
6925
+ .pf-v6-c-form-control.pf-m-error {
6926
+ translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
6927
+ animation-name: pf-v6-global-danger-jiggle-motion;
6928
+ animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
6929
+ animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
6930
+ animation-fill-mode: both;
6931
+ }
6932
+ }
6933
+ .pf-v6-c-form-control.pf-m-error .pf-v6-c-form-control__icon.pf-m-status {
6934
+ --pf-v6-c-form-control--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
6935
+ --pf-v6-c-form-control--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
6936
+ animation-name: pf-v6-global-fade-in;
6937
+ animation-duration: var(--pf-v6-c-form-control--TransitionDuration--Opacity);
6938
+ animation-timing-function: var(--pf-v6-c-form-control--TransitionTimingFunction--Opacity);
6939
+ }
6940
+
6571
6941
  .pf-v6-c-form-control.pf-m-error > textarea {
6572
6942
  padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd));
6573
6943
  }
@@ -6654,226 +7024,72 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
6654
7024
 
6655
7025
  @-moz-document url-prefix() {
6656
7026
  .pf-v6-c-form-control:has(select) {
6657
- --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) - 1px);
6658
- --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__select--PaddingInlineStart) - 4px);
6659
- }
6660
- }
6661
- .pf-v6-c-form-control.pf-m-placeholder > select {
6662
- --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
6663
- }
6664
-
6665
- .pf-v6-c-form-control.pf-m-placeholder > select * {
6666
- color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
6667
- }
6668
-
6669
- .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
6670
- color: revert;
6671
- }
6672
-
6673
- .pf-v6-c-form-control > textarea {
6674
- width: 100%;
6675
- height: 100%;
6676
- vertical-align: bottom;
6677
- resize: none;
6678
- }
6679
-
6680
- .pf-v6-c-form-control.pf-m-resize-vertical {
6681
- --pf-v6-c-form-control--Resize: vertical;
6682
- overflow: auto;
6683
- }
6684
-
6685
- .pf-v6-c-form-control.pf-m-resize-horizontal {
6686
- --pf-v6-c-form-control--Resize: horizontal;
6687
- overflow: auto;
6688
- }
6689
-
6690
- .pf-v6-c-form-control.pf-m-resize-both {
6691
- --pf-v6-c-form-control--Resize: both;
6692
- overflow: auto;
6693
- }
6694
-
6695
- .pf-v6-c-form-control__icon {
6696
- font-size: var(--pf-v6-c-form-control__icon--FontSize);
6697
- color: var(--pf-v6-c-form-control__icon--Color);
6698
- }
6699
-
6700
- .pf-v6-c-form-control__icon.pf-m-status {
6701
- --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
6702
- }
6703
-
6704
- .pf-v6-c-form-control__toggle-icon {
6705
- grid-row: 1/2;
6706
- grid-column: 3;
6707
- padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
6708
- padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
6709
- font-size: var(--pf-v6-c-form-control__toggle-icon--FontSize);
6710
- color: var(--pf-v6-c-form-control__toggle-icon--Color);
6711
- pointer-events: none;
6712
- }
6713
-
6714
- .pf-v6-c-form-control__utilities {
6715
- display: flex;
6716
- flex-wrap: nowrap;
6717
- grid-row: 1/2;
6718
- grid-column: 2;
6719
- gap: var(--pf-v6-c-form-control__utilities--Gap);
6720
- padding-block-start: var(--pf-v6-c-form-control__utilities--PaddingBlockStart);
6721
- padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
6722
- pointer-events: none;
6723
- }
6724
-
6725
- .pf-v6-c-spinner {
6726
- --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
6727
- --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
6728
- --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
6729
- --pf-v6-c-spinner--Color: var(--pf-t--global--icon--color--brand--default);
6730
- --pf-v6-c-spinner--AnimationDuration: 1.4s;
6731
- --pf-v6-c-spinner--AnimationTimingFunction: linear;
6732
- --pf-v6-c-spinner--StrokeWidth: 10;
6733
- --pf-v6-c-spinner__path--StrokeWidth: var(--pf-v6-c-spinner--StrokeWidth);
6734
- --pf-v6-c-spinner__path--AnimationTimingFunction: ease-in-out;
6735
- --pf-v6-c-spinner--m-sm--diameter: var(--pf-t--global--icon--size--md);
6736
- --pf-v6-c-spinner--m-md--diameter: var(--pf-t--global--icon--size--lg);
6737
- --pf-v6-c-spinner--m-lg--diameter: var(--pf-t--global--icon--size--xl);
6738
- --pf-v6-c-spinner--m-xl--diameter: var(--pf-t--global--icon--size--2xl);
6739
- --pf-v6-c-spinner--m-inline--diameter: 1em;
6740
- }
6741
-
6742
- .pf-v6-c-spinner {
6743
- width: var(--pf-v6-c-spinner--Width);
6744
- height: var(--pf-v6-c-spinner--Height);
6745
- overflow: hidden;
6746
- animation: pf-v6-c-spinner-animation-rotate calc(var(--pf-v6-c-spinner--AnimationDuration) * 2) var(--pf-v6-c-spinner--AnimationTimingFunction) infinite;
6747
- }
6748
-
6749
- .pf-v6-c-spinner.pf-m-inline {
6750
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-inline--diameter);
6751
- }
6752
-
6753
- .pf-v6-c-spinner.pf-m-sm {
6754
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-sm--diameter);
6755
- }
6756
-
6757
- .pf-v6-c-spinner.pf-m-md {
6758
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-md--diameter);
6759
- }
6760
-
6761
- .pf-v6-c-spinner.pf-m-lg {
6762
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-lg--diameter);
6763
- }
6764
-
6765
- .pf-v6-c-spinner.pf-m-xl {
6766
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xl--diameter);
6767
- }
6768
-
6769
- .pf-v6-c-spinner__path {
6770
- width: 100%;
6771
- height: 100%;
6772
- stroke: var(--pf-v6-c-spinner--Color);
6773
- stroke-dasharray: 283;
6774
- stroke-dashoffset: 280;
6775
- stroke-linecap: round;
6776
- stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
6777
- transform-origin: 50% 50%;
6778
- animation: pf-v6-c-spinner-animation-dash var(--pf-v6-c-spinner--AnimationDuration) var(--pf-v6-c-spinner__path--AnimationTimingFunction) infinite;
6779
- }
6780
-
6781
- @keyframes pf-v6-c-spinner-animation-rotate {
6782
- 0% {
6783
- transform: rotate(0deg);
6784
- }
6785
- 100% {
6786
- transform: rotate(360deg);
6787
- }
6788
- }
6789
- @keyframes pf-v6-c-spinner-animation-dash {
6790
- 0% {
6791
- stroke-dashoffset: 280;
6792
- transform: rotate(0);
6793
- }
6794
- 15% {
6795
- stroke-width: calc(var(--pf-v6-c-spinner__path--StrokeWidth) - 4);
6796
- }
6797
- 40% {
6798
- stroke-dasharray: 220;
6799
- stroke-dashoffset: 150;
6800
- }
6801
- 100% {
6802
- stroke-dashoffset: 280;
6803
- transform: rotate(720deg);
6804
- }
6805
- }
6806
- .pf-v6-c-badge {
6807
- --pf-v6-c-badge--BorderColor: transparent;
6808
- --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
6809
- --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
6810
- --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
6811
- --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
6812
- --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
6813
- --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
6814
- --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
6815
- --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
6816
- --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
6817
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
6818
- --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
6819
- --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
6820
- --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
6821
- --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
6822
- --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
6823
- --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
6824
- --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
6825
- --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
6826
- --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7027
+ --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) - 1px);
7028
+ --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__select--PaddingInlineStart) - 4px);
7029
+ }
7030
+ }
7031
+ .pf-v6-c-form-control.pf-m-placeholder > select {
7032
+ --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
6827
7033
  }
6828
7034
 
6829
- .pf-v6-c-badge {
6830
- position: relative;
6831
- display: inline-block;
6832
- min-width: var(--pf-v6-c-badge--MinWidth);
6833
- padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
6834
- padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
6835
- font-size: var(--pf-v6-c-badge--FontSize);
6836
- font-weight: var(--pf-v6-c-badge--FontWeight);
6837
- color: var(--pf-v6-c-badge--Color);
6838
- text-align: center;
6839
- white-space: nowrap;
6840
- background-color: var(--pf-v6-c-badge--BackgroundColor);
6841
- border-radius: var(--pf-v6-c-badge--BorderRadius);
7035
+ .pf-v6-c-form-control.pf-m-placeholder > select * {
7036
+ color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
6842
7037
  }
6843
7038
 
6844
- .pf-v6-c-badge::after {
6845
- position: absolute;
6846
- inset: 0;
6847
- pointer-events: none;
6848
- content: "";
6849
- border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
6850
- border-radius: inherit;
7039
+ .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
7040
+ color: revert;
6851
7041
  }
6852
7042
 
6853
- .pf-v6-c-badge.pf-m-read {
6854
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
6855
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
6856
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
7043
+ .pf-v6-c-form-control > textarea {
7044
+ width: 100%;
7045
+ height: 100%;
7046
+ vertical-align: bottom;
7047
+ resize: none;
6857
7048
  }
6858
7049
 
6859
- .pf-v6-c-badge.pf-m-unread {
6860
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
6861
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
6862
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
7050
+ .pf-v6-c-form-control.pf-m-resize-vertical {
7051
+ --pf-v6-c-form-control--Resize: vertical;
7052
+ overflow: auto;
6863
7053
  }
6864
7054
 
6865
- .pf-v6-c-badge.pf-m-disabled {
6866
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
6867
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
7055
+ .pf-v6-c-form-control.pf-m-resize-horizontal {
7056
+ --pf-v6-c-form-control--Resize: horizontal;
7057
+ overflow: auto;
6868
7058
  }
6869
7059
 
6870
- .pf-v6-c-badge.pf-m-disabled::after {
6871
- border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
7060
+ .pf-v6-c-form-control.pf-m-resize-both {
7061
+ --pf-v6-c-form-control--Resize: both;
7062
+ overflow: auto;
6872
7063
  }
6873
7064
 
6874
- .pf-v6-c-badge__toggle-icon {
6875
- margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
6876
- color: var(--pf-v6-c-badge__toggle-icon--Color);
7065
+ .pf-v6-c-form-control__icon {
7066
+ font-size: var(--pf-v6-c-form-control__icon--FontSize);
7067
+ color: var(--pf-v6-c-form-control__icon--Color);
7068
+ }
7069
+
7070
+ .pf-v6-c-form-control__icon.pf-m-status {
7071
+ --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
7072
+ }
7073
+
7074
+ .pf-v6-c-form-control__toggle-icon {
7075
+ grid-row: 1/2;
7076
+ grid-column: 3;
7077
+ padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
7078
+ padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
7079
+ font-size: var(--pf-v6-c-form-control__toggle-icon--FontSize);
7080
+ color: var(--pf-v6-c-form-control__toggle-icon--Color);
7081
+ pointer-events: none;
7082
+ }
7083
+
7084
+ .pf-v6-c-form-control__utilities {
7085
+ display: flex;
7086
+ flex-wrap: nowrap;
7087
+ grid-row: 1/2;
7088
+ grid-column: 2;
7089
+ gap: var(--pf-v6-c-form-control__utilities--Gap);
7090
+ padding-block-start: var(--pf-v6-c-form-control__utilities--PaddingBlockStart);
7091
+ padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
7092
+ pointer-events: none;
6877
7093
  }
6878
7094
 
6879
7095
  .pf-v6-c-breadcrumb {
@@ -7006,7 +7222,7 @@ button.pf-v6-c-breadcrumb__link {
7006
7222
  --pf-v6-c-menu--ZIndex: var(--pf-t--global--z-index--sm);
7007
7223
  --pf-v6-c-menu--button--disabled--Color: var(--pf-t--global--text--color--disabled);
7008
7224
  --pf-v6-c-menu--icon--disabled--Color: var(--pf-t--global--icon--color--disabled);
7009
- --pf-v6-c-menu--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
7225
+ --pf-v6-c-menu--TransitionDuration: 0s;
7010
7226
  --pf-v6-c-menu--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
7011
7227
  --pf-v6-c-menu--m-plain--BoxShadow: none;
7012
7228
  --pf-v6-c-menu__content--RowGap: var(--pf-v6-c-menu--RowGap);
@@ -7079,15 +7295,35 @@ button.pf-v6-c-breadcrumb__link {
7079
7295
  --pf-v6-c-menu--m-flyout__menu--m-left--InsetInlineEnd: calc(100% + var(--pf-v6-c-menu--m-flyout__menu--m-left--right-offset));
7080
7296
  --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--motion--duration--slide-in--default);
7081
7297
  --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
7082
- --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);
7298
+ --pf-v6-c-menu--m-drilldown__content--Transition: height var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--height);
7083
7299
  --pf-v6-c-menu--m-drilldown--c-menu--InsetBlockStart: 0;
7084
- --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
7300
+ --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: 0s;
7085
7301
  --pf-v6-c-menu--m-drilldown--c-menu--Transition: transform var(--pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform);
7086
- --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
7302
+ --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: 0s;
7087
7303
  --pf-v6-c-menu--m-drilldown__list--Transition: transform var(--pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform);
7088
7304
  --pf-v6-c-menu--m-drilled-in--c-menu__list-item--m-current-path--c-menu--ZIndex: var(--pf-t--global--z-index--xs);
7089
7305
  }
7090
7306
 
7307
+ @media (prefers-reduced-motion: no-preference) {
7308
+ .pf-v6-c-menu {
7309
+ --pf-v6-c-menu--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
7310
+ }
7311
+ }
7312
+ @media (prefers-reduced-motion: no-preference) {
7313
+ .pf-v6-c-menu {
7314
+ --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);
7315
+ }
7316
+ }
7317
+ @media (prefers-reduced-motion: no-preference) {
7318
+ .pf-v6-c-menu {
7319
+ --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
7320
+ }
7321
+ }
7322
+ @media (prefers-reduced-motion: no-preference) {
7323
+ .pf-v6-c-menu {
7324
+ --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
7325
+ }
7326
+ }
7091
7327
  .pf-v6-c-menu__content,
7092
7328
  .pf-v6-c-menu__list-item,
7093
7329
  .pf-v6-c-menu__item-main,
@@ -7636,4 +7872,164 @@ button.pf-v6-c-breadcrumb__link {
7636
7872
  --pf-v6-c-menu-toggle--BorderWidth: 0;
7637
7873
  --pf-v6-c-menu-toggle--BorderColor: transparent;
7638
7874
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
7875
+ }
7876
+
7877
+ .pf-v6-c-spinner {
7878
+ --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
7879
+ --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
7880
+ --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
7881
+ --pf-v6-c-spinner--Color: var(--pf-t--global--icon--color--brand--default);
7882
+ --pf-v6-c-spinner--AnimationDuration: 1.4s;
7883
+ --pf-v6-c-spinner--AnimationTimingFunction: linear;
7884
+ --pf-v6-c-spinner--StrokeWidth: 10;
7885
+ --pf-v6-c-spinner__path--StrokeWidth: var(--pf-v6-c-spinner--StrokeWidth);
7886
+ --pf-v6-c-spinner__path--AnimationTimingFunction: ease-in-out;
7887
+ --pf-v6-c-spinner--m-xs--diameter: var(--pf-t--global--icon--size--sm);
7888
+ --pf-v6-c-spinner--m-sm--diameter: var(--pf-t--global--icon--size--md);
7889
+ --pf-v6-c-spinner--m-md--diameter: var(--pf-t--global--icon--size--lg);
7890
+ --pf-v6-c-spinner--m-lg--diameter: var(--pf-t--global--icon--size--xl);
7891
+ --pf-v6-c-spinner--m-xl--diameter: var(--pf-t--global--icon--size--2xl);
7892
+ --pf-v6-c-spinner--m-inline--diameter: 1em;
7893
+ }
7894
+
7895
+ .pf-v6-c-spinner {
7896
+ width: var(--pf-v6-c-spinner--Width);
7897
+ height: var(--pf-v6-c-spinner--Height);
7898
+ overflow: hidden;
7899
+ animation: pf-v6-c-spinner-animation-rotate calc(var(--pf-v6-c-spinner--AnimationDuration) * 2) var(--pf-v6-c-spinner--AnimationTimingFunction) infinite;
7900
+ }
7901
+
7902
+ .pf-v6-c-spinner.pf-m-inline {
7903
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-inline--diameter);
7904
+ }
7905
+
7906
+ .pf-v6-c-spinner.pf-m-xs {
7907
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xs--diameter);
7908
+ --pf-v6-c-spinner--StrokeWidth: 15;
7909
+ }
7910
+
7911
+ .pf-v6-c-spinner.pf-m-sm {
7912
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-sm--diameter);
7913
+ }
7914
+
7915
+ .pf-v6-c-spinner.pf-m-md {
7916
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-md--diameter);
7917
+ }
7918
+
7919
+ .pf-v6-c-spinner.pf-m-lg {
7920
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-lg--diameter);
7921
+ }
7922
+
7923
+ .pf-v6-c-spinner.pf-m-xl {
7924
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xl--diameter);
7925
+ }
7926
+
7927
+ .pf-v6-c-spinner__path {
7928
+ width: 100%;
7929
+ height: 100%;
7930
+ stroke: var(--pf-v6-c-spinner--Color);
7931
+ stroke-dasharray: 283;
7932
+ stroke-dashoffset: 280;
7933
+ stroke-linecap: round;
7934
+ stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
7935
+ transform-origin: 50% 50%;
7936
+ animation: pf-v6-c-spinner-animation-dash var(--pf-v6-c-spinner--AnimationDuration) var(--pf-v6-c-spinner__path--AnimationTimingFunction) infinite;
7937
+ }
7938
+
7939
+ @keyframes pf-v6-c-spinner-animation-rotate {
7940
+ 0% {
7941
+ transform: rotate(0deg);
7942
+ }
7943
+ 100% {
7944
+ transform: rotate(360deg);
7945
+ }
7946
+ }
7947
+ @keyframes pf-v6-c-spinner-animation-dash {
7948
+ 0% {
7949
+ stroke-dashoffset: 280;
7950
+ transform: rotate(0);
7951
+ }
7952
+ 15% {
7953
+ stroke-width: calc(var(--pf-v6-c-spinner__path--StrokeWidth) - 4);
7954
+ }
7955
+ 40% {
7956
+ stroke-dasharray: 220;
7957
+ stroke-dashoffset: 150;
7958
+ }
7959
+ 100% {
7960
+ stroke-dashoffset: 280;
7961
+ transform: rotate(720deg);
7962
+ }
7963
+ }
7964
+ .pf-v6-c-badge {
7965
+ --pf-v6-c-badge--BorderColor: transparent;
7966
+ --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
7967
+ --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
7968
+ --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
7969
+ --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
7970
+ --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7971
+ --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7972
+ --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7973
+ --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
7974
+ --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
7975
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7976
+ --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
7977
+ --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7978
+ --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7979
+ --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
7980
+ --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
7981
+ --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
7982
+ --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
7983
+ --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
7984
+ --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7985
+ }
7986
+
7987
+ .pf-v6-c-badge {
7988
+ position: relative;
7989
+ display: inline-block;
7990
+ min-width: var(--pf-v6-c-badge--MinWidth);
7991
+ padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
7992
+ padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
7993
+ font-size: var(--pf-v6-c-badge--FontSize);
7994
+ font-weight: var(--pf-v6-c-badge--FontWeight);
7995
+ color: var(--pf-v6-c-badge--Color);
7996
+ text-align: center;
7997
+ white-space: nowrap;
7998
+ background-color: var(--pf-v6-c-badge--BackgroundColor);
7999
+ border-radius: var(--pf-v6-c-badge--BorderRadius);
8000
+ }
8001
+
8002
+ .pf-v6-c-badge::after {
8003
+ position: absolute;
8004
+ inset: 0;
8005
+ pointer-events: none;
8006
+ content: "";
8007
+ border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
8008
+ border-radius: inherit;
8009
+ }
8010
+
8011
+ .pf-v6-c-badge.pf-m-read {
8012
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
8013
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
8014
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
8015
+ }
8016
+
8017
+ .pf-v6-c-badge.pf-m-unread {
8018
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
8019
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
8020
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
8021
+ }
8022
+
8023
+ .pf-v6-c-badge.pf-m-disabled {
8024
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
8025
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
8026
+ }
8027
+
8028
+ .pf-v6-c-badge.pf-m-disabled::after {
8029
+ border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
8030
+ }
8031
+
8032
+ .pf-v6-c-badge__toggle-icon {
8033
+ margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
8034
+ color: var(--pf-v6-c-badge__toggle-icon--Color);
7639
8035
  }