@patternfly/react-templates 6.5.0-prerelease.5 → 6.5.0-prerelease.50

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 (24) hide show
  1. package/CHANGELOG.md +178 -0
  2. package/components/package.json +1 -1
  3. package/dist/dynamic/components/Dropdown/package.json +1 -1
  4. package/dist/dynamic/components/Select/package.json +1 -1
  5. package/dist/esm/components/Select/MultiTypeaheadSelect.js +2 -2
  6. package/dist/esm/components/Select/MultiTypeaheadSelect.js.map +1 -1
  7. package/dist/esm/components/Select/TypeaheadSelect.d.ts.map +1 -1
  8. package/dist/esm/components/Select/TypeaheadSelect.js +13 -7
  9. package/dist/esm/components/Select/TypeaheadSelect.js.map +1 -1
  10. package/dist/js/components/Select/MultiTypeaheadSelect.js +2 -2
  11. package/dist/js/components/Select/MultiTypeaheadSelect.js.map +1 -1
  12. package/dist/js/components/Select/TypeaheadSelect.d.ts.map +1 -1
  13. package/dist/js/components/Select/TypeaheadSelect.js +13 -7
  14. package/dist/js/components/Select/TypeaheadSelect.js.map +1 -1
  15. package/dist/umd/assets/{output-B0S322Xe.css → output-BTS6ztYO.css} +2011 -1863
  16. package/dist/umd/react-templates.min.js +1 -1
  17. package/package.json +6 -6
  18. package/src/components/Dropdown/__tests__/__snapshots__/SimpleDropdown.test.tsx.snap +34 -10
  19. package/src/components/Select/MultiTypeaheadSelect.tsx +2 -2
  20. package/src/components/Select/TypeaheadSelect.tsx +19 -7
  21. package/src/components/Select/__tests__/__snapshots__/CheckboxSelectSnapshots.test.tsx.snap +34 -10
  22. package/src/components/Select/__tests__/__snapshots__/MultiTypeaheadSelect.test.tsx.snap +20 -8
  23. package/src/components/Select/__tests__/__snapshots__/SimpleSelect.test.tsx.snap +34 -10
  24. package/src/components/Select/__tests__/__snapshots__/TypeaheadSelect.test.tsx.snap +20 -8
package/dist/umd/assets/{output-B0S322Xe.css → output-BTS6ztYO.css} RENAMED
@@ -3,1515 +3,1948 @@
3
3
  pointer-events: none;
4
4
  }
5
5
 
6
- .pf-v6-c-menu-toggle {
7
- --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
8
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
9
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
10
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
11
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
12
- --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));
13
- --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
14
- --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
15
- --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
16
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
17
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
18
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
19
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
20
- --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
21
- --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
22
- --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
23
- --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
24
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
25
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
26
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
27
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
28
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
29
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
30
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
31
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--control--clicked);
32
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
33
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
34
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
35
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
36
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
37
- --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
38
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
39
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
40
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
41
- --pf-v6-c-menu-toggle__icon--TransitionDelay: 0s;
42
- --pf-v6-c-menu-toggle__icon--TransitionDuration: 0s;
43
- --pf-v6-c-menu-toggle__icon--TransitionProperty: none;
44
- --pf-v6-c-menu-toggle--hover__icon--TransitionDelay: 0s;
45
- --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: 0s;
46
- --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: none;
47
- --pf-v6-c-menu-toggle__icon--Rotate: 0deg;
48
- --pf-v6-c-menu-toggle--hover__icon--Rotate: 0deg;
49
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
50
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
51
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
52
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
53
- --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
54
- --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
55
- --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
56
- --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
57
- --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
58
- --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
59
- --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
60
- --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
61
- --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
62
- --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
63
- --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
64
- --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
65
- --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
66
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
67
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
68
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
69
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
70
- --pf-v6-c-menu-toggle--m-secondary--BackgroundColor: transparent;
71
- --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
72
- --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
73
- --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
74
- --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
75
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
76
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
77
- --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
78
- --pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor: transparent;
79
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
80
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
81
- --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
82
- --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
83
- --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
84
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
85
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
86
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
87
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
88
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
89
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
90
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
91
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
92
- --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
93
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
94
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
95
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
96
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
97
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
98
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
99
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
100
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--alt);
101
- --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
102
- --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
103
- --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
104
- --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
105
- --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
106
- --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
107
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
108
- --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));
109
- --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
110
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
111
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
112
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
113
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
114
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
115
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
116
- --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
117
- --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
118
- --pf-v6-c-menu-toggle--m-plain--BorderColor: var(--pf-t--global--border--color--high-contrast);
119
- --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
120
- --pf-v6-c-menu-toggle--m-plain--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
121
- --pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
122
- --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
123
- --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
124
- --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
125
- --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
126
- --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
127
- --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
128
- --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
129
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
130
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
131
- --pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
132
- --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
133
- --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
134
- --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
135
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
136
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
137
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
138
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
139
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
140
- --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
141
- --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
142
- --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
143
- --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
144
- --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
145
- --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
146
- --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
147
- --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
148
- --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
149
- --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
150
- --pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
151
- --pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
152
- --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
153
- --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
154
- --pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate: 60deg;
6
+ .pf-v6-c-check {
7
+ --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
8
+ --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
9
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
10
+ --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
11
+ --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
12
+ --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
13
+ --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
14
+ --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
15
+ --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
16
+ --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
17
+ --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
18
+ --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
19
+ --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
20
+ --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
21
+ }
22
+
23
+ .pf-v6-c-check {
24
+ display: grid;
25
+ grid-template-columns: auto 1fr;
26
+ grid-gap: var(--pf-v6-c-check--GridGap);
27
+ accent-color: var(--pf-v6-c-check--AccentColor);
28
+ }
29
+
30
+ .pf-v6-c-check.pf-m-standalone {
31
+ display: inline-grid;
32
+ grid-template-columns: auto;
33
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
34
+ }
35
+
36
+ .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
37
+ align-self: center;
38
+ transform: none;
39
+ }
40
+
41
+ .pf-v6-c-check__input {
42
+ align-self: start;
43
+ font-size: var(--pf-v6-c-check__label--FontSize);
44
+ line-height: var(--pf-v6-c-check__label--LineHeight);
45
+ transform: translateY(var(--pf-v6-c-check__input--TranslateY));
46
+ }
47
+
48
+ .pf-v6-c-check__label {
49
+ font-size: var(--pf-v6-c-check__label--FontSize);
50
+ font-weight: var(--pf-v6-c-check__label--FontWeight);
51
+ line-height: var(--pf-v6-c-check__label--LineHeight);
52
+ color: var(--pf-v6-c-check__label--Color);
53
+ }
54
+
55
+ .pf-v6-c-check__description {
56
+ grid-column: 2;
57
+ font-size: var(--pf-v6-c-check__description--FontSize);
58
+ color: var(--pf-v6-c-check__description--Color);
59
+ }
60
+
61
+ .pf-v6-c-check__body {
62
+ grid-column: 2;
63
+ }
64
+
65
+ .pf-v6-c-check__label,
66
+ .pf-v6-c-check__input {
67
+ justify-self: start;
68
+ }
69
+
70
+ label.pf-v6-c-check, .pf-v6-c-check__label,
71
+ .pf-v6-c-check__input {
72
+ cursor: pointer;
73
+ }
74
+
75
+ .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
76
+ .pf-v6-c-check__input:disabled,
77
+ .pf-v6-c-check__input.pf-m-disabled {
78
+ --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
79
+ cursor: not-allowed;
80
+ }
81
+
82
+ .pf-v6-c-check__label-required {
83
+ margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
84
+ font-size: var(--pf-v6-c-check__label-required--FontSize);
85
+ color: var(--pf-v6-c-check__label-required--Color);
86
+ }
87
+
88
+ .pf-v6-c-label {
89
+ --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
90
+ --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
91
+ --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
92
+ --pf-v6-c-label--PaddingInlineStart: var(--pf-t--global--spacer--sm);
93
+ --pf-v6-c-label--MaxWidth: 100%;
94
+ --pf-v6-c-label--MinWidth: calc((var(--pf-v6-c-label--FontSize) * var(--pf-t--global--font--line-height--body) + var(--pf-v6-c-label--PaddingBlockStart) + var(--pf-v6-c-label--PaddingBlockEnd)));
95
+ --pf-v6-c-label--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
96
+ --pf-v6-c-label--BorderColor: var(--pf-t--global--border--color--high-contrast);
97
+ --pf-v6-c-label--BorderRadius: var(--pf-t--global--border--radius--pill);
98
+ --pf-v6-c-label--FontSize: var(--pf-t--global--font--size--body--sm);
99
+ --pf-v6-c-label--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
100
+ --pf-v6-c-label--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
101
+ --pf-v6-c-label--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
102
+ --pf-v6-c-label__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
103
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--hover);
104
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-gray--hover);
105
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--hover);
106
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--default);
107
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--hover);
108
+ --pf-v6-c-label--m-blue--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--default);
109
+ --pf-v6-c-label--m-blue--Color: var(--pf-t--global--text--color--nonstatus--on-blue--default);
110
+ --pf-v6-c-label--m-blue__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--default);
111
+ --pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--hover);
112
+ --pf-v6-c-label--m-blue--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-blue--hover);
113
+ --pf-v6-c-label--m-blue--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--hover);
114
+ --pf-v6-c-label--m-blue--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--default);
115
+ --pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--hover);
116
+ --pf-v6-c-label--m-red--BackgroundColor: var(--pf-t--global--color--nonstatus--red--default);
117
+ --pf-v6-c-label--m-red--Color: var(--pf-t--global--text--color--nonstatus--on-red--default);
118
+ --pf-v6-c-label--m-red__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--default);
119
+ --pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--red--hover);
120
+ --pf-v6-c-label--m-red--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-red--hover);
121
+ --pf-v6-c-label--m-red--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--hover);
122
+ --pf-v6-c-label--m-red--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--red--default);
123
+ --pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--red--hover);
124
+ --pf-v6-c-label--m-orange--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--default);
125
+ --pf-v6-c-label--m-orange--Color: var(--pf-t--global--text--color--nonstatus--on-orange--default);
126
+ --pf-v6-c-label--m-orange__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--default);
127
+ --pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--hover);
128
+ --pf-v6-c-label--m-orange--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orange--hover);
129
+ --pf-v6-c-label--m-orange--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--hover);
130
+ --pf-v6-c-label--m-orange--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--default);
131
+ --pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--hover);
132
+ --pf-v6-c-label--m-orangered--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--default);
133
+ --pf-v6-c-label--m-orangered--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--default);
134
+ --pf-v6-c-label--m-orangered__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--default);
135
+ --pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--hover);
136
+ --pf-v6-c-label--m-orangered--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--hover);
137
+ --pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--hover);
138
+ --pf-v6-c-label--m-orangered--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--default);
139
+ --pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--hover);
140
+ --pf-v6-c-label--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
141
+ --pf-v6-c-label--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
142
+ --pf-v6-c-label--m-yellow__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--default);
143
+ --pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--hover);
144
+ --pf-v6-c-label--m-yellow--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--hover);
145
+ --pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--hover);
146
+ --pf-v6-c-label--m-yellow--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--default);
147
+ --pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--hover);
148
+ --pf-v6-c-label--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
149
+ --pf-v6-c-label--m-green--Color: var(--pf-t--global--text--color--nonstatus--on-green--default);
150
+ --pf-v6-c-label--m-green__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--default);
151
+ --pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--green--hover);
152
+ --pf-v6-c-label--m-green--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-green--hover);
153
+ --pf-v6-c-label--m-green--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--hover);
154
+ --pf-v6-c-label--m-green--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--green--default);
155
+ --pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--green--hover);
156
+ --pf-v6-c-label--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
157
+ --pf-v6-c-label--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
158
+ --pf-v6-c-label--m-teal__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--default);
159
+ --pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--hover);
160
+ --pf-v6-c-label--m-teal--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-teal--hover);
161
+ --pf-v6-c-label--m-teal--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--hover);
162
+ --pf-v6-c-label--m-teal--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--default);
163
+ --pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--hover);
164
+ --pf-v6-c-label--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
165
+ --pf-v6-c-label--m-purple--Color: var(--pf-t--global--text--color--nonstatus--on-purple--default);
166
+ --pf-v6-c-label--m-purple__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--default);
167
+ --pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--hover);
168
+ --pf-v6-c-label--m-purple--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-purple--hover);
169
+ --pf-v6-c-label--m-purple--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--hover);
170
+ --pf-v6-c-label--m-purple--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--default);
171
+ --pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--hover);
172
+ --pf-v6-c-label--m-success--BackgroundColor: var(--pf-t--global--color--status--success--default);
173
+ --pf-v6-c-label--m-success--Color: var(--pf-t--global--text--color--status--on-success--default);
174
+ --pf-v6-c-label--m-success__icon--Color: var(--pf-t--global--icon--color--status--on-success--default);
175
+ --pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--success--hover);
176
+ --pf-v6-c-label--m-success--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-success--hover);
177
+ --pf-v6-c-label--m-success--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-success--hover);
178
+ --pf-v6-c-label--m-success--m-outline__icon--Color: var(--pf-t--global--icon--color--status--success--default);
179
+ --pf-v6-c-label--m-success--m-outline--BorderColor: var(--pf-t--global--border--color--status--success--default);
180
+ --pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--success--hover);
181
+ --pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--success--hover);
182
+ --pf-v6-c-label--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
183
+ --pf-v6-c-label--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
184
+ --pf-v6-c-label--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
185
+ --pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--warning--hover);
186
+ --pf-v6-c-label--m-warning--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-warning--hover);
187
+ --pf-v6-c-label--m-warning--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-warning--hover);
188
+ --pf-v6-c-label--m-warning--m-outline__icon--Color: var(--pf-t--global--icon--color--status--warning--default);
189
+ --pf-v6-c-label--m-warning--m-outline--BorderColor: var(--pf-t--global--border--color--status--warning--default);
190
+ --pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
191
+ --pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--warning--hover);
192
+ --pf-v6-c-label--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
193
+ --pf-v6-c-label--m-danger--Color: var(--pf-t--global--text--color--status--on-danger--default);
194
+ --pf-v6-c-label--m-danger__icon--Color: var(--pf-t--global--icon--color--status--on-danger--default);
195
+ --pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--danger--hover);
196
+ --pf-v6-c-label--m-danger--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-danger--hover);
197
+ --pf-v6-c-label--m-danger--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-danger--hover);
198
+ --pf-v6-c-label--m-danger--m-outline__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
199
+ --pf-v6-c-label--m-danger--m-outline--BorderColor: var(--pf-t--global--border--color--status--danger--default);
200
+ --pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
201
+ --pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
202
+ --pf-v6-c-label--m-info--BackgroundColor: var(--pf-t--global--color--status--info--default);
203
+ --pf-v6-c-label--m-info--Color: var(--pf-t--global--text--color--status--on-info--default);
204
+ --pf-v6-c-label--m-info__icon--Color: var(--pf-t--global--icon--color--status--on-info--default);
205
+ --pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--info--hover);
206
+ --pf-v6-c-label--m-info--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-info--hover);
207
+ --pf-v6-c-label--m-info--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-info--hover);
208
+ --pf-v6-c-label--m-info--m-outline__icon--Color: var(--pf-t--global--icon--color--status--info--default);
209
+ --pf-v6-c-label--m-info--m-outline--BorderColor: var(--pf-t--global--border--color--status--info--default);
210
+ --pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--info--hover);
211
+ --pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--info--hover);
212
+ --pf-v6-c-label--m-custom--BackgroundColor: var(--pf-t--global--color--status--custom--default);
213
+ --pf-v6-c-label--m-custom--Color: var(--pf-t--global--text--color--status--on-custom--default);
214
+ --pf-v6-c-label--m-custom__icon--Color: var(--pf-t--global--icon--color--status--on-custom--default);
215
+ --pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--custom--hover);
216
+ --pf-v6-c-label--m-custom--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-custom--hover);
217
+ --pf-v6-c-label--m-custom--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-custom--hover);
218
+ --pf-v6-c-label--m-custom--m-outline__icon--Color: var(--pf-t--global--icon--color--status--custom--default);
219
+ --pf-v6-c-label--m-custom--m-outline--BorderColor: var(--pf-t--global--border--color--status--custom--default);
220
+ --pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--custom--hover);
221
+ --pf-v6-c-label--m-custom--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--custom--hover);
222
+ --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
223
+ --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
224
+ --pf-v6-c-label--m-clickable__content--Cursor: pointer;
225
+ --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label__icon--Color);
226
+ --pf-v6-c-label--m-outline--BorderWidth: var(--pf-t--global--border--width--action--default);
227
+ --pf-v6-c-label--m-outline--BackgroundColor: transparent;
228
+ --pf-v6-c-label--m-outline--Color: var(--pf-t--global--text--color--regular);
229
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-t--global--icon--color--regular);
230
+ --pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor: transparent;
231
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
232
+ --pf-v6-c-label--m-outline--m-clickable--hover--Color: var(--pf-t--global--text--color--regular);
233
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--regular);
234
+ --pf-v6-c-label--m-overflow--Color: var(--pf-t--global--text--color--brand--default);
235
+ --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
236
+ --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
237
+ --pf-v6-c-label--m-overflow--hover--Color: var(--pf-t--global--text--color--brand--hover);
238
+ --pf-v6-c-label--m-overflow--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
239
+ --pf-v6-c-label--m-overflow--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
240
+ --pf-v6-c-label--m-add--Color: var(--pf-t--global--text--color--brand--default);
241
+ --pf-v6-c-label--m-add--BackgroundColor: transparent;
242
+ --pf-v6-c-label--m-add--BorderColor: var(--pf-t--global--border--color--default);
243
+ --pf-v6-c-label--m-add--BorderWidth: var(--pf-t--global--border--width--action--default);
244
+ --pf-v6-c-label--m-add--hover--Color: var(--pf-t--global--text--color--brand--hover);
245
+ --pf-v6-c-label--m-add--hover--BackgroundColor: transparent;
246
+ --pf-v6-c-label--m-add--hover--BorderColor: var(--pf-t--global--border--color--hover);
247
+ --pf-v6-c-label--m-add--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
248
+ --pf-v6-c-label--m-compact--PaddingBlockStart: 0;
249
+ --pf-v6-c-label--m-compact--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
250
+ --pf-v6-c-label--m-compact--PaddingBlockEnd: 0;
251
+ --pf-v6-c-label--m-compact--PaddingInlineStart: var(--pf-t--global--spacer--sm);
252
+ --pf-v6-c-label--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
253
+ --pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset: 0.0625rem;
254
+ --pf-v6-c-label--m-compact--MinWidth: calc((var(--pf-v6-c-label--m-compact--FontSize) * var(--pf-t--global--font--line-height--body)) + (var(--pf-v6-c-label--m-compact--PaddingBlockStart) + var(--pf-v6-c-label--m-compact--PaddingBlockEnd)));
255
+ --pf-v6-c-label__content--MaxWidth: 100%;
256
+ --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
257
+ --pf-v6-c-label__content--Cursor: initial;
258
+ --pf-v6-c-label__icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
259
+ --pf-v6-c-label__text--MaxWidth: 100%;
260
+ --pf-v6-c-label__actions--MarginInlineEnd: 0;
261
+ --pf-v6-c-label__actions--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
262
+ --pf-v6-c-label__actions--c-button--OutlineOffset: -0.1875rem;
263
+ --pf-v6-c-label__actions--c-button--MarginBlockStart: 0;
264
+ --pf-v6-c-label__actions--c-button--MarginBlockEnd: 0;
265
+ --pf-v6-c-label__actions--c-button--PaddingBlockStart: 0;
266
+ --pf-v6-c-label__actions--c-button--PaddingInlineEnd: 0;
267
+ --pf-v6-c-label__actions--c-button--PaddingBlockEnd: 0;
268
+ --pf-v6-c-label__actions--c-button--PaddingInlineStart: 0;
269
+ --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--default);
270
+ --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--default);
271
+ --pf-v6-c-label--m-editable--hover--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--hover);
272
+ --pf-v6-c-label--m-editable--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--hover);
273
+ --pf-v6-c-label--m-editable--TextUnderlineOffset: 0.25rem;
274
+ --pf-v6-c-label--m-editable__content--MaxWidth: 16ch;
275
+ --pf-v6-c-label--m-editable__content--Cursor: pointer;
276
+ --pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine: none;
277
+ --pf-v6-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
278
+ --pf-v6-c-label--m-editable--m-editable-active--Color: var(--pf-t--global--text--color--regular);
279
+ --pf-v6-c-label--m-editable--m-editable-active__content--Cursor: initial;
280
+ --pf-v6-c-label--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
281
+ --pf-v6-c-label--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
282
+ --pf-v6-c-label--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
283
+ --pf-v6-c-label--m-disabled--c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
155
284
  }
156
285
 
157
- .pf-v6-c-menu-toggle {
286
+ .pf-v6-c-label {
158
287
  position: relative;
159
- display: inline-flex;
160
- gap: var(--pf-v6-c-menu-toggle--Gap);
161
- align-items: center;
162
- justify-content: center;
163
- min-width: var(--pf-v6-c-menu-toggle--MinWidth);
164
- max-width: 100%;
165
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
166
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
167
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
168
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
169
- font-size: var(--pf-v6-c-menu-toggle--FontSize);
170
- line-height: var(--pf-v6-c-menu-toggle--LineHeight);
171
- color: var(--pf-v6-c-menu-toggle--Color);
172
- cursor: pointer;
173
- background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
288
+ gap: var(--pf-v6-c-label--Gap);
289
+ min-width: var(--pf-v6-c-label--MinWidth);
290
+ max-width: var(--pf-v6-c-label--MaxWidth);
291
+ padding-block-start: var(--pf-v6-c-label--PaddingBlockStart);
292
+ padding-block-end: var(--pf-v6-c-label--PaddingBlockEnd);
293
+ padding-inline-start: var(--pf-v6-c-label--PaddingInlineStart);
294
+ padding-inline-end: var(--pf-v6-c-label--PaddingInlineEnd);
295
+ font-size: var(--pf-v6-c-label--FontSize);
296
+ white-space: nowrap;
297
+ background: transparent;
298
+ isolation: isolate;
174
299
  border: 0;
175
- transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
176
- transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
177
- transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
300
+ border-radius: var(--pf-v6-c-label--BorderRadius);
301
+ }
302
+
303
+ .pf-v6-c-label.pf-m-blue {
304
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-blue--BackgroundColor);
305
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-blue--Color);
306
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-blue__icon--Color);
307
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor);
308
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover--Color);
309
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover__icon--Color);
310
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--BorderColor);
311
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor);
312
+ }
313
+
314
+ .pf-v6-c-label.pf-m-red {
315
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-red--BackgroundColor);
316
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-red--Color);
317
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-red__icon--Color);
318
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor);
319
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-red--m-clickable--hover--Color);
320
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-red--m-clickable--hover__icon--Color);
321
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-red--m-outline--BorderColor);
322
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor);
323
+ }
324
+
325
+ .pf-v6-c-label.pf-m-orange {
326
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orange--BackgroundColor);
327
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orange--Color);
328
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orange__icon--Color);
329
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor);
330
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover--Color);
331
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover__icon--Color);
332
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--BorderColor);
333
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor);
334
+ }
335
+
336
+ .pf-v6-c-label.pf-m-orangered {
337
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orangered--BackgroundColor);
338
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orangered--Color);
339
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orangered__icon--Color);
340
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor);
341
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover--Color);
342
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color);
343
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--BorderColor);
344
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor);
345
+ }
346
+
347
+ .pf-v6-c-label.pf-m-yellow {
348
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-yellow--BackgroundColor);
349
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-yellow--Color);
350
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-yellow__icon--Color);
351
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor);
352
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover--Color);
353
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color);
354
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--BorderColor);
355
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor);
356
+ }
357
+
358
+ .pf-v6-c-label.pf-m-green {
359
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-green--BackgroundColor);
360
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-green--Color);
361
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-green__icon--Color);
362
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor);
363
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-green--m-clickable--hover--Color);
364
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-green--m-clickable--hover__icon--Color);
365
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-green--m-outline--BorderColor);
366
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor);
367
+ }
368
+
369
+ .pf-v6-c-label.pf-m-teal {
370
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-teal--BackgroundColor);
371
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-teal--Color);
372
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-teal__icon--Color);
373
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor);
374
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover--Color);
375
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover__icon--Color);
376
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--BorderColor);
377
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor);
378
+ }
379
+
380
+ .pf-v6-c-label.pf-m-purple {
381
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-purple--BackgroundColor);
382
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-purple--Color);
383
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-purple__icon--Color);
384
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor);
385
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover--Color);
386
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover__icon--Color);
387
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--BorderColor);
388
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor);
389
+ }
390
+
391
+ .pf-v6-c-label.pf-m-success {
392
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-success--BackgroundColor);
393
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-success--Color);
394
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-success__icon--Color);
395
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor);
396
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-success--m-clickable--hover--Color);
397
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-clickable--hover__icon--Color);
398
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-success--m-outline__icon--Color);
399
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-success--m-outline--BorderColor);
400
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor);
401
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color);
402
+ }
403
+
404
+ .pf-v6-c-label.pf-m-warning {
405
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-warning--BackgroundColor);
406
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-warning--Color);
407
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-warning__icon--Color);
408
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor);
409
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover--Color);
410
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover__icon--Color);
411
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-warning--m-outline__icon--Color);
412
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--BorderColor);
413
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor);
414
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color);
415
+ }
416
+
417
+ .pf-v6-c-label.pf-m-danger {
418
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-danger--BackgroundColor);
419
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-danger--Color);
420
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-danger__icon--Color);
421
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor);
422
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover--Color);
423
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover__icon--Color);
424
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-danger--m-outline__icon--Color);
425
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--BorderColor);
426
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor);
427
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color);
428
+ }
429
+
430
+ .pf-v6-c-label.pf-m-info {
431
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-info--BackgroundColor);
432
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-info--Color);
433
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-info__icon--Color);
434
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor);
435
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-info--m-clickable--hover--Color);
436
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-clickable--hover__icon--Color);
437
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-info--m-outline__icon--Color);
438
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-info--m-outline--BorderColor);
439
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor);
440
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color);
178
441
  }
179
442
 
180
- .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
181
- border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
443
+ .pf-v6-c-label.pf-m-custom {
444
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-custom--BackgroundColor);
445
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-custom--Color);
446
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-custom__icon--Color);
447
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor);
448
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover--Color);
449
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover__icon--Color);
450
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-custom--m-outline__icon--Color);
451
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--BorderColor);
452
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor);
453
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color);
182
454
  }
183
455
 
184
- .pf-v6-c-menu-toggle::before {
185
- position: absolute;
186
- inset-block-start: 0;
187
- inset-block-end: 0;
188
- inset-inline-start: 0;
189
- inset-inline-end: 0;
190
- z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
191
- pointer-events: none;
192
- content: "";
193
- border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
194
- transition: inherit;
456
+ .pf-v6-c-label.pf-m-compact {
457
+ --pf-v6-c-label--PaddingBlockStart: var(--pf-v6-c-label--m-compact--PaddingBlockStart);
458
+ --pf-v6-c-label--PaddingInlineEnd: var(--pf-v6-c-label--m-compact--PaddingInlineEnd);
459
+ --pf-v6-c-label--PaddingBlockEnd: var(--pf-v6-c-label--m-compact--PaddingBlockEnd);
460
+ --pf-v6-c-label--PaddingInlineStart: var(--pf-v6-c-label--m-compact--PaddingInlineStart);
461
+ --pf-v6-c-label--FontSize: var(--pf-v6-c-label--m-compact--FontSize);
462
+ --pf-v6-c-label--MinWidth: var(--pf-v6-c-label--m-compact--MinWidth);
463
+ --pf-v6-c-label--m-editable--TextUnderlineOffset: var(--pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset);
195
464
  }
196
465
 
197
- .pf-v6-c-menu-toggle.pf-m-primary {
198
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
199
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
200
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
201
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
202
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
203
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
204
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
205
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
206
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
207
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
208
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
209
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
210
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
211
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
212
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
213
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
214
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
466
+ .pf-v6-c-label.pf-m-filled .pf-v6-c-label__actions .pf-v6-c-button {
467
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-label--m-filled__actions--c-button__icon--Color);
215
468
  }
216
469
 
217
- .pf-v6-c-menu-toggle.pf-m-secondary {
218
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
219
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
220
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
221
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--BackgroundColor);
222
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
223
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
224
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
225
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
226
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
227
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
228
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor);
229
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
230
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
231
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
232
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
233
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
234
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
470
+ .pf-v6-c-label.pf-m-outline {
471
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-outline--Color);
472
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-outline--BorderWidth);
473
+ --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-outline--BorderColor);
474
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-outline--BackgroundColor);
475
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-outline__icon--Color);
476
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor);
477
+ --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
478
+ --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
479
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover--Color);
480
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover__icon--Color);
235
481
  }
236
482
 
237
- .pf-v6-c-menu-toggle.pf-m-full-height {
238
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
239
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
240
- --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
241
- align-items: center;
242
- height: 100%;
483
+ .pf-v6-c-label.pf-m-editable {
484
+ --pf-v6-c-label__content--MaxWidth: var(--pf-v6-c-label--m-editable__content--MaxWidth);
485
+ --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable__content--Cursor);
243
486
  }
244
487
 
245
- .pf-v6-c-menu-toggle.pf-m-full-width {
246
- width: 100%;
488
+ .pf-v6-c-label.pf-m-editable .pf-v6-c-label__content:is(:hover, :focus) {
489
+ --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--hover--TextDecorationLine);
490
+ --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-v6-c-label--m-editable--hover--TextDecorationStyle);
247
491
  }
248
492
 
249
- .pf-v6-c-menu-toggle.pf-m-plain {
250
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
251
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
252
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
253
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
254
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
255
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
256
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
257
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
258
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
259
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
260
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
261
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
262
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
263
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
264
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
265
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
493
+ .pf-v6-c-label.pf-m-editable .pf-v6-c-label__text {
494
+ text-decoration-line: var(--pf-v6-c-label--m-editable--TextDecorationLine);
495
+ text-decoration-style: var(--pf-v6-c-label--m-editable--TextDecorationStyle);
496
+ text-underline-offset: var(--pf-v6-c-label--m-editable--TextUnderlineOffset);
266
497
  }
267
498
 
268
- .pf-v6-c-menu-toggle.pf-m-plain.pf-m-circle {
269
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius);
499
+ .pf-v6-c-label.pf-m-editable-active {
500
+ --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine);
501
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-editable--m-editable-active--BackgroundColor);
502
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-editable--m-editable-active--Color);
503
+ --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable--m-editable-active__content--Cursor);
270
504
  }
271
505
 
272
- .pf-v6-c-menu-toggle.pf-m-plain::before {
273
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
274
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
506
+ .pf-v6-c-label.pf-m-overflow {
507
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-overflow--Color);
508
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-overflow--BackgroundColor);
509
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-overflow--BorderWidth);
275
510
  }
276
511
 
277
- .pf-v6-c-menu-toggle:is(:hover, :focus) {
278
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
279
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
280
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
281
- --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--hover--BorderWidth);
282
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
283
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
284
- --pf-v6-c-menu-toggle__icon--TransitionDelay: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDelay);
285
- --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDuration);
286
- --pf-v6-c-menu-toggle__icon--TransitionProperty: var(--pf-v6-c-menu-toggle--hover__icon--TransitionProperty);
287
- --pf-v6-c-menu-toggle__icon--Rotate: var(--pf-v6-c-menu-toggle--hover__icon--Rotate);
512
+ .pf-v6-c-label.pf-m-overflow:is(:hover, :focus) {
513
+ --pf-v6-c-label--m-overflow--Color: var(--pf-v6-c-label--m-overflow--hover--Color);
514
+ --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-v6-c-label--m-overflow--hover--BackgroundColor);
515
+ --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-v6-c-label--m-overflow--hover--BorderWidth);
288
516
  }
289
517
 
290
- .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
291
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
292
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
293
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
294
- --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth);
295
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
296
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
518
+ .pf-v6-c-label.pf-m-add {
519
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-add--Color);
520
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-add--BackgroundColor);
521
+ --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-add--BorderColor);
522
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-add--BorderWidth);
297
523
  }
298
524
 
299
- .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
300
- border: 0;
525
+ .pf-v6-c-label.pf-m-add:is(:hover, :focus) {
526
+ --pf-v6-c-label--m-add--Color: var(--pf-v6-c-label--m-add--hover--Color);
527
+ --pf-v6-c-label--m-add--BackgroundColor: var(--pf-v6-c-label--m-add--hover--BackgroundColor);
528
+ --pf-v6-c-label--m-add--BorderColor: var(--pf-v6-c-label--m-add--hover--BorderColor);
529
+ --pf-v6-c-label--m-add--BorderWidth: var(--pf-v6-c-label--m-add--hover--BorderWidth);
301
530
  }
302
531
 
303
- .pf-v6-c-menu-toggle.pf-m-small {
304
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
305
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
306
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
307
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
308
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
309
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
310
- --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);
311
- --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);
532
+ .pf-v6-c-label.pf-m-clickable {
533
+ --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-clickable__content--Cursor);
312
534
  }
313
535
 
314
- .pf-v6-c-menu-toggle.pf-m-success {
315
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
316
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
536
+ .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content, .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
537
+ text-decoration-line: none;
317
538
  }
318
539
 
319
- .pf-v6-c-menu-toggle.pf-m-warning {
320
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
321
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
540
+ .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
541
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-clickable--hover--Color);
542
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
543
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-clickable--hover--BackgroundColor);
544
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-clickable--hover--BorderWidth);
545
+ --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-clickable--hover--BorderColor);
546
+ --pf-v6-c-label--m-outline--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
547
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
322
548
  }
323
549
 
324
- .pf-v6-c-menu-toggle.pf-m-danger {
325
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
326
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
550
+ .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) ~ .pf-v6-c-label__actions .pf-v6-c-button {
551
+ --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
327
552
  }
328
553
 
329
- @media screen and (prefers-reduced-motion: no-preference) {
330
- .pf-v6-c-menu-toggle.pf-m-danger {
331
- transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
332
- animation-name: pf-v6-c-menu-toggle-m-danger-motion;
333
- animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
334
- animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
335
- animation-fill-mode: both;
336
- }
554
+ .pf-v6-c-label.pf-m-disabled {
555
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-disabled--BackgroundColor);
556
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-disabled--Color);
557
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-disabled__icon--Color);
558
+ --pf-v6-c-label--BorderWidth: 0;
559
+ pointer-events: none;
337
560
  }
338
- .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
339
- animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
340
- animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
341
- animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
561
+
562
+ .pf-v6-c-label.pf-m-disabled .pf-v6-c-button {
563
+ --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-v6-c-label--m-disabled--c-button--disabled__icon--Color);
342
564
  }
343
565
 
344
- @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
345
- from {
346
- opacity: 0;
347
- }
348
- to {
349
- opacity: 1;
350
- }
566
+ .pf-v6-c-label,
567
+ .pf-v6-c-label__content {
568
+ display: inline-flex;
569
+ align-items: center;
570
+ justify-content: center;
351
571
  }
352
- .pf-v6-c-menu-toggle.pf-m-settings {
353
- --pf-v6-c-menu-toggle__icon--TransitionProperty: rotate;
354
- --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration);
355
- --pf-v6-c-menu-toggle__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction);
356
- --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: rotate;
357
- --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration);
358
- --pf-v6-c-menu-toggle--hover__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction);
359
- --pf-v6-c-menu-toggle--hover__icon--Rotate: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate);
572
+
573
+ .pf-v6-c-label__text {
574
+ overflow: hidden;
575
+ text-overflow: ellipsis;
576
+ white-space: nowrap;
577
+ max-width: var(--pf-v6-c-label__text--MaxWidth);
578
+ }
579
+
580
+ .pf-v6-c-label__content {
581
+ gap: var(--pf-v6-c-label__content--Gap);
582
+ max-width: var(--pf-v6-c-label__content--MaxWidth);
583
+ padding: 0;
584
+ overflow: hidden;
585
+ color: var(--pf-v6-c-label--Color);
586
+ cursor: var(--pf-v6-c-label__content--Cursor, revert);
587
+ background: transparent;
588
+ border-width: 0;
360
589
  }
361
590
 
362
- .pf-v6-c-menu-toggle.pf-m-placeholder {
363
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
591
+ .pf-v6-c-label__content::before {
592
+ position: absolute;
593
+ inset: 0;
594
+ z-index: -1;
595
+ pointer-events: none;
596
+ content: "";
597
+ background-color: var(--pf-v6-c-label--BackgroundColor);
598
+ border: var(--pf-v6-c-label--BorderWidth) solid var(--pf-v6-c-label--BorderColor);
599
+ border-radius: var(--pf-v6-c-label--BorderRadius);
364
600
  }
365
601
 
366
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
367
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
368
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
369
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
370
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
371
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
602
+ input.pf-v6-c-label__content {
603
+ overflow: hidden;
604
+ text-overflow: ellipsis;
605
+ white-space: nowrap;
372
606
  }
373
607
 
374
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
375
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
376
- pointer-events: none;
608
+ .pf-v6-c-label__icon {
609
+ color: var(--pf-v6-c-label__icon--Color);
377
610
  }
378
611
 
379
- @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
380
- syntax: "<length>";
381
- inherits: false;
382
- initial-value: 0;
383
- }
384
- @media (prefers-reduced-motion: no-preference) {
385
- @keyframes pf-v6-c-menu-toggle-m-danger-motion {
386
- 33% {
387
- --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
388
- }
389
- 66% {
390
- --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
391
- }
392
- }
612
+ .pf-v6-c-label__actions {
613
+ margin-inline-end: var(--pf-v6-c-label__actions--MarginInlineEnd);
393
614
  }
394
- .pf-v6-c-menu-toggle.pf-m-split-button {
395
- --pf-v6-c-menu-toggle--Gap: 0;
396
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
397
- padding: 0;
615
+
616
+ .pf-v6-c-label.pf-m-compact .pf-v6-c-label__actions .pf-v6-c-button {
617
+ --pf-v6-c-button--m-plain--m-no-padding--after--Inset: 0 calc(-0.125rem);
398
618
  }
399
619
 
400
- .pf-v6-c-menu-toggle.pf-m-split-button > * {
401
- position: relative;
402
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
403
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
404
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
405
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
620
+ .pf-v6-c-label__actions .pf-v6-c-button {
621
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label__actions--c-button--FontSize);
622
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label__actions--c-button--PaddingBlockStart);
623
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd);
624
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd);
625
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label__actions--c-button--PaddingInlineStart);
626
+ margin-block-start: var(--pf-v6-c-label__actions--c-button--MarginBlockStart);
627
+ margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
628
+ outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
406
629
  }
407
630
 
408
- .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
409
- border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
410
- border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
631
+ .pf-v6-c-text-input-group {
632
+ --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
633
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--control--default);
634
+ --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
635
+ --pf-v6-c-text-input-group--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
636
+ --pf-v6-c-text-input-group--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--default);
637
+ --pf-v6-c-text-input-group--BorderWidth: var(--pf-t--global--border--width--control--default);
638
+ --pf-v6-c-text-input-group__LineHeight: var(--pf-t--global--font--line-height--body);
639
+ --pf-v6-c-text-input-group__FontSize: var(--pf-t--global--font--size--body--default);
640
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-t--global--border--color--hover);
641
+ --pf-v6-c-text-input-group--m-hover--m-success--BorderColor: var(--pf-t--global--border--color--status--success--hover);
642
+ --pf-v6-c-text-input-group--m-hover--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
643
+ --pf-v6-c-text-input-group--m-hover--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
644
+ --pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
645
+ --pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
646
+ --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
647
+ --pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--sm) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
648
+ --pf-v6-c-text-input-group__main--RowGap: var(--pf-t--global--spacer--xs);
649
+ --pf-v6-c-text-input-group__main--ColumnGap: var(--pf-t--global--spacer--xs);
650
+ --pf-v6-c-text-input-group__text--BorderRadius--base: var(--pf-t--global--border--radius--control--form-element);
651
+ --pf-v6-c-text-input-group__text--BorderStartStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
652
+ --pf-v6-c-text-input-group__text--BorderStartEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
653
+ --pf-v6-c-text-input-group__text--BorderEndEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
654
+ --pf-v6-c-text-input-group__text--BorderEndStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
655
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
656
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
657
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
658
+ --pf-v6-c-text-input-group__text-input--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
659
+ --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
660
+ --pf-v6-c-text-input-group__text-input--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
661
+ --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
662
+ --pf-v6-c-text-input-group__text-input--MinWidth: 12ch;
663
+ --pf-v6-c-text-input-group__text-input--m-hint--Color: var(--pf-t--global--text--color--placeholder);
664
+ --pf-v6-c-text-input-group__text-input--Color: var(--pf-t--global--text--color--regular);
665
+ --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-t--global--text--color--placeholder);
666
+ --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
667
+ --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
668
+ --pf-v6-c-text-input-group__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
669
+ --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
670
+ --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
671
+ --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
672
+ --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
673
+ --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
674
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
675
+ --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
676
+ --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
677
+ --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
678
+ --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
679
+ --pf-v6-c-text-input-group__icon--TranslateY: -50%;
680
+ --pf-v6-c-text-input-group__utilities--child--MarginInlineStart: var(--pf-t--global--spacer--xs);
681
+ --pf-v6-c-text-input-group--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
682
+ --pf-v6-c-text-input-group--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
411
683
  }
412
684
 
413
- .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
414
- border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
415
- border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
685
+ .pf-v6-c-text-input-group {
686
+ position: relative;
687
+ display: flex;
688
+ width: 100%;
689
+ font-size: var(--pf-v6-c-text-input-group__FontSize);
690
+ line-height: var(--pf-v6-c-text-input-group__LineHeight);
691
+ color: var(--pf-v6-c-text-input-group--Color, inherit);
692
+ background-color: var(--pf-v6-c-text-input-group--BackgroundColor);
693
+ border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
694
+ border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
695
+ border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
696
+ border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
416
697
  }
417
698
 
418
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
419
- --pf-v6-c-check__label--Color: currentcolor;
420
- --pf-v6-c-check__label--disabled--Color: currentcolor;
421
- align-items: center;
422
- align-self: stretch;
699
+ .pf-v6-c-text-input-group::before {
700
+ position: absolute;
701
+ inset: 0;
702
+ pointer-events: none;
703
+ content: "";
704
+ border: var(--pf-v6-c-text-input-group--BorderWidth) solid var(--pf-v6-c-text-input-group--BorderColor);
705
+ border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
706
+ border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
707
+ border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
708
+ border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
423
709
  }
424
710
 
425
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
426
- --pf-v6-c-check__input--TranslateY: 0;
427
- align-self: center;
711
+ .pf-v6-c-text-input-group.pf-m-disabled {
712
+ --pf-v6-c-text-input-group--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
713
+ --pf-v6-c-text-input-group__text-input--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
714
+ --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
715
+ --pf-v6-c-text-input-group__icon--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--Color);
716
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--m-status--Color);
717
+ --pf-v6-c-text-input-group--BackgroundColor: var(--pf-v6-c-text-input-group--m-disabled--BackgroundColor);
718
+ pointer-events: none;
428
719
  }
429
720
 
430
- .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
431
- 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);
721
+ .pf-v6-c-text-input-group.pf-m-plain {
722
+ --pf-v6-c-text-input-group--BackgroundColor: transparent;
432
723
  }
433
724
 
434
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
435
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
725
+ .pf-v6-c-text-input-group.pf-m-plain::before {
726
+ border: 0;
436
727
  }
437
728
 
438
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
439
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
440
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
729
+ .pf-v6-c-text-input-group.pf-m-success {
730
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-success--BorderColor);
731
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-success--BorderColor);
732
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-success__icon--m-status--Color);
441
733
  }
442
734
 
443
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
444
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
445
- --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);
735
+ .pf-v6-c-text-input-group.pf-m-warning {
736
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-warning--BorderColor);
737
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-warning--BorderColor);
738
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color);
446
739
  }
447
740
 
448
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
449
- --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);
741
+ .pf-v6-c-text-input-group.pf-m-error {
742
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-error--BorderColor);
743
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-error--BorderColor);
744
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-error__icon--m-status--Color);
450
745
  }
451
746
 
452
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
453
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
747
+ @media (prefers-reduced-motion: no-preference) {
748
+ .pf-v6-c-text-input-group.pf-m-error {
749
+ translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
750
+ animation-name: pf-v6-global-danger-jiggle-motion;
751
+ animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
752
+ animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
753
+ animation-fill-mode: both;
754
+ }
755
+ }
756
+ .pf-v6-c-text-input-group.pf-m-error .pf-v6-c-text-input-group__icon.pf-m-status {
757
+ --pf-v6-c-text-input-group--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
758
+ --pf-v6-c-text-input-group--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
759
+ animation-name: pf-v6-global-fade-in;
760
+ animation-duration: var(--pf-v6-c-text-input-group--TransitionDuration--Opacity);
761
+ animation-timing-function: var(--pf-v6-c-text-input-group--TransitionTimingFunction--Opacity);
454
762
  }
455
763
 
456
- .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,
457
- .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,
458
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
459
- padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
764
+ .pf-v6-c-text-input-group:hover {
765
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-hover--BorderColor);
460
766
  }
461
767
 
462
- .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,
463
- .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,
464
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
465
- padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
768
+ .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) {
769
+ --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd);
466
770
  }
467
771
 
468
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
469
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
772
+ .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) .pf-v6-c-text-input-group__text {
773
+ --pf-v6-c-text-input-group__text--Position: relative;
470
774
  }
471
775
 
472
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
473
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
474
- color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
475
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
776
+ .pf-v6-c-text-input-group:has(> .pf-v6-c-text-input-group__utilities) {
777
+ --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd);
778
+ --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd);
476
779
  }
477
780
 
478
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
479
- content: none;
781
+ .pf-v6-c-text-input-group__main {
782
+ display: flex;
783
+ flex: 1;
784
+ flex-wrap: wrap;
785
+ gap: var(--pf-v6-c-text-input-group__main--RowGap) var(--pf-v6-c-text-input-group__main--ColumnGap);
786
+ min-width: 0;
480
787
  }
481
788
 
482
- .pf-v6-c-menu-toggle.pf-m-typeahead {
483
- --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
484
- --pf-v6-c-menu-toggle--Gap: 0;
485
- align-items: stretch;
486
- padding: 0;
789
+ .pf-v6-c-text-input-group__main.pf-m-icon {
790
+ --pf-v6-c-text-input-group__text--Position: relative;
791
+ --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart);
792
+ display: inline-flex;
793
+ align-items: center;
794
+ justify-content: center;
795
+ min-width: calc(var(--pf-v6-c-text-input-group__LineHeight) * var(--pf-v6-c-text-input-group__FontSize));
487
796
  }
488
797
 
489
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
490
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
798
+ .pf-v6-c-text-input-group__main > :first-child:not(.pf-v6-c-text-input-group__text) {
799
+ margin-inline-start: var(--pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart);
491
800
  }
492
801
 
493
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
494
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
495
- display: flex;
496
- align-items: stretch;
802
+ .pf-v6-c-text-input-group__main .pf-v6-c-label-group__main {
803
+ padding-block-start: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart);
804
+ padding-block-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd);
805
+ padding-inline-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd);
497
806
  }
498
807
 
499
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
500
- --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
808
+ .pf-v6-c-text-input-group__text {
809
+ position: var(--pf-v6-c-text-input-group__text--Position, revert);
810
+ display: inline-grid;
501
811
  flex: 1;
812
+ grid-template-areas: "text-input";
813
+ grid-template-columns: 1fr;
502
814
  }
503
815
 
504
- .pf-v6-c-menu-toggle__button {
505
- gap: var(--pf-v6-c-menu-toggle__button--Gap);
506
- align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
507
- min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
508
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
509
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
510
- color: inherit;
511
- background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
512
- border: 0;
513
- }
514
-
515
- .pf-v6-c-menu-toggle__button.pf-m-text {
516
- display: inline-flex;
517
- align-items: baseline;
816
+ .pf-v6-c-text-input-group__icon {
817
+ position: absolute;
818
+ inset-block-start: 50%;
819
+ inset-inline-start: var(--pf-v6-c-text-input-group__icon--InsetInlineStart);
820
+ font-size: var(--pf-v6-c-text-input-group__icon--FontSize);
821
+ color: var(--pf-v6-c-text-input-group__icon--Color);
822
+ transform: translateY(var(--pf-v6-c-text-input-group__icon--TranslateY));
518
823
  }
519
824
 
520
- .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) {
521
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
522
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
825
+ .pf-v6-c-text-input-group__icon.pf-m-status {
826
+ inset-inline-start: auto;
827
+ inset-inline-end: var(--pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd);
828
+ color: var(--pf-v6-c-text-input-group__icon--m-status--Color);
523
829
  }
524
830
 
525
- .pf-v6-c-menu-toggle__text {
831
+ .pf-v6-c-text-input-group__text-input {
526
832
  overflow: hidden;
527
833
  text-overflow: ellipsis;
528
834
  white-space: nowrap;
529
- min-width: 0;
530
- }
531
-
532
- .pf-v6-c-menu-toggle__count {
533
- display: flex;
534
- flex-wrap: nowrap;
835
+ position: relative;
836
+ width: 100%;
837
+ min-width: var(--pf-v6-c-text-input-group__text-input--MinWidth);
838
+ padding-block-start: var(--pf-v6-c-text-input-group__text-input--PaddingBlockStart);
839
+ padding-block-end: var(--pf-v6-c-text-input-group__text-input--PaddingBlockEnd);
840
+ padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
841
+ padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
842
+ color: var(--pf-v6-c-text-input-group__text-input--Color);
843
+ background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
844
+ border: 0;
845
+ outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
535
846
  }
536
847
 
537
- .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
538
- .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
539
- .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 {
540
- margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
541
- margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
848
+ .pf-v6-c-text-input-group__text-input, .pf-v6-c-text-input-group__text-input.pf-m-hint {
849
+ grid-area: text-input;
542
850
  }
543
851
 
544
- .pf-v6-c-menu-toggle__icon {
545
- flex-shrink: 0;
546
- transition-delay: var(--pf-v6-c-menu-toggle__icon--TransitionDelay);
547
- transition-duration: var(--pf-v6-c-menu-toggle__icon--TransitionDuration);
548
- transition-property: var(--pf-v6-c-menu-toggle__icon--TransitionProperty);
549
- rotate: var(--pf-v6-c-menu-toggle__icon--Rotate);
852
+ .pf-v6-c-text-input-group__text-input.pf-m-hint {
853
+ color: var(--pf-v6-c-text-input-group__text-input--m-hint--Color);
550
854
  }
551
855
 
552
- .pf-v6-c-menu-toggle__icon :where(picture, img) {
553
- vertical-align: middle;
856
+ .pf-v6-c-text-input-group__text-input::placeholder {
857
+ color: var(--pf-v6-c-text-input-group__text-input--placeholder--Color);
554
858
  }
555
859
 
556
- .pf-v6-c-menu-toggle__controls {
860
+ .pf-v6-c-text-input-group__utilities {
557
861
  display: flex;
558
- gap: var(--pf-v6-c-menu-toggle__controls--Gap);
559
862
  align-items: center;
560
- justify-content: center;
561
- margin-inline-start: auto;
863
+ margin-inline-start: var(--pf-v6-c-text-input-group__utilities--MarginInlineStart);
864
+ margin-inline-end: var(--pf-v6-c-text-input-group__utilities--MarginInlineEnd);
562
865
  }
563
866
 
564
- .pf-v6-c-menu-toggle__toggle-icon {
565
- min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
566
- color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
867
+ .pf-v6-c-text-input-group__utilities > * + * {
868
+ margin-inline-start: var(--pf-v6-c-text-input-group__utilities--child--MarginInlineStart);
567
869
  }
568
870
 
569
- .pf-v6-c-menu-toggle__status-icon {
570
- color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
871
+ .pf-v6-c-text-input-group__group {
872
+ display: flex;
571
873
  }
572
874
 
573
- .pf-v6-c-text-input-group {
574
- --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
575
- --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
576
- --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
577
- --pf-v6-c-text-input-group--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
578
- --pf-v6-c-text-input-group--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--default);
579
- --pf-v6-c-text-input-group--BorderWidth: var(--pf-t--global--border--width--control--default);
580
- --pf-v6-c-text-input-group__LineHeight: var(--pf-t--global--font--line-height--body);
581
- --pf-v6-c-text-input-group__FontSize: var(--pf-t--global--font--size--body--default);
582
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-t--global--border--color--hover);
583
- --pf-v6-c-text-input-group--m-hover--m-success--BorderColor: var(--pf-t--global--border--color--status--success--hover);
584
- --pf-v6-c-text-input-group--m-hover--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
585
- --pf-v6-c-text-input-group--m-hover--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
586
- --pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
587
- --pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
588
- --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
589
- --pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--sm) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
590
- --pf-v6-c-text-input-group__main--RowGap: var(--pf-t--global--spacer--xs);
591
- --pf-v6-c-text-input-group__main--ColumnGap: var(--pf-t--global--spacer--xs);
592
- --pf-v6-c-text-input-group__text--BorderRadius--base: var(--pf-t--global--border--radius--small);
593
- --pf-v6-c-text-input-group__text--BorderStartStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
594
- --pf-v6-c-text-input-group__text--BorderStartEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
595
- --pf-v6-c-text-input-group__text--BorderEndEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
596
- --pf-v6-c-text-input-group__text--BorderEndStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
597
- --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
598
- --pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
599
- --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
600
- --pf-v6-c-text-input-group__text-input--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
601
- --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
602
- --pf-v6-c-text-input-group__text-input--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
603
- --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
604
- --pf-v6-c-text-input-group__text-input--MinWidth: 12ch;
605
- --pf-v6-c-text-input-group__text-input--m-hint--Color: var(--pf-t--global--text--color--placeholder);
606
- --pf-v6-c-text-input-group__text-input--Color: var(--pf-t--global--text--color--regular);
607
- --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-t--global--text--color--placeholder);
608
- --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
609
- --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
610
- --pf-v6-c-text-input-group__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
611
- --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
612
- --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
613
- --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
614
- --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
615
- --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
616
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
617
- --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
618
- --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
619
- --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
620
- --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
621
- --pf-v6-c-text-input-group__icon--TranslateY: -50%;
622
- --pf-v6-c-text-input-group__utilities--child--MarginInlineStart: var(--pf-t--global--spacer--xs);
623
- --pf-v6-c-text-input-group--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
624
- --pf-v6-c-text-input-group--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
875
+ .pf-v6-c-menu-toggle {
876
+ --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
877
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
878
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
879
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
880
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
881
+ --pf-v6-c-menu-toggle--MinWidth: calc(1lh + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
882
+ --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
883
+ --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
884
+ --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
885
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
886
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--control--default);
887
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--control--default);
888
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
889
+ --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
890
+ --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
891
+ --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
892
+ --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
893
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
894
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
895
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
896
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
897
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
898
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
899
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
900
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--control--clicked);
901
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
902
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
903
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
904
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
905
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
906
+ --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
907
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
908
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
909
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
910
+ --pf-v6-c-menu-toggle__icon--TransitionDelay: 0s;
911
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: 0s;
912
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: none;
913
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDelay: 0s;
914
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: 0s;
915
+ --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: none;
916
+ --pf-v6-c-menu-toggle__icon--Rotate: 0deg;
917
+ --pf-v6-c-menu-toggle--hover__icon--Rotate: 0deg;
918
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
919
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
920
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
921
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
922
+ --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
923
+ --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
924
+ --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--action--default);
925
+ --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
926
+ --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
927
+ --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
928
+ --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
929
+ --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
930
+ --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
931
+ --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
932
+ --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
933
+ --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
934
+ --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
935
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
936
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
937
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
938
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
939
+ --pf-v6-c-menu-toggle--m-secondary--BackgroundColor: transparent;
940
+ --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
941
+ --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
942
+ --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--action--default);
943
+ --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
944
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
945
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
946
+ --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
947
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor: transparent;
948
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
949
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
950
+ --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
951
+ --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
952
+ --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
953
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
954
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
955
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
956
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
957
+ --pf-v6-c-menu-toggle--m-form--BorderRadius: var(--pf-t--global--border--radius--control--form-element);
958
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
959
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
960
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
961
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
962
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--action--default);
963
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
964
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
965
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
966
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
967
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
968
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
969
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
970
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--alt);
971
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
972
+ --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
973
+ --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
974
+ --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
975
+ --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
976
+ --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
977
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
978
+ --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));
979
+ --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
980
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
981
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
982
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
983
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
984
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
985
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
986
+ --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
987
+ --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
988
+ --pf-v6-c-menu-toggle--m-plain--BorderColor: var(--pf-t--global--border--color--high-contrast);
989
+ --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
990
+ --pf-v6-c-menu-toggle--m-plain--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
991
+ --pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
992
+ --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--control--default);
993
+ --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
994
+ --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
995
+ --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
996
+ --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
997
+ --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
998
+ --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
999
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1000
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1001
+ --pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
1002
+ --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
1003
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
1004
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
1005
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
1006
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
1007
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
1008
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
1009
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
1010
+ --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
1011
+ --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
1012
+ --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
1013
+ --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
1014
+ --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
1015
+ --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
1016
+ --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
1017
+ --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
1018
+ --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
1019
+ --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
1020
+ --pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
1021
+ --pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
1022
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
1023
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
1024
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate: 60deg;
625
1025
  }
626
1026
 
627
- .pf-v6-c-text-input-group {
1027
+ .pf-v6-c-menu-toggle {
628
1028
  position: relative;
629
- display: flex;
630
- width: 100%;
631
- font-size: var(--pf-v6-c-text-input-group__FontSize);
632
- line-height: var(--pf-v6-c-text-input-group__LineHeight);
633
- color: var(--pf-v6-c-text-input-group--Color, inherit);
634
- background-color: var(--pf-v6-c-text-input-group--BackgroundColor);
635
- border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
636
- border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
637
- border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
638
- border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
639
- }
640
-
641
- .pf-v6-c-text-input-group::before {
642
- position: absolute;
643
- inset: 0;
644
- pointer-events: none;
645
- content: "";
646
- border: var(--pf-v6-c-text-input-group--BorderWidth) solid var(--pf-v6-c-text-input-group--BorderColor);
647
- border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
648
- border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
649
- border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
650
- border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
651
- }
652
-
653
- .pf-v6-c-text-input-group.pf-m-disabled {
654
- --pf-v6-c-text-input-group--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
655
- --pf-v6-c-text-input-group__text-input--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
656
- --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
657
- --pf-v6-c-text-input-group__icon--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--Color);
658
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--m-status--Color);
659
- --pf-v6-c-text-input-group--BackgroundColor: var(--pf-v6-c-text-input-group--m-disabled--BackgroundColor);
660
- pointer-events: none;
661
- }
662
-
663
- .pf-v6-c-text-input-group.pf-m-plain {
664
- --pf-v6-c-text-input-group--BackgroundColor: transparent;
665
- }
666
-
667
- .pf-v6-c-text-input-group.pf-m-plain::before {
1029
+ display: inline-flex;
1030
+ gap: var(--pf-v6-c-menu-toggle--Gap);
1031
+ align-items: center;
1032
+ justify-content: center;
1033
+ min-width: var(--pf-v6-c-menu-toggle--MinWidth, revert);
1034
+ max-width: 100%;
1035
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
1036
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
1037
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
1038
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
1039
+ font-size: var(--pf-v6-c-menu-toggle--FontSize);
1040
+ line-height: var(--pf-v6-c-menu-toggle--LineHeight);
1041
+ color: var(--pf-v6-c-menu-toggle--Color);
1042
+ cursor: pointer;
1043
+ background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
668
1044
  border: 0;
1045
+ transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
1046
+ transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
1047
+ transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
669
1048
  }
670
1049
 
671
- .pf-v6-c-text-input-group.pf-m-success {
672
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-success--BorderColor);
673
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-success--BorderColor);
674
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-success__icon--m-status--Color);
675
- }
676
-
677
- .pf-v6-c-text-input-group.pf-m-warning {
678
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-warning--BorderColor);
679
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-warning--BorderColor);
680
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color);
681
- }
682
-
683
- .pf-v6-c-text-input-group.pf-m-error {
684
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-error--BorderColor);
685
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-error--BorderColor);
686
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-error__icon--m-status--Color);
687
- }
688
-
689
- @media (prefers-reduced-motion: no-preference) {
690
- .pf-v6-c-text-input-group.pf-m-error {
691
- translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
692
- animation-name: pf-v6-global-danger-jiggle-motion;
693
- animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
694
- animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
695
- animation-fill-mode: both;
696
- }
697
- }
698
- .pf-v6-c-text-input-group.pf-m-error .pf-v6-c-text-input-group__icon.pf-m-status {
699
- --pf-v6-c-text-input-group--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
700
- --pf-v6-c-text-input-group--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
701
- animation-name: pf-v6-global-fade-in;
702
- animation-duration: var(--pf-v6-c-text-input-group--TransitionDuration--Opacity);
703
- animation-timing-function: var(--pf-v6-c-text-input-group--TransitionTimingFunction--Opacity);
704
- }
705
-
706
- .pf-v6-c-text-input-group:hover {
707
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-hover--BorderColor);
708
- }
709
-
710
- .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) {
711
- --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd);
1050
+ .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
1051
+ border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
712
1052
  }
713
1053
 
714
- .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) .pf-v6-c-text-input-group__text {
715
- --pf-v6-c-text-input-group__text--Position: relative;
1054
+ .pf-v6-c-menu-toggle::before {
1055
+ position: absolute;
1056
+ inset-block-start: 0;
1057
+ inset-block-end: 0;
1058
+ inset-inline-start: 0;
1059
+ inset-inline-end: 0;
1060
+ z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
1061
+ pointer-events: none;
1062
+ content: "";
1063
+ border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
1064
+ transition: inherit;
716
1065
  }
717
1066
 
718
- .pf-v6-c-text-input-group:has(> .pf-v6-c-text-input-group__utilities) {
719
- --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd);
720
- --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd);
1067
+ .pf-v6-c-menu-toggle.pf-m-primary {
1068
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
1069
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
1070
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
1071
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
1072
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
1073
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
1074
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
1075
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
1076
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
1077
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
1078
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
1079
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
1080
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
1081
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
1082
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
1083
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
1084
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
721
1085
  }
722
1086
 
723
- .pf-v6-c-text-input-group__main {
724
- display: flex;
725
- flex: 1;
726
- flex-wrap: wrap;
727
- gap: var(--pf-v6-c-text-input-group__main--RowGap) var(--pf-v6-c-text-input-group__main--ColumnGap);
728
- min-width: 0;
1087
+ .pf-v6-c-menu-toggle.pf-m-secondary {
1088
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
1089
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
1090
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
1091
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--BackgroundColor);
1092
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
1093
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
1094
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
1095
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
1096
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
1097
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
1098
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor);
1099
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
1100
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
1101
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
1102
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
1103
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
1104
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
729
1105
  }
730
1106
 
731
- .pf-v6-c-text-input-group__main.pf-m-icon {
732
- --pf-v6-c-text-input-group__text--Position: relative;
733
- --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart);
734
- display: inline-flex;
1107
+ .pf-v6-c-menu-toggle.pf-m-full-height {
1108
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
1109
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
1110
+ --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
735
1111
  align-items: center;
736
- justify-content: center;
737
- min-width: calc(var(--pf-v6-c-text-input-group__LineHeight) * var(--pf-v6-c-text-input-group__FontSize));
738
- }
739
-
740
- .pf-v6-c-text-input-group__main > :first-child:not(.pf-v6-c-text-input-group__text) {
741
- margin-inline-start: var(--pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart);
742
- }
743
-
744
- .pf-v6-c-text-input-group__main .pf-v6-c-label-group__main {
745
- padding-block-start: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart);
746
- padding-block-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd);
747
- padding-inline-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd);
748
- }
749
-
750
- .pf-v6-c-text-input-group__text {
751
- position: var(--pf-v6-c-text-input-group__text--Position, revert);
752
- display: inline-grid;
753
- flex: 1;
754
- grid-template-areas: "text-input";
755
- grid-template-columns: 1fr;
1112
+ height: 100%;
756
1113
  }
757
1114
 
758
- .pf-v6-c-text-input-group__icon {
759
- position: absolute;
760
- inset-block-start: 50%;
761
- inset-inline-start: var(--pf-v6-c-text-input-group__icon--InsetInlineStart);
762
- font-size: var(--pf-v6-c-text-input-group__icon--FontSize);
763
- color: var(--pf-v6-c-text-input-group__icon--Color);
764
- transform: translateY(var(--pf-v6-c-text-input-group__icon--TranslateY));
1115
+ .pf-v6-c-menu-toggle.pf-m-full-width {
1116
+ width: 100%;
765
1117
  }
766
1118
 
767
- .pf-v6-c-text-input-group__icon.pf-m-status {
768
- inset-inline-start: auto;
769
- inset-inline-end: var(--pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd);
770
- color: var(--pf-v6-c-text-input-group__icon--m-status--Color);
1119
+ .pf-v6-c-menu-toggle.pf-m-form {
1120
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-form--BorderRadius);
771
1121
  }
772
1122
 
773
- .pf-v6-c-text-input-group__text-input {
774
- overflow: hidden;
775
- text-overflow: ellipsis;
776
- white-space: nowrap;
777
- position: relative;
778
- width: 100%;
779
- min-width: var(--pf-v6-c-text-input-group__text-input--MinWidth);
780
- padding-block-start: var(--pf-v6-c-text-input-group__text-input--PaddingBlockStart);
781
- padding-block-end: var(--pf-v6-c-text-input-group__text-input--PaddingBlockEnd);
782
- padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
783
- padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
784
- color: var(--pf-v6-c-text-input-group__text-input--Color);
785
- background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
786
- border: 0;
787
- outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
1123
+ .pf-v6-c-menu-toggle.pf-m-plain {
1124
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
1125
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
1126
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
1127
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
1128
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
1129
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
1130
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
1131
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
1132
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
1133
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
1134
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
1135
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
1136
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
1137
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
1138
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
1139
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
788
1140
  }
789
1141
 
790
- .pf-v6-c-text-input-group__text-input, .pf-v6-c-text-input-group__text-input.pf-m-hint {
791
- grid-area: text-input;
1142
+ .pf-v6-c-menu-toggle.pf-m-plain.pf-m-circle {
1143
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius);
792
1144
  }
793
1145
 
794
- .pf-v6-c-text-input-group__text-input.pf-m-hint {
795
- color: var(--pf-v6-c-text-input-group__text-input--m-hint--Color);
1146
+ .pf-v6-c-menu-toggle.pf-m-plain::before {
1147
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
1148
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
796
1149
  }
797
1150
 
798
- .pf-v6-c-text-input-group__text-input::placeholder {
799
- color: var(--pf-v6-c-text-input-group__text-input--placeholder--Color);
1151
+ .pf-v6-c-menu-toggle:is(:hover, :focus) {
1152
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
1153
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
1154
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
1155
+ --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--hover--BorderWidth);
1156
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
1157
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
1158
+ --pf-v6-c-menu-toggle__icon--TransitionDelay: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDelay);
1159
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDuration);
1160
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: var(--pf-v6-c-menu-toggle--hover__icon--TransitionProperty);
1161
+ --pf-v6-c-menu-toggle__icon--Rotate: var(--pf-v6-c-menu-toggle--hover__icon--Rotate);
800
1162
  }
801
1163
 
802
- .pf-v6-c-text-input-group__utilities {
803
- display: flex;
804
- align-items: center;
805
- margin-inline-start: var(--pf-v6-c-text-input-group__utilities--MarginInlineStart);
806
- margin-inline-end: var(--pf-v6-c-text-input-group__utilities--MarginInlineEnd);
1164
+ .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
1165
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
1166
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
1167
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
1168
+ --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth);
1169
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
1170
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
807
1171
  }
808
1172
 
809
- .pf-v6-c-text-input-group__utilities > * + * {
810
- margin-inline-start: var(--pf-v6-c-text-input-group__utilities--child--MarginInlineStart);
1173
+ .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
1174
+ border: 0;
811
1175
  }
812
1176
 
813
- .pf-v6-c-text-input-group__group {
814
- display: flex;
1177
+ .pf-v6-c-menu-toggle.pf-m-small {
1178
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
1179
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
1180
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
1181
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
1182
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
1183
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
1184
+ --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);
1185
+ --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);
815
1186
  }
816
1187
 
817
- .pf-v6-c-label {
818
- --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
819
- --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
820
- --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
821
- --pf-v6-c-label--PaddingInlineStart: var(--pf-t--global--spacer--sm);
822
- --pf-v6-c-label--MaxWidth: 100%;
823
- --pf-v6-c-label--MinWidth: calc((var(--pf-v6-c-label--FontSize) * var(--pf-t--global--font--line-height--body) + var(--pf-v6-c-label--PaddingBlockStart) + var(--pf-v6-c-label--PaddingBlockEnd)));
824
- --pf-v6-c-label--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
825
- --pf-v6-c-label--BorderColor: var(--pf-t--global--border--color--high-contrast);
826
- --pf-v6-c-label--BorderRadius: var(--pf-t--global--border--radius--pill);
827
- --pf-v6-c-label--FontSize: var(--pf-t--global--font--size--body--sm);
828
- --pf-v6-c-label--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
829
- --pf-v6-c-label--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
830
- --pf-v6-c-label--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
831
- --pf-v6-c-label__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
832
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--hover);
833
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-gray--hover);
834
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--hover);
835
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--default);
836
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--hover);
837
- --pf-v6-c-label--m-blue--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--default);
838
- --pf-v6-c-label--m-blue--Color: var(--pf-t--global--text--color--nonstatus--on-blue--default);
839
- --pf-v6-c-label--m-blue__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--default);
840
- --pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--hover);
841
- --pf-v6-c-label--m-blue--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-blue--hover);
842
- --pf-v6-c-label--m-blue--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--hover);
843
- --pf-v6-c-label--m-blue--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--default);
844
- --pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--hover);
845
- --pf-v6-c-label--m-red--BackgroundColor: var(--pf-t--global--color--nonstatus--red--default);
846
- --pf-v6-c-label--m-red--Color: var(--pf-t--global--text--color--nonstatus--on-red--default);
847
- --pf-v6-c-label--m-red__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--default);
848
- --pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--red--hover);
849
- --pf-v6-c-label--m-red--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-red--hover);
850
- --pf-v6-c-label--m-red--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--hover);
851
- --pf-v6-c-label--m-red--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--red--default);
852
- --pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--red--hover);
853
- --pf-v6-c-label--m-orange--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--default);
854
- --pf-v6-c-label--m-orange--Color: var(--pf-t--global--text--color--nonstatus--on-orange--default);
855
- --pf-v6-c-label--m-orange__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--default);
856
- --pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--hover);
857
- --pf-v6-c-label--m-orange--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orange--hover);
858
- --pf-v6-c-label--m-orange--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--hover);
859
- --pf-v6-c-label--m-orange--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--default);
860
- --pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--hover);
861
- --pf-v6-c-label--m-orangered--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--default);
862
- --pf-v6-c-label--m-orangered--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--default);
863
- --pf-v6-c-label--m-orangered__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--default);
864
- --pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--hover);
865
- --pf-v6-c-label--m-orangered--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--hover);
866
- --pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--hover);
867
- --pf-v6-c-label--m-orangered--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--default);
868
- --pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--hover);
869
- --pf-v6-c-label--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
870
- --pf-v6-c-label--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
871
- --pf-v6-c-label--m-yellow__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--default);
872
- --pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--hover);
873
- --pf-v6-c-label--m-yellow--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--hover);
874
- --pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--hover);
875
- --pf-v6-c-label--m-yellow--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--default);
876
- --pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--hover);
877
- --pf-v6-c-label--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
878
- --pf-v6-c-label--m-green--Color: var(--pf-t--global--text--color--nonstatus--on-green--default);
879
- --pf-v6-c-label--m-green__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--default);
880
- --pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--green--hover);
881
- --pf-v6-c-label--m-green--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-green--hover);
882
- --pf-v6-c-label--m-green--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--hover);
883
- --pf-v6-c-label--m-green--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--green--default);
884
- --pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--green--hover);
885
- --pf-v6-c-label--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
886
- --pf-v6-c-label--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
887
- --pf-v6-c-label--m-teal__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--default);
888
- --pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--hover);
889
- --pf-v6-c-label--m-teal--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-teal--hover);
890
- --pf-v6-c-label--m-teal--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--hover);
891
- --pf-v6-c-label--m-teal--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--default);
892
- --pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--hover);
893
- --pf-v6-c-label--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
894
- --pf-v6-c-label--m-purple--Color: var(--pf-t--global--text--color--nonstatus--on-purple--default);
895
- --pf-v6-c-label--m-purple__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--default);
896
- --pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--hover);
897
- --pf-v6-c-label--m-purple--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-purple--hover);
898
- --pf-v6-c-label--m-purple--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--hover);
899
- --pf-v6-c-label--m-purple--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--default);
900
- --pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--hover);
901
- --pf-v6-c-label--m-success--BackgroundColor: var(--pf-t--global--color--status--success--default);
902
- --pf-v6-c-label--m-success--Color: var(--pf-t--global--text--color--status--on-success--default);
903
- --pf-v6-c-label--m-success__icon--Color: var(--pf-t--global--icon--color--status--on-success--default);
904
- --pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--success--hover);
905
- --pf-v6-c-label--m-success--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-success--hover);
906
- --pf-v6-c-label--m-success--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-success--hover);
907
- --pf-v6-c-label--m-success--m-outline__icon--Color: var(--pf-t--global--icon--color--status--success--default);
908
- --pf-v6-c-label--m-success--m-outline--BorderColor: var(--pf-t--global--border--color--status--success--default);
909
- --pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--success--hover);
910
- --pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--success--hover);
911
- --pf-v6-c-label--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
912
- --pf-v6-c-label--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
913
- --pf-v6-c-label--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
914
- --pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--warning--hover);
915
- --pf-v6-c-label--m-warning--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-warning--hover);
916
- --pf-v6-c-label--m-warning--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-warning--hover);
917
- --pf-v6-c-label--m-warning--m-outline__icon--Color: var(--pf-t--global--icon--color--status--warning--default);
918
- --pf-v6-c-label--m-warning--m-outline--BorderColor: var(--pf-t--global--border--color--status--warning--default);
919
- --pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
920
- --pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--warning--hover);
921
- --pf-v6-c-label--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
922
- --pf-v6-c-label--m-danger--Color: var(--pf-t--global--text--color--status--on-danger--default);
923
- --pf-v6-c-label--m-danger__icon--Color: var(--pf-t--global--icon--color--status--on-danger--default);
924
- --pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--danger--hover);
925
- --pf-v6-c-label--m-danger--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-danger--hover);
926
- --pf-v6-c-label--m-danger--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-danger--hover);
927
- --pf-v6-c-label--m-danger--m-outline__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
928
- --pf-v6-c-label--m-danger--m-outline--BorderColor: var(--pf-t--global--border--color--status--danger--default);
929
- --pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
930
- --pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
931
- --pf-v6-c-label--m-info--BackgroundColor: var(--pf-t--global--color--status--info--default);
932
- --pf-v6-c-label--m-info--Color: var(--pf-t--global--text--color--status--on-info--default);
933
- --pf-v6-c-label--m-info__icon--Color: var(--pf-t--global--icon--color--status--on-info--default);
934
- --pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--info--hover);
935
- --pf-v6-c-label--m-info--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-info--hover);
936
- --pf-v6-c-label--m-info--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-info--hover);
937
- --pf-v6-c-label--m-info--m-outline__icon--Color: var(--pf-t--global--icon--color--status--info--default);
938
- --pf-v6-c-label--m-info--m-outline--BorderColor: var(--pf-t--global--border--color--status--info--default);
939
- --pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--info--hover);
940
- --pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--info--hover);
941
- --pf-v6-c-label--m-custom--BackgroundColor: var(--pf-t--global--color--status--custom--default);
942
- --pf-v6-c-label--m-custom--Color: var(--pf-t--global--text--color--status--on-custom--default);
943
- --pf-v6-c-label--m-custom__icon--Color: var(--pf-t--global--icon--color--status--on-custom--default);
944
- --pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--custom--hover);
945
- --pf-v6-c-label--m-custom--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-custom--hover);
946
- --pf-v6-c-label--m-custom--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-custom--hover);
947
- --pf-v6-c-label--m-custom--m-outline__icon--Color: var(--pf-t--global--icon--color--status--custom--default);
948
- --pf-v6-c-label--m-custom--m-outline--BorderColor: var(--pf-t--global--border--color--status--custom--default);
949
- --pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--custom--hover);
950
- --pf-v6-c-label--m-custom--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--custom--hover);
951
- --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
952
- --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
953
- --pf-v6-c-label--m-clickable__content--Cursor: pointer;
954
- --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label__icon--Color);
955
- --pf-v6-c-label--m-outline--BorderWidth: var(--pf-t--global--border--width--action--default);
956
- --pf-v6-c-label--m-outline--BackgroundColor: transparent;
957
- --pf-v6-c-label--m-outline--Color: var(--pf-t--global--text--color--regular);
958
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-t--global--icon--color--regular);
959
- --pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor: transparent;
960
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
961
- --pf-v6-c-label--m-outline--m-clickable--hover--Color: var(--pf-t--global--text--color--regular);
962
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--regular);
963
- --pf-v6-c-label--m-overflow--Color: var(--pf-t--global--text--color--brand--default);
964
- --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
965
- --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
966
- --pf-v6-c-label--m-overflow--hover--Color: var(--pf-t--global--text--color--brand--hover);
967
- --pf-v6-c-label--m-overflow--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
968
- --pf-v6-c-label--m-overflow--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
969
- --pf-v6-c-label--m-add--Color: var(--pf-t--global--text--color--brand--default);
970
- --pf-v6-c-label--m-add--BackgroundColor: transparent;
971
- --pf-v6-c-label--m-add--BorderColor: var(--pf-t--global--border--color--default);
972
- --pf-v6-c-label--m-add--BorderWidth: var(--pf-t--global--border--width--action--default);
973
- --pf-v6-c-label--m-add--hover--Color: var(--pf-t--global--text--color--brand--hover);
974
- --pf-v6-c-label--m-add--hover--BackgroundColor: transparent;
975
- --pf-v6-c-label--m-add--hover--BorderColor: var(--pf-t--global--border--color--hover);
976
- --pf-v6-c-label--m-add--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
977
- --pf-v6-c-label--m-compact--PaddingBlockStart: 0;
978
- --pf-v6-c-label--m-compact--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
979
- --pf-v6-c-label--m-compact--PaddingBlockEnd: 0;
980
- --pf-v6-c-label--m-compact--PaddingInlineStart: var(--pf-t--global--spacer--sm);
981
- --pf-v6-c-label--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
982
- --pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset: 0.0625rem;
983
- --pf-v6-c-label--m-compact--MinWidth: calc((var(--pf-v6-c-label--m-compact--FontSize) * var(--pf-t--global--font--line-height--body)) + (var(--pf-v6-c-label--m-compact--PaddingBlockStart) + var(--pf-v6-c-label--m-compact--PaddingBlockEnd)));
984
- --pf-v6-c-label__content--MaxWidth: 100%;
985
- --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
986
- --pf-v6-c-label__content--Cursor: initial;
987
- --pf-v6-c-label__icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
988
- --pf-v6-c-label__text--MaxWidth: 100%;
989
- --pf-v6-c-label__actions--MarginInlineEnd: 0;
990
- --pf-v6-c-label__actions--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
991
- --pf-v6-c-label__actions--c-button--OutlineOffset: -0.1875rem;
992
- --pf-v6-c-label__actions--c-button--MarginBlockStart: 0;
993
- --pf-v6-c-label__actions--c-button--MarginBlockEnd: 0;
994
- --pf-v6-c-label__actions--c-button--PaddingBlockStart: 0;
995
- --pf-v6-c-label__actions--c-button--PaddingInlineEnd: 0;
996
- --pf-v6-c-label__actions--c-button--PaddingBlockEnd: 0;
997
- --pf-v6-c-label__actions--c-button--PaddingInlineStart: 0;
998
- --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--default);
999
- --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--default);
1000
- --pf-v6-c-label--m-editable--hover--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--hover);
1001
- --pf-v6-c-label--m-editable--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--hover);
1002
- --pf-v6-c-label--m-editable--TextUnderlineOffset: 0.25rem;
1003
- --pf-v6-c-label--m-editable__content--MaxWidth: 16ch;
1004
- --pf-v6-c-label--m-editable__content--Cursor: pointer;
1005
- --pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine: none;
1006
- --pf-v6-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
1007
- --pf-v6-c-label--m-editable--m-editable-active--Color: var(--pf-t--global--text--color--regular);
1008
- --pf-v6-c-label--m-editable--m-editable-active__content--Cursor: initial;
1009
- --pf-v6-c-label--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1010
- --pf-v6-c-label--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
1011
- --pf-v6-c-label--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1012
- --pf-v6-c-label--m-disabled--c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1188
+ .pf-v6-c-menu-toggle.pf-m-success {
1189
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
1190
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
1191
+ }
1192
+
1193
+ .pf-v6-c-menu-toggle.pf-m-warning {
1194
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
1195
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
1013
1196
  }
1014
1197
 
1015
- .pf-v6-c-label {
1198
+ .pf-v6-c-menu-toggle.pf-m-danger {
1199
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
1200
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
1201
+ }
1202
+
1203
+ @media screen and (prefers-reduced-motion: no-preference) {
1204
+ .pf-v6-c-menu-toggle.pf-m-danger {
1205
+ transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
1206
+ animation-name: pf-v6-c-menu-toggle-m-danger-motion;
1207
+ animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
1208
+ animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
1209
+ animation-fill-mode: both;
1210
+ }
1211
+ }
1212
+ .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
1213
+ animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
1214
+ animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
1215
+ animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
1216
+ }
1217
+
1218
+ @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
1219
+ from {
1220
+ opacity: 0;
1221
+ }
1222
+ to {
1223
+ opacity: 1;
1224
+ }
1225
+ }
1226
+ .pf-v6-c-menu-toggle.pf-m-settings {
1227
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: rotate;
1228
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration);
1229
+ --pf-v6-c-menu-toggle__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction);
1230
+ --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: rotate;
1231
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration);
1232
+ --pf-v6-c-menu-toggle--hover__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction);
1233
+ --pf-v6-c-menu-toggle--hover__icon--Rotate: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate);
1234
+ }
1235
+
1236
+ .pf-v6-c-menu-toggle.pf-m-placeholder {
1237
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
1238
+ }
1239
+
1240
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
1241
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
1242
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
1243
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
1244
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
1245
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
1246
+ }
1247
+
1248
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
1249
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
1250
+ pointer-events: none;
1251
+ }
1252
+
1253
+ .pf-v6-c-menu-toggle.pf-m-dock {
1254
+ justify-content: flex-start;
1255
+ width: 100%;
1256
+ }
1257
+
1258
+ @media (min-width: 62rem) {
1259
+ .pf-v6-c-menu-toggle.pf-m-dock {
1260
+ justify-content: center;
1261
+ width: auto;
1262
+ }
1263
+ .pf-v6-c-menu-toggle.pf-m-dock .pf-v6-c-menu-toggle__text,
1264
+ .pf-v6-c-menu-toggle.pf-m-dock .pf-v6-c-menu-toggle__controls {
1265
+ display: none;
1266
+ }
1267
+ }
1268
+ .pf-v6-c-page__dock.pf-m-text-expanded .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle.pf-m-text-expanded {
1269
+ justify-content: flex-start;
1270
+ width: 100%;
1271
+ }
1272
+
1273
+ .pf-v6-c-page__dock.pf-m-text-expanded .pf-v6-c-menu-toggle .pf-v6-c-menu-toggle__text,
1274
+ .pf-v6-c-page__dock.pf-m-text-expanded .pf-v6-c-menu-toggle .pf-v6-c-menu-toggle__controls, .pf-v6-c-menu-toggle.pf-m-text-expanded .pf-v6-c-menu-toggle__text,
1275
+ .pf-v6-c-menu-toggle.pf-m-text-expanded .pf-v6-c-menu-toggle__controls {
1276
+ display: revert;
1277
+ }
1278
+
1279
+ @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
1280
+ syntax: "<length>";
1281
+ inherits: false;
1282
+ initial-value: 0;
1283
+ }
1284
+ @media (prefers-reduced-motion: no-preference) {
1285
+ @keyframes pf-v6-c-menu-toggle-m-danger-motion {
1286
+ 33% {
1287
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
1288
+ }
1289
+ 66% {
1290
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
1291
+ }
1292
+ }
1293
+ }
1294
+ .pf-v6-c-menu-toggle.pf-m-split-button {
1295
+ --pf-v6-c-menu-toggle--Gap: 0;
1296
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
1297
+ padding: 0;
1298
+ }
1299
+
1300
+ .pf-v6-c-menu-toggle.pf-m-split-button > * {
1016
1301
  position: relative;
1017
- gap: var(--pf-v6-c-label--Gap);
1018
- min-width: var(--pf-v6-c-label--MinWidth);
1019
- max-width: var(--pf-v6-c-label--MaxWidth);
1020
- padding-block-start: var(--pf-v6-c-label--PaddingBlockStart);
1021
- padding-block-end: var(--pf-v6-c-label--PaddingBlockEnd);
1022
- padding-inline-start: var(--pf-v6-c-label--PaddingInlineStart);
1023
- padding-inline-end: var(--pf-v6-c-label--PaddingInlineEnd);
1024
- font-size: var(--pf-v6-c-label--FontSize);
1025
- white-space: nowrap;
1026
- background: transparent;
1027
- isolation: isolate;
1028
- border: 0;
1029
- border-radius: var(--pf-v6-c-label--BorderRadius);
1302
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
1303
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
1304
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
1305
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
1030
1306
  }
1031
1307
 
1032
- .pf-v6-c-label.pf-m-blue {
1033
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-blue--BackgroundColor);
1034
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-blue--Color);
1035
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-blue__icon--Color);
1036
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor);
1037
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover--Color);
1038
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover__icon--Color);
1039
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--BorderColor);
1040
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor);
1308
+ .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
1309
+ border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1310
+ border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1041
1311
  }
1042
1312
 
1043
- .pf-v6-c-label.pf-m-red {
1044
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-red--BackgroundColor);
1045
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-red--Color);
1046
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-red__icon--Color);
1047
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor);
1048
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-red--m-clickable--hover--Color);
1049
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-red--m-clickable--hover__icon--Color);
1050
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-red--m-outline--BorderColor);
1051
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor);
1313
+ .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
1314
+ border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1315
+ border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1052
1316
  }
1053
1317
 
1054
- .pf-v6-c-label.pf-m-orange {
1055
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orange--BackgroundColor);
1056
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orange--Color);
1057
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orange__icon--Color);
1058
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor);
1059
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover--Color);
1060
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover__icon--Color);
1061
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--BorderColor);
1062
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor);
1318
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
1319
+ --pf-v6-c-check__label--Color: currentcolor;
1320
+ --pf-v6-c-check__label--disabled--Color: currentcolor;
1321
+ align-items: center;
1322
+ align-self: stretch;
1063
1323
  }
1064
1324
 
1065
- .pf-v6-c-label.pf-m-orangered {
1066
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orangered--BackgroundColor);
1067
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orangered--Color);
1068
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orangered__icon--Color);
1069
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor);
1070
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover--Color);
1071
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color);
1072
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--BorderColor);
1073
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor);
1325
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
1326
+ --pf-v6-c-check__input--TranslateY: 0;
1327
+ align-self: center;
1074
1328
  }
1075
1329
 
1076
- .pf-v6-c-label.pf-m-yellow {
1077
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-yellow--BackgroundColor);
1078
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-yellow--Color);
1079
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-yellow__icon--Color);
1080
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor);
1081
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover--Color);
1082
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color);
1083
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--BorderColor);
1084
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor);
1330
+ .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
1331
+ 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);
1085
1332
  }
1086
1333
 
1087
- .pf-v6-c-label.pf-m-green {
1088
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-green--BackgroundColor);
1089
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-green--Color);
1090
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-green__icon--Color);
1091
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor);
1092
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-green--m-clickable--hover--Color);
1093
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-green--m-clickable--hover__icon--Color);
1094
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-green--m-outline--BorderColor);
1095
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor);
1334
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
1335
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
1096
1336
  }
1097
1337
 
1098
- .pf-v6-c-label.pf-m-teal {
1099
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-teal--BackgroundColor);
1100
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-teal--Color);
1101
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-teal__icon--Color);
1102
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor);
1103
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover--Color);
1104
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover__icon--Color);
1105
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--BorderColor);
1106
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor);
1338
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
1339
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
1340
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
1107
1341
  }
1108
1342
 
1109
- .pf-v6-c-label.pf-m-purple {
1110
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-purple--BackgroundColor);
1111
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-purple--Color);
1112
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-purple__icon--Color);
1113
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor);
1114
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover--Color);
1115
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover__icon--Color);
1116
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--BorderColor);
1117
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor);
1343
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
1344
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
1345
+ --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);
1118
1346
  }
1119
1347
 
1120
- .pf-v6-c-label.pf-m-success {
1121
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-success--BackgroundColor);
1122
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-success--Color);
1123
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-success__icon--Color);
1124
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor);
1125
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-success--m-clickable--hover--Color);
1126
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-clickable--hover__icon--Color);
1127
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-success--m-outline__icon--Color);
1128
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-success--m-outline--BorderColor);
1129
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor);
1130
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color);
1348
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
1349
+ --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);
1131
1350
  }
1132
1351
 
1133
- .pf-v6-c-label.pf-m-warning {
1134
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-warning--BackgroundColor);
1135
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-warning--Color);
1136
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-warning__icon--Color);
1137
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor);
1138
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover--Color);
1139
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover__icon--Color);
1140
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-warning--m-outline__icon--Color);
1141
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--BorderColor);
1142
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor);
1143
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color);
1352
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
1353
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
1354
+ }
1355
+
1356
+ .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,
1357
+ .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,
1358
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
1359
+ padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
1360
+ }
1361
+
1362
+ .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,
1363
+ .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,
1364
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
1365
+ padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
1366
+ }
1367
+
1368
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
1369
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
1370
+ }
1371
+
1372
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
1373
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
1374
+ color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
1375
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
1376
+ }
1377
+
1378
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
1379
+ content: none;
1144
1380
  }
1145
1381
 
1146
- .pf-v6-c-label.pf-m-danger {
1147
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-danger--BackgroundColor);
1148
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-danger--Color);
1149
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-danger__icon--Color);
1150
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor);
1151
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover--Color);
1152
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover__icon--Color);
1153
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-danger--m-outline__icon--Color);
1154
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--BorderColor);
1155
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor);
1156
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color);
1382
+ .pf-v6-c-menu-toggle.pf-m-typeahead {
1383
+ --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
1384
+ --pf-v6-c-menu-toggle--Gap: 0;
1385
+ align-items: stretch;
1386
+ padding: 0;
1157
1387
  }
1158
1388
 
1159
- .pf-v6-c-label.pf-m-info {
1160
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-info--BackgroundColor);
1161
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-info--Color);
1162
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-info__icon--Color);
1163
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor);
1164
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-info--m-clickable--hover--Color);
1165
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-clickable--hover__icon--Color);
1166
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-info--m-outline__icon--Color);
1167
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-info--m-outline--BorderColor);
1168
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor);
1169
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color);
1389
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
1390
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
1170
1391
  }
1171
1392
 
1172
- .pf-v6-c-label.pf-m-custom {
1173
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-custom--BackgroundColor);
1174
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-custom--Color);
1175
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-custom__icon--Color);
1176
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor);
1177
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover--Color);
1178
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover__icon--Color);
1179
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-custom--m-outline__icon--Color);
1180
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--BorderColor);
1181
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor);
1182
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color);
1393
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
1394
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
1395
+ display: flex;
1396
+ align-items: stretch;
1183
1397
  }
1184
1398
 
1185
- .pf-v6-c-label.pf-m-compact {
1186
- --pf-v6-c-label--PaddingBlockStart: var(--pf-v6-c-label--m-compact--PaddingBlockStart);
1187
- --pf-v6-c-label--PaddingInlineEnd: var(--pf-v6-c-label--m-compact--PaddingInlineEnd);
1188
- --pf-v6-c-label--PaddingBlockEnd: var(--pf-v6-c-label--m-compact--PaddingBlockEnd);
1189
- --pf-v6-c-label--PaddingInlineStart: var(--pf-v6-c-label--m-compact--PaddingInlineStart);
1190
- --pf-v6-c-label--FontSize: var(--pf-v6-c-label--m-compact--FontSize);
1191
- --pf-v6-c-label--MinWidth: var(--pf-v6-c-label--m-compact--MinWidth);
1192
- --pf-v6-c-label--m-editable--TextUnderlineOffset: var(--pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset);
1399
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
1400
+ --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
1401
+ flex: 1;
1193
1402
  }
1194
1403
 
1195
- .pf-v6-c-label.pf-m-filled .pf-v6-c-label__actions .pf-v6-c-button {
1196
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-label--m-filled__actions--c-button__icon--Color);
1404
+ .pf-v6-c-menu-toggle__button {
1405
+ gap: var(--pf-v6-c-menu-toggle__button--Gap);
1406
+ align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
1407
+ min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
1408
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
1409
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
1410
+ color: inherit;
1411
+ background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
1412
+ border: 0;
1197
1413
  }
1198
1414
 
1199
- .pf-v6-c-label.pf-m-outline {
1200
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-outline--Color);
1201
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-outline--BorderWidth);
1202
- --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-outline--BorderColor);
1203
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-outline--BackgroundColor);
1204
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-outline__icon--Color);
1205
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor);
1206
- --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
1207
- --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
1208
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover--Color);
1209
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover__icon--Color);
1415
+ .pf-v6-c-menu-toggle__button.pf-m-text {
1416
+ display: inline-flex;
1417
+ align-items: baseline;
1210
1418
  }
1211
1419
 
1212
- .pf-v6-c-label.pf-m-editable {
1213
- --pf-v6-c-label__content--MaxWidth: var(--pf-v6-c-label--m-editable__content--MaxWidth);
1214
- --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable__content--Cursor);
1420
+ .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) {
1421
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
1422
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
1215
1423
  }
1216
1424
 
1217
- .pf-v6-c-label.pf-m-editable .pf-v6-c-label__content:is(:hover, :focus) {
1218
- --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--hover--TextDecorationLine);
1219
- --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-v6-c-label--m-editable--hover--TextDecorationStyle);
1425
+ .pf-v6-c-menu-toggle__text {
1426
+ overflow: hidden;
1427
+ text-overflow: ellipsis;
1428
+ white-space: nowrap;
1429
+ min-width: 0;
1220
1430
  }
1221
1431
 
1222
- .pf-v6-c-label.pf-m-editable .pf-v6-c-label__text {
1223
- text-decoration-line: var(--pf-v6-c-label--m-editable--TextDecorationLine);
1224
- text-decoration-style: var(--pf-v6-c-label--m-editable--TextDecorationStyle);
1225
- text-underline-offset: var(--pf-v6-c-label--m-editable--TextUnderlineOffset);
1432
+ .pf-v6-c-menu-toggle__count {
1433
+ display: flex;
1434
+ flex-wrap: nowrap;
1226
1435
  }
1227
1436
 
1228
- .pf-v6-c-label.pf-m-editable-active {
1229
- --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine);
1230
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-editable--m-editable-active--BackgroundColor);
1231
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-editable--m-editable-active--Color);
1232
- --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable--m-editable-active__content--Cursor);
1437
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
1438
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
1439
+ .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 {
1440
+ margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
1441
+ margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
1233
1442
  }
1234
1443
 
1235
- .pf-v6-c-label.pf-m-overflow {
1236
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-overflow--Color);
1237
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-overflow--BackgroundColor);
1238
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-overflow--BorderWidth);
1444
+ .pf-v6-c-menu-toggle__icon {
1445
+ flex-shrink: 0;
1446
+ transition-delay: var(--pf-v6-c-menu-toggle__icon--TransitionDelay);
1447
+ transition-duration: var(--pf-v6-c-menu-toggle__icon--TransitionDuration);
1448
+ transition-property: var(--pf-v6-c-menu-toggle__icon--TransitionProperty);
1449
+ rotate: var(--pf-v6-c-menu-toggle__icon--Rotate);
1239
1450
  }
1240
1451
 
1241
- .pf-v6-c-label.pf-m-overflow:is(:hover, :focus) {
1242
- --pf-v6-c-label--m-overflow--Color: var(--pf-v6-c-label--m-overflow--hover--Color);
1243
- --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-v6-c-label--m-overflow--hover--BackgroundColor);
1244
- --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-v6-c-label--m-overflow--hover--BorderWidth);
1452
+ .pf-v6-c-menu-toggle__icon :where(picture, img) {
1453
+ vertical-align: middle;
1245
1454
  }
1246
1455
 
1247
- .pf-v6-c-label.pf-m-add {
1248
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-add--Color);
1249
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-add--BackgroundColor);
1250
- --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-add--BorderColor);
1251
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-add--BorderWidth);
1456
+ .pf-v6-c-menu-toggle__controls {
1457
+ display: flex;
1458
+ gap: var(--pf-v6-c-menu-toggle__controls--Gap);
1459
+ align-items: center;
1460
+ justify-content: center;
1461
+ margin-inline-start: auto;
1252
1462
  }
1253
1463
 
1254
- .pf-v6-c-label.pf-m-add:is(:hover, :focus) {
1255
- --pf-v6-c-label--m-add--Color: var(--pf-v6-c-label--m-add--hover--Color);
1256
- --pf-v6-c-label--m-add--BackgroundColor: var(--pf-v6-c-label--m-add--hover--BackgroundColor);
1257
- --pf-v6-c-label--m-add--BorderColor: var(--pf-v6-c-label--m-add--hover--BorderColor);
1258
- --pf-v6-c-label--m-add--BorderWidth: var(--pf-v6-c-label--m-add--hover--BorderWidth);
1464
+ .pf-v6-c-menu-toggle__toggle-icon {
1465
+ min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
1466
+ color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
1259
1467
  }
1260
1468
 
1261
- .pf-v6-c-label.pf-m-clickable {
1262
- --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-clickable__content--Cursor);
1469
+ .pf-v6-c-menu-toggle__status-icon {
1470
+ color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
1263
1471
  }
1264
1472
 
1265
- .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content, .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
1266
- text-decoration-line: none;
1473
+ .pf-v6-c-divider {
1474
+ --pf-v6-c-divider--Display: flex;
1475
+ --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
1476
+ --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
1477
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1267
1478
  }
1268
1479
 
1269
- .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
1270
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-clickable--hover--Color);
1271
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
1272
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-clickable--hover--BackgroundColor);
1273
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-clickable--hover--BorderWidth);
1274
- --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-clickable--hover--BorderColor);
1275
- --pf-v6-c-label--m-outline--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
1276
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
1480
+ .pf-v6-c-divider {
1481
+ flex-direction: row;
1482
+ width: 100%;
1483
+ height: var(--pf-v6-c-divider--Size);
1484
+ --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
1485
+ --pf-v6-hidden-visible--hidden--Display: none;
1486
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1487
+ display: var(--pf-v6-hidden-visible--Display);
1277
1488
  }
1278
1489
 
1279
- .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) ~ .pf-v6-c-label__actions .pf-v6-c-button {
1280
- --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
1490
+ .pf-v6-c-divider.pf-m-hidden {
1491
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1281
1492
  }
1282
1493
 
1283
- .pf-v6-c-label.pf-m-disabled {
1284
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-disabled--BackgroundColor);
1285
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-disabled--Color);
1286
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-disabled__icon--Color);
1287
- --pf-v6-c-label--BorderWidth: 0;
1288
- pointer-events: none;
1494
+ @media screen and (min-width: 36rem) {
1495
+ .pf-v6-c-divider.pf-m-hidden-on-sm {
1496
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1497
+ }
1498
+ .pf-v6-c-divider.pf-m-visible-on-sm {
1499
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1500
+ }
1501
+ }
1502
+ @media screen and (min-width: 48rem) {
1503
+ .pf-v6-c-divider.pf-m-hidden-on-md {
1504
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1505
+ }
1506
+ .pf-v6-c-divider.pf-m-visible-on-md {
1507
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1508
+ }
1509
+ }
1510
+ @media screen and (min-width: 62rem) {
1511
+ .pf-v6-c-divider.pf-m-hidden-on-lg {
1512
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1513
+ }
1514
+ .pf-v6-c-divider.pf-m-visible-on-lg {
1515
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1516
+ }
1517
+ }
1518
+ @media screen and (min-width: 75rem) {
1519
+ .pf-v6-c-divider.pf-m-hidden-on-xl {
1520
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1521
+ }
1522
+ .pf-v6-c-divider.pf-m-visible-on-xl {
1523
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1524
+ }
1525
+ }
1526
+ @media screen and (min-width: 90.625rem) {
1527
+ .pf-v6-c-divider.pf-m-hidden-on-2xl {
1528
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1529
+ }
1530
+ .pf-v6-c-divider.pf-m-visible-on-2xl {
1531
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1532
+ }
1533
+ }
1534
+ .pf-v6-c-divider {
1535
+ flex-shrink: 0;
1536
+ align-items: stretch;
1537
+ align-self: stretch;
1538
+ justify-content: center;
1539
+ border: 0;
1289
1540
  }
1290
1541
 
1291
- .pf-v6-c-label.pf-m-disabled .pf-v6-c-button {
1292
- --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-v6-c-label--m-disabled--c-button--disabled__icon--Color);
1542
+ .pf-v6-c-divider::before {
1543
+ flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
1544
+ content: "";
1545
+ background-color: var(--pf-v6-c-divider--Color);
1546
+ border-block-start: var(--pf-v6-c-divider--Size) solid transparent;
1547
+ border-inline-start: var(--pf-v6-c-divider--Size) solid transparent;
1293
1548
  }
1294
1549
 
1295
- .pf-v6-c-label,
1296
- .pf-v6-c-label__content {
1297
- display: inline-flex;
1298
- align-items: center;
1299
- justify-content: center;
1550
+ .pf-v6-c-divider.pf-m-horizontal {
1551
+ flex-direction: row;
1552
+ width: 100%;
1553
+ height: var(--pf-v6-c-divider--Size);
1300
1554
  }
1301
1555
 
1302
- .pf-v6-c-label__text {
1303
- overflow: hidden;
1304
- text-overflow: ellipsis;
1305
- white-space: nowrap;
1306
- max-width: var(--pf-v6-c-label__text--MaxWidth);
1556
+ .pf-v6-c-divider.pf-m-vertical {
1557
+ flex-direction: column;
1558
+ width: var(--pf-v6-c-divider--Size);
1559
+ height: inherit;
1560
+ }
1561
+
1562
+ .pf-v6-c-divider.pf-m-inset-none {
1563
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
1307
1564
  }
1308
1565
 
1309
- .pf-v6-c-label__content {
1310
- gap: var(--pf-v6-c-label__content--Gap);
1311
- max-width: var(--pf-v6-c-label__content--MaxWidth);
1312
- padding: 0;
1313
- overflow: hidden;
1314
- color: var(--pf-v6-c-label--Color);
1315
- cursor: var(--pf-v6-c-label__content--Cursor, revert);
1316
- background: transparent;
1317
- border-width: 0;
1566
+ .pf-v6-c-divider.pf-m-inset-xs {
1567
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1318
1568
  }
1319
1569
 
1320
- .pf-v6-c-label__content::before {
1321
- position: absolute;
1322
- inset: 0;
1323
- z-index: -1;
1324
- pointer-events: none;
1325
- content: "";
1326
- background-color: var(--pf-v6-c-label--BackgroundColor);
1327
- border: var(--pf-v6-c-label--BorderWidth) solid var(--pf-v6-c-label--BorderColor);
1328
- border-radius: var(--pf-v6-c-label--BorderRadius);
1570
+ .pf-v6-c-divider.pf-m-inset-sm {
1571
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1329
1572
  }
1330
1573
 
1331
- input.pf-v6-c-label__content {
1332
- overflow: hidden;
1333
- text-overflow: ellipsis;
1334
- white-space: nowrap;
1574
+ .pf-v6-c-divider.pf-m-inset-md {
1575
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1335
1576
  }
1336
1577
 
1337
- .pf-v6-c-label__icon {
1338
- color: var(--pf-v6-c-label__icon--Color);
1578
+ .pf-v6-c-divider.pf-m-inset-lg {
1579
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1339
1580
  }
1340
1581
 
1341
- .pf-v6-c-label__actions {
1342
- margin-inline-end: var(--pf-v6-c-label__actions--MarginInlineEnd);
1582
+ .pf-v6-c-divider.pf-m-inset-xl {
1583
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1343
1584
  }
1344
1585
 
1345
- .pf-v6-c-label__actions .pf-v6-c-button {
1346
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label__actions--c-button--FontSize);
1347
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label__actions--c-button--PaddingBlockStart);
1348
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd);
1349
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd);
1350
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label__actions--c-button--PaddingInlineStart);
1351
- margin-block-start: var(--pf-v6-c-label__actions--c-button--MarginBlockStart);
1352
- margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
1353
- outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
1586
+ .pf-v6-c-divider.pf-m-inset-2xl {
1587
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1354
1588
  }
1355
1589
 
1356
- .pf-v6-c-label.pf-m-compact .pf-v6-c-label__actions .pf-v6-c-button {
1357
- --pf-v6-c-button--m-plain--m-no-padding--after--Inset: 0 calc(-0.125rem);
1590
+ .pf-v6-c-divider.pf-m-inset-3xl {
1591
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1358
1592
  }
1359
1593
 
1360
- .pf-v6-c-check {
1361
- --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
1362
- --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
1363
- --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
1364
- --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
1365
- --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
1366
- --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
1367
- --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
1368
- --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
1369
- --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
1370
- --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
1371
- --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
1372
- --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
1373
- --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
1374
- --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
1594
+ @media (min-width: 36rem) {
1595
+ .pf-v6-c-divider.pf-m-horizontal-on-sm {
1596
+ flex-direction: row;
1597
+ width: 100%;
1598
+ height: var(--pf-v6-c-divider--Size);
1599
+ }
1600
+ }
1601
+ @media (min-width: 36rem) {
1602
+ .pf-v6-c-divider.pf-m-vertical-on-sm {
1603
+ flex-direction: column;
1604
+ width: var(--pf-v6-c-divider--Size);
1605
+ height: inherit;
1606
+ }
1607
+ }
1608
+ @media (min-width: 36rem) {
1609
+ .pf-v6-c-divider.pf-m-inset-none-on-sm {
1610
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1611
+ }
1612
+ .pf-v6-c-divider.pf-m-inset-xs-on-sm {
1613
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1614
+ }
1615
+ .pf-v6-c-divider.pf-m-inset-sm-on-sm {
1616
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1617
+ }
1618
+ .pf-v6-c-divider.pf-m-inset-md-on-sm {
1619
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1620
+ }
1621
+ .pf-v6-c-divider.pf-m-inset-lg-on-sm {
1622
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1623
+ }
1624
+ .pf-v6-c-divider.pf-m-inset-xl-on-sm {
1625
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1626
+ }
1627
+ .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
1628
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1629
+ }
1630
+ .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
1631
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1632
+ }
1633
+ }
1634
+ @media (min-width: 48rem) {
1635
+ .pf-v6-c-divider.pf-m-horizontal-on-md {
1636
+ flex-direction: row;
1637
+ width: 100%;
1638
+ height: var(--pf-v6-c-divider--Size);
1639
+ }
1640
+ }
1641
+ @media (min-width: 48rem) {
1642
+ .pf-v6-c-divider.pf-m-vertical-on-md {
1643
+ flex-direction: column;
1644
+ width: var(--pf-v6-c-divider--Size);
1645
+ height: inherit;
1646
+ }
1647
+ }
1648
+ @media (min-width: 48rem) {
1649
+ .pf-v6-c-divider.pf-m-inset-none-on-md {
1650
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1651
+ }
1652
+ .pf-v6-c-divider.pf-m-inset-xs-on-md {
1653
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1654
+ }
1655
+ .pf-v6-c-divider.pf-m-inset-sm-on-md {
1656
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1657
+ }
1658
+ .pf-v6-c-divider.pf-m-inset-md-on-md {
1659
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1660
+ }
1661
+ .pf-v6-c-divider.pf-m-inset-lg-on-md {
1662
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1663
+ }
1664
+ .pf-v6-c-divider.pf-m-inset-xl-on-md {
1665
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1666
+ }
1667
+ .pf-v6-c-divider.pf-m-inset-2xl-on-md {
1668
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1669
+ }
1670
+ .pf-v6-c-divider.pf-m-inset-3xl-on-md {
1671
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1672
+ }
1673
+ }
1674
+ @media (min-width: 62rem) {
1675
+ .pf-v6-c-divider.pf-m-horizontal-on-lg {
1676
+ flex-direction: row;
1677
+ width: 100%;
1678
+ height: var(--pf-v6-c-divider--Size);
1679
+ }
1680
+ }
1681
+ @media (min-width: 62rem) {
1682
+ .pf-v6-c-divider.pf-m-vertical-on-lg {
1683
+ flex-direction: column;
1684
+ width: var(--pf-v6-c-divider--Size);
1685
+ height: inherit;
1686
+ }
1687
+ }
1688
+ @media (min-width: 62rem) {
1689
+ .pf-v6-c-divider.pf-m-inset-none-on-lg {
1690
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1691
+ }
1692
+ .pf-v6-c-divider.pf-m-inset-xs-on-lg {
1693
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1694
+ }
1695
+ .pf-v6-c-divider.pf-m-inset-sm-on-lg {
1696
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1697
+ }
1698
+ .pf-v6-c-divider.pf-m-inset-md-on-lg {
1699
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1700
+ }
1701
+ .pf-v6-c-divider.pf-m-inset-lg-on-lg {
1702
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1703
+ }
1704
+ .pf-v6-c-divider.pf-m-inset-xl-on-lg {
1705
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1706
+ }
1707
+ .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
1708
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1709
+ }
1710
+ .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
1711
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1712
+ }
1713
+ }
1714
+ @media (min-width: 75rem) {
1715
+ .pf-v6-c-divider.pf-m-horizontal-on-xl {
1716
+ flex-direction: row;
1717
+ width: 100%;
1718
+ height: var(--pf-v6-c-divider--Size);
1719
+ }
1720
+ }
1721
+ @media (min-width: 75rem) {
1722
+ .pf-v6-c-divider.pf-m-vertical-on-xl {
1723
+ flex-direction: column;
1724
+ width: var(--pf-v6-c-divider--Size);
1725
+ height: inherit;
1726
+ }
1727
+ }
1728
+ @media (min-width: 75rem) {
1729
+ .pf-v6-c-divider.pf-m-inset-none-on-xl {
1730
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1731
+ }
1732
+ .pf-v6-c-divider.pf-m-inset-xs-on-xl {
1733
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1734
+ }
1735
+ .pf-v6-c-divider.pf-m-inset-sm-on-xl {
1736
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1737
+ }
1738
+ .pf-v6-c-divider.pf-m-inset-md-on-xl {
1739
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1740
+ }
1741
+ .pf-v6-c-divider.pf-m-inset-lg-on-xl {
1742
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1743
+ }
1744
+ .pf-v6-c-divider.pf-m-inset-xl-on-xl {
1745
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1746
+ }
1747
+ .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
1748
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1749
+ }
1750
+ .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
1751
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1752
+ }
1753
+ }
1754
+ @media (min-width: 90.625rem) {
1755
+ .pf-v6-c-divider.pf-m-horizontal-on-2xl {
1756
+ flex-direction: row;
1757
+ width: 100%;
1758
+ height: var(--pf-v6-c-divider--Size);
1759
+ }
1760
+ }
1761
+ @media (min-width: 90.625rem) {
1762
+ .pf-v6-c-divider.pf-m-vertical-on-2xl {
1763
+ flex-direction: column;
1764
+ width: var(--pf-v6-c-divider--Size);
1765
+ height: inherit;
1766
+ }
1767
+ }
1768
+ @media (min-width: 90.625rem) {
1769
+ .pf-v6-c-divider.pf-m-inset-none-on-2xl {
1770
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1771
+ }
1772
+ .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
1773
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1774
+ }
1775
+ .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
1776
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1777
+ }
1778
+ .pf-v6-c-divider.pf-m-inset-md-on-2xl {
1779
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1780
+ }
1781
+ .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
1782
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1783
+ }
1784
+ .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
1785
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1786
+ }
1787
+ .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
1788
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1789
+ }
1790
+ .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
1791
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1792
+ }
1375
1793
  }
1376
-
1377
- .pf-v6-c-check {
1378
- display: grid;
1379
- grid-template-columns: auto 1fr;
1380
- grid-gap: var(--pf-v6-c-check--GridGap);
1381
- accent-color: var(--pf-v6-c-check--AccentColor);
1794
+ .pf-v6-c-label-group {
1795
+ --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
1796
+ --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
1797
+ --pf-v6-c-label-group--MaxWidth: 100%;
1798
+ --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
1799
+ --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
1800
+ --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
1801
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
1802
+ --pf-v6-c-label-group__main--MaxWidth: 100%;
1803
+ --pf-v6-c-label-group__main--MinWidth: 0;
1804
+ --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
1805
+ --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
1806
+ --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
1807
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
1808
+ --pf-v6-c-label-group__list--MaxWidth: 100%;
1809
+ --pf-v6-c-label-group__list--MinWidth: 0;
1810
+ --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
1811
+ --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
1812
+ --pf-v6-c-label-group__list-item--MaxWidth: 100%;
1813
+ --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1814
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1815
+ --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1816
+ --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1817
+ --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
1818
+ --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
1819
+ --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
1820
+ --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1821
+ --pf-v6-c-label-group__label--MaxWidth: 18ch;
1822
+ --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
1823
+ --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1824
+ --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1825
+ --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1826
+ --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1827
+ --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
1828
+ --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
1829
+ --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
1830
+ --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
1831
+ --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
1382
1832
  }
1383
1833
 
1384
- .pf-v6-c-check.pf-m-standalone {
1385
- display: inline-grid;
1386
- grid-template-columns: auto;
1387
- min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
1834
+ .pf-v6-c-label-group {
1835
+ display: inline-flex;
1836
+ row-gap: var(--pf-v6-c-label-group--RowGap);
1837
+ column-gap: var(--pf-v6-c-label-group--ColumnGap);
1838
+ align-items: center;
1839
+ max-width: var(--pf-v6-c-label-group--MaxWidth);
1388
1840
  }
1389
1841
 
1390
- .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
1391
- align-self: center;
1392
- transform: none;
1842
+ .pf-v6-c-label-group.pf-m-category {
1843
+ padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
1844
+ padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
1845
+ padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
1846
+ padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
1847
+ background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
1848
+ border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
1849
+ border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
1393
1850
  }
1394
1851
 
1395
- .pf-v6-c-check__input {
1396
- align-self: start;
1397
- font-size: var(--pf-v6-c-check__label--FontSize);
1398
- line-height: var(--pf-v6-c-check__label--LineHeight);
1399
- transform: translateY(var(--pf-v6-c-check__input--TranslateY));
1852
+ .pf-v6-c-label-group.pf-m-vertical {
1853
+ --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
1854
+ --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
1855
+ --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
1856
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
1857
+ --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
1858
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
1859
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
1400
1860
  }
1401
1861
 
1402
- .pf-v6-c-check__label {
1403
- font-size: var(--pf-v6-c-check__label--FontSize);
1404
- font-weight: var(--pf-v6-c-check__label--FontWeight);
1405
- line-height: var(--pf-v6-c-check__label--LineHeight);
1406
- color: var(--pf-v6-c-check__label--Color);
1862
+ .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
1863
+ align-items: flex-start;
1407
1864
  }
1408
1865
 
1409
- .pf-v6-c-check__description {
1410
- grid-column: 2;
1411
- font-size: var(--pf-v6-c-check__description--FontSize);
1412
- color: var(--pf-v6-c-check__description--Color);
1866
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
1867
+ flex-direction: column;
1868
+ align-items: flex-start;
1869
+ max-width: var(--pf-v6-c-label-group__list--MaxWidth);
1413
1870
  }
1414
1871
 
1415
- .pf-v6-c-check__body {
1416
- grid-column: 2;
1872
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
1873
+ flex-direction: column;
1874
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
1417
1875
  }
1418
1876
 
1419
- .pf-v6-c-check__label,
1420
- .pf-v6-c-check__input {
1421
- justify-self: start;
1877
+ .pf-v6-c-label-group.pf-m-editable,
1878
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1879
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
1880
+ display: flex;
1422
1881
  }
1423
1882
 
1424
- label.pf-v6-c-check, .pf-v6-c-check__label,
1425
- .pf-v6-c-check__input {
1426
- cursor: pointer;
1883
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1884
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
1885
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
1886
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
1887
+ flex: 1;
1427
1888
  }
1428
1889
 
1429
- .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
1430
- .pf-v6-c-check__input:disabled,
1431
- .pf-v6-c-check__input.pf-m-disabled {
1432
- --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
1433
- cursor: not-allowed;
1890
+ .pf-v6-c-label-group__main {
1891
+ display: flex;
1892
+ flex: 1;
1893
+ flex-wrap: wrap;
1894
+ row-gap: var(--pf-v6-c-label-group__main--RowGap);
1895
+ column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
1896
+ align-items: baseline;
1897
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
1434
1898
  }
1435
1899
 
1436
- .pf-v6-c-check__label-required {
1437
- margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
1438
- font-size: var(--pf-v6-c-check__label-required--FontSize);
1439
- color: var(--pf-v6-c-check__label-required--Color);
1900
+ .pf-v6-c-label-group__list {
1901
+ display: inline-flex;
1902
+ flex-wrap: wrap;
1903
+ row-gap: var(--pf-v6-c-label-group__list--RowGap);
1904
+ column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
1905
+ min-width: var(--pf-v6-c-label-group__list--MinWidth);
1440
1906
  }
1441
1907
 
1442
- .pf-v6-c-badge {
1443
- --pf-v6-c-badge--BorderColor: transparent;
1444
- --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
1445
- --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
1446
- --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
1447
- --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
1448
- --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1449
- --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1450
- --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
1451
- --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
1452
- --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
1453
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
1454
- --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
1455
- --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
1456
- --pf-v6-c-badge--m-read--BorderColor: var(--pf-t--global--border--color--high-contrast);
1457
- --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
1458
- --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
1459
- --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
1460
- --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
1461
- --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
1462
- --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
1463
- --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1908
+ .pf-v6-c-label-group__list-item {
1909
+ display: inline-flex;
1910
+ max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
1464
1911
  }
1465
1912
 
1466
- .pf-v6-c-badge {
1467
- position: relative;
1468
- display: inline-block;
1469
- min-width: var(--pf-v6-c-badge--MinWidth);
1470
- padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
1471
- padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
1472
- font-size: var(--pf-v6-c-badge--FontSize);
1473
- font-weight: var(--pf-v6-c-badge--FontWeight);
1474
- color: var(--pf-v6-c-badge--Color);
1475
- text-align: center;
1913
+ .pf-v6-c-label-group__label {
1914
+ overflow: hidden;
1915
+ text-overflow: ellipsis;
1476
1916
  white-space: nowrap;
1477
- background-color: var(--pf-v6-c-badge--BackgroundColor);
1478
- border-radius: var(--pf-v6-c-badge--BorderRadius);
1479
- }
1480
-
1481
- .pf-v6-c-badge::after {
1482
- position: absolute;
1483
- inset: 0;
1484
- pointer-events: none;
1485
- content: "";
1486
- border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
1487
- border-radius: inherit;
1488
- }
1489
-
1490
- .pf-v6-c-badge.pf-m-read {
1491
- --pf-v6-c-badge--BorderColor: var(--pf-v6-c-badge--m-read--BorderColor);
1492
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
1493
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
1494
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
1917
+ max-width: var(--pf-v6-c-label-group__label--MaxWidth);
1495
1918
  }
1496
1919
 
1497
- .pf-v6-c-badge.pf-m-unread {
1498
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
1499
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
1500
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
1920
+ .pf-v6-c-label-group__close {
1921
+ display: flex;
1922
+ align-self: flex-start;
1501
1923
  }
1502
1924
 
1503
- .pf-v6-c-badge.pf-m-disabled {
1504
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
1505
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
1925
+ .pf-v6-c-label-group__close .pf-v6-c-button {
1926
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
1927
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
1928
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
1929
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
1930
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
1506
1931
  }
1507
1932
 
1508
- .pf-v6-c-badge.pf-m-disabled::after {
1509
- border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
1933
+ .pf-v6-c-label-group__textarea {
1934
+ min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
1935
+ padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
1936
+ padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
1937
+ padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
1938
+ padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
1939
+ white-space: nowrap;
1940
+ resize: none;
1941
+ scrollbar-width: none;
1942
+ -ms-overflow-style: none;
1943
+ border: 0;
1510
1944
  }
1511
1945
 
1512
- .pf-v6-c-badge__toggle-icon {
1513
- margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
1514
- color: var(--pf-v6-c-badge__toggle-icon--Color);
1946
+ .pf-v6-c-label-group__textarea::-webkit-scrollbar {
1947
+ display: none;
1515
1948
  }
1516
1949
 
1517
1950
  .pf-v6-c-button {
@@ -1519,7 +1952,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1519
1952
  --pf-v6-c-button--AlignItems: baseline;
1520
1953
  --pf-v6-c-button--JustifyContent: center;
1521
1954
  --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
1522
- --pf-v6-c-button--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--PaddingBlockStart) + var(--pf-v6-c-button--PaddingBlockEnd));
1955
+ --pf-v6-c-button--MinWidth: calc(1lh + var(--pf-v6-c-button--PaddingBlockStart) + var(--pf-v6-c-button--PaddingBlockEnd));
1523
1956
  --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
1524
1957
  --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
1525
1958
  --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
@@ -1548,11 +1981,16 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1548
1981
  --pf-v6-c-button--hover--TextDecorationLine: none;
1549
1982
  --pf-v6-c-button--hover--TextDecorationStyle: none;
1550
1983
  --pf-v6-c-button--hover--TextDecorationColor: currentcolor;
1984
+ --pf-v6-c-button--hover--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
1551
1985
  --pf-v6-c-button--hover--ScaleX: 1;
1552
1986
  --pf-v6-c-button--hover--ScaleY: 1;
1553
1987
  --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
1554
1988
  --pf-v6-c-button--m-clicked--BorderColor: transparent;
1555
1989
  --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
1990
+ --pf-v6-c-button--m-clicked--TextDecorationLine: none;
1991
+ --pf-v6-c-button--m-clicked--TextDecorationStyle: none;
1992
+ --pf-v6-c-button--m-clicked--TextDecorationColor: currentcolor;
1993
+ --pf-v6-c-button--m-clicked--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--default);
1556
1994
  --pf-v6-c-button--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
1557
1995
  --pf-v6-c-button--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
1558
1996
  --pf-v6-c-button--m-primary__icon--Color: var(--pf-t--global--icon--color--on-brand--default);
@@ -1591,7 +2029,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1591
2029
  --pf-v6-c-button--m-tertiary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
1592
2030
  --pf-v6-c-button--m-tertiary--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
1593
2031
  --pf-v6-c-button--m-tertiary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
1594
- --pf-v6-c-button--m-link--BorderRadius: var(--pf-t--global--border--radius--small);
2032
+ --pf-v6-c-button--m-link--BorderRadius: var(--pf-t--global--border--radius--action--plain--default);
1595
2033
  --pf-v6-c-button--m-link--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
1596
2034
  --pf-v6-c-button--m-link--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
1597
2035
  --pf-v6-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
@@ -1629,10 +2067,17 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1629
2067
  --pf-v6-c-button--m-link--m-inline--PaddingInlineEnd: 0;
1630
2068
  --pf-v6-c-button--m-link--m-inline--PaddingBlockEnd: 0;
1631
2069
  --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: 0;
2070
+ --pf-v6-c-button--m-link--m-inline--TextDecorationColor: var(--pf-t--global--text-decoration--color--default);
1632
2071
  --pf-v6-c-button--m-link--m-inline--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
1633
2072
  --pf-v6-c-button--m-link--m-inline--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
2073
+ --pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--default);
2074
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: var(--pf-t--global--text-decoration--color--hover);
1634
2075
  --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
1635
2076
  --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
2077
+ --pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
2078
+ --pf-v6-c-button--m-link--m-inline--TransitionProperty: color, text-underline-offset;
2079
+ --pf-v6-c-button--m-link--m-inline--TransitionDuration: var(--pf-t--global--motion--duration--fade--default), var(--pf-t--global--motion--duration--lg);
2080
+ --pf-v6-c-button--m-link--m-inline--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate), var(--pf-t--global--motion--timing-function--default);
1636
2081
  --pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart: var(--pf-t--global--spacer--xs);
1637
2082
  --pf-v6-c-button--m-link--m-inline--m-in-progress--PaddingInlineStart: calc(var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart) + 1rem + var(--pf-t--global--spacer--sm));
1638
2083
  --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
@@ -1642,11 +2087,9 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1642
2087
  --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
1643
2088
  --pf-v6-c-button--m-link--m-inline--Color: var(--pf-t--global--text--color--brand--default);
1644
2089
  --pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
1645
- --pf-v6-c-button--m-link--m-inline--TextDecorationColor: currentcolor;
1646
2090
  --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
1647
2091
  --pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
1648
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: currentcolor;
1649
- --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
2092
+ --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--action--plain--default);
1650
2093
  --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
1651
2094
  --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
1652
2095
  --pf-v6-c-button--m-plain--Color: var(--pf-t--global--icon--color--regular);
@@ -1680,12 +2123,12 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1680
2123
  --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
1681
2124
  --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
1682
2125
  --pf-v6-c-button--m-plain--m-no-padding--border--offset: calc(0.125rem * -1);
1683
- --pf-v6-c-button--m-control--BorderRadius: var(--pf-t--global--border--radius--small);
2126
+ --pf-v6-c-button--m-control--BorderRadius: var(--pf-t--global--border--radius--control--form-element);
1684
2127
  --pf-v6-c-button--m-control--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1685
2128
  --pf-v6-c-button--m-control--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1686
2129
  --pf-v6-c-button--m-control--Color: var(--pf-t--global--text--color--regular);
1687
2130
  --pf-v6-c-button--m-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
1688
- --pf-v6-c-button--m-control--BorderColor: var(--pf-t--global--border--color--default);
2131
+ --pf-v6-c-button--m-control--BorderColor: var(--pf-t--global--border--color--control--default);
1689
2132
  --pf-v6-c-button--m-control--BorderWidth: var(--pf-t--global--border--width--control--default);
1690
2133
  --pf-v6-c-button--m-control__icon--Color: var(--pf-t--global--icon--color--regular);
1691
2134
  --pf-v6-c-button--m-control--hover--Color: var(--pf-t--global--text--color--regular);
@@ -1700,13 +2143,13 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1700
2143
  --pf-v6-c-button--m-control--m-clicked__icon--Color: var(--pf-t--global--icon--color--regular);
1701
2144
  --pf-v6-c-button--m-control--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
1702
2145
  --pf-v6-c-button--m-control--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
1703
- --pf-v6-c-button--m-stateful--BorderRadius: var(--pf-t--global--border--radius--small);
2146
+ --pf-v6-c-button--m-stateful--BorderRadius: var(--pf-t--global--border--radius--action--plain--default);
1704
2147
  --pf-v6-c-button--m-stateful--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1705
2148
  --pf-v6-c-button--m-stateful--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1706
2149
  --pf-v6-c-button--m-stateful--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
1707
2150
  --pf-v6-c-button--m-stateful--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
1708
2151
  --pf-v6-c-button--m-read--BackgroundColor: var(--pf-t--global--background--color--control--default);
1709
- --pf-v6-c-button--m-read--BorderColor: var(--pf-t--global--border--color--default);
2152
+ --pf-v6-c-button--m-read--BorderColor: var(--pf-t--global--border--color--control--default);
1710
2153
  --pf-v6-c-button--m-read--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
1711
2154
  --pf-v6-c-button--m-read--hover--BorderColor: var(--pf-t--global--border--color--hover);
1712
2155
  --pf-v6-c-button--m-read--m-clicked--BackgroundColor: var(--pf-t--global--background--color--control--default);
@@ -1752,7 +2195,37 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1752
2195
  --pf-v6-c-button--m-display-lg--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--spacious);
1753
2196
  --pf-v6-c-button--m-display-lg--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--spacious);
1754
2197
  --pf-v6-c-button--m-display-lg--FontWeight: var(--pf-t--global--font--weight--body--bold);
1755
- --pf-v6-c-button--m-link--m-display-lg--FontSize: var(--pf-t--global--font--size--body--lg);
2198
+ --pf-v6-c-button--m-link--m-display-lg--FontSize: var(--pf-t--global--font--size--body--default);
2199
+ --pf-v6-c-button--m-display-lg--hover--TextDecorationColor: var(--pf-t--global--border--color--control--default);
2200
+ --pf-v6-c-button--m-display-lg--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
2201
+ --pf-v6-c-button--m-display-lg--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
2202
+ --pf-v6-c-button--m-display-lg--hover--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
2203
+ --pf-v6-c-button--m-display-lg--m-clicked--TextDecorationColor: var(--pf-t--global--border--color--control--default);
2204
+ --pf-v6-c-button--m-display-lg--m-clicked--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
2205
+ --pf-v6-c-button--m-display-lg--m-clicked--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
2206
+ --pf-v6-c-button--m-display-lg--m-clicked--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
2207
+ --pf-v6-c-button--m-display-lg--m-primary--Color: var(--pf-t--global--text--color--on-brand--accent--default);
2208
+ --pf-v6-c-button--m-display-lg--m-primary--BackgroundColor: var(--pf-t--global--color--brand--accent--default);
2209
+ --pf-v6-c-button--m-display-lg--m-primary__icon--Color: var(--pf-t--global--icon--color--on-brand--accent--default);
2210
+ --pf-v6-c-button--m-display-lg--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--accent--hover);
2211
+ --pf-v6-c-button--m-display-lg--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--accent--hover);
2212
+ --pf-v6-c-button--m-display-lg--m-primary--hover__icon--Color: var(--pf-t--global--icon--color--on-brand--accent--hover);
2213
+ --pf-v6-c-button--m-display-lg--m-primary--m-clicked--Color: var(--pf-t--global--text--color--on-brand--accent--clicked);
2214
+ --pf-v6-c-button--m-display-lg--m-primary--m-clicked--BackgroundColor: var(--pf-t--global--color--brand--accent--clicked);
2215
+ --pf-v6-c-button--m-display-lg--m-primary--m-clicked__icon--Color: var(--pf-t--global--icon--color--on-brand--accent--clicked);
2216
+ --pf-v6-c-button--m-display-lg--m-primary--hover--TextDecorationColor: currentcolor;
2217
+ --pf-v6-c-button--m-display-lg--m-primary--m-clicked--TextDecorationColor: currentcolor;
2218
+ --pf-v6-c-button--m-display-lg--m-secondary--Color: var(--pf-t--global--text--color--regular);
2219
+ --pf-v6-c-button--m-display-lg--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--accent--default);
2220
+ --pf-v6-c-button--m-display-lg--m-secondary__icon--Color: var(--pf-t--global--icon--color--brand--accent--default);
2221
+ --pf-v6-c-button--m-display-lg--m-secondary--hover--Color: var(--pf-t--global--text--color--regular);
2222
+ --pf-v6-c-button--m-display-lg--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--accent--hover);
2223
+ --pf-v6-c-button--m-display-lg--m-secondary--hover__icon--Color: var(--pf-t--global--icon--color--brand--accent--hover);
2224
+ --pf-v6-c-button--m-display-lg--m-secondary--m-clicked--Color: var(--pf-t--global--text--color--regular);
2225
+ --pf-v6-c-button--m-display-lg--m-secondary--m-clicked--BorderColor: var(--pf-t--global--border--color--brand--accent--clicked);
2226
+ --pf-v6-c-button--m-display-lg--m-secondary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--accent--clicked);
2227
+ --pf-v6-c-button--m-display-lg--m-tertiary--hover--BorderColor: var(--pf-t--global--border--color--default);
2228
+ --pf-v6-c-button--m-display-lg--m-tertiary--m-clicked--BorderColor: var(--pf-t--global--border--color--default);
1756
2229
  --pf-v6-c-button--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
1757
2230
  --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
1758
2231
  --pf-v6-c-button--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
@@ -1831,14 +2304,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1831
2304
  --pf-v6-c-button--hamburger-icon--arrow--collapse--path: path("M3,7 L1,5 L3,3");
1832
2305
  --pf-v6-c-button--hamburger-icon--bottom--collapse--path: path("M9,9 L5,9");
1833
2306
  --pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX: -1;
1834
- --pf-v6-c-button--m-circle--ScaleX: 1.29;
1835
- --pf-v6-c-button--m-circle--ScaleY: 1.29;
1836
2307
  --pf-v6-c-button--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
1837
- --pf-v6-c-button--m-circle--Padding--base: var(--pf-t--global--spacer--control--vertical--default);
1838
- --pf-v6-c-button--m-circle--PaddingBlockStart: var(--pf-v6-c-button--m-circle--Padding--base);
1839
- --pf-v6-c-button--m-circle--PaddingInlineEnd: 0;
1840
- --pf-v6-c-button--m-circle--PaddingBlockEnd: var(--pf-v6-c-button--m-circle--Padding--base);
1841
- --pf-v6-c-button--m-circle--PaddingInlineStart: 0;
1842
2308
  }
1843
2309
 
1844
2310
  .pf-v6-c-button {
@@ -1847,7 +2313,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1847
2313
  gap: var(--pf-v6-c-button--Gap);
1848
2314
  align-items: var(--pf-v6-c-button--AlignItems);
1849
2315
  justify-content: var(--pf-v6-c-button--JustifyContent);
1850
- min-width: var(--pf-v6-c-button--MinWidth);
2316
+ min-width: var(--pf-v6-c-button--MinWidth, revert);
1851
2317
  padding-block-start: var(--pf-v6-c-button--PaddingBlockStart);
1852
2318
  padding-block-end: var(--pf-v6-c-button--PaddingBlockEnd);
1853
2319
  padding-inline-start: var(--pf-v6-c-button--PaddingInlineStart);
@@ -1968,6 +2434,12 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1968
2434
  --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-small--PaddingInlineStart);
1969
2435
  }
1970
2436
 
2437
+ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2438
+ --pf-v6-c-button--m-link--m-inline--Display: var(--pf-v6-c-button--span--m-link--m-inline--Display);
2439
+ --pf-v6-c-button__icon--m-start--MarginInlineEnd: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd);
2440
+ --pf-v6-c-button__icon--m-end--MarginInlineStart: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart);
2441
+ }
2442
+
1971
2443
  .pf-v6-c-button.pf-m-link.pf-m-inline {
1972
2444
  --pf-v6-c-button--Display: var(--pf-v6-c-button--m-link--m-inline--Display);
1973
2445
  --pf-v6-c-button--JustifyContent: var(--pf-v6-c-button--m-link--m-inline--JustifyContent);
@@ -1978,12 +2450,13 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1978
2450
  --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-link--m-inline--PaddingInlineEnd);
1979
2451
  --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-link--m-inline--PaddingBlockEnd);
1980
2452
  --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-inline--PaddingInlineStart);
2453
+ --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-link--m-inline--TransitionDuration);
2454
+ --pf-v6-c-button--TransitionTimingFunction: var(--pf-v6-c-button--m-link--m-inline--TransitionTimingFunction);
2455
+ --pf-v6-c-button--TransitionProperty: var(--pf-v6-c-button--m-link--m-inline--TransitionProperty);
1981
2456
  --pf-v6-c-button--BackgroundColor: transparent;
1982
2457
  --pf-v6-c-button__progress--InsetInlineStart: var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart);
1983
2458
  --pf-v6-c-button--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--TextDecorationLine);
1984
2459
  --pf-v6-c-button--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--TextDecorationStyle);
1985
- --pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
1986
- --pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
1987
2460
  --pf-v6-c-button--hover--BackgroundColor: transparent;
1988
2461
  --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
1989
2462
  --pf-v6-c-button--disabled--BackgroundColor: transparent;
@@ -1992,22 +2465,24 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1992
2465
  --pf-v6-c-button--m-link--Color: var(--pf-v6-c-button--m-link--m-inline--Color);
1993
2466
  --pf-v6-c-button--m-link__icon--Color: var(--pf-v6-c-button--m-link--m-inline__icon--Color);
1994
2467
  --pf-v6-c-button--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--TextDecorationColor);
2468
+ --pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
2469
+ --pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
1995
2470
  --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
2471
+ --pf-v6-c-button--hover--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--TextUnderlineOffset);
1996
2472
  --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
1997
2473
  --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
1998
2474
  --pf-v6-c-button--BorderWidth: 0;
1999
2475
  --pf-v6-c-button--hover--BorderWidth: 0;
2000
2476
  --pf-v6-c-button--m-clicked--BorderWidth: 0;
2001
2477
  text-align: start;
2478
+ text-underline-offset: var(--pf-v6-c-button--m-link--m-inline--TextUnderlineOffset);
2002
2479
  white-space: normal;
2003
2480
  background: transparent;
2004
2481
  outline-offset: 0.125rem;
2005
2482
  }
2006
2483
 
2007
- span.pf-v6-c-button.pf-m-link.pf-m-inline {
2008
- --pf-v6-c-button--m-link--m-inline--Display: var(--pf-v6-c-button--span--m-link--m-inline--Display);
2009
- --pf-v6-c-button__icon--m-start--MarginInlineEnd: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd);
2010
- --pf-v6-c-button__icon--m-end--MarginInlineStart: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart);
2484
+ .pf-v6-c-button.pf-m-link.pf-m-inline:hover, .pf-v6-c-button.pf-m-link.pf-m-inline:focus {
2485
+ --pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset);
2011
2486
  }
2012
2487
 
2013
2488
  .pf-v6-c-button.pf-m-link.pf-m-danger {
@@ -2173,6 +2648,39 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2173
2648
  --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-display-lg--PaddingBlockEnd);
2174
2649
  --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-display-lg--PaddingInlineStart);
2175
2650
  --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-display-lg--FontSize);
2651
+ --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-display-lg--hover--TextDecorationColor);
2652
+ --pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-display-lg--hover--TextDecorationLine);
2653
+ --pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-display-lg--hover--TextDecorationStyle);
2654
+ --pf-v6-c-button--hover--TextUnderlineOffset: var(--pf-v6-c-button--m-display-lg--hover--TextUnderlineOffset);
2655
+ --pf-v6-c-button--m-clicked--TextDecorationColor: var(--pf-v6-c-button--m-display-lg--m-clicked--TextDecorationColor);
2656
+ --pf-v6-c-button--m-clicked--TextDecorationLine: var(--pf-v6-c-button--m-display-lg--m-clicked--TextDecorationLine);
2657
+ --pf-v6-c-button--m-clicked--TextDecorationStyle: var(--pf-v6-c-button--m-display-lg--m-clicked--TextDecorationStyle);
2658
+ --pf-v6-c-button--m-clicked--TextUnderlineOffset: var(--pf-v6-c-button--m-display-lg--m-clicked--TextUnderlineOffset);
2659
+ --pf-v6-c-button--m-primary--Color: var(--pf-v6-c-button--m-display-lg--m-primary--Color);
2660
+ --pf-v6-c-button--m-primary--BackgroundColor: var(--pf-v6-c-button--m-display-lg--m-primary--BackgroundColor);
2661
+ --pf-v6-c-button--m-primary__icon--Color: var(--pf-v6-c-button--m-display-lg--m-primary__icon--Color);
2662
+ --pf-v6-c-button--m-primary--hover--Color: var(--pf-v6-c-button--m-display-lg--m-primary--hover--Color);
2663
+ --pf-v6-c-button--m-primary--hover--BackgroundColor: var(--pf-v6-c-button--m-display-lg--m-primary--hover--BackgroundColor);
2664
+ --pf-v6-c-button--m-primary--hover__icon--Color: var(--pf-v6-c-button--m-display-lg--m-primary--hover__icon--Color);
2665
+ --pf-v6-c-button--m-primary--m-clicked--Color: var(--pf-v6-c-button--m-display-lg--m-primary--m-clicked--Color);
2666
+ --pf-v6-c-button--m-primary--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-display-lg--m-primary--m-clicked--BackgroundColor);
2667
+ --pf-v6-c-button--m-primary--m-clicked__icon--Color: var(--pf-v6-c-button--m-display-lg--m-primary--m-clicked__icon--Color);
2668
+ --pf-v6-c-button--m-secondary--Color: var(--pf-v6-c-button--m-display-lg--m-secondary--Color);
2669
+ --pf-v6-c-button--m-secondary--BorderColor: var(--pf-v6-c-button--m-display-lg--m-secondary--BorderColor);
2670
+ --pf-v6-c-button--m-secondary__icon--Color: var(--pf-v6-c-button--m-display-lg--m-secondary__icon--Color);
2671
+ --pf-v6-c-button--m-secondary--hover--Color: var(--pf-v6-c-button--m-display-lg--m-secondary--hover--Color);
2672
+ --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-v6-c-button--m-display-lg--m-secondary--hover--BorderColor);
2673
+ --pf-v6-c-button--m-secondary--hover__icon--Color: var(--pf-v6-c-button--m-display-lg--m-secondary--hover__icon--Color);
2674
+ --pf-v6-c-button--m-secondary--m-clicked--Color: var(--pf-v6-c-button--m-display-lg--m-secondary--m-clicked--Color);
2675
+ --pf-v6-c-button--m-secondary--m-clicked--BorderColor: var(--pf-v6-c-button--m-display-lg--m-secondary--m-clicked--BorderColor);
2676
+ --pf-v6-c-button--m-secondary--m-clicked__icon--Color: var(--pf-v6-c-button--m-display-lg--m-secondary--m-clicked__icon--Color);
2677
+ --pf-v6-c-button--m-tertiary--hover--BorderColor: var(--pf-v6-c-button--m-display-lg--m-tertiary--hover--BorderColor);
2678
+ --pf-v6-c-button--m-tertiary--m-clicked--BorderColor: var(--pf-v6-c-button--m-display-lg--m-tertiary--m-clicked--BorderColor);
2679
+ }
2680
+
2681
+ .pf-v6-c-button.pf-m-display-lg.pf-m-primary {
2682
+ --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-display-lg--m-primary--hover--TextDecorationColor);
2683
+ --pf-v6-c-button--m-clicked--TextDecorationColor: var(--pf-v6-c-button--m-display-lg--m-primary--m-clicked--TextDecorationColor);
2176
2684
  }
2177
2685
 
2178
2686
  .pf-v6-c-button.pf-m-favorite .pf-v6-c-button__icon {
@@ -2237,15 +2745,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2237
2745
  }
2238
2746
 
2239
2747
  .pf-v6-c-button.pf-m-circle {
2240
- --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-circle--BorderRadius);
2241
- --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-circle--PaddingBlockStart);
2242
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-circle--PaddingInlineEnd);
2243
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-circle--PaddingBlockEnd);
2244
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-circle--PaddingInlineStart);
2245
- }
2246
-
2247
- .pf-v6-c-button.pf-m-circle .pf-v6-c-button__icon {
2248
- scale: var(--pf-v6-c-button--m-circle--ScaleX) var(--pf-v6-c-button--m-circle--ScaleY);
2748
+ --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-circle--BorderRadius);
2749
+ padding-inline: 0;
2249
2750
  }
2250
2751
 
2251
2752
  .pf-v6-c-button:hover, .pf-v6-c-button:focus {
@@ -2266,6 +2767,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2266
2767
  text-decoration-line: var(--pf-v6-c-button--hover--TextDecorationLine);
2267
2768
  text-decoration-style: var(--pf-v6-c-button--hover--TextDecorationStyle);
2268
2769
  text-decoration-color: var(--pf-v6-c-button--hover--TextDecorationColor);
2770
+ text-underline-offset: var(--pf-v6-c-button--hover--TextUnderlineOffset);
2269
2771
  outline-offset: var(--pf-t--global--focus-ring--position--offset);
2270
2772
  }
2271
2773
 
@@ -2275,6 +2777,10 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2275
2777
  --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--m-clicked--BorderWidth);
2276
2778
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-clicked--BorderColor);
2277
2779
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-clicked__icon--Color);
2780
+ text-decoration-line: var(--pf-v6-c-button--m-clicked--TextDecorationLine);
2781
+ text-decoration-style: var(--pf-v6-c-button--m-clicked--TextDecorationStyle);
2782
+ text-decoration-color: var(--pf-v6-c-button--m-clicked--TextDecorationColor);
2783
+ text-underline-offset: var(--pf-v6-c-button--m-clicked--TextUnderlineOffset);
2278
2784
  }
2279
2785
 
2280
2786
  .pf-v6-c-button:active {
@@ -2335,6 +2841,28 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2335
2841
  animation-timing-function: var(--pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify);
2336
2842
  }
2337
2843
 
2844
+ .pf-v6-c-button.pf-m-dock {
2845
+ justify-content: flex-start;
2846
+ width: 100%;
2847
+ }
2848
+
2849
+ @media (min-width: 62rem) {
2850
+ .pf-v6-c-button.pf-m-dock {
2851
+ justify-content: center;
2852
+ }
2853
+ .pf-v6-c-button.pf-m-dock .pf-v6-c-button__text {
2854
+ display: none;
2855
+ }
2856
+ }
2857
+ .pf-v6-c-page__dock.pf-m-text-expanded .pf-v6-c-button, .pf-v6-c-button.pf-m-text-expanded {
2858
+ justify-content: flex-start;
2859
+ width: 100%;
2860
+ }
2861
+
2862
+ .pf-v6-c-page__dock.pf-m-text-expanded .pf-v6-c-button .pf-v6-c-button__text, .pf-v6-c-button.pf-m-text-expanded .pf-v6-c-button__text {
2863
+ display: revert;
2864
+ }
2865
+
2338
2866
  .pf-v6-c-button__icon {
2339
2867
  margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
2340
2868
  margin-inline-end: var(--pf-v6-c-button__icon--MarginInlineEnd);
@@ -2429,498 +2957,225 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2429
2957
  scale: 1.5;
2430
2958
  }
2431
2959
  }
2432
- .pf-v6-c-label-group {
2433
- --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
2434
- --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
2435
- --pf-v6-c-label-group--MaxWidth: 100%;
2436
- --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
2437
- --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
2438
- --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
2439
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
2440
- --pf-v6-c-label-group__main--MaxWidth: 100%;
2441
- --pf-v6-c-label-group__main--MinWidth: 0;
2442
- --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
2443
- --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
2444
- --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
2445
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
2446
- --pf-v6-c-label-group__list--MaxWidth: 100%;
2447
- --pf-v6-c-label-group__list--MinWidth: 0;
2448
- --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
2449
- --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
2450
- --pf-v6-c-label-group__list-item--MaxWidth: 100%;
2451
- --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
2452
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2453
- --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
2454
- --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2455
- --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
2456
- --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
2457
- --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
2458
- --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2459
- --pf-v6-c-label-group__label--MaxWidth: 18ch;
2460
- --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
2461
- --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
2462
- --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2463
- --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
2464
- --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2465
- --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
2466
- --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
2467
- --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
2468
- --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
2469
- --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
2470
- }
2471
-
2472
- .pf-v6-c-label-group {
2473
- display: inline-flex;
2474
- row-gap: var(--pf-v6-c-label-group--RowGap);
2475
- column-gap: var(--pf-v6-c-label-group--ColumnGap);
2476
- align-items: center;
2477
- max-width: var(--pf-v6-c-label-group--MaxWidth);
2478
- }
2479
-
2480
- .pf-v6-c-label-group.pf-m-category {
2481
- padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
2482
- padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
2483
- padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
2484
- padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
2485
- background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
2486
- border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
2487
- border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
2488
- }
2489
-
2490
- .pf-v6-c-label-group.pf-m-vertical {
2491
- --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
2492
- --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
2493
- --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
2494
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
2495
- --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
2496
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
2497
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
2498
- }
2499
-
2500
- .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
2501
- align-items: flex-start;
2502
- }
2503
-
2504
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
2505
- flex-direction: column;
2506
- align-items: flex-start;
2507
- max-width: var(--pf-v6-c-label-group__list--MaxWidth);
2508
- }
2509
-
2510
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
2511
- flex-direction: column;
2512
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
2513
- }
2514
-
2515
- .pf-v6-c-label-group.pf-m-editable,
2516
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
2517
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
2518
- display: flex;
2519
- }
2520
-
2521
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
2522
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
2523
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
2524
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
2525
- flex: 1;
2526
- }
2527
-
2528
- .pf-v6-c-label-group__main {
2529
- display: flex;
2530
- flex: 1;
2531
- flex-wrap: wrap;
2532
- row-gap: var(--pf-v6-c-label-group__main--RowGap);
2533
- column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
2534
- align-items: baseline;
2535
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
2536
- }
2537
-
2538
- .pf-v6-c-label-group__list {
2539
- display: inline-flex;
2540
- flex-wrap: wrap;
2541
- row-gap: var(--pf-v6-c-label-group__list--RowGap);
2542
- column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
2543
- min-width: var(--pf-v6-c-label-group__list--MinWidth);
2544
- }
2545
-
2546
- .pf-v6-c-label-group__list-item {
2547
- display: inline-flex;
2548
- max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
2549
- }
2550
-
2551
- .pf-v6-c-label-group__label {
2552
- overflow: hidden;
2553
- text-overflow: ellipsis;
2554
- white-space: nowrap;
2555
- max-width: var(--pf-v6-c-label-group__label--MaxWidth);
2556
- }
2557
-
2558
- .pf-v6-c-label-group__close {
2559
- display: flex;
2560
- align-self: flex-start;
2561
- }
2562
-
2563
- .pf-v6-c-label-group__close .pf-v6-c-button {
2564
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
2565
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
2566
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
2567
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
2568
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
2569
- }
2570
-
2571
- .pf-v6-c-label-group__textarea {
2572
- min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
2573
- padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
2574
- padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
2575
- padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
2576
- padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
2577
- white-space: nowrap;
2578
- resize: none;
2579
- border: 0;
2580
- -ms-overflow-style: none;
2581
- scrollbar-width: none;
2582
- }
2583
-
2584
- .pf-v6-c-label-group__textarea::-webkit-scrollbar {
2585
- display: none;
2586
- }
2587
-
2588
- .pf-v6-c-divider {
2589
- --pf-v6-c-divider--Display: flex;
2590
- --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
2591
- --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
2592
- --pf-v6-c-divider--before--FlexBasis: 100%;
2593
- }
2594
-
2595
- .pf-v6-c-divider {
2596
- flex-direction: row;
2597
- width: 100%;
2598
- height: var(--pf-v6-c-divider--Size);
2599
- --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
2600
- --pf-v6-hidden-visible--hidden--Display: none;
2601
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2602
- display: var(--pf-v6-hidden-visible--Display);
2603
- flex-shrink: 0;
2604
- align-items: stretch;
2605
- align-self: stretch;
2606
- justify-content: center;
2607
- border: 0;
2608
- }
2609
-
2610
- .pf-v6-c-divider.pf-m-hidden {
2611
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2612
- }
2613
-
2614
- @media screen and (min-width: 36rem) {
2615
- .pf-v6-c-divider.pf-m-hidden-on-sm {
2616
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2617
- }
2618
- .pf-v6-c-divider.pf-m-visible-on-sm {
2619
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2620
- }
2621
- }
2622
- @media screen and (min-width: 48rem) {
2623
- .pf-v6-c-divider.pf-m-hidden-on-md {
2624
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2625
- }
2626
- .pf-v6-c-divider.pf-m-visible-on-md {
2627
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2628
- }
2629
- }
2630
- @media screen and (min-width: 62rem) {
2631
- .pf-v6-c-divider.pf-m-hidden-on-lg {
2632
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2633
- }
2634
- .pf-v6-c-divider.pf-m-visible-on-lg {
2635
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2636
- }
2637
- }
2638
- @media screen and (min-width: 75rem) {
2639
- .pf-v6-c-divider.pf-m-hidden-on-xl {
2640
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2641
- }
2642
- .pf-v6-c-divider.pf-m-visible-on-xl {
2643
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2644
- }
2645
- }
2646
- @media screen and (min-width: 90.625rem) {
2647
- .pf-v6-c-divider.pf-m-hidden-on-2xl {
2648
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2649
- }
2650
- .pf-v6-c-divider.pf-m-visible-on-2xl {
2651
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2652
- }
2653
- }
2654
- .pf-v6-c-divider::before {
2655
- flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
2656
- content: "";
2657
- background-color: var(--pf-v6-c-divider--Color);
2658
- border-block-start: var(--pf-v6-c-divider--Size) solid transparent;
2659
- border-inline-start: var(--pf-v6-c-divider--Size) solid transparent;
2960
+ .pf-v6-c-badge {
2961
+ --pf-v6-c-badge--BorderColor: transparent;
2962
+ --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
2963
+ --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
2964
+ --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
2965
+ --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
2966
+ --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2967
+ --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2968
+ --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
2969
+ --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
2970
+ --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
2971
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
2972
+ --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
2973
+ --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
2974
+ --pf-v6-c-badge--m-read--BorderColor: var(--pf-t--global--border--color--high-contrast);
2975
+ --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
2976
+ --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
2977
+ --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
2978
+ --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
2979
+ --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
2980
+ --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
2981
+ --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
2660
2982
  }
2661
2983
 
2662
- .pf-v6-c-divider.pf-m-horizontal {
2663
- flex-direction: row;
2664
- width: 100%;
2665
- height: var(--pf-v6-c-divider--Size);
2984
+ .pf-v6-c-badge {
2985
+ position: relative;
2986
+ display: inline-block;
2987
+ min-width: var(--pf-v6-c-badge--MinWidth);
2988
+ padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
2989
+ padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
2990
+ font-size: var(--pf-v6-c-badge--FontSize);
2991
+ font-weight: var(--pf-v6-c-badge--FontWeight);
2992
+ color: var(--pf-v6-c-badge--Color);
2993
+ text-align: center;
2994
+ white-space: nowrap;
2995
+ background-color: var(--pf-v6-c-badge--BackgroundColor);
2996
+ border-radius: var(--pf-v6-c-badge--BorderRadius);
2666
2997
  }
2667
2998
 
2668
- .pf-v6-c-divider.pf-m-vertical {
2669
- flex-direction: column;
2670
- width: var(--pf-v6-c-divider--Size);
2671
- height: inherit;
2999
+ .pf-v6-c-badge::after {
3000
+ position: absolute;
3001
+ inset: 0;
3002
+ pointer-events: none;
3003
+ content: "";
3004
+ border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
3005
+ border-radius: inherit;
2672
3006
  }
2673
3007
 
2674
- .pf-v6-c-divider.pf-m-inset-none {
2675
- --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
3008
+ .pf-v6-c-badge.pf-m-read {
3009
+ --pf-v6-c-badge--BorderColor: var(--pf-v6-c-badge--m-read--BorderColor);
3010
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
3011
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
3012
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
2676
3013
  }
2677
3014
 
2678
- .pf-v6-c-divider.pf-m-inset-xs {
2679
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
3015
+ .pf-v6-c-badge.pf-m-unread {
3016
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
3017
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
3018
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
2680
3019
  }
2681
3020
 
2682
- .pf-v6-c-divider.pf-m-inset-sm {
2683
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
3021
+ .pf-v6-c-badge.pf-m-disabled {
3022
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
3023
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
2684
3024
  }
2685
3025
 
2686
- .pf-v6-c-divider.pf-m-inset-md {
2687
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
3026
+ .pf-v6-c-badge.pf-m-disabled::after {
3027
+ border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
2688
3028
  }
2689
3029
 
2690
- .pf-v6-c-divider.pf-m-inset-lg {
2691
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
3030
+ .pf-v6-c-badge__toggle-icon {
3031
+ margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
3032
+ color: var(--pf-v6-c-badge__toggle-icon--Color);
2692
3033
  }
2693
3034
 
2694
- .pf-v6-c-divider.pf-m-inset-xl {
2695
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
3035
+ .pf-v6-c-breadcrumb {
3036
+ --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
3037
+ --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
3038
+ --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3039
+ --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
3040
+ --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3041
+ --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
3042
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3043
+ --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3044
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
3045
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
3046
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
3047
+ --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
3048
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
3049
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
3050
+ --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
3051
+ --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
3052
+ --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
3053
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3054
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
3055
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3056
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
2696
3057
  }
2697
3058
 
2698
- .pf-v6-c-divider.pf-m-inset-2xl {
2699
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
3059
+ .pf-v6-c-breadcrumb {
3060
+ display: inline-flex;
2700
3061
  }
2701
3062
 
2702
- .pf-v6-c-divider.pf-m-inset-3xl {
2703
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
3063
+ .pf-v6-c-breadcrumb__list {
3064
+ display: flex;
3065
+ flex-wrap: wrap;
3066
+ align-items: center;
2704
3067
  }
2705
3068
 
2706
- @media (min-width: 36rem) {
2707
- .pf-v6-c-divider.pf-m-horizontal-on-sm {
2708
- flex-direction: row;
2709
- width: 100%;
2710
- height: var(--pf-v6-c-divider--Size);
2711
- }
2712
- }
2713
- @media (min-width: 36rem) {
2714
- .pf-v6-c-divider.pf-m-vertical-on-sm {
2715
- flex-direction: column;
2716
- width: var(--pf-v6-c-divider--Size);
2717
- height: inherit;
2718
- }
2719
- }
2720
- @media (min-width: 36rem) {
2721
- .pf-v6-c-divider.pf-m-inset-none-on-sm {
2722
- --pf-v6-c-divider--before--FlexBasis: 100%;
2723
- }
2724
- .pf-v6-c-divider.pf-m-inset-xs-on-sm {
2725
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2726
- }
2727
- .pf-v6-c-divider.pf-m-inset-sm-on-sm {
2728
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2729
- }
2730
- .pf-v6-c-divider.pf-m-inset-md-on-sm {
2731
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2732
- }
2733
- .pf-v6-c-divider.pf-m-inset-lg-on-sm {
2734
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2735
- }
2736
- .pf-v6-c-divider.pf-m-inset-xl-on-sm {
2737
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2738
- }
2739
- .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
2740
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2741
- }
2742
- .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
2743
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2744
- }
2745
- }
2746
- @media (min-width: 48rem) {
2747
- .pf-v6-c-divider.pf-m-horizontal-on-md {
2748
- flex-direction: row;
2749
- width: 100%;
2750
- height: var(--pf-v6-c-divider--Size);
2751
- }
3069
+ .pf-v6-c-breadcrumb__item {
3070
+ display: flex;
3071
+ align-items: baseline;
3072
+ font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
3073
+ font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
3074
+ line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
3075
+ white-space: nowrap;
3076
+ list-style: none;
2752
3077
  }
2753
- @media (min-width: 48rem) {
2754
- .pf-v6-c-divider.pf-m-vertical-on-md {
2755
- flex-direction: column;
2756
- width: var(--pf-v6-c-divider--Size);
2757
- height: inherit;
2758
- }
3078
+
3079
+ .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
3080
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
2759
3081
  }
2760
- @media (min-width: 48rem) {
2761
- .pf-v6-c-divider.pf-m-inset-none-on-md {
2762
- --pf-v6-c-divider--before--FlexBasis: 100%;
2763
- }
2764
- .pf-v6-c-divider.pf-m-inset-xs-on-md {
2765
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2766
- }
2767
- .pf-v6-c-divider.pf-m-inset-sm-on-md {
2768
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2769
- }
2770
- .pf-v6-c-divider.pf-m-inset-md-on-md {
2771
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2772
- }
2773
- .pf-v6-c-divider.pf-m-inset-lg-on-md {
2774
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2775
- }
2776
- .pf-v6-c-divider.pf-m-inset-xl-on-md {
2777
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2778
- }
2779
- .pf-v6-c-divider.pf-m-inset-2xl-on-md {
2780
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2781
- }
2782
- .pf-v6-c-divider.pf-m-inset-3xl-on-md {
2783
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2784
- }
3082
+
3083
+ .pf-v6-c-breadcrumb__item:not(:last-child) {
3084
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
2785
3085
  }
2786
- @media (min-width: 62rem) {
2787
- .pf-v6-c-divider.pf-m-horizontal-on-lg {
2788
- flex-direction: row;
2789
- width: 100%;
2790
- height: var(--pf-v6-c-divider--Size);
2791
- }
3086
+
3087
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
3088
+ scale: -1 1;
2792
3089
  }
2793
- @media (min-width: 62rem) {
2794
- .pf-v6-c-divider.pf-m-vertical-on-lg {
2795
- flex-direction: column;
2796
- width: var(--pf-v6-c-divider--Size);
2797
- height: inherit;
2798
- }
3090
+
3091
+ .pf-v6-c-breadcrumb__item-divider {
3092
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
3093
+ font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
3094
+ line-height: 1;
3095
+ color: var(--pf-v6-c-breadcrumb__item-divider--Color);
2799
3096
  }
2800
- @media (min-width: 62rem) {
2801
- .pf-v6-c-divider.pf-m-inset-none-on-lg {
2802
- --pf-v6-c-divider--before--FlexBasis: 100%;
2803
- }
2804
- .pf-v6-c-divider.pf-m-inset-xs-on-lg {
2805
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2806
- }
2807
- .pf-v6-c-divider.pf-m-inset-sm-on-lg {
2808
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2809
- }
2810
- .pf-v6-c-divider.pf-m-inset-md-on-lg {
2811
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2812
- }
2813
- .pf-v6-c-divider.pf-m-inset-lg-on-lg {
2814
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2815
- }
2816
- .pf-v6-c-divider.pf-m-inset-xl-on-lg {
2817
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2818
- }
2819
- .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
2820
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2821
- }
2822
- .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
2823
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2824
- }
3097
+
3098
+ .pf-v6-c-breadcrumb__link {
3099
+ padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
3100
+ padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
3101
+ font-size: inherit;
3102
+ font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
3103
+ line-height: inherit;
3104
+ color: var(--pf-v6-c-breadcrumb__link--Color);
3105
+ text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
3106
+ text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
3107
+ word-break: break-word;
3108
+ background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
2825
3109
  }
2826
- @media (min-width: 75rem) {
2827
- .pf-v6-c-divider.pf-m-horizontal-on-xl {
2828
- flex-direction: row;
2829
- width: 100%;
2830
- height: var(--pf-v6-c-divider--Size);
2831
- }
3110
+
3111
+ .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
3112
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
3113
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
3114
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
2832
3115
  }
2833
- @media (min-width: 75rem) {
2834
- .pf-v6-c-divider.pf-m-vertical-on-xl {
2835
- flex-direction: column;
2836
- width: var(--pf-v6-c-divider--Size);
2837
- height: inherit;
2838
- }
3116
+
3117
+ .pf-v6-c-breadcrumb__link.pf-m-current {
3118
+ cursor: default;
2839
3119
  }
2840
- @media (min-width: 75rem) {
2841
- .pf-v6-c-divider.pf-m-inset-none-on-xl {
2842
- --pf-v6-c-divider--before--FlexBasis: 100%;
2843
- }
2844
- .pf-v6-c-divider.pf-m-inset-xs-on-xl {
2845
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2846
- }
2847
- .pf-v6-c-divider.pf-m-inset-sm-on-xl {
2848
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2849
- }
2850
- .pf-v6-c-divider.pf-m-inset-md-on-xl {
2851
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2852
- }
2853
- .pf-v6-c-divider.pf-m-inset-lg-on-xl {
2854
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2855
- }
2856
- .pf-v6-c-divider.pf-m-inset-xl-on-xl {
2857
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2858
- }
2859
- .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
2860
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2861
- }
2862
- .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
2863
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2864
- }
3120
+
3121
+ .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
3122
+ color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
3123
+ text-decoration-line: none;
2865
3124
  }
2866
- @media (min-width: 90.625rem) {
2867
- .pf-v6-c-divider.pf-m-horizontal-on-2xl {
2868
- flex-direction: row;
2869
- width: 100%;
2870
- height: var(--pf-v6-c-divider--Size);
2871
- }
3125
+
3126
+ button.pf-v6-c-breadcrumb__link {
3127
+ border: none;
2872
3128
  }
2873
- @media (min-width: 90.625rem) {
2874
- .pf-v6-c-divider.pf-m-vertical-on-2xl {
2875
- flex-direction: column;
2876
- width: var(--pf-v6-c-divider--Size);
2877
- height: inherit;
2878
- }
3129
+
3130
+ .pf-v6-c-breadcrumb__dropdown {
3131
+ margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
3132
+ margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
3133
+ margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
3134
+ margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
2879
3135
  }
2880
- @media (min-width: 90.625rem) {
2881
- .pf-v6-c-divider.pf-m-inset-none-on-2xl {
2882
- --pf-v6-c-divider--before--FlexBasis: 100%;
2883
- }
2884
- .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
2885
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2886
- }
2887
- .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
2888
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2889
- }
2890
- .pf-v6-c-divider.pf-m-inset-md-on-2xl {
2891
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2892
- }
2893
- .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
2894
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2895
- }
2896
- .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
2897
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2898
- }
2899
- .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
2900
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2901
- }
2902
- .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
2903
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2904
- }
3136
+
3137
+ .pf-v6-c-breadcrumb__heading {
3138
+ display: inline;
3139
+ font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
3140
+ }
3141
+
3142
+ .pf-v6-c-breadcrumb__link,
3143
+ .pf-v6-c-breadcrumb__heading {
3144
+ white-space: normal;
3145
+ }
3146
+
3147
+ .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
3148
+ display: none;
2905
3149
  }
3150
+
2906
3151
  .pf-v6-c-menu {
2907
- --pf-v6-c-menu--RowGap: var(--pf-t--global--spacer--sm);
3152
+ --pf-v6-c-menu--RowGap: var(--pf-t--global--spacer--xs);
2908
3153
  --pf-v6-c-menu--Width: auto;
2909
3154
  --pf-v6-c-menu--MinWidth: auto;
2910
- --pf-v6-c-menu--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2911
- --pf-v6-c-menu--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3155
+ --pf-v6-c-menu--PaddingBlockStart: var(--pf-t--global--spacer--xs);
3156
+ --pf-v6-c-menu--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
3157
+ --pf-v6-c-menu--PaddingInlineStart: var(--pf-t--global--spacer--xs);
3158
+ --pf-v6-c-menu--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
2912
3159
  --pf-v6-c-menu--BackgroundColor: var(--pf-t--global--background--color--floating--default);
2913
3160
  --pf-v6-c-menu--BoxShadow: var(--pf-t--global--box-shadow--md);
2914
3161
  --pf-v6-c-menu--Color: var(--pf-t--global--text--color--regular);
2915
3162
  --pf-v6-c-menu--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
2916
3163
  --pf-v6-c-menu--BorderColor: var(--pf-t--global--border--color--high-contrast);
2917
- --pf-v6-c-menu--BorderRadius: var(--pf-t--global--border--radius--small);
3164
+ --pf-v6-c-menu--BorderRadius: calc(var(--pf-v6-c-menu__item--BorderRadius) + var(--pf-v6-c-menu--PaddingBlockStart));
2918
3165
  --pf-v6-c-menu--OutlineOffset: calc(var(--pf-t--global--border--width--control--default) * -3);
2919
3166
  --pf-v6-c-menu--ZIndex: var(--pf-t--global--z-index--sm);
2920
3167
  --pf-v6-c-menu--button--disabled--Color: var(--pf-t--global--text--color--disabled);
2921
3168
  --pf-v6-c-menu--icon--disabled--Color: var(--pf-t--global--icon--color--disabled);
2922
3169
  --pf-v6-c-menu--TransitionDuration: 0s;
2923
3170
  --pf-v6-c-menu--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
3171
+ }
3172
+
3173
+ @media (prefers-reduced-motion: no-preference) {
3174
+ .pf-v6-c-menu {
3175
+ --pf-v6-c-menu--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
3176
+ }
3177
+ }
3178
+ .pf-v6-c-menu {
2924
3179
  --pf-v6-c-menu--m-plain--BoxShadow: none;
2925
3180
  --pf-v6-c-menu__content--RowGap: var(--pf-v6-c-menu--RowGap);
2926
3181
  --pf-v6-c-menu__content--Height: auto;
@@ -2948,12 +3203,13 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2948
3203
  --pf-v6-c-menu__list-item--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
2949
3204
  --pf-v6-c-menu__list-item--m-load__item--Color: var(--pf-t--global--text--color--link--default);
2950
3205
  --pf-v6-c-menu__list-item--has--menu-action--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2951
- --pf-v6-c-menu__list--divider--MarginBlockStart: var(--pf-t--global--spacer--sm);
2952
- --pf-v6-c-menu__list--divider--MarginBlockEnd: var(--pf-t--global--spacer--sm);
3206
+ --pf-v6-c-menu__list--divider--MarginBlockStart: var(--pf-t--global--spacer--xs);
3207
+ --pf-v6-c-menu__list--divider--MarginBlockEnd: var(--pf-t--global--spacer--xs);
3208
+ --pf-v6-c-menu__item--BorderRadius: var(--pf-t--global--border--radius--small);
2953
3209
  --pf-v6-c-menu__item--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2954
3210
  --pf-v6-c-menu__item--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2955
- --pf-v6-c-menu__item--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2956
- --pf-v6-c-menu__item--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
3211
+ --pf-v6-c-menu__item--PaddingInlineStart: var(--pf-t--global--spacer--md);
3212
+ --pf-v6-c-menu__item--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2957
3213
  --pf-v6-c-menu__item--FontSize: var(--pf-t--global--font--size--body--default);
2958
3214
  --pf-v6-c-menu__item--LineHeight: var(--pf-t--global--font--line-height--body);
2959
3215
  --pf-v6-c-menu__item--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -2962,22 +3218,23 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2962
3218
  --pf-v6-c-menu__item--m-disabled--Color: var(--pf-t--global--text--color--disabled);
2963
3219
  --pf-v6-c-menu__header--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2964
3220
  --pf-v6-c-menu__header--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2965
- --pf-v6-c-menu__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2966
- --pf-v6-c-menu__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
3221
+ --pf-v6-c-menu__header--PaddingInlineStart: var(--pf-t--global--spacer--md);
3222
+ --pf-v6-c-menu__header--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2967
3223
  --pf-v6-c-menu__group-title--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2968
3224
  --pf-v6-c-menu__group-title--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2969
- --pf-v6-c-menu__group-title--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2970
- --pf-v6-c-menu__group-title--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
3225
+ --pf-v6-c-menu__group-title--PaddingInlineStart: var(--pf-t--global--spacer--md);
3226
+ --pf-v6-c-menu__group-title--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2971
3227
  --pf-v6-c-menu__breadcrumb--PaddingBlockStart: 0;
2972
3228
  --pf-v6-c-menu__breadcrumb--PaddingBlockEnd: 0;
2973
- --pf-v6-c-menu__breadcrumb--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2974
- --pf-v6-c-menu__breadcrumb--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
3229
+ --pf-v6-c-menu__breadcrumb--PaddingInlineStart: var(--pf-t--global--spacer--md);
3230
+ --pf-v6-c-menu__breadcrumb--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2975
3231
  --pf-v6-c-menu__footer--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2976
3232
  --pf-v6-c-menu__footer--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2977
- --pf-v6-c-menu__footer--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2978
- --pf-v6-c-menu__footer--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
3233
+ --pf-v6-c-menu__footer--PaddingInlineStart: var(--pf-t--global--spacer--md);
3234
+ --pf-v6-c-menu__footer--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2979
3235
  --pf-v6-c-menu__item-main--ColumnGap: var(--pf-t--global--spacer--sm);
2980
- --pf-v6-c-menu__group-title--Color: var(--pf-t--global--text--color--subtle);
3236
+ --pf-v6-c-menu__group-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
3237
+ --pf-v6-c-menu__group-title--Color: var(--pf-t--global--text--color--regular);
2981
3238
  --pf-v6-c-menu__item-description--FontSize: var(--pf-t--global--font--size--body--sm);
2982
3239
  --pf-v6-c-menu__item-description--Color: var(--pf-t--global--text--color--subtle);
2983
3240
  --pf-v6-c-menu__item-action--FontSize: var(--pf-t--global--font--size--body--default);
@@ -3000,34 +3257,38 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
3000
3257
  --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--motion--duration--slide-in--default);
3001
3258
  --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
3002
3259
  --pf-v6-c-menu--m-drilldown__content--Transition: height var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--height);
3003
- --pf-v6-c-menu--m-drilldown--c-menu--InsetBlockStart: 0;
3004
- --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: 0s;
3005
- --pf-v6-c-menu--m-drilldown--c-menu--Transition: transform var(--pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform);
3006
- --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: 0s;
3007
- --pf-v6-c-menu--m-drilldown__list--Transition: transform var(--pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform);
3008
- --pf-v6-c-menu--m-drilled-in--c-menu__list-item--m-current-path--c-menu--ZIndex: var(--pf-t--global--z-index--xs);
3009
3260
  }
3010
3261
 
3011
- @media (prefers-reduced-motion: no-preference) {
3012
- .pf-v6-c-menu {
3013
- --pf-v6-c-menu--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
3014
- }
3015
- }
3016
3262
  @media (prefers-reduced-motion: no-preference) {
3017
3263
  .pf-v6-c-menu {
3018
3264
  --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);
3019
3265
  }
3020
3266
  }
3267
+ .pf-v6-c-menu {
3268
+ --pf-v6-c-menu--m-drilldown--c-menu--InsetBlockStart: 0;
3269
+ --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: 0s;
3270
+ --pf-v6-c-menu--m-drilldown--c-menu--Transition: transform var(--pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform);
3271
+ }
3272
+
3021
3273
  @media (prefers-reduced-motion: no-preference) {
3022
3274
  .pf-v6-c-menu {
3023
3275
  --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
3024
3276
  }
3025
3277
  }
3278
+ .pf-v6-c-menu {
3279
+ --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: 0s;
3280
+ --pf-v6-c-menu--m-drilldown__list--Transition: transform var(--pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform);
3281
+ }
3282
+
3026
3283
  @media (prefers-reduced-motion: no-preference) {
3027
3284
  .pf-v6-c-menu {
3028
3285
  --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
3029
3286
  }
3030
3287
  }
3288
+ .pf-v6-c-menu {
3289
+ --pf-v6-c-menu--m-drilled-in--c-menu__list-item--m-current-path--c-menu--ZIndex: var(--pf-t--global--z-index--xs);
3290
+ }
3291
+
3031
3292
  .pf-v6-c-menu__content,
3032
3293
  .pf-v6-c-menu__list-item,
3033
3294
  .pf-v6-c-menu__item-main,
@@ -3141,6 +3402,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
3141
3402
  min-width: var(--pf-v6-c-menu--MinWidth);
3142
3403
  padding-block-start: var(--pf-v6-c-menu--PaddingBlockStart);
3143
3404
  padding-block-end: var(--pf-v6-c-menu--PaddingBlockEnd);
3405
+ padding-inline-start: var(--pf-v6-c-menu--PaddingInlineStart);
3406
+ padding-inline-end: var(--pf-v6-c-menu--PaddingInlineEnd);
3144
3407
  overflow: hidden;
3145
3408
  color: var(--pf-v6-c-menu--Color);
3146
3409
  background-color: var(--pf-v6-c-menu--BackgroundColor);
@@ -3368,8 +3631,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
3368
3631
  inset: 0;
3369
3632
  content: "";
3370
3633
  background-color: var(--pf-v6-c-menu__list-item--BackgroundColor);
3371
- border-block-start: var(--pf-v6-c-menu__list-item--BorderWidth) solid var(--pf-v6-c-menu__list-item--BorderColor);
3372
- border-block-end: var(--pf-v6-c-menu__list-item--BorderWidth) solid var(--pf-v6-c-menu__list-item--BorderColor);
3634
+ border: var(--pf-v6-c-menu__list-item--BorderWidth) solid var(--pf-v6-c-menu__list-item--BorderColor);
3635
+ border-radius: var(--pf-v6-c-menu__item--BorderRadius);
3373
3636
  transition: inherit;
3374
3637
  }
3375
3638
 
@@ -3427,6 +3690,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
3427
3690
  text-decoration-line: none;
3428
3691
  background-color: var(--pf-v6-c-menu__item--BackgroundColor);
3429
3692
  border: 0;
3693
+ border-radius: var(--pf-v6-c-menu__item--BorderRadius);
3430
3694
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
3431
3695
  --pf-v6-hidden-visible--visible--Display: flex;
3432
3696
  --pf-v6-hidden-visible--hidden--Display: none;
@@ -3532,14 +3796,14 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
3532
3796
  --pf-v6-c-check__input--TranslateY: none;
3533
3797
  }
3534
3798
 
3535
- .pf-v6-c-menu__item-toggle-icon {
3536
- color: var(--pf-v6-c-menu__item-toggle-icon--Color, inherit);
3537
- }
3538
-
3539
3799
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-menu__item-toggle-icon {
3540
3800
  scale: -1 1;
3541
3801
  }
3542
3802
 
3803
+ .pf-v6-c-menu__item-toggle-icon {
3804
+ color: var(--pf-v6-c-menu__item-toggle-icon--Color, inherit);
3805
+ }
3806
+
3543
3807
  .pf-v6-c-menu__item-icon {
3544
3808
  color: var(--pf-v6-c-menu__item--icon--Color, inherit);
3545
3809
  }
@@ -3587,122 +3851,6 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
3587
3851
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
3588
3852
  }
3589
3853
 
3590
- .pf-v6-c-breadcrumb {
3591
- --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
3592
- --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
3593
- --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3594
- --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
3595
- --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3596
- --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
3597
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3598
- --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3599
- --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
3600
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
3601
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
3602
- --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
3603
- --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
3604
- --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
3605
- --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
3606
- --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
3607
- --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
3608
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3609
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
3610
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3611
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
3612
- }
3613
-
3614
- .pf-v6-c-breadcrumb {
3615
- display: inline-flex;
3616
- }
3617
-
3618
- .pf-v6-c-breadcrumb__list {
3619
- display: flex;
3620
- flex-wrap: wrap;
3621
- align-items: center;
3622
- }
3623
-
3624
- .pf-v6-c-breadcrumb__item {
3625
- display: flex;
3626
- align-items: baseline;
3627
- font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
3628
- font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
3629
- line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
3630
- white-space: nowrap;
3631
- list-style: none;
3632
- }
3633
-
3634
- .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
3635
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
3636
- }
3637
-
3638
- .pf-v6-c-breadcrumb__item:not(:last-child) {
3639
- margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
3640
- }
3641
-
3642
- .pf-v6-c-breadcrumb__item-divider {
3643
- margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
3644
- font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
3645
- line-height: 1;
3646
- color: var(--pf-v6-c-breadcrumb__item-divider--Color);
3647
- }
3648
-
3649
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
3650
- scale: -1 1;
3651
- }
3652
-
3653
- .pf-v6-c-breadcrumb__link {
3654
- padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
3655
- padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
3656
- font-size: inherit;
3657
- font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
3658
- line-height: inherit;
3659
- color: var(--pf-v6-c-breadcrumb__link--Color);
3660
- text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
3661
- text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
3662
- word-break: break-word;
3663
- background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
3664
- }
3665
-
3666
- .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
3667
- --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
3668
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
3669
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
3670
- }
3671
-
3672
- .pf-v6-c-breadcrumb__link.pf-m-current {
3673
- cursor: default;
3674
- }
3675
-
3676
- .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
3677
- color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
3678
- text-decoration-line: none;
3679
- }
3680
-
3681
- button.pf-v6-c-breadcrumb__link {
3682
- border: none;
3683
- }
3684
-
3685
- .pf-v6-c-breadcrumb__dropdown {
3686
- margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
3687
- margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
3688
- margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
3689
- margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
3690
- }
3691
-
3692
- .pf-v6-c-breadcrumb__heading {
3693
- display: inline;
3694
- font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
3695
- }
3696
-
3697
- .pf-v6-c-breadcrumb__link,
3698
- .pf-v6-c-breadcrumb__heading {
3699
- white-space: normal;
3700
- }
3701
-
3702
- .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
3703
- display: none;
3704
- }
3705
-
3706
3854
  .pf-v6-c-spinner {
3707
3855
  --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
3708
3856
  --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);