@patternfly/react-templates 6.5.0-prerelease.40 → 6.5.0-prerelease.41

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 (6) hide show
  1. package/CHANGELOG.md +4 -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/umd/assets/{output-CvTgD770.css → output-DjwU-S1R.css} +1661 -1661
  6. package/package.json +3 -3
package/dist/umd/assets/{output-CvTgD770.css → output-DjwU-S1R.css} RENAMED
@@ -3,704 +3,836 @@
3
3
  pointer-events: none;
4
4
  }
5
5
 
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%);
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: initial;
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--control--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;
21
155
  }
22
156
 
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);
157
+ .pf-v6-c-menu-toggle {
158
+ 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, revert);
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);
174
+ 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);
28
178
  }
29
179
 
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);
180
+ .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
181
+ border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
34
182
  }
35
183
 
36
- .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
37
- align-self: center;
38
- transform: none;
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;
39
195
  }
40
196
 
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));
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);
46
215
  }
47
216
 
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);
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);
53
235
  }
54
236
 
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);
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%;
59
243
  }
60
244
 
61
- .pf-v6-c-check__body {
62
- grid-column: 2;
245
+ .pf-v6-c-menu-toggle.pf-m-full-width {
246
+ width: 100%;
63
247
  }
64
248
 
65
- .pf-v6-c-check__label,
66
- .pf-v6-c-check__input {
67
- justify-self: start;
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);
68
266
  }
69
267
 
70
- label.pf-v6-c-check, .pf-v6-c-check__label,
71
- .pf-v6-c-check__input {
72
- cursor: pointer;
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);
73
270
  }
74
271
 
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;
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);
80
275
  }
81
276
 
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);
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);
86
288
  }
87
289
 
88
- .pf-v6-c-badge {
89
- --pf-v6-c-badge--BorderColor: transparent;
90
- --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
91
- --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
92
- --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
93
- --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
94
- --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
95
- --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
96
- --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
97
- --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
98
- --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
99
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
100
- --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
101
- --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
102
- --pf-v6-c-badge--m-read--BorderColor: var(--pf-t--global--border--color--high-contrast);
103
- --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
104
- --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
105
- --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
106
- --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
107
- --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
108
- --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
109
- --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
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);
110
297
  }
111
298
 
112
- .pf-v6-c-badge {
113
- position: relative;
114
- display: inline-block;
115
- min-width: var(--pf-v6-c-badge--MinWidth);
116
- padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
117
- padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
118
- font-size: var(--pf-v6-c-badge--FontSize);
119
- font-weight: var(--pf-v6-c-badge--FontWeight);
120
- color: var(--pf-v6-c-badge--Color);
121
- text-align: center;
122
- white-space: nowrap;
123
- background-color: var(--pf-v6-c-badge--BackgroundColor);
124
- border-radius: var(--pf-v6-c-badge--BorderRadius);
299
+ .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
300
+ border: 0;
125
301
  }
126
302
 
127
- .pf-v6-c-badge::after {
128
- position: absolute;
129
- inset: 0;
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);
312
+ }
313
+
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);
317
+ }
318
+
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);
322
+ }
323
+
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);
327
+ }
328
+
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
+ }
337
+ }
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);
342
+ }
343
+
344
+ @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
345
+ from {
346
+ opacity: 0;
347
+ }
348
+ to {
349
+ opacity: 1;
350
+ }
351
+ }
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);
360
+ }
361
+
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);
364
+ }
365
+
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);
372
+ }
373
+
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 {
130
376
  pointer-events: none;
131
- content: "";
132
- border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
133
- border-radius: inherit;
134
377
  }
135
378
 
136
- .pf-v6-c-badge.pf-m-read {
137
- --pf-v6-c-badge--BorderColor: var(--pf-v6-c-badge--m-read--BorderColor);
138
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
139
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
140
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
379
+ .pf-v6-c-menu-toggle.pf-m-dock {
380
+ justify-content: flex-start;
381
+ width: 100%;
141
382
  }
142
383
 
143
- .pf-v6-c-badge.pf-m-unread {
144
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
145
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
146
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
384
+ @media (min-width: 62rem) {
385
+ .pf-v6-c-menu-toggle.pf-m-dock {
386
+ justify-content: center;
387
+ width: auto;
388
+ }
389
+ .pf-v6-c-menu-toggle.pf-m-dock .pf-v6-c-menu-toggle__text,
390
+ .pf-v6-c-menu-toggle.pf-m-dock .pf-v6-c-menu-toggle__controls {
391
+ display: none;
392
+ }
393
+ }
394
+ .pf-v6-c-page__dock.pf-m-text-expanded .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle.pf-m-text-expanded {
395
+ justify-content: flex-start;
396
+ width: 100%;
147
397
  }
148
398
 
149
- .pf-v6-c-badge.pf-m-disabled {
150
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
151
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
399
+ .pf-v6-c-page__dock.pf-m-text-expanded .pf-v6-c-menu-toggle .pf-v6-c-menu-toggle__text,
400
+ .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,
401
+ .pf-v6-c-menu-toggle.pf-m-text-expanded .pf-v6-c-menu-toggle__controls {
402
+ display: revert;
152
403
  }
153
404
 
154
- .pf-v6-c-badge.pf-m-disabled::after {
155
- border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
405
+ @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
406
+ syntax: "<length>";
407
+ inherits: false;
408
+ initial-value: 0;
409
+ }
410
+ @media (prefers-reduced-motion: no-preference) {
411
+ @keyframes pf-v6-c-menu-toggle-m-danger-motion {
412
+ 33% {
413
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
414
+ }
415
+ 66% {
416
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
417
+ }
418
+ }
419
+ }
420
+ .pf-v6-c-menu-toggle.pf-m-split-button {
421
+ --pf-v6-c-menu-toggle--Gap: 0;
422
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
423
+ padding: 0;
156
424
  }
157
425
 
158
- .pf-v6-c-badge__toggle-icon {
159
- margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
160
- color: var(--pf-v6-c-badge__toggle-icon--Color);
426
+ .pf-v6-c-menu-toggle.pf-m-split-button > * {
427
+ position: relative;
428
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
429
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
430
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
431
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
161
432
  }
162
433
 
163
- .pf-v6-c-label {
164
- --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
165
- --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
166
- --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
167
- --pf-v6-c-label--PaddingInlineStart: var(--pf-t--global--spacer--sm);
168
- --pf-v6-c-label--MaxWidth: 100%;
169
- --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)));
170
- --pf-v6-c-label--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
171
- --pf-v6-c-label--BorderColor: var(--pf-t--global--border--color--high-contrast);
172
- --pf-v6-c-label--BorderRadius: var(--pf-t--global--border--radius--pill);
173
- --pf-v6-c-label--FontSize: var(--pf-t--global--font--size--body--sm);
174
- --pf-v6-c-label--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
175
- --pf-v6-c-label--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
176
- --pf-v6-c-label--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
177
- --pf-v6-c-label__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
178
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--hover);
179
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-gray--hover);
180
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--hover);
181
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--default);
182
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--hover);
183
- --pf-v6-c-label--m-blue--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--default);
184
- --pf-v6-c-label--m-blue--Color: var(--pf-t--global--text--color--nonstatus--on-blue--default);
185
- --pf-v6-c-label--m-blue__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--default);
186
- --pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--hover);
187
- --pf-v6-c-label--m-blue--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-blue--hover);
188
- --pf-v6-c-label--m-blue--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--hover);
189
- --pf-v6-c-label--m-blue--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--default);
190
- --pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--hover);
191
- --pf-v6-c-label--m-red--BackgroundColor: var(--pf-t--global--color--nonstatus--red--default);
192
- --pf-v6-c-label--m-red--Color: var(--pf-t--global--text--color--nonstatus--on-red--default);
193
- --pf-v6-c-label--m-red__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--default);
194
- --pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--red--hover);
195
- --pf-v6-c-label--m-red--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-red--hover);
196
- --pf-v6-c-label--m-red--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--hover);
197
- --pf-v6-c-label--m-red--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--red--default);
198
- --pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--red--hover);
199
- --pf-v6-c-label--m-orange--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--default);
200
- --pf-v6-c-label--m-orange--Color: var(--pf-t--global--text--color--nonstatus--on-orange--default);
201
- --pf-v6-c-label--m-orange__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--default);
202
- --pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--hover);
203
- --pf-v6-c-label--m-orange--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orange--hover);
204
- --pf-v6-c-label--m-orange--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--hover);
205
- --pf-v6-c-label--m-orange--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--default);
206
- --pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--hover);
207
- --pf-v6-c-label--m-orangered--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--default);
208
- --pf-v6-c-label--m-orangered--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--default);
209
- --pf-v6-c-label--m-orangered__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--default);
210
- --pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--hover);
211
- --pf-v6-c-label--m-orangered--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--hover);
212
- --pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--hover);
213
- --pf-v6-c-label--m-orangered--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--default);
214
- --pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--hover);
215
- --pf-v6-c-label--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
216
- --pf-v6-c-label--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
217
- --pf-v6-c-label--m-yellow__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--default);
218
- --pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--hover);
219
- --pf-v6-c-label--m-yellow--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--hover);
220
- --pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--hover);
221
- --pf-v6-c-label--m-yellow--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--default);
222
- --pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--hover);
223
- --pf-v6-c-label--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
224
- --pf-v6-c-label--m-green--Color: var(--pf-t--global--text--color--nonstatus--on-green--default);
225
- --pf-v6-c-label--m-green__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--default);
226
- --pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--green--hover);
227
- --pf-v6-c-label--m-green--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-green--hover);
228
- --pf-v6-c-label--m-green--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--hover);
229
- --pf-v6-c-label--m-green--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--green--default);
230
- --pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--green--hover);
231
- --pf-v6-c-label--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
232
- --pf-v6-c-label--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
233
- --pf-v6-c-label--m-teal__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--default);
234
- --pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--hover);
235
- --pf-v6-c-label--m-teal--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-teal--hover);
236
- --pf-v6-c-label--m-teal--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--hover);
237
- --pf-v6-c-label--m-teal--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--default);
238
- --pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--hover);
239
- --pf-v6-c-label--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
240
- --pf-v6-c-label--m-purple--Color: var(--pf-t--global--text--color--nonstatus--on-purple--default);
241
- --pf-v6-c-label--m-purple__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--default);
242
- --pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--hover);
243
- --pf-v6-c-label--m-purple--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-purple--hover);
244
- --pf-v6-c-label--m-purple--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--hover);
245
- --pf-v6-c-label--m-purple--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--default);
246
- --pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--hover);
247
- --pf-v6-c-label--m-success--BackgroundColor: var(--pf-t--global--color--status--success--default);
248
- --pf-v6-c-label--m-success--Color: var(--pf-t--global--text--color--status--on-success--default);
249
- --pf-v6-c-label--m-success__icon--Color: var(--pf-t--global--icon--color--status--on-success--default);
250
- --pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--success--hover);
251
- --pf-v6-c-label--m-success--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-success--hover);
252
- --pf-v6-c-label--m-success--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-success--hover);
253
- --pf-v6-c-label--m-success--m-outline__icon--Color: var(--pf-t--global--icon--color--status--success--default);
254
- --pf-v6-c-label--m-success--m-outline--BorderColor: var(--pf-t--global--border--color--status--success--default);
255
- --pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--success--hover);
256
- --pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--success--hover);
257
- --pf-v6-c-label--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
258
- --pf-v6-c-label--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
259
- --pf-v6-c-label--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
260
- --pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--warning--hover);
261
- --pf-v6-c-label--m-warning--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-warning--hover);
262
- --pf-v6-c-label--m-warning--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-warning--hover);
263
- --pf-v6-c-label--m-warning--m-outline__icon--Color: var(--pf-t--global--icon--color--status--warning--default);
264
- --pf-v6-c-label--m-warning--m-outline--BorderColor: var(--pf-t--global--border--color--status--warning--default);
265
- --pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
266
- --pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--warning--hover);
267
- --pf-v6-c-label--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
268
- --pf-v6-c-label--m-danger--Color: var(--pf-t--global--text--color--status--on-danger--default);
269
- --pf-v6-c-label--m-danger__icon--Color: var(--pf-t--global--icon--color--status--on-danger--default);
270
- --pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--danger--hover);
271
- --pf-v6-c-label--m-danger--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-danger--hover);
272
- --pf-v6-c-label--m-danger--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-danger--hover);
273
- --pf-v6-c-label--m-danger--m-outline__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
274
- --pf-v6-c-label--m-danger--m-outline--BorderColor: var(--pf-t--global--border--color--status--danger--default);
275
- --pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
276
- --pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
277
- --pf-v6-c-label--m-info--BackgroundColor: var(--pf-t--global--color--status--info--default);
278
- --pf-v6-c-label--m-info--Color: var(--pf-t--global--text--color--status--on-info--default);
279
- --pf-v6-c-label--m-info__icon--Color: var(--pf-t--global--icon--color--status--on-info--default);
280
- --pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--info--hover);
281
- --pf-v6-c-label--m-info--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-info--hover);
282
- --pf-v6-c-label--m-info--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-info--hover);
283
- --pf-v6-c-label--m-info--m-outline__icon--Color: var(--pf-t--global--icon--color--status--info--default);
284
- --pf-v6-c-label--m-info--m-outline--BorderColor: var(--pf-t--global--border--color--status--info--default);
285
- --pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--info--hover);
286
- --pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--info--hover);
287
- --pf-v6-c-label--m-custom--BackgroundColor: var(--pf-t--global--color--status--custom--default);
288
- --pf-v6-c-label--m-custom--Color: var(--pf-t--global--text--color--status--on-custom--default);
289
- --pf-v6-c-label--m-custom__icon--Color: var(--pf-t--global--icon--color--status--on-custom--default);
290
- --pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--custom--hover);
291
- --pf-v6-c-label--m-custom--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-custom--hover);
292
- --pf-v6-c-label--m-custom--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-custom--hover);
293
- --pf-v6-c-label--m-custom--m-outline__icon--Color: var(--pf-t--global--icon--color--status--custom--default);
294
- --pf-v6-c-label--m-custom--m-outline--BorderColor: var(--pf-t--global--border--color--status--custom--default);
295
- --pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--custom--hover);
296
- --pf-v6-c-label--m-custom--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--custom--hover);
297
- --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
298
- --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
299
- --pf-v6-c-label--m-clickable__content--Cursor: pointer;
300
- --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label__icon--Color);
301
- --pf-v6-c-label--m-outline--BorderWidth: var(--pf-t--global--border--width--action--default);
302
- --pf-v6-c-label--m-outline--BackgroundColor: transparent;
303
- --pf-v6-c-label--m-outline--Color: var(--pf-t--global--text--color--regular);
304
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-t--global--icon--color--regular);
305
- --pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor: transparent;
306
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
307
- --pf-v6-c-label--m-outline--m-clickable--hover--Color: var(--pf-t--global--text--color--regular);
308
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--regular);
309
- --pf-v6-c-label--m-overflow--Color: var(--pf-t--global--text--color--brand--default);
310
- --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
311
- --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
312
- --pf-v6-c-label--m-overflow--hover--Color: var(--pf-t--global--text--color--brand--hover);
313
- --pf-v6-c-label--m-overflow--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
314
- --pf-v6-c-label--m-overflow--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
315
- --pf-v6-c-label--m-add--Color: var(--pf-t--global--text--color--brand--default);
316
- --pf-v6-c-label--m-add--BackgroundColor: transparent;
317
- --pf-v6-c-label--m-add--BorderColor: var(--pf-t--global--border--color--default);
318
- --pf-v6-c-label--m-add--BorderWidth: var(--pf-t--global--border--width--action--default);
319
- --pf-v6-c-label--m-add--hover--Color: var(--pf-t--global--text--color--brand--hover);
320
- --pf-v6-c-label--m-add--hover--BackgroundColor: transparent;
321
- --pf-v6-c-label--m-add--hover--BorderColor: var(--pf-t--global--border--color--hover);
322
- --pf-v6-c-label--m-add--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
323
- --pf-v6-c-label--m-compact--PaddingBlockStart: 0;
324
- --pf-v6-c-label--m-compact--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
325
- --pf-v6-c-label--m-compact--PaddingBlockEnd: 0;
326
- --pf-v6-c-label--m-compact--PaddingInlineStart: var(--pf-t--global--spacer--sm);
327
- --pf-v6-c-label--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
328
- --pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset: 0.0625rem;
329
- --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)));
330
- --pf-v6-c-label__content--MaxWidth: 100%;
331
- --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
332
- --pf-v6-c-label__content--Cursor: initial;
333
- --pf-v6-c-label__icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
334
- --pf-v6-c-label__text--MaxWidth: 100%;
335
- --pf-v6-c-label__actions--MarginInlineEnd: 0;
336
- --pf-v6-c-label__actions--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
337
- --pf-v6-c-label__actions--c-button--OutlineOffset: -0.1875rem;
338
- --pf-v6-c-label__actions--c-button--MarginBlockStart: 0;
339
- --pf-v6-c-label__actions--c-button--MarginBlockEnd: 0;
340
- --pf-v6-c-label__actions--c-button--PaddingBlockStart: 0;
341
- --pf-v6-c-label__actions--c-button--PaddingInlineEnd: 0;
342
- --pf-v6-c-label__actions--c-button--PaddingBlockEnd: 0;
343
- --pf-v6-c-label__actions--c-button--PaddingInlineStart: 0;
344
- --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--default);
345
- --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--default);
346
- --pf-v6-c-label--m-editable--hover--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--hover);
347
- --pf-v6-c-label--m-editable--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--hover);
348
- --pf-v6-c-label--m-editable--TextUnderlineOffset: 0.25rem;
349
- --pf-v6-c-label--m-editable__content--MaxWidth: 16ch;
350
- --pf-v6-c-label--m-editable__content--Cursor: pointer;
351
- --pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine: none;
352
- --pf-v6-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
353
- --pf-v6-c-label--m-editable--m-editable-active--Color: var(--pf-t--global--text--color--regular);
354
- --pf-v6-c-label--m-editable--m-editable-active__content--Cursor: initial;
355
- --pf-v6-c-label--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
356
- --pf-v6-c-label--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
357
- --pf-v6-c-label--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
358
- --pf-v6-c-label--m-disabled--c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
434
+ .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
435
+ border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
436
+ border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
359
437
  }
360
438
 
361
- .pf-v6-c-label {
362
- position: relative;
363
- gap: var(--pf-v6-c-label--Gap);
364
- min-width: var(--pf-v6-c-label--MinWidth);
365
- max-width: var(--pf-v6-c-label--MaxWidth);
366
- padding-block-start: var(--pf-v6-c-label--PaddingBlockStart);
367
- padding-block-end: var(--pf-v6-c-label--PaddingBlockEnd);
368
- padding-inline-start: var(--pf-v6-c-label--PaddingInlineStart);
369
- padding-inline-end: var(--pf-v6-c-label--PaddingInlineEnd);
370
- font-size: var(--pf-v6-c-label--FontSize);
371
- white-space: nowrap;
372
- background: transparent;
373
- isolation: isolate;
374
- border: 0;
375
- border-radius: var(--pf-v6-c-label--BorderRadius);
439
+ .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
440
+ border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
441
+ border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
376
442
  }
377
443
 
378
- .pf-v6-c-label.pf-m-blue {
379
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-blue--BackgroundColor);
380
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-blue--Color);
381
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-blue__icon--Color);
382
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor);
383
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover--Color);
384
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover__icon--Color);
385
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--BorderColor);
386
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor);
444
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
445
+ --pf-v6-c-check__label--Color: currentcolor;
446
+ --pf-v6-c-check__label--disabled--Color: currentcolor;
447
+ align-items: center;
448
+ align-self: stretch;
387
449
  }
388
450
 
389
- .pf-v6-c-label.pf-m-red {
390
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-red--BackgroundColor);
391
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-red--Color);
392
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-red__icon--Color);
393
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor);
394
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-red--m-clickable--hover--Color);
395
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-red--m-clickable--hover__icon--Color);
396
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-red--m-outline--BorderColor);
397
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor);
451
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
452
+ --pf-v6-c-check__input--TranslateY: 0;
453
+ align-self: center;
398
454
  }
399
455
 
400
- .pf-v6-c-label.pf-m-orange {
401
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orange--BackgroundColor);
402
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orange--Color);
403
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orange__icon--Color);
404
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor);
405
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover--Color);
406
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover__icon--Color);
407
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--BorderColor);
408
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor);
456
+ .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
457
+ 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);
409
458
  }
410
459
 
411
- .pf-v6-c-label.pf-m-orangered {
412
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orangered--BackgroundColor);
413
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orangered--Color);
414
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orangered__icon--Color);
415
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor);
416
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover--Color);
417
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color);
418
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--BorderColor);
419
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor);
460
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
461
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
420
462
  }
421
463
 
422
- .pf-v6-c-label.pf-m-yellow {
423
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-yellow--BackgroundColor);
424
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-yellow--Color);
425
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-yellow__icon--Color);
426
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor);
427
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover--Color);
428
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color);
429
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--BorderColor);
430
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor);
431
- }
432
-
433
- .pf-v6-c-label.pf-m-green {
434
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-green--BackgroundColor);
435
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-green--Color);
436
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-green__icon--Color);
437
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor);
438
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-green--m-clickable--hover--Color);
439
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-green--m-clickable--hover__icon--Color);
440
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-green--m-outline--BorderColor);
441
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor);
464
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
465
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
466
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
442
467
  }
443
468
 
444
- .pf-v6-c-label.pf-m-teal {
445
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-teal--BackgroundColor);
446
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-teal--Color);
447
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-teal__icon--Color);
448
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor);
449
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover--Color);
450
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover__icon--Color);
451
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--BorderColor);
452
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor);
469
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
470
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
471
+ --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);
453
472
  }
454
473
 
455
- .pf-v6-c-label.pf-m-purple {
456
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-purple--BackgroundColor);
457
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-purple--Color);
458
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-purple__icon--Color);
459
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor);
460
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover--Color);
461
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover__icon--Color);
462
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--BorderColor);
463
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor);
474
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
475
+ --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);
464
476
  }
465
477
 
466
- .pf-v6-c-label.pf-m-success {
467
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-success--BackgroundColor);
468
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-success--Color);
469
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-success__icon--Color);
470
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor);
471
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-success--m-clickable--hover--Color);
472
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-clickable--hover__icon--Color);
473
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-success--m-outline__icon--Color);
474
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-success--m-outline--BorderColor);
475
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor);
476
- --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);
478
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
479
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
477
480
  }
478
481
 
479
- .pf-v6-c-label.pf-m-warning {
480
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-warning--BackgroundColor);
481
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-warning--Color);
482
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-warning__icon--Color);
483
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor);
484
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover--Color);
485
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover__icon--Color);
486
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-warning--m-outline__icon--Color);
487
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--BorderColor);
488
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor);
489
- --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);
482
+ .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,
483
+ .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,
484
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
485
+ padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
490
486
  }
491
487
 
492
- .pf-v6-c-label.pf-m-danger {
493
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-danger--BackgroundColor);
494
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-danger--Color);
495
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-danger__icon--Color);
496
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor);
497
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover--Color);
498
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover__icon--Color);
499
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-danger--m-outline__icon--Color);
500
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--BorderColor);
501
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor);
502
- --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);
488
+ .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,
489
+ .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,
490
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
491
+ padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
503
492
  }
504
493
 
505
- .pf-v6-c-label.pf-m-info {
506
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-info--BackgroundColor);
507
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-info--Color);
508
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-info__icon--Color);
509
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor);
510
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-info--m-clickable--hover--Color);
511
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-clickable--hover__icon--Color);
512
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-info--m-outline__icon--Color);
513
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-info--m-outline--BorderColor);
514
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor);
515
- --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);
494
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
495
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
516
496
  }
517
497
 
518
- .pf-v6-c-label.pf-m-custom {
519
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-custom--BackgroundColor);
520
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-custom--Color);
521
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-custom__icon--Color);
522
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor);
523
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover--Color);
524
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover__icon--Color);
525
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-custom--m-outline__icon--Color);
526
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--BorderColor);
527
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor);
528
- --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);
498
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
499
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
500
+ color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
501
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
529
502
  }
530
503
 
531
- .pf-v6-c-label.pf-m-compact {
532
- --pf-v6-c-label--PaddingBlockStart: var(--pf-v6-c-label--m-compact--PaddingBlockStart);
533
- --pf-v6-c-label--PaddingInlineEnd: var(--pf-v6-c-label--m-compact--PaddingInlineEnd);
534
- --pf-v6-c-label--PaddingBlockEnd: var(--pf-v6-c-label--m-compact--PaddingBlockEnd);
535
- --pf-v6-c-label--PaddingInlineStart: var(--pf-v6-c-label--m-compact--PaddingInlineStart);
536
- --pf-v6-c-label--FontSize: var(--pf-v6-c-label--m-compact--FontSize);
537
- --pf-v6-c-label--MinWidth: var(--pf-v6-c-label--m-compact--MinWidth);
538
- --pf-v6-c-label--m-editable--TextUnderlineOffset: var(--pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset);
504
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
505
+ content: none;
539
506
  }
540
507
 
541
- .pf-v6-c-label.pf-m-filled .pf-v6-c-label__actions .pf-v6-c-button {
542
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-label--m-filled__actions--c-button__icon--Color);
508
+ .pf-v6-c-menu-toggle.pf-m-typeahead {
509
+ --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
510
+ --pf-v6-c-menu-toggle--Gap: 0;
511
+ align-items: stretch;
512
+ padding: 0;
543
513
  }
544
514
 
545
- .pf-v6-c-label.pf-m-outline {
546
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-outline--Color);
547
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-outline--BorderWidth);
548
- --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-outline--BorderColor);
549
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-outline--BackgroundColor);
550
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-outline__icon--Color);
551
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor);
552
- --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
553
- --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
554
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover--Color);
555
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover__icon--Color);
515
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
516
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
556
517
  }
557
518
 
558
- .pf-v6-c-label.pf-m-editable {
559
- --pf-v6-c-label__content--MaxWidth: var(--pf-v6-c-label--m-editable__content--MaxWidth);
560
- --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable__content--Cursor);
519
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
520
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
521
+ display: flex;
522
+ align-items: stretch;
561
523
  }
562
524
 
563
- .pf-v6-c-label.pf-m-editable .pf-v6-c-label__content:is(:hover, :focus) {
564
- --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--hover--TextDecorationLine);
565
- --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-v6-c-label--m-editable--hover--TextDecorationStyle);
525
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
526
+ --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
527
+ flex: 1;
566
528
  }
567
529
 
568
- .pf-v6-c-label.pf-m-editable .pf-v6-c-label__text {
569
- text-decoration-line: var(--pf-v6-c-label--m-editable--TextDecorationLine);
570
- text-decoration-style: var(--pf-v6-c-label--m-editable--TextDecorationStyle);
571
- text-underline-offset: var(--pf-v6-c-label--m-editable--TextUnderlineOffset);
530
+ .pf-v6-c-menu-toggle__button {
531
+ gap: var(--pf-v6-c-menu-toggle__button--Gap);
532
+ align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
533
+ min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
534
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
535
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
536
+ color: inherit;
537
+ background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
538
+ border: 0;
572
539
  }
573
540
 
574
- .pf-v6-c-label.pf-m-editable-active {
575
- --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine);
576
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-editable--m-editable-active--BackgroundColor);
577
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-editable--m-editable-active--Color);
578
- --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable--m-editable-active__content--Cursor);
541
+ .pf-v6-c-menu-toggle__button.pf-m-text {
542
+ display: inline-flex;
543
+ align-items: baseline;
579
544
  }
580
545
 
581
- .pf-v6-c-label.pf-m-overflow {
582
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-overflow--Color);
583
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-overflow--BackgroundColor);
584
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-overflow--BorderWidth);
546
+ .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) {
547
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
548
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
585
549
  }
586
550
 
587
- .pf-v6-c-label.pf-m-overflow:is(:hover, :focus) {
588
- --pf-v6-c-label--m-overflow--Color: var(--pf-v6-c-label--m-overflow--hover--Color);
589
- --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-v6-c-label--m-overflow--hover--BackgroundColor);
590
- --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-v6-c-label--m-overflow--hover--BorderWidth);
551
+ .pf-v6-c-menu-toggle__text {
552
+ overflow: hidden;
553
+ text-overflow: ellipsis;
554
+ white-space: nowrap;
555
+ min-width: 0;
591
556
  }
592
557
 
593
- .pf-v6-c-label.pf-m-add {
594
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-add--Color);
595
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-add--BackgroundColor);
596
- --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-add--BorderColor);
597
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-add--BorderWidth);
558
+ .pf-v6-c-menu-toggle__count {
559
+ display: flex;
560
+ flex-wrap: nowrap;
598
561
  }
599
562
 
600
- .pf-v6-c-label.pf-m-add:is(:hover, :focus) {
601
- --pf-v6-c-label--m-add--Color: var(--pf-v6-c-label--m-add--hover--Color);
602
- --pf-v6-c-label--m-add--BackgroundColor: var(--pf-v6-c-label--m-add--hover--BackgroundColor);
603
- --pf-v6-c-label--m-add--BorderColor: var(--pf-v6-c-label--m-add--hover--BorderColor);
604
- --pf-v6-c-label--m-add--BorderWidth: var(--pf-v6-c-label--m-add--hover--BorderWidth);
563
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
564
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
565
+ .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 {
566
+ margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
567
+ margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
605
568
  }
606
569
 
607
- .pf-v6-c-label.pf-m-clickable {
608
- --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-clickable__content--Cursor);
570
+ .pf-v6-c-menu-toggle__icon {
571
+ flex-shrink: 0;
572
+ min-width: 1lh;
573
+ transition-delay: var(--pf-v6-c-menu-toggle__icon--TransitionDelay);
574
+ transition-duration: var(--pf-v6-c-menu-toggle__icon--TransitionDuration);
575
+ transition-property: var(--pf-v6-c-menu-toggle__icon--TransitionProperty);
576
+ rotate: var(--pf-v6-c-menu-toggle__icon--Rotate);
609
577
  }
610
578
 
611
- .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) {
612
- text-decoration-line: none;
579
+ .pf-v6-c-menu-toggle__icon :where(picture, img) {
580
+ vertical-align: middle;
613
581
  }
614
582
 
615
- .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
616
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-clickable--hover--Color);
617
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
618
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-clickable--hover--BackgroundColor);
619
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-clickable--hover--BorderWidth);
620
- --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-clickable--hover--BorderColor);
621
- --pf-v6-c-label--m-outline--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
622
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
583
+ .pf-v6-c-menu-toggle__controls {
584
+ display: flex;
585
+ gap: var(--pf-v6-c-menu-toggle__controls--Gap);
586
+ align-items: center;
587
+ justify-content: center;
588
+ margin-inline-start: auto;
623
589
  }
624
590
 
625
- .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) ~ .pf-v6-c-label__actions .pf-v6-c-button {
626
- --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
591
+ .pf-v6-c-menu-toggle__toggle-icon {
592
+ min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
593
+ color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
627
594
  }
628
595
 
629
- .pf-v6-c-label.pf-m-disabled {
630
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-disabled--BackgroundColor);
631
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-disabled--Color);
632
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-disabled__icon--Color);
633
- --pf-v6-c-label--BorderWidth: 0;
634
- pointer-events: none;
596
+ .pf-v6-c-menu-toggle__status-icon {
597
+ color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
635
598
  }
636
599
 
637
- .pf-v6-c-label.pf-m-disabled .pf-v6-c-button {
638
- --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-v6-c-label--m-disabled--c-button--disabled__icon--Color);
600
+ .pf-v6-c-check {
601
+ --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
602
+ --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
603
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
604
+ --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
605
+ --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
606
+ --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
607
+ --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
608
+ --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
609
+ --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
610
+ --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
611
+ --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
612
+ --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
613
+ --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
614
+ --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
639
615
  }
640
616
 
641
- .pf-v6-c-label,
642
- .pf-v6-c-label__content {
617
+ .pf-v6-c-check {
618
+ display: grid;
619
+ grid-template-columns: auto 1fr;
620
+ grid-gap: var(--pf-v6-c-check--GridGap);
621
+ accent-color: var(--pf-v6-c-check--AccentColor);
622
+ }
623
+
624
+ .pf-v6-c-check.pf-m-standalone {
625
+ display: inline-grid;
626
+ grid-template-columns: auto;
627
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
628
+ }
629
+
630
+ .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
631
+ align-self: center;
632
+ transform: none;
633
+ }
634
+
635
+ .pf-v6-c-check__input {
636
+ align-self: start;
637
+ font-size: var(--pf-v6-c-check__label--FontSize);
638
+ line-height: var(--pf-v6-c-check__label--LineHeight);
639
+ transform: translateY(var(--pf-v6-c-check__input--TranslateY));
640
+ }
641
+
642
+ .pf-v6-c-check__label {
643
+ font-size: var(--pf-v6-c-check__label--FontSize);
644
+ font-weight: var(--pf-v6-c-check__label--FontWeight);
645
+ line-height: var(--pf-v6-c-check__label--LineHeight);
646
+ color: var(--pf-v6-c-check__label--Color);
647
+ }
648
+
649
+ .pf-v6-c-check__description {
650
+ grid-column: 2;
651
+ font-size: var(--pf-v6-c-check__description--FontSize);
652
+ color: var(--pf-v6-c-check__description--Color);
653
+ }
654
+
655
+ .pf-v6-c-check__body {
656
+ grid-column: 2;
657
+ }
658
+
659
+ .pf-v6-c-check__label,
660
+ .pf-v6-c-check__input {
661
+ justify-self: start;
662
+ }
663
+
664
+ label.pf-v6-c-check, .pf-v6-c-check__label,
665
+ .pf-v6-c-check__input {
666
+ cursor: pointer;
667
+ }
668
+
669
+ .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
670
+ .pf-v6-c-check__input:disabled,
671
+ .pf-v6-c-check__input.pf-m-disabled {
672
+ --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
673
+ cursor: not-allowed;
674
+ }
675
+
676
+ .pf-v6-c-check__label-required {
677
+ margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
678
+ font-size: var(--pf-v6-c-check__label-required--FontSize);
679
+ color: var(--pf-v6-c-check__label-required--Color);
680
+ }
681
+
682
+ .pf-v6-c-label-group {
683
+ --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
684
+ --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
685
+ --pf-v6-c-label-group--MaxWidth: 100%;
686
+ --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
687
+ --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
688
+ --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
689
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
690
+ --pf-v6-c-label-group__main--MaxWidth: 100%;
691
+ --pf-v6-c-label-group__main--MinWidth: 0;
692
+ --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
693
+ --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
694
+ --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
695
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
696
+ --pf-v6-c-label-group__list--MaxWidth: 100%;
697
+ --pf-v6-c-label-group__list--MinWidth: 0;
698
+ --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
699
+ --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
700
+ --pf-v6-c-label-group__list-item--MaxWidth: 100%;
701
+ --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
702
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
703
+ --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
704
+ --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
705
+ --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
706
+ --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
707
+ --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
708
+ --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
709
+ --pf-v6-c-label-group__label--MaxWidth: 18ch;
710
+ --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
711
+ --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
712
+ --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
713
+ --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
714
+ --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
715
+ --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
716
+ --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
717
+ --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
718
+ --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
719
+ --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
720
+ }
721
+
722
+ .pf-v6-c-label-group {
643
723
  display: inline-flex;
724
+ row-gap: var(--pf-v6-c-label-group--RowGap);
725
+ column-gap: var(--pf-v6-c-label-group--ColumnGap);
644
726
  align-items: center;
645
- justify-content: center;
727
+ max-width: var(--pf-v6-c-label-group--MaxWidth);
646
728
  }
647
729
 
648
- .pf-v6-c-label__text {
649
- overflow: hidden;
650
- text-overflow: ellipsis;
651
- white-space: nowrap;
652
- max-width: var(--pf-v6-c-label__text--MaxWidth);
730
+ .pf-v6-c-label-group.pf-m-category {
731
+ padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
732
+ padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
733
+ padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
734
+ padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
735
+ background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
736
+ border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
737
+ border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
653
738
  }
654
739
 
655
- .pf-v6-c-label__content {
656
- gap: var(--pf-v6-c-label__content--Gap);
657
- max-width: var(--pf-v6-c-label__content--MaxWidth);
658
- padding: 0;
659
- overflow: hidden;
660
- color: var(--pf-v6-c-label--Color);
661
- cursor: var(--pf-v6-c-label__content--Cursor, revert);
662
- background: transparent;
663
- border-width: 0;
740
+ .pf-v6-c-label-group.pf-m-vertical {
741
+ --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
742
+ --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
743
+ --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
744
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
745
+ --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
746
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
747
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
664
748
  }
665
749
 
666
- .pf-v6-c-label__content::before {
667
- position: absolute;
668
- inset: 0;
669
- z-index: -1;
670
- pointer-events: none;
671
- content: "";
672
- background-color: var(--pf-v6-c-label--BackgroundColor);
673
- border: var(--pf-v6-c-label--BorderWidth) solid var(--pf-v6-c-label--BorderColor);
674
- border-radius: var(--pf-v6-c-label--BorderRadius);
750
+ .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
751
+ align-items: flex-start;
675
752
  }
676
753
 
677
- input.pf-v6-c-label__content {
754
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
755
+ flex-direction: column;
756
+ align-items: flex-start;
757
+ max-width: var(--pf-v6-c-label-group__list--MaxWidth);
758
+ }
759
+
760
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
761
+ flex-direction: column;
762
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
763
+ }
764
+
765
+ .pf-v6-c-label-group.pf-m-editable,
766
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
767
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
768
+ display: flex;
769
+ }
770
+
771
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
772
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
773
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
774
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
775
+ flex: 1;
776
+ }
777
+
778
+ .pf-v6-c-label-group__main {
779
+ display: flex;
780
+ flex: 1;
781
+ flex-wrap: wrap;
782
+ row-gap: var(--pf-v6-c-label-group__main--RowGap);
783
+ column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
784
+ align-items: baseline;
785
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
786
+ }
787
+
788
+ .pf-v6-c-label-group__list {
789
+ display: inline-flex;
790
+ flex-wrap: wrap;
791
+ row-gap: var(--pf-v6-c-label-group__list--RowGap);
792
+ column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
793
+ min-width: var(--pf-v6-c-label-group__list--MinWidth);
794
+ }
795
+
796
+ .pf-v6-c-label-group__list-item {
797
+ display: inline-flex;
798
+ max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
799
+ }
800
+
801
+ .pf-v6-c-label-group__label {
678
802
  overflow: hidden;
679
803
  text-overflow: ellipsis;
680
804
  white-space: nowrap;
805
+ max-width: var(--pf-v6-c-label-group__label--MaxWidth);
681
806
  }
682
807
 
683
- .pf-v6-c-label__icon {
684
- color: var(--pf-v6-c-label__icon--Color);
808
+ .pf-v6-c-label-group__close {
809
+ display: flex;
810
+ align-self: flex-start;
685
811
  }
686
812
 
687
- .pf-v6-c-label__actions {
688
- margin-inline-end: var(--pf-v6-c-label__actions--MarginInlineEnd);
813
+ .pf-v6-c-label-group__close .pf-v6-c-button {
814
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
815
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
816
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
817
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
818
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
689
819
  }
690
820
 
691
- .pf-v6-c-label.pf-m-compact .pf-v6-c-label__actions .pf-v6-c-button {
692
- --pf-v6-c-button--m-plain--m-no-padding--after--Inset: 0 calc(-0.125rem);
821
+ .pf-v6-c-label-group__textarea {
822
+ min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
823
+ padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
824
+ padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
825
+ padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
826
+ padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
827
+ white-space: nowrap;
828
+ resize: none;
829
+ scrollbar-width: none;
830
+ -ms-overflow-style: none;
831
+ border: 0;
693
832
  }
694
833
 
695
- .pf-v6-c-label__actions .pf-v6-c-button {
696
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label__actions--c-button--FontSize);
697
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label__actions--c-button--PaddingBlockStart);
698
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd);
699
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd);
700
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label__actions--c-button--PaddingInlineStart);
701
- margin-block-start: var(--pf-v6-c-label__actions--c-button--MarginBlockStart);
702
- margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
703
- outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
834
+ .pf-v6-c-label-group__textarea::-webkit-scrollbar {
835
+ display: none;
704
836
  }
705
837
 
706
838
  .pf-v6-c-text-input-group {
@@ -911,1111 +1043,979 @@ input.pf-v6-c-label__content {
911
1043
  width: 100%;
912
1044
  min-width: var(--pf-v6-c-text-input-group__text-input--MinWidth);
913
1045
  padding-block-start: var(--pf-v6-c-text-input-group__text-input--PaddingBlockStart);
914
- padding-block-end: var(--pf-v6-c-text-input-group__text-input--PaddingBlockEnd);
915
- padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
916
- padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
917
- color: var(--pf-v6-c-text-input-group__text-input--Color);
918
- background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
919
- border: 0;
920
- outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
921
- }
922
-
923
- .pf-v6-c-text-input-group__text-input, .pf-v6-c-text-input-group__text-input.pf-m-hint {
924
- grid-area: text-input;
925
- }
926
-
927
- .pf-v6-c-text-input-group__text-input.pf-m-hint {
928
- color: var(--pf-v6-c-text-input-group__text-input--m-hint--Color);
929
- }
930
-
931
- .pf-v6-c-text-input-group__text-input::placeholder {
932
- color: var(--pf-v6-c-text-input-group__text-input--placeholder--Color);
933
- }
934
-
935
- .pf-v6-c-text-input-group__utilities {
936
- display: flex;
937
- align-items: center;
938
- margin-inline-start: var(--pf-v6-c-text-input-group__utilities--MarginInlineStart);
939
- margin-inline-end: var(--pf-v6-c-text-input-group__utilities--MarginInlineEnd);
940
- }
941
-
942
- .pf-v6-c-text-input-group__utilities > * + * {
943
- margin-inline-start: var(--pf-v6-c-text-input-group__utilities--child--MarginInlineStart);
944
- }
945
-
946
- .pf-v6-c-text-input-group__group {
947
- display: flex;
948
- }
949
-
950
- .pf-v6-c-divider {
951
- --pf-v6-c-divider--Display: flex;
952
- --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
953
- --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
954
- --pf-v6-c-divider--before--FlexBasis: 100%;
955
- }
956
-
957
- .pf-v6-c-divider {
958
- flex-direction: row;
959
- width: 100%;
960
- height: var(--pf-v6-c-divider--Size);
961
- --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
962
- --pf-v6-hidden-visible--hidden--Display: none;
963
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
964
- display: var(--pf-v6-hidden-visible--Display);
965
- }
966
-
967
- .pf-v6-c-divider.pf-m-hidden {
968
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
969
- }
970
-
971
- @media screen and (min-width: 36rem) {
972
- .pf-v6-c-divider.pf-m-hidden-on-sm {
973
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
974
- }
975
- .pf-v6-c-divider.pf-m-visible-on-sm {
976
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
977
- }
978
- }
979
- @media screen and (min-width: 48rem) {
980
- .pf-v6-c-divider.pf-m-hidden-on-md {
981
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
982
- }
983
- .pf-v6-c-divider.pf-m-visible-on-md {
984
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
985
- }
986
- }
987
- @media screen and (min-width: 62rem) {
988
- .pf-v6-c-divider.pf-m-hidden-on-lg {
989
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
990
- }
991
- .pf-v6-c-divider.pf-m-visible-on-lg {
992
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
993
- }
994
- }
995
- @media screen and (min-width: 75rem) {
996
- .pf-v6-c-divider.pf-m-hidden-on-xl {
997
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
998
- }
999
- .pf-v6-c-divider.pf-m-visible-on-xl {
1000
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1001
- }
1002
- }
1003
- @media screen and (min-width: 90.625rem) {
1004
- .pf-v6-c-divider.pf-m-hidden-on-2xl {
1005
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1006
- }
1007
- .pf-v6-c-divider.pf-m-visible-on-2xl {
1008
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1009
- }
1010
- }
1011
- .pf-v6-c-divider {
1012
- flex-shrink: 0;
1013
- align-items: stretch;
1014
- align-self: stretch;
1015
- justify-content: center;
1016
- border: 0;
1017
- }
1018
-
1019
- .pf-v6-c-divider::before {
1020
- flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
1021
- content: "";
1022
- background-color: var(--pf-v6-c-divider--Color);
1023
- border-block-start: var(--pf-v6-c-divider--Size) solid transparent;
1024
- border-inline-start: var(--pf-v6-c-divider--Size) solid transparent;
1025
- }
1026
-
1027
- .pf-v6-c-divider.pf-m-horizontal {
1028
- flex-direction: row;
1029
- width: 100%;
1030
- height: var(--pf-v6-c-divider--Size);
1031
- }
1032
-
1033
- .pf-v6-c-divider.pf-m-vertical {
1034
- flex-direction: column;
1035
- width: var(--pf-v6-c-divider--Size);
1036
- height: inherit;
1037
- }
1038
-
1039
- .pf-v6-c-divider.pf-m-inset-none {
1040
- --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
1041
- }
1042
-
1043
- .pf-v6-c-divider.pf-m-inset-xs {
1044
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1045
- }
1046
-
1047
- .pf-v6-c-divider.pf-m-inset-sm {
1048
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1049
- }
1050
-
1051
- .pf-v6-c-divider.pf-m-inset-md {
1052
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1053
- }
1054
-
1055
- .pf-v6-c-divider.pf-m-inset-lg {
1056
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1057
- }
1058
-
1059
- .pf-v6-c-divider.pf-m-inset-xl {
1060
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1061
- }
1062
-
1063
- .pf-v6-c-divider.pf-m-inset-2xl {
1064
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1065
- }
1066
-
1067
- .pf-v6-c-divider.pf-m-inset-3xl {
1068
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1069
- }
1070
-
1071
- @media (min-width: 36rem) {
1072
- .pf-v6-c-divider.pf-m-horizontal-on-sm {
1073
- flex-direction: row;
1074
- width: 100%;
1075
- height: var(--pf-v6-c-divider--Size);
1076
- }
1077
- }
1078
- @media (min-width: 36rem) {
1079
- .pf-v6-c-divider.pf-m-vertical-on-sm {
1080
- flex-direction: column;
1081
- width: var(--pf-v6-c-divider--Size);
1082
- height: inherit;
1083
- }
1084
- }
1085
- @media (min-width: 36rem) {
1086
- .pf-v6-c-divider.pf-m-inset-none-on-sm {
1087
- --pf-v6-c-divider--before--FlexBasis: 100%;
1088
- }
1089
- .pf-v6-c-divider.pf-m-inset-xs-on-sm {
1090
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1091
- }
1092
- .pf-v6-c-divider.pf-m-inset-sm-on-sm {
1093
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1094
- }
1095
- .pf-v6-c-divider.pf-m-inset-md-on-sm {
1096
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1097
- }
1098
- .pf-v6-c-divider.pf-m-inset-lg-on-sm {
1099
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1100
- }
1101
- .pf-v6-c-divider.pf-m-inset-xl-on-sm {
1102
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1103
- }
1104
- .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
1105
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1106
- }
1107
- .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
1108
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1109
- }
1110
- }
1111
- @media (min-width: 48rem) {
1112
- .pf-v6-c-divider.pf-m-horizontal-on-md {
1113
- flex-direction: row;
1114
- width: 100%;
1115
- height: var(--pf-v6-c-divider--Size);
1116
- }
1117
- }
1118
- @media (min-width: 48rem) {
1119
- .pf-v6-c-divider.pf-m-vertical-on-md {
1120
- flex-direction: column;
1121
- width: var(--pf-v6-c-divider--Size);
1122
- height: inherit;
1123
- }
1124
- }
1125
- @media (min-width: 48rem) {
1126
- .pf-v6-c-divider.pf-m-inset-none-on-md {
1127
- --pf-v6-c-divider--before--FlexBasis: 100%;
1128
- }
1129
- .pf-v6-c-divider.pf-m-inset-xs-on-md {
1130
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1131
- }
1132
- .pf-v6-c-divider.pf-m-inset-sm-on-md {
1133
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1134
- }
1135
- .pf-v6-c-divider.pf-m-inset-md-on-md {
1136
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1137
- }
1138
- .pf-v6-c-divider.pf-m-inset-lg-on-md {
1139
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1140
- }
1141
- .pf-v6-c-divider.pf-m-inset-xl-on-md {
1142
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1143
- }
1144
- .pf-v6-c-divider.pf-m-inset-2xl-on-md {
1145
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1146
- }
1147
- .pf-v6-c-divider.pf-m-inset-3xl-on-md {
1148
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1149
- }
1150
- }
1151
- @media (min-width: 62rem) {
1152
- .pf-v6-c-divider.pf-m-horizontal-on-lg {
1153
- flex-direction: row;
1154
- width: 100%;
1155
- height: var(--pf-v6-c-divider--Size);
1156
- }
1157
- }
1158
- @media (min-width: 62rem) {
1159
- .pf-v6-c-divider.pf-m-vertical-on-lg {
1160
- flex-direction: column;
1161
- width: var(--pf-v6-c-divider--Size);
1162
- height: inherit;
1163
- }
1164
- }
1165
- @media (min-width: 62rem) {
1166
- .pf-v6-c-divider.pf-m-inset-none-on-lg {
1167
- --pf-v6-c-divider--before--FlexBasis: 100%;
1168
- }
1169
- .pf-v6-c-divider.pf-m-inset-xs-on-lg {
1170
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1171
- }
1172
- .pf-v6-c-divider.pf-m-inset-sm-on-lg {
1173
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1174
- }
1175
- .pf-v6-c-divider.pf-m-inset-md-on-lg {
1176
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1177
- }
1178
- .pf-v6-c-divider.pf-m-inset-lg-on-lg {
1179
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1180
- }
1181
- .pf-v6-c-divider.pf-m-inset-xl-on-lg {
1182
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1183
- }
1184
- .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
1185
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1186
- }
1187
- .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
1188
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1189
- }
1190
- }
1191
- @media (min-width: 75rem) {
1192
- .pf-v6-c-divider.pf-m-horizontal-on-xl {
1193
- flex-direction: row;
1194
- width: 100%;
1195
- height: var(--pf-v6-c-divider--Size);
1196
- }
1197
- }
1198
- @media (min-width: 75rem) {
1199
- .pf-v6-c-divider.pf-m-vertical-on-xl {
1200
- flex-direction: column;
1201
- width: var(--pf-v6-c-divider--Size);
1202
- height: inherit;
1203
- }
1204
- }
1205
- @media (min-width: 75rem) {
1206
- .pf-v6-c-divider.pf-m-inset-none-on-xl {
1207
- --pf-v6-c-divider--before--FlexBasis: 100%;
1208
- }
1209
- .pf-v6-c-divider.pf-m-inset-xs-on-xl {
1210
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1211
- }
1212
- .pf-v6-c-divider.pf-m-inset-sm-on-xl {
1213
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1214
- }
1215
- .pf-v6-c-divider.pf-m-inset-md-on-xl {
1216
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1217
- }
1218
- .pf-v6-c-divider.pf-m-inset-lg-on-xl {
1219
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1220
- }
1221
- .pf-v6-c-divider.pf-m-inset-xl-on-xl {
1222
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1223
- }
1224
- .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
1225
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1226
- }
1227
- .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
1228
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1229
- }
1230
- }
1231
- @media (min-width: 90.625rem) {
1232
- .pf-v6-c-divider.pf-m-horizontal-on-2xl {
1233
- flex-direction: row;
1234
- width: 100%;
1235
- height: var(--pf-v6-c-divider--Size);
1236
- }
1237
- }
1238
- @media (min-width: 90.625rem) {
1239
- .pf-v6-c-divider.pf-m-vertical-on-2xl {
1240
- flex-direction: column;
1241
- width: var(--pf-v6-c-divider--Size);
1242
- height: inherit;
1243
- }
1244
- }
1245
- @media (min-width: 90.625rem) {
1246
- .pf-v6-c-divider.pf-m-inset-none-on-2xl {
1247
- --pf-v6-c-divider--before--FlexBasis: 100%;
1248
- }
1249
- .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
1250
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1251
- }
1252
- .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
1253
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1254
- }
1255
- .pf-v6-c-divider.pf-m-inset-md-on-2xl {
1256
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1257
- }
1258
- .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
1259
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1260
- }
1261
- .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
1262
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1263
- }
1264
- .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
1265
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1266
- }
1267
- .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
1268
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1269
- }
1270
- }
1271
- .pf-v6-c-menu-toggle {
1272
- --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
1273
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
1274
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1275
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
1276
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1277
- --pf-v6-c-menu-toggle--MinWidth: initial;
1278
- --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
1279
- --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
1280
- --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
1281
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
1282
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
1283
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--control--default);
1284
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
1285
- --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
1286
- --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
1287
- --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
1288
- --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
1289
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
1290
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
1291
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
1292
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
1293
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
1294
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
1295
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
1296
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--control--clicked);
1297
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
1298
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
1299
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
1300
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1301
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
1302
- --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
1303
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1304
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
1305
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
1306
- --pf-v6-c-menu-toggle__icon--TransitionDelay: 0s;
1307
- --pf-v6-c-menu-toggle__icon--TransitionDuration: 0s;
1308
- --pf-v6-c-menu-toggle__icon--TransitionProperty: none;
1309
- --pf-v6-c-menu-toggle--hover__icon--TransitionDelay: 0s;
1310
- --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: 0s;
1311
- --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: none;
1312
- --pf-v6-c-menu-toggle__icon--Rotate: 0deg;
1313
- --pf-v6-c-menu-toggle--hover__icon--Rotate: 0deg;
1314
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
1315
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
1316
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
1317
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
1318
- --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
1319
- --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
1320
- --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
1321
- --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
1322
- --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
1323
- --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
1324
- --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
1325
- --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
1326
- --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
1327
- --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
1328
- --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
1329
- --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
1330
- --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
1331
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
1332
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
1333
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
1334
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
1335
- --pf-v6-c-menu-toggle--m-secondary--BackgroundColor: transparent;
1336
- --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
1337
- --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
1338
- --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
1339
- --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
1340
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
1341
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
1342
- --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
1343
- --pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor: transparent;
1344
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
1345
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
1346
- --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
1347
- --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
1348
- --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
1349
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
1350
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
1351
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
1352
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
1353
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
1354
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1355
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
1356
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
1357
- --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
1358
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
1359
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
1360
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
1361
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
1362
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
1363
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
1364
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
1365
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--alt);
1366
- --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
1367
- --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
1368
- --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
1369
- --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
1370
- --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
1371
- --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
1372
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
1373
- --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));
1374
- --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1375
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1376
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1377
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
1378
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
1379
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
1380
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
1381
- --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
1382
- --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
1383
- --pf-v6-c-menu-toggle--m-plain--BorderColor: var(--pf-t--global--border--color--high-contrast);
1384
- --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
1385
- --pf-v6-c-menu-toggle--m-plain--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
1386
- --pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
1387
- --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
1388
- --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
1389
- --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
1390
- --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
1391
- --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
1392
- --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
1393
- --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
1394
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1395
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1396
- --pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
1397
- --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
1398
- --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
1399
- --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
1400
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
1401
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
1402
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
1403
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
1404
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
1405
- --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
1406
- --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
1407
- --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
1408
- --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
1409
- --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
1410
- --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
1411
- --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
1412
- --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
1413
- --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
1414
- --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
1415
- --pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
1416
- --pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
1417
- --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
1418
- --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
1419
- --pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate: 60deg;
1046
+ padding-block-end: var(--pf-v6-c-text-input-group__text-input--PaddingBlockEnd);
1047
+ padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
1048
+ padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
1049
+ color: var(--pf-v6-c-text-input-group__text-input--Color);
1050
+ background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
1051
+ border: 0;
1052
+ outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
1420
1053
  }
1421
1054
 
1422
- .pf-v6-c-menu-toggle {
1423
- position: relative;
1424
- display: inline-flex;
1425
- gap: var(--pf-v6-c-menu-toggle--Gap);
1055
+ .pf-v6-c-text-input-group__text-input, .pf-v6-c-text-input-group__text-input.pf-m-hint {
1056
+ grid-area: text-input;
1057
+ }
1058
+
1059
+ .pf-v6-c-text-input-group__text-input.pf-m-hint {
1060
+ color: var(--pf-v6-c-text-input-group__text-input--m-hint--Color);
1061
+ }
1062
+
1063
+ .pf-v6-c-text-input-group__text-input::placeholder {
1064
+ color: var(--pf-v6-c-text-input-group__text-input--placeholder--Color);
1065
+ }
1066
+
1067
+ .pf-v6-c-text-input-group__utilities {
1068
+ display: flex;
1426
1069
  align-items: center;
1070
+ margin-inline-start: var(--pf-v6-c-text-input-group__utilities--MarginInlineStart);
1071
+ margin-inline-end: var(--pf-v6-c-text-input-group__utilities--MarginInlineEnd);
1072
+ }
1073
+
1074
+ .pf-v6-c-text-input-group__utilities > * + * {
1075
+ margin-inline-start: var(--pf-v6-c-text-input-group__utilities--child--MarginInlineStart);
1076
+ }
1077
+
1078
+ .pf-v6-c-text-input-group__group {
1079
+ display: flex;
1080
+ }
1081
+
1082
+ .pf-v6-c-divider {
1083
+ --pf-v6-c-divider--Display: flex;
1084
+ --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
1085
+ --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
1086
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1087
+ }
1088
+
1089
+ .pf-v6-c-divider {
1090
+ flex-direction: row;
1091
+ width: 100%;
1092
+ height: var(--pf-v6-c-divider--Size);
1093
+ --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
1094
+ --pf-v6-hidden-visible--hidden--Display: none;
1095
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1096
+ display: var(--pf-v6-hidden-visible--Display);
1097
+ }
1098
+
1099
+ .pf-v6-c-divider.pf-m-hidden {
1100
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1101
+ }
1102
+
1103
+ @media screen and (min-width: 36rem) {
1104
+ .pf-v6-c-divider.pf-m-hidden-on-sm {
1105
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1106
+ }
1107
+ .pf-v6-c-divider.pf-m-visible-on-sm {
1108
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1109
+ }
1110
+ }
1111
+ @media screen and (min-width: 48rem) {
1112
+ .pf-v6-c-divider.pf-m-hidden-on-md {
1113
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1114
+ }
1115
+ .pf-v6-c-divider.pf-m-visible-on-md {
1116
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1117
+ }
1118
+ }
1119
+ @media screen and (min-width: 62rem) {
1120
+ .pf-v6-c-divider.pf-m-hidden-on-lg {
1121
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1122
+ }
1123
+ .pf-v6-c-divider.pf-m-visible-on-lg {
1124
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1125
+ }
1126
+ }
1127
+ @media screen and (min-width: 75rem) {
1128
+ .pf-v6-c-divider.pf-m-hidden-on-xl {
1129
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1130
+ }
1131
+ .pf-v6-c-divider.pf-m-visible-on-xl {
1132
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1133
+ }
1134
+ }
1135
+ @media screen and (min-width: 90.625rem) {
1136
+ .pf-v6-c-divider.pf-m-hidden-on-2xl {
1137
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1138
+ }
1139
+ .pf-v6-c-divider.pf-m-visible-on-2xl {
1140
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1141
+ }
1142
+ }
1143
+ .pf-v6-c-divider {
1144
+ flex-shrink: 0;
1145
+ align-items: stretch;
1146
+ align-self: stretch;
1427
1147
  justify-content: center;
1428
- min-width: var(--pf-v6-c-menu-toggle--MinWidth, revert);
1429
- max-width: 100%;
1430
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
1431
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
1432
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
1433
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
1434
- font-size: var(--pf-v6-c-menu-toggle--FontSize);
1435
- line-height: var(--pf-v6-c-menu-toggle--LineHeight);
1436
- color: var(--pf-v6-c-menu-toggle--Color);
1437
- cursor: pointer;
1438
- background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
1439
1148
  border: 0;
1440
- transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
1441
- transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
1442
- transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
1443
1149
  }
1444
1150
 
1445
- .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
1446
- border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1151
+ .pf-v6-c-divider::before {
1152
+ flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
1153
+ content: "";
1154
+ background-color: var(--pf-v6-c-divider--Color);
1155
+ border-block-start: var(--pf-v6-c-divider--Size) solid transparent;
1156
+ border-inline-start: var(--pf-v6-c-divider--Size) solid transparent;
1447
1157
  }
1448
1158
 
1449
- .pf-v6-c-menu-toggle::before {
1450
- position: absolute;
1451
- inset-block-start: 0;
1452
- inset-block-end: 0;
1453
- inset-inline-start: 0;
1454
- inset-inline-end: 0;
1455
- z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
1456
- pointer-events: none;
1457
- content: "";
1458
- border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
1459
- transition: inherit;
1159
+ .pf-v6-c-divider.pf-m-horizontal {
1160
+ flex-direction: row;
1161
+ width: 100%;
1162
+ height: var(--pf-v6-c-divider--Size);
1460
1163
  }
1461
1164
 
1462
- .pf-v6-c-menu-toggle.pf-m-primary {
1463
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
1464
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
1465
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
1466
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
1467
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
1468
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
1469
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
1470
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
1471
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
1472
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
1473
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
1474
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
1475
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
1476
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
1477
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
1478
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
1479
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
1165
+ .pf-v6-c-divider.pf-m-vertical {
1166
+ flex-direction: column;
1167
+ width: var(--pf-v6-c-divider--Size);
1168
+ height: inherit;
1480
1169
  }
1481
1170
 
1482
- .pf-v6-c-menu-toggle.pf-m-secondary {
1483
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
1484
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
1485
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
1486
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--BackgroundColor);
1487
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
1488
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
1489
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
1490
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
1491
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
1492
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
1493
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor);
1494
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
1495
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
1496
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
1497
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
1498
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
1499
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
1171
+ .pf-v6-c-divider.pf-m-inset-none {
1172
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
1500
1173
  }
1501
1174
 
1502
- .pf-v6-c-menu-toggle.pf-m-full-height {
1503
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
1504
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
1505
- --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
1506
- align-items: center;
1507
- height: 100%;
1175
+ .pf-v6-c-divider.pf-m-inset-xs {
1176
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1508
1177
  }
1509
1178
 
1510
- .pf-v6-c-menu-toggle.pf-m-full-width {
1511
- width: 100%;
1179
+ .pf-v6-c-divider.pf-m-inset-sm {
1180
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1512
1181
  }
1513
1182
 
1514
- .pf-v6-c-menu-toggle.pf-m-plain {
1515
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
1516
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
1517
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
1518
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
1519
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
1520
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
1521
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
1522
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
1523
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
1524
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
1525
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
1526
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
1527
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
1528
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
1529
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
1530
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
1183
+ .pf-v6-c-divider.pf-m-inset-md {
1184
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1185
+ }
1186
+
1187
+ .pf-v6-c-divider.pf-m-inset-lg {
1188
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1189
+ }
1190
+
1191
+ .pf-v6-c-divider.pf-m-inset-xl {
1192
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1193
+ }
1194
+
1195
+ .pf-v6-c-divider.pf-m-inset-2xl {
1196
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1197
+ }
1198
+
1199
+ .pf-v6-c-divider.pf-m-inset-3xl {
1200
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1201
+ }
1202
+
1203
+ @media (min-width: 36rem) {
1204
+ .pf-v6-c-divider.pf-m-horizontal-on-sm {
1205
+ flex-direction: row;
1206
+ width: 100%;
1207
+ height: var(--pf-v6-c-divider--Size);
1208
+ }
1209
+ }
1210
+ @media (min-width: 36rem) {
1211
+ .pf-v6-c-divider.pf-m-vertical-on-sm {
1212
+ flex-direction: column;
1213
+ width: var(--pf-v6-c-divider--Size);
1214
+ height: inherit;
1215
+ }
1216
+ }
1217
+ @media (min-width: 36rem) {
1218
+ .pf-v6-c-divider.pf-m-inset-none-on-sm {
1219
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1220
+ }
1221
+ .pf-v6-c-divider.pf-m-inset-xs-on-sm {
1222
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1223
+ }
1224
+ .pf-v6-c-divider.pf-m-inset-sm-on-sm {
1225
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1226
+ }
1227
+ .pf-v6-c-divider.pf-m-inset-md-on-sm {
1228
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1229
+ }
1230
+ .pf-v6-c-divider.pf-m-inset-lg-on-sm {
1231
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1232
+ }
1233
+ .pf-v6-c-divider.pf-m-inset-xl-on-sm {
1234
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1235
+ }
1236
+ .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
1237
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1238
+ }
1239
+ .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
1240
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1241
+ }
1531
1242
  }
1532
-
1533
- .pf-v6-c-menu-toggle.pf-m-plain.pf-m-circle {
1534
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius);
1243
+ @media (min-width: 48rem) {
1244
+ .pf-v6-c-divider.pf-m-horizontal-on-md {
1245
+ flex-direction: row;
1246
+ width: 100%;
1247
+ height: var(--pf-v6-c-divider--Size);
1248
+ }
1535
1249
  }
1536
-
1537
- .pf-v6-c-menu-toggle.pf-m-plain::before {
1538
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
1539
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
1250
+ @media (min-width: 48rem) {
1251
+ .pf-v6-c-divider.pf-m-vertical-on-md {
1252
+ flex-direction: column;
1253
+ width: var(--pf-v6-c-divider--Size);
1254
+ height: inherit;
1255
+ }
1540
1256
  }
1541
-
1542
- .pf-v6-c-menu-toggle:is(:hover, :focus) {
1543
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
1544
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
1545
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
1546
- --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--hover--BorderWidth);
1547
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
1548
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
1549
- --pf-v6-c-menu-toggle__icon--TransitionDelay: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDelay);
1550
- --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDuration);
1551
- --pf-v6-c-menu-toggle__icon--TransitionProperty: var(--pf-v6-c-menu-toggle--hover__icon--TransitionProperty);
1552
- --pf-v6-c-menu-toggle__icon--Rotate: var(--pf-v6-c-menu-toggle--hover__icon--Rotate);
1257
+ @media (min-width: 48rem) {
1258
+ .pf-v6-c-divider.pf-m-inset-none-on-md {
1259
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1260
+ }
1261
+ .pf-v6-c-divider.pf-m-inset-xs-on-md {
1262
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1263
+ }
1264
+ .pf-v6-c-divider.pf-m-inset-sm-on-md {
1265
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1266
+ }
1267
+ .pf-v6-c-divider.pf-m-inset-md-on-md {
1268
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1269
+ }
1270
+ .pf-v6-c-divider.pf-m-inset-lg-on-md {
1271
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1272
+ }
1273
+ .pf-v6-c-divider.pf-m-inset-xl-on-md {
1274
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1275
+ }
1276
+ .pf-v6-c-divider.pf-m-inset-2xl-on-md {
1277
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1278
+ }
1279
+ .pf-v6-c-divider.pf-m-inset-3xl-on-md {
1280
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1281
+ }
1553
1282
  }
1554
-
1555
- .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
1556
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
1557
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
1558
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
1559
- --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth);
1560
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
1561
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
1283
+ @media (min-width: 62rem) {
1284
+ .pf-v6-c-divider.pf-m-horizontal-on-lg {
1285
+ flex-direction: row;
1286
+ width: 100%;
1287
+ height: var(--pf-v6-c-divider--Size);
1288
+ }
1562
1289
  }
1563
-
1564
- .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
1565
- border: 0;
1290
+ @media (min-width: 62rem) {
1291
+ .pf-v6-c-divider.pf-m-vertical-on-lg {
1292
+ flex-direction: column;
1293
+ width: var(--pf-v6-c-divider--Size);
1294
+ height: inherit;
1295
+ }
1566
1296
  }
1567
-
1568
- .pf-v6-c-menu-toggle.pf-m-small {
1569
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
1570
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
1571
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
1572
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
1573
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
1574
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
1575
- --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);
1576
- --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);
1297
+ @media (min-width: 62rem) {
1298
+ .pf-v6-c-divider.pf-m-inset-none-on-lg {
1299
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1300
+ }
1301
+ .pf-v6-c-divider.pf-m-inset-xs-on-lg {
1302
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1303
+ }
1304
+ .pf-v6-c-divider.pf-m-inset-sm-on-lg {
1305
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1306
+ }
1307
+ .pf-v6-c-divider.pf-m-inset-md-on-lg {
1308
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1309
+ }
1310
+ .pf-v6-c-divider.pf-m-inset-lg-on-lg {
1311
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1312
+ }
1313
+ .pf-v6-c-divider.pf-m-inset-xl-on-lg {
1314
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1315
+ }
1316
+ .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
1317
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1318
+ }
1319
+ .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
1320
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1321
+ }
1577
1322
  }
1578
-
1579
- .pf-v6-c-menu-toggle.pf-m-success {
1580
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
1581
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
1323
+ @media (min-width: 75rem) {
1324
+ .pf-v6-c-divider.pf-m-horizontal-on-xl {
1325
+ flex-direction: row;
1326
+ width: 100%;
1327
+ height: var(--pf-v6-c-divider--Size);
1328
+ }
1582
1329
  }
1583
-
1584
- .pf-v6-c-menu-toggle.pf-m-warning {
1585
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
1586
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
1330
+ @media (min-width: 75rem) {
1331
+ .pf-v6-c-divider.pf-m-vertical-on-xl {
1332
+ flex-direction: column;
1333
+ width: var(--pf-v6-c-divider--Size);
1334
+ height: inherit;
1335
+ }
1587
1336
  }
1588
-
1589
- .pf-v6-c-menu-toggle.pf-m-danger {
1590
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
1591
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
1337
+ @media (min-width: 75rem) {
1338
+ .pf-v6-c-divider.pf-m-inset-none-on-xl {
1339
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1340
+ }
1341
+ .pf-v6-c-divider.pf-m-inset-xs-on-xl {
1342
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1343
+ }
1344
+ .pf-v6-c-divider.pf-m-inset-sm-on-xl {
1345
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1346
+ }
1347
+ .pf-v6-c-divider.pf-m-inset-md-on-xl {
1348
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1349
+ }
1350
+ .pf-v6-c-divider.pf-m-inset-lg-on-xl {
1351
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1352
+ }
1353
+ .pf-v6-c-divider.pf-m-inset-xl-on-xl {
1354
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1355
+ }
1356
+ .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
1357
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1358
+ }
1359
+ .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
1360
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1361
+ }
1592
1362
  }
1593
-
1594
- @media screen and (prefers-reduced-motion: no-preference) {
1595
- .pf-v6-c-menu-toggle.pf-m-danger {
1596
- transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
1597
- animation-name: pf-v6-c-menu-toggle-m-danger-motion;
1598
- animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
1599
- animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
1600
- animation-fill-mode: both;
1363
+ @media (min-width: 90.625rem) {
1364
+ .pf-v6-c-divider.pf-m-horizontal-on-2xl {
1365
+ flex-direction: row;
1366
+ width: 100%;
1367
+ height: var(--pf-v6-c-divider--Size);
1601
1368
  }
1602
1369
  }
1603
- .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
1604
- animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
1605
- animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
1606
- animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
1370
+ @media (min-width: 90.625rem) {
1371
+ .pf-v6-c-divider.pf-m-vertical-on-2xl {
1372
+ flex-direction: column;
1373
+ width: var(--pf-v6-c-divider--Size);
1374
+ height: inherit;
1375
+ }
1607
1376
  }
1608
-
1609
- @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
1610
- from {
1611
- opacity: 0;
1377
+ @media (min-width: 90.625rem) {
1378
+ .pf-v6-c-divider.pf-m-inset-none-on-2xl {
1379
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1612
1380
  }
1613
- to {
1614
- opacity: 1;
1381
+ .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
1382
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1383
+ }
1384
+ .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
1385
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1386
+ }
1387
+ .pf-v6-c-divider.pf-m-inset-md-on-2xl {
1388
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1389
+ }
1390
+ .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
1391
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1392
+ }
1393
+ .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
1394
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1395
+ }
1396
+ .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
1397
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1398
+ }
1399
+ .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
1400
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1615
1401
  }
1616
1402
  }
1617
- .pf-v6-c-menu-toggle.pf-m-settings {
1618
- --pf-v6-c-menu-toggle__icon--TransitionProperty: rotate;
1619
- --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration);
1620
- --pf-v6-c-menu-toggle__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction);
1621
- --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: rotate;
1622
- --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration);
1623
- --pf-v6-c-menu-toggle--hover__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction);
1624
- --pf-v6-c-menu-toggle--hover__icon--Rotate: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate);
1625
- }
1626
-
1627
- .pf-v6-c-menu-toggle.pf-m-placeholder {
1628
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
1403
+ .pf-v6-c-badge {
1404
+ --pf-v6-c-badge--BorderColor: transparent;
1405
+ --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
1406
+ --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
1407
+ --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
1408
+ --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
1409
+ --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1410
+ --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1411
+ --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
1412
+ --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
1413
+ --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
1414
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
1415
+ --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
1416
+ --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
1417
+ --pf-v6-c-badge--m-read--BorderColor: var(--pf-t--global--border--color--high-contrast);
1418
+ --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
1419
+ --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
1420
+ --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
1421
+ --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
1422
+ --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
1423
+ --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
1424
+ --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1629
1425
  }
1630
1426
 
1631
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
1632
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
1633
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
1634
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
1635
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
1636
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
1427
+ .pf-v6-c-badge {
1428
+ position: relative;
1429
+ display: inline-block;
1430
+ min-width: var(--pf-v6-c-badge--MinWidth);
1431
+ padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
1432
+ padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
1433
+ font-size: var(--pf-v6-c-badge--FontSize);
1434
+ font-weight: var(--pf-v6-c-badge--FontWeight);
1435
+ color: var(--pf-v6-c-badge--Color);
1436
+ text-align: center;
1437
+ white-space: nowrap;
1438
+ background-color: var(--pf-v6-c-badge--BackgroundColor);
1439
+ border-radius: var(--pf-v6-c-badge--BorderRadius);
1637
1440
  }
1638
1441
 
1639
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
1640
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
1442
+ .pf-v6-c-badge::after {
1443
+ position: absolute;
1444
+ inset: 0;
1641
1445
  pointer-events: none;
1446
+ content: "";
1447
+ border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
1448
+ border-radius: inherit;
1642
1449
  }
1643
1450
 
1644
- .pf-v6-c-menu-toggle.pf-m-dock {
1645
- justify-content: flex-start;
1646
- width: 100%;
1451
+ .pf-v6-c-badge.pf-m-read {
1452
+ --pf-v6-c-badge--BorderColor: var(--pf-v6-c-badge--m-read--BorderColor);
1453
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
1454
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
1455
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
1647
1456
  }
1648
1457
 
1649
- @media (min-width: 62rem) {
1650
- .pf-v6-c-menu-toggle.pf-m-dock {
1651
- justify-content: center;
1652
- width: auto;
1653
- }
1654
- .pf-v6-c-menu-toggle.pf-m-dock .pf-v6-c-menu-toggle__text,
1655
- .pf-v6-c-menu-toggle.pf-m-dock .pf-v6-c-menu-toggle__controls {
1656
- display: none;
1657
- }
1658
- }
1659
- .pf-v6-c-page__dock.pf-m-text-expanded .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle.pf-m-text-expanded {
1660
- justify-content: flex-start;
1661
- width: 100%;
1458
+ .pf-v6-c-badge.pf-m-unread {
1459
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
1460
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
1461
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
1662
1462
  }
1663
1463
 
1664
- .pf-v6-c-page__dock.pf-m-text-expanded .pf-v6-c-menu-toggle .pf-v6-c-menu-toggle__text,
1665
- .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,
1666
- .pf-v6-c-menu-toggle.pf-m-text-expanded .pf-v6-c-menu-toggle__controls {
1667
- display: revert;
1464
+ .pf-v6-c-badge.pf-m-disabled {
1465
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
1466
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
1668
1467
  }
1669
1468
 
1670
- @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
1671
- syntax: "<length>";
1672
- inherits: false;
1673
- initial-value: 0;
1469
+ .pf-v6-c-badge.pf-m-disabled::after {
1470
+ border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
1674
1471
  }
1675
- @media (prefers-reduced-motion: no-preference) {
1676
- @keyframes pf-v6-c-menu-toggle-m-danger-motion {
1677
- 33% {
1678
- --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
1679
- }
1680
- 66% {
1681
- --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
1682
- }
1683
- }
1472
+
1473
+ .pf-v6-c-badge__toggle-icon {
1474
+ margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
1475
+ color: var(--pf-v6-c-badge__toggle-icon--Color);
1684
1476
  }
1685
- .pf-v6-c-menu-toggle.pf-m-split-button {
1686
- --pf-v6-c-menu-toggle--Gap: 0;
1687
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
1688
- padding: 0;
1477
+
1478
+ .pf-v6-c-label {
1479
+ --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1480
+ --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1481
+ --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1482
+ --pf-v6-c-label--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1483
+ --pf-v6-c-label--MaxWidth: 100%;
1484
+ --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)));
1485
+ --pf-v6-c-label--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
1486
+ --pf-v6-c-label--BorderColor: var(--pf-t--global--border--color--high-contrast);
1487
+ --pf-v6-c-label--BorderRadius: var(--pf-t--global--border--radius--pill);
1488
+ --pf-v6-c-label--FontSize: var(--pf-t--global--font--size--body--sm);
1489
+ --pf-v6-c-label--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
1490
+ --pf-v6-c-label--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
1491
+ --pf-v6-c-label--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
1492
+ --pf-v6-c-label__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
1493
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--hover);
1494
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-gray--hover);
1495
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--hover);
1496
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--default);
1497
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--hover);
1498
+ --pf-v6-c-label--m-blue--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--default);
1499
+ --pf-v6-c-label--m-blue--Color: var(--pf-t--global--text--color--nonstatus--on-blue--default);
1500
+ --pf-v6-c-label--m-blue__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--default);
1501
+ --pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--hover);
1502
+ --pf-v6-c-label--m-blue--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-blue--hover);
1503
+ --pf-v6-c-label--m-blue--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--hover);
1504
+ --pf-v6-c-label--m-blue--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--default);
1505
+ --pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--hover);
1506
+ --pf-v6-c-label--m-red--BackgroundColor: var(--pf-t--global--color--nonstatus--red--default);
1507
+ --pf-v6-c-label--m-red--Color: var(--pf-t--global--text--color--nonstatus--on-red--default);
1508
+ --pf-v6-c-label--m-red__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--default);
1509
+ --pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--red--hover);
1510
+ --pf-v6-c-label--m-red--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-red--hover);
1511
+ --pf-v6-c-label--m-red--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--hover);
1512
+ --pf-v6-c-label--m-red--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--red--default);
1513
+ --pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--red--hover);
1514
+ --pf-v6-c-label--m-orange--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--default);
1515
+ --pf-v6-c-label--m-orange--Color: var(--pf-t--global--text--color--nonstatus--on-orange--default);
1516
+ --pf-v6-c-label--m-orange__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--default);
1517
+ --pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--hover);
1518
+ --pf-v6-c-label--m-orange--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orange--hover);
1519
+ --pf-v6-c-label--m-orange--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--hover);
1520
+ --pf-v6-c-label--m-orange--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--default);
1521
+ --pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--hover);
1522
+ --pf-v6-c-label--m-orangered--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--default);
1523
+ --pf-v6-c-label--m-orangered--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--default);
1524
+ --pf-v6-c-label--m-orangered__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--default);
1525
+ --pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--hover);
1526
+ --pf-v6-c-label--m-orangered--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--hover);
1527
+ --pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--hover);
1528
+ --pf-v6-c-label--m-orangered--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--default);
1529
+ --pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--hover);
1530
+ --pf-v6-c-label--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
1531
+ --pf-v6-c-label--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
1532
+ --pf-v6-c-label--m-yellow__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--default);
1533
+ --pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--hover);
1534
+ --pf-v6-c-label--m-yellow--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--hover);
1535
+ --pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--hover);
1536
+ --pf-v6-c-label--m-yellow--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--default);
1537
+ --pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--hover);
1538
+ --pf-v6-c-label--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
1539
+ --pf-v6-c-label--m-green--Color: var(--pf-t--global--text--color--nonstatus--on-green--default);
1540
+ --pf-v6-c-label--m-green__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--default);
1541
+ --pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--green--hover);
1542
+ --pf-v6-c-label--m-green--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-green--hover);
1543
+ --pf-v6-c-label--m-green--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--hover);
1544
+ --pf-v6-c-label--m-green--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--green--default);
1545
+ --pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--green--hover);
1546
+ --pf-v6-c-label--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
1547
+ --pf-v6-c-label--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
1548
+ --pf-v6-c-label--m-teal__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--default);
1549
+ --pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--hover);
1550
+ --pf-v6-c-label--m-teal--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-teal--hover);
1551
+ --pf-v6-c-label--m-teal--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--hover);
1552
+ --pf-v6-c-label--m-teal--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--default);
1553
+ --pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--hover);
1554
+ --pf-v6-c-label--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
1555
+ --pf-v6-c-label--m-purple--Color: var(--pf-t--global--text--color--nonstatus--on-purple--default);
1556
+ --pf-v6-c-label--m-purple__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--default);
1557
+ --pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--hover);
1558
+ --pf-v6-c-label--m-purple--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-purple--hover);
1559
+ --pf-v6-c-label--m-purple--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--hover);
1560
+ --pf-v6-c-label--m-purple--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--default);
1561
+ --pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--hover);
1562
+ --pf-v6-c-label--m-success--BackgroundColor: var(--pf-t--global--color--status--success--default);
1563
+ --pf-v6-c-label--m-success--Color: var(--pf-t--global--text--color--status--on-success--default);
1564
+ --pf-v6-c-label--m-success__icon--Color: var(--pf-t--global--icon--color--status--on-success--default);
1565
+ --pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--success--hover);
1566
+ --pf-v6-c-label--m-success--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-success--hover);
1567
+ --pf-v6-c-label--m-success--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-success--hover);
1568
+ --pf-v6-c-label--m-success--m-outline__icon--Color: var(--pf-t--global--icon--color--status--success--default);
1569
+ --pf-v6-c-label--m-success--m-outline--BorderColor: var(--pf-t--global--border--color--status--success--default);
1570
+ --pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--success--hover);
1571
+ --pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--success--hover);
1572
+ --pf-v6-c-label--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
1573
+ --pf-v6-c-label--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
1574
+ --pf-v6-c-label--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
1575
+ --pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--warning--hover);
1576
+ --pf-v6-c-label--m-warning--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-warning--hover);
1577
+ --pf-v6-c-label--m-warning--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-warning--hover);
1578
+ --pf-v6-c-label--m-warning--m-outline__icon--Color: var(--pf-t--global--icon--color--status--warning--default);
1579
+ --pf-v6-c-label--m-warning--m-outline--BorderColor: var(--pf-t--global--border--color--status--warning--default);
1580
+ --pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
1581
+ --pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--warning--hover);
1582
+ --pf-v6-c-label--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
1583
+ --pf-v6-c-label--m-danger--Color: var(--pf-t--global--text--color--status--on-danger--default);
1584
+ --pf-v6-c-label--m-danger__icon--Color: var(--pf-t--global--icon--color--status--on-danger--default);
1585
+ --pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--danger--hover);
1586
+ --pf-v6-c-label--m-danger--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-danger--hover);
1587
+ --pf-v6-c-label--m-danger--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-danger--hover);
1588
+ --pf-v6-c-label--m-danger--m-outline__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
1589
+ --pf-v6-c-label--m-danger--m-outline--BorderColor: var(--pf-t--global--border--color--status--danger--default);
1590
+ --pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
1591
+ --pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
1592
+ --pf-v6-c-label--m-info--BackgroundColor: var(--pf-t--global--color--status--info--default);
1593
+ --pf-v6-c-label--m-info--Color: var(--pf-t--global--text--color--status--on-info--default);
1594
+ --pf-v6-c-label--m-info__icon--Color: var(--pf-t--global--icon--color--status--on-info--default);
1595
+ --pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--info--hover);
1596
+ --pf-v6-c-label--m-info--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-info--hover);
1597
+ --pf-v6-c-label--m-info--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-info--hover);
1598
+ --pf-v6-c-label--m-info--m-outline__icon--Color: var(--pf-t--global--icon--color--status--info--default);
1599
+ --pf-v6-c-label--m-info--m-outline--BorderColor: var(--pf-t--global--border--color--status--info--default);
1600
+ --pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--info--hover);
1601
+ --pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--info--hover);
1602
+ --pf-v6-c-label--m-custom--BackgroundColor: var(--pf-t--global--color--status--custom--default);
1603
+ --pf-v6-c-label--m-custom--Color: var(--pf-t--global--text--color--status--on-custom--default);
1604
+ --pf-v6-c-label--m-custom__icon--Color: var(--pf-t--global--icon--color--status--on-custom--default);
1605
+ --pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--custom--hover);
1606
+ --pf-v6-c-label--m-custom--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-custom--hover);
1607
+ --pf-v6-c-label--m-custom--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-custom--hover);
1608
+ --pf-v6-c-label--m-custom--m-outline__icon--Color: var(--pf-t--global--icon--color--status--custom--default);
1609
+ --pf-v6-c-label--m-custom--m-outline--BorderColor: var(--pf-t--global--border--color--status--custom--default);
1610
+ --pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--custom--hover);
1611
+ --pf-v6-c-label--m-custom--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--custom--hover);
1612
+ --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
1613
+ --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
1614
+ --pf-v6-c-label--m-clickable__content--Cursor: pointer;
1615
+ --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label__icon--Color);
1616
+ --pf-v6-c-label--m-outline--BorderWidth: var(--pf-t--global--border--width--action--default);
1617
+ --pf-v6-c-label--m-outline--BackgroundColor: transparent;
1618
+ --pf-v6-c-label--m-outline--Color: var(--pf-t--global--text--color--regular);
1619
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-t--global--icon--color--regular);
1620
+ --pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor: transparent;
1621
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
1622
+ --pf-v6-c-label--m-outline--m-clickable--hover--Color: var(--pf-t--global--text--color--regular);
1623
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--regular);
1624
+ --pf-v6-c-label--m-overflow--Color: var(--pf-t--global--text--color--brand--default);
1625
+ --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
1626
+ --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
1627
+ --pf-v6-c-label--m-overflow--hover--Color: var(--pf-t--global--text--color--brand--hover);
1628
+ --pf-v6-c-label--m-overflow--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
1629
+ --pf-v6-c-label--m-overflow--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
1630
+ --pf-v6-c-label--m-add--Color: var(--pf-t--global--text--color--brand--default);
1631
+ --pf-v6-c-label--m-add--BackgroundColor: transparent;
1632
+ --pf-v6-c-label--m-add--BorderColor: var(--pf-t--global--border--color--default);
1633
+ --pf-v6-c-label--m-add--BorderWidth: var(--pf-t--global--border--width--action--default);
1634
+ --pf-v6-c-label--m-add--hover--Color: var(--pf-t--global--text--color--brand--hover);
1635
+ --pf-v6-c-label--m-add--hover--BackgroundColor: transparent;
1636
+ --pf-v6-c-label--m-add--hover--BorderColor: var(--pf-t--global--border--color--hover);
1637
+ --pf-v6-c-label--m-add--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
1638
+ --pf-v6-c-label--m-compact--PaddingBlockStart: 0;
1639
+ --pf-v6-c-label--m-compact--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1640
+ --pf-v6-c-label--m-compact--PaddingBlockEnd: 0;
1641
+ --pf-v6-c-label--m-compact--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1642
+ --pf-v6-c-label--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
1643
+ --pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset: 0.0625rem;
1644
+ --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)));
1645
+ --pf-v6-c-label__content--MaxWidth: 100%;
1646
+ --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
1647
+ --pf-v6-c-label__content--Cursor: initial;
1648
+ --pf-v6-c-label__icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
1649
+ --pf-v6-c-label__text--MaxWidth: 100%;
1650
+ --pf-v6-c-label__actions--MarginInlineEnd: 0;
1651
+ --pf-v6-c-label__actions--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
1652
+ --pf-v6-c-label__actions--c-button--OutlineOffset: -0.1875rem;
1653
+ --pf-v6-c-label__actions--c-button--MarginBlockStart: 0;
1654
+ --pf-v6-c-label__actions--c-button--MarginBlockEnd: 0;
1655
+ --pf-v6-c-label__actions--c-button--PaddingBlockStart: 0;
1656
+ --pf-v6-c-label__actions--c-button--PaddingInlineEnd: 0;
1657
+ --pf-v6-c-label__actions--c-button--PaddingBlockEnd: 0;
1658
+ --pf-v6-c-label__actions--c-button--PaddingInlineStart: 0;
1659
+ --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--default);
1660
+ --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--default);
1661
+ --pf-v6-c-label--m-editable--hover--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--hover);
1662
+ --pf-v6-c-label--m-editable--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--hover);
1663
+ --pf-v6-c-label--m-editable--TextUnderlineOffset: 0.25rem;
1664
+ --pf-v6-c-label--m-editable__content--MaxWidth: 16ch;
1665
+ --pf-v6-c-label--m-editable__content--Cursor: pointer;
1666
+ --pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine: none;
1667
+ --pf-v6-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
1668
+ --pf-v6-c-label--m-editable--m-editable-active--Color: var(--pf-t--global--text--color--regular);
1669
+ --pf-v6-c-label--m-editable--m-editable-active__content--Cursor: initial;
1670
+ --pf-v6-c-label--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1671
+ --pf-v6-c-label--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
1672
+ --pf-v6-c-label--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1673
+ --pf-v6-c-label--m-disabled--c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1689
1674
  }
1690
1675
 
1691
- .pf-v6-c-menu-toggle.pf-m-split-button > * {
1676
+ .pf-v6-c-label {
1692
1677
  position: relative;
1693
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
1694
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
1695
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
1696
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
1697
- }
1698
-
1699
- .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
1700
- border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1701
- border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1702
- }
1703
-
1704
- .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
1705
- border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1706
- border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1707
- }
1708
-
1709
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
1710
- --pf-v6-c-check__label--Color: currentcolor;
1711
- --pf-v6-c-check__label--disabled--Color: currentcolor;
1712
- align-items: center;
1713
- align-self: stretch;
1714
- }
1715
-
1716
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
1717
- --pf-v6-c-check__input--TranslateY: 0;
1718
- align-self: center;
1719
- }
1720
-
1721
- .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
1722
- 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);
1723
- }
1724
-
1725
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
1726
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
1727
- }
1728
-
1729
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
1730
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
1731
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
1732
- }
1733
-
1734
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
1735
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
1736
- --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);
1678
+ gap: var(--pf-v6-c-label--Gap);
1679
+ min-width: var(--pf-v6-c-label--MinWidth);
1680
+ max-width: var(--pf-v6-c-label--MaxWidth);
1681
+ padding-block-start: var(--pf-v6-c-label--PaddingBlockStart);
1682
+ padding-block-end: var(--pf-v6-c-label--PaddingBlockEnd);
1683
+ padding-inline-start: var(--pf-v6-c-label--PaddingInlineStart);
1684
+ padding-inline-end: var(--pf-v6-c-label--PaddingInlineEnd);
1685
+ font-size: var(--pf-v6-c-label--FontSize);
1686
+ white-space: nowrap;
1687
+ background: transparent;
1688
+ isolation: isolate;
1689
+ border: 0;
1690
+ border-radius: var(--pf-v6-c-label--BorderRadius);
1737
1691
  }
1738
1692
 
1739
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
1740
- --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);
1693
+ .pf-v6-c-label.pf-m-blue {
1694
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-blue--BackgroundColor);
1695
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-blue--Color);
1696
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-blue__icon--Color);
1697
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor);
1698
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover--Color);
1699
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover__icon--Color);
1700
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--BorderColor);
1701
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor);
1741
1702
  }
1742
1703
 
1743
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
1744
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
1704
+ .pf-v6-c-label.pf-m-red {
1705
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-red--BackgroundColor);
1706
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-red--Color);
1707
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-red__icon--Color);
1708
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor);
1709
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-red--m-clickable--hover--Color);
1710
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-red--m-clickable--hover__icon--Color);
1711
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-red--m-outline--BorderColor);
1712
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor);
1745
1713
  }
1746
1714
 
1747
- .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,
1748
- .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,
1749
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
1750
- padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
1715
+ .pf-v6-c-label.pf-m-orange {
1716
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orange--BackgroundColor);
1717
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orange--Color);
1718
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orange__icon--Color);
1719
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor);
1720
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover--Color);
1721
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover__icon--Color);
1722
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--BorderColor);
1723
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor);
1751
1724
  }
1752
1725
 
1753
- .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,
1754
- .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,
1755
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
1756
- padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
1726
+ .pf-v6-c-label.pf-m-orangered {
1727
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orangered--BackgroundColor);
1728
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orangered--Color);
1729
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orangered__icon--Color);
1730
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor);
1731
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover--Color);
1732
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color);
1733
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--BorderColor);
1734
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor);
1757
1735
  }
1758
1736
 
1759
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
1760
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
1737
+ .pf-v6-c-label.pf-m-yellow {
1738
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-yellow--BackgroundColor);
1739
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-yellow--Color);
1740
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-yellow__icon--Color);
1741
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor);
1742
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover--Color);
1743
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color);
1744
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--BorderColor);
1745
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor);
1761
1746
  }
1762
1747
 
1763
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
1764
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
1765
- color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
1766
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
1748
+ .pf-v6-c-label.pf-m-green {
1749
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-green--BackgroundColor);
1750
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-green--Color);
1751
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-green__icon--Color);
1752
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor);
1753
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-green--m-clickable--hover--Color);
1754
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-green--m-clickable--hover__icon--Color);
1755
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-green--m-outline--BorderColor);
1756
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor);
1767
1757
  }
1768
1758
 
1769
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
1770
- content: none;
1759
+ .pf-v6-c-label.pf-m-teal {
1760
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-teal--BackgroundColor);
1761
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-teal--Color);
1762
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-teal__icon--Color);
1763
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor);
1764
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover--Color);
1765
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover__icon--Color);
1766
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--BorderColor);
1767
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor);
1771
1768
  }
1772
1769
 
1773
- .pf-v6-c-menu-toggle.pf-m-typeahead {
1774
- --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
1775
- --pf-v6-c-menu-toggle--Gap: 0;
1776
- align-items: stretch;
1777
- padding: 0;
1770
+ .pf-v6-c-label.pf-m-purple {
1771
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-purple--BackgroundColor);
1772
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-purple--Color);
1773
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-purple__icon--Color);
1774
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor);
1775
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover--Color);
1776
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover__icon--Color);
1777
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--BorderColor);
1778
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor);
1778
1779
  }
1779
1780
 
1780
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
1781
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
1781
+ .pf-v6-c-label.pf-m-success {
1782
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-success--BackgroundColor);
1783
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-success--Color);
1784
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-success__icon--Color);
1785
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor);
1786
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-success--m-clickable--hover--Color);
1787
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-clickable--hover__icon--Color);
1788
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-success--m-outline__icon--Color);
1789
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-success--m-outline--BorderColor);
1790
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor);
1791
+ --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);
1782
1792
  }
1783
1793
 
1784
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
1785
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
1786
- display: flex;
1787
- align-items: stretch;
1794
+ .pf-v6-c-label.pf-m-warning {
1795
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-warning--BackgroundColor);
1796
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-warning--Color);
1797
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-warning__icon--Color);
1798
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor);
1799
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover--Color);
1800
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover__icon--Color);
1801
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-warning--m-outline__icon--Color);
1802
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--BorderColor);
1803
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor);
1804
+ --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);
1788
1805
  }
1789
1806
 
1790
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
1791
- --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
1792
- flex: 1;
1807
+ .pf-v6-c-label.pf-m-danger {
1808
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-danger--BackgroundColor);
1809
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-danger--Color);
1810
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-danger__icon--Color);
1811
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor);
1812
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover--Color);
1813
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover__icon--Color);
1814
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-danger--m-outline__icon--Color);
1815
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--BorderColor);
1816
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor);
1817
+ --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);
1793
1818
  }
1794
1819
 
1795
- .pf-v6-c-menu-toggle__button {
1796
- gap: var(--pf-v6-c-menu-toggle__button--Gap);
1797
- align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
1798
- min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
1799
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
1800
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
1801
- color: inherit;
1802
- background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
1803
- border: 0;
1820
+ .pf-v6-c-label.pf-m-info {
1821
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-info--BackgroundColor);
1822
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-info--Color);
1823
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-info__icon--Color);
1824
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor);
1825
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-info--m-clickable--hover--Color);
1826
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-clickable--hover__icon--Color);
1827
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-info--m-outline__icon--Color);
1828
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-info--m-outline--BorderColor);
1829
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor);
1830
+ --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);
1804
1831
  }
1805
1832
 
1806
- .pf-v6-c-menu-toggle__button.pf-m-text {
1807
- display: inline-flex;
1808
- align-items: baseline;
1833
+ .pf-v6-c-label.pf-m-custom {
1834
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-custom--BackgroundColor);
1835
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-custom--Color);
1836
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-custom__icon--Color);
1837
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor);
1838
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover--Color);
1839
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover__icon--Color);
1840
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-custom--m-outline__icon--Color);
1841
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--BorderColor);
1842
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor);
1843
+ --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);
1809
1844
  }
1810
1845
 
1811
- .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) {
1812
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
1813
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
1846
+ .pf-v6-c-label.pf-m-compact {
1847
+ --pf-v6-c-label--PaddingBlockStart: var(--pf-v6-c-label--m-compact--PaddingBlockStart);
1848
+ --pf-v6-c-label--PaddingInlineEnd: var(--pf-v6-c-label--m-compact--PaddingInlineEnd);
1849
+ --pf-v6-c-label--PaddingBlockEnd: var(--pf-v6-c-label--m-compact--PaddingBlockEnd);
1850
+ --pf-v6-c-label--PaddingInlineStart: var(--pf-v6-c-label--m-compact--PaddingInlineStart);
1851
+ --pf-v6-c-label--FontSize: var(--pf-v6-c-label--m-compact--FontSize);
1852
+ --pf-v6-c-label--MinWidth: var(--pf-v6-c-label--m-compact--MinWidth);
1853
+ --pf-v6-c-label--m-editable--TextUnderlineOffset: var(--pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset);
1814
1854
  }
1815
1855
 
1816
- .pf-v6-c-menu-toggle__text {
1817
- overflow: hidden;
1818
- text-overflow: ellipsis;
1819
- white-space: nowrap;
1820
- min-width: 0;
1856
+ .pf-v6-c-label.pf-m-filled .pf-v6-c-label__actions .pf-v6-c-button {
1857
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-label--m-filled__actions--c-button__icon--Color);
1821
1858
  }
1822
1859
 
1823
- .pf-v6-c-menu-toggle__count {
1824
- display: flex;
1825
- flex-wrap: nowrap;
1860
+ .pf-v6-c-label.pf-m-outline {
1861
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-outline--Color);
1862
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-outline--BorderWidth);
1863
+ --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-outline--BorderColor);
1864
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-outline--BackgroundColor);
1865
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-outline__icon--Color);
1866
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor);
1867
+ --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
1868
+ --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
1869
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover--Color);
1870
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover__icon--Color);
1826
1871
  }
1827
1872
 
1828
- .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
1829
- .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
1830
- .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 {
1831
- margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
1832
- margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
1873
+ .pf-v6-c-label.pf-m-editable {
1874
+ --pf-v6-c-label__content--MaxWidth: var(--pf-v6-c-label--m-editable__content--MaxWidth);
1875
+ --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable__content--Cursor);
1833
1876
  }
1834
1877
 
1835
- .pf-v6-c-menu-toggle__icon {
1836
- flex-shrink: 0;
1837
- min-width: 1lh;
1838
- transition-delay: var(--pf-v6-c-menu-toggle__icon--TransitionDelay);
1839
- transition-duration: var(--pf-v6-c-menu-toggle__icon--TransitionDuration);
1840
- transition-property: var(--pf-v6-c-menu-toggle__icon--TransitionProperty);
1841
- rotate: var(--pf-v6-c-menu-toggle__icon--Rotate);
1878
+ .pf-v6-c-label.pf-m-editable .pf-v6-c-label__content:is(:hover, :focus) {
1879
+ --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--hover--TextDecorationLine);
1880
+ --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-v6-c-label--m-editable--hover--TextDecorationStyle);
1842
1881
  }
1843
1882
 
1844
- .pf-v6-c-menu-toggle__icon :where(picture, img) {
1845
- vertical-align: middle;
1883
+ .pf-v6-c-label.pf-m-editable .pf-v6-c-label__text {
1884
+ text-decoration-line: var(--pf-v6-c-label--m-editable--TextDecorationLine);
1885
+ text-decoration-style: var(--pf-v6-c-label--m-editable--TextDecorationStyle);
1886
+ text-underline-offset: var(--pf-v6-c-label--m-editable--TextUnderlineOffset);
1846
1887
  }
1847
1888
 
1848
- .pf-v6-c-menu-toggle__controls {
1849
- display: flex;
1850
- gap: var(--pf-v6-c-menu-toggle__controls--Gap);
1851
- align-items: center;
1852
- justify-content: center;
1853
- margin-inline-start: auto;
1889
+ .pf-v6-c-label.pf-m-editable-active {
1890
+ --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine);
1891
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-editable--m-editable-active--BackgroundColor);
1892
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-editable--m-editable-active--Color);
1893
+ --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable--m-editable-active__content--Cursor);
1854
1894
  }
1855
1895
 
1856
- .pf-v6-c-menu-toggle__toggle-icon {
1857
- min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
1858
- color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
1896
+ .pf-v6-c-label.pf-m-overflow {
1897
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-overflow--Color);
1898
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-overflow--BackgroundColor);
1899
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-overflow--BorderWidth);
1859
1900
  }
1860
1901
 
1861
- .pf-v6-c-menu-toggle__status-icon {
1862
- color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
1902
+ .pf-v6-c-label.pf-m-overflow:is(:hover, :focus) {
1903
+ --pf-v6-c-label--m-overflow--Color: var(--pf-v6-c-label--m-overflow--hover--Color);
1904
+ --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-v6-c-label--m-overflow--hover--BackgroundColor);
1905
+ --pf-v6-c-label--m-overflow--BorderWidth: var(--pf-v6-c-label--m-overflow--hover--BorderWidth);
1863
1906
  }
1864
1907
 
1865
- .pf-v6-c-label-group {
1866
- --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
1867
- --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
1868
- --pf-v6-c-label-group--MaxWidth: 100%;
1869
- --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
1870
- --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
1871
- --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
1872
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
1873
- --pf-v6-c-label-group__main--MaxWidth: 100%;
1874
- --pf-v6-c-label-group__main--MinWidth: 0;
1875
- --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
1876
- --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
1877
- --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
1878
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
1879
- --pf-v6-c-label-group__list--MaxWidth: 100%;
1880
- --pf-v6-c-label-group__list--MinWidth: 0;
1881
- --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
1882
- --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
1883
- --pf-v6-c-label-group__list-item--MaxWidth: 100%;
1884
- --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1885
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1886
- --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1887
- --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1888
- --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
1889
- --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
1890
- --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
1891
- --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1892
- --pf-v6-c-label-group__label--MaxWidth: 18ch;
1893
- --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
1894
- --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1895
- --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1896
- --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1897
- --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1898
- --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
1899
- --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
1900
- --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
1901
- --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
1902
- --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
1908
+ .pf-v6-c-label.pf-m-add {
1909
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-add--Color);
1910
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-add--BackgroundColor);
1911
+ --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-add--BorderColor);
1912
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-add--BorderWidth);
1903
1913
  }
1904
1914
 
1905
- .pf-v6-c-label-group {
1906
- display: inline-flex;
1907
- row-gap: var(--pf-v6-c-label-group--RowGap);
1908
- column-gap: var(--pf-v6-c-label-group--ColumnGap);
1909
- align-items: center;
1910
- max-width: var(--pf-v6-c-label-group--MaxWidth);
1915
+ .pf-v6-c-label.pf-m-add:is(:hover, :focus) {
1916
+ --pf-v6-c-label--m-add--Color: var(--pf-v6-c-label--m-add--hover--Color);
1917
+ --pf-v6-c-label--m-add--BackgroundColor: var(--pf-v6-c-label--m-add--hover--BackgroundColor);
1918
+ --pf-v6-c-label--m-add--BorderColor: var(--pf-v6-c-label--m-add--hover--BorderColor);
1919
+ --pf-v6-c-label--m-add--BorderWidth: var(--pf-v6-c-label--m-add--hover--BorderWidth);
1911
1920
  }
1912
1921
 
1913
- .pf-v6-c-label-group.pf-m-category {
1914
- padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
1915
- padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
1916
- padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
1917
- padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
1918
- background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
1919
- border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
1920
- border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
1922
+ .pf-v6-c-label.pf-m-clickable {
1923
+ --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-clickable__content--Cursor);
1921
1924
  }
1922
1925
 
1923
- .pf-v6-c-label-group.pf-m-vertical {
1924
- --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
1925
- --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
1926
- --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
1927
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
1928
- --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
1929
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
1930
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
1926
+ .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) {
1927
+ text-decoration-line: none;
1931
1928
  }
1932
1929
 
1933
- .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
1934
- align-items: flex-start;
1930
+ .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
1931
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-clickable--hover--Color);
1932
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
1933
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-clickable--hover--BackgroundColor);
1934
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-clickable--hover--BorderWidth);
1935
+ --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-clickable--hover--BorderColor);
1936
+ --pf-v6-c-label--m-outline--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
1937
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
1935
1938
  }
1936
1939
 
1937
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
1938
- flex-direction: column;
1939
- align-items: flex-start;
1940
- max-width: var(--pf-v6-c-label-group__list--MaxWidth);
1940
+ .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) ~ .pf-v6-c-label__actions .pf-v6-c-button {
1941
+ --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
1941
1942
  }
1942
1943
 
1943
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
1944
- flex-direction: column;
1945
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
1944
+ .pf-v6-c-label.pf-m-disabled {
1945
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-disabled--BackgroundColor);
1946
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-disabled--Color);
1947
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-disabled__icon--Color);
1948
+ --pf-v6-c-label--BorderWidth: 0;
1949
+ pointer-events: none;
1946
1950
  }
1947
1951
 
1948
- .pf-v6-c-label-group.pf-m-editable,
1949
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1950
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
1951
- display: flex;
1952
+ .pf-v6-c-label.pf-m-disabled .pf-v6-c-button {
1953
+ --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-v6-c-label--m-disabled--c-button--disabled__icon--Color);
1952
1954
  }
1953
1955
 
1954
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1955
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
1956
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
1957
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
1958
- flex: 1;
1956
+ .pf-v6-c-label,
1957
+ .pf-v6-c-label__content {
1958
+ display: inline-flex;
1959
+ align-items: center;
1960
+ justify-content: center;
1959
1961
  }
1960
1962
 
1961
- .pf-v6-c-label-group__main {
1962
- display: flex;
1963
- flex: 1;
1964
- flex-wrap: wrap;
1965
- row-gap: var(--pf-v6-c-label-group__main--RowGap);
1966
- column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
1967
- align-items: baseline;
1968
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
1963
+ .pf-v6-c-label__text {
1964
+ overflow: hidden;
1965
+ text-overflow: ellipsis;
1966
+ white-space: nowrap;
1967
+ max-width: var(--pf-v6-c-label__text--MaxWidth);
1969
1968
  }
1970
1969
 
1971
- .pf-v6-c-label-group__list {
1972
- display: inline-flex;
1973
- flex-wrap: wrap;
1974
- row-gap: var(--pf-v6-c-label-group__list--RowGap);
1975
- column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
1976
- min-width: var(--pf-v6-c-label-group__list--MinWidth);
1970
+ .pf-v6-c-label__content {
1971
+ gap: var(--pf-v6-c-label__content--Gap);
1972
+ max-width: var(--pf-v6-c-label__content--MaxWidth);
1973
+ padding: 0;
1974
+ overflow: hidden;
1975
+ color: var(--pf-v6-c-label--Color);
1976
+ cursor: var(--pf-v6-c-label__content--Cursor, revert);
1977
+ background: transparent;
1978
+ border-width: 0;
1977
1979
  }
1978
1980
 
1979
- .pf-v6-c-label-group__list-item {
1980
- display: inline-flex;
1981
- max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
1981
+ .pf-v6-c-label__content::before {
1982
+ position: absolute;
1983
+ inset: 0;
1984
+ z-index: -1;
1985
+ pointer-events: none;
1986
+ content: "";
1987
+ background-color: var(--pf-v6-c-label--BackgroundColor);
1988
+ border: var(--pf-v6-c-label--BorderWidth) solid var(--pf-v6-c-label--BorderColor);
1989
+ border-radius: var(--pf-v6-c-label--BorderRadius);
1982
1990
  }
1983
1991
 
1984
- .pf-v6-c-label-group__label {
1992
+ input.pf-v6-c-label__content {
1985
1993
  overflow: hidden;
1986
1994
  text-overflow: ellipsis;
1987
1995
  white-space: nowrap;
1988
- max-width: var(--pf-v6-c-label-group__label--MaxWidth);
1989
1996
  }
1990
1997
 
1991
- .pf-v6-c-label-group__close {
1992
- display: flex;
1993
- align-self: flex-start;
1998
+ .pf-v6-c-label__icon {
1999
+ color: var(--pf-v6-c-label__icon--Color);
1994
2000
  }
1995
2001
 
1996
- .pf-v6-c-label-group__close .pf-v6-c-button {
1997
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
1998
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
1999
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
2000
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
2001
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
2002
+ .pf-v6-c-label__actions {
2003
+ margin-inline-end: var(--pf-v6-c-label__actions--MarginInlineEnd);
2002
2004
  }
2003
2005
 
2004
- .pf-v6-c-label-group__textarea {
2005
- min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
2006
- padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
2007
- padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
2008
- padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
2009
- padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
2010
- white-space: nowrap;
2011
- resize: none;
2012
- scrollbar-width: none;
2013
- -ms-overflow-style: none;
2014
- border: 0;
2006
+ .pf-v6-c-label.pf-m-compact .pf-v6-c-label__actions .pf-v6-c-button {
2007
+ --pf-v6-c-button--m-plain--m-no-padding--after--Inset: 0 calc(-0.125rem);
2015
2008
  }
2016
2009
 
2017
- .pf-v6-c-label-group__textarea::-webkit-scrollbar {
2018
- display: none;
2010
+ .pf-v6-c-label__actions .pf-v6-c-button {
2011
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label__actions--c-button--FontSize);
2012
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label__actions--c-button--PaddingBlockStart);
2013
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd);
2014
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd);
2015
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label__actions--c-button--PaddingInlineStart);
2016
+ margin-block-start: var(--pf-v6-c-label__actions--c-button--MarginBlockStart);
2017
+ margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
2018
+ outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
2019
2019
  }
2020
2020
 
2021
2021
  .pf-v6-c-button {
@@ -3028,122 +3028,6 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
3028
3028
  scale: 1.5;
3029
3029
  }
3030
3030
  }
3031
- .pf-v6-c-breadcrumb {
3032
- --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
3033
- --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
3034
- --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3035
- --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
3036
- --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3037
- --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
3038
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3039
- --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3040
- --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
3041
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
3042
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
3043
- --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
3044
- --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
3045
- --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
3046
- --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
3047
- --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
3048
- --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
3049
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3050
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
3051
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3052
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
3053
- }
3054
-
3055
- .pf-v6-c-breadcrumb {
3056
- display: inline-flex;
3057
- }
3058
-
3059
- .pf-v6-c-breadcrumb__list {
3060
- display: flex;
3061
- flex-wrap: wrap;
3062
- align-items: center;
3063
- }
3064
-
3065
- .pf-v6-c-breadcrumb__item {
3066
- display: flex;
3067
- align-items: baseline;
3068
- font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
3069
- font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
3070
- line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
3071
- white-space: nowrap;
3072
- list-style: none;
3073
- }
3074
-
3075
- .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
3076
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
3077
- }
3078
-
3079
- .pf-v6-c-breadcrumb__item:not(:last-child) {
3080
- margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
3081
- }
3082
-
3083
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
3084
- scale: -1 1;
3085
- }
3086
-
3087
- .pf-v6-c-breadcrumb__item-divider {
3088
- margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
3089
- font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
3090
- line-height: 1;
3091
- color: var(--pf-v6-c-breadcrumb__item-divider--Color);
3092
- }
3093
-
3094
- .pf-v6-c-breadcrumb__link {
3095
- padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
3096
- padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
3097
- font-size: inherit;
3098
- font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
3099
- line-height: inherit;
3100
- color: var(--pf-v6-c-breadcrumb__link--Color);
3101
- text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
3102
- text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
3103
- word-break: break-word;
3104
- background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
3105
- }
3106
-
3107
- .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
3108
- --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
3109
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
3110
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
3111
- }
3112
-
3113
- .pf-v6-c-breadcrumb__link.pf-m-current {
3114
- cursor: default;
3115
- }
3116
-
3117
- .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
3118
- color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
3119
- text-decoration-line: none;
3120
- }
3121
-
3122
- button.pf-v6-c-breadcrumb__link {
3123
- border: none;
3124
- }
3125
-
3126
- .pf-v6-c-breadcrumb__dropdown {
3127
- margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
3128
- margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
3129
- margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
3130
- margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
3131
- }
3132
-
3133
- .pf-v6-c-breadcrumb__heading {
3134
- display: inline;
3135
- font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
3136
- }
3137
-
3138
- .pf-v6-c-breadcrumb__link,
3139
- .pf-v6-c-breadcrumb__heading {
3140
- white-space: normal;
3141
- }
3142
-
3143
- .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
3144
- display: none;
3145
- }
3146
-
3147
3031
  .pf-v6-c-menu {
3148
3032
  --pf-v6-c-menu--RowGap: var(--pf-t--global--spacer--sm);
3149
3033
  --pf-v6-c-menu--Width: auto;
@@ -3840,6 +3724,122 @@ button.pf-v6-c-breadcrumb__link {
3840
3724
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
3841
3725
  }
3842
3726
 
3727
+ .pf-v6-c-breadcrumb {
3728
+ --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
3729
+ --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
3730
+ --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3731
+ --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
3732
+ --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3733
+ --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
3734
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3735
+ --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3736
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
3737
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
3738
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
3739
+ --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
3740
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
3741
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
3742
+ --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
3743
+ --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
3744
+ --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
3745
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3746
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
3747
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3748
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
3749
+ }
3750
+
3751
+ .pf-v6-c-breadcrumb {
3752
+ display: inline-flex;
3753
+ }
3754
+
3755
+ .pf-v6-c-breadcrumb__list {
3756
+ display: flex;
3757
+ flex-wrap: wrap;
3758
+ align-items: center;
3759
+ }
3760
+
3761
+ .pf-v6-c-breadcrumb__item {
3762
+ display: flex;
3763
+ align-items: baseline;
3764
+ font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
3765
+ font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
3766
+ line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
3767
+ white-space: nowrap;
3768
+ list-style: none;
3769
+ }
3770
+
3771
+ .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
3772
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
3773
+ }
3774
+
3775
+ .pf-v6-c-breadcrumb__item:not(:last-child) {
3776
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
3777
+ }
3778
+
3779
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
3780
+ scale: -1 1;
3781
+ }
3782
+
3783
+ .pf-v6-c-breadcrumb__item-divider {
3784
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
3785
+ font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
3786
+ line-height: 1;
3787
+ color: var(--pf-v6-c-breadcrumb__item-divider--Color);
3788
+ }
3789
+
3790
+ .pf-v6-c-breadcrumb__link {
3791
+ padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
3792
+ padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
3793
+ font-size: inherit;
3794
+ font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
3795
+ line-height: inherit;
3796
+ color: var(--pf-v6-c-breadcrumb__link--Color);
3797
+ text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
3798
+ text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
3799
+ word-break: break-word;
3800
+ background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
3801
+ }
3802
+
3803
+ .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
3804
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
3805
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
3806
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
3807
+ }
3808
+
3809
+ .pf-v6-c-breadcrumb__link.pf-m-current {
3810
+ cursor: default;
3811
+ }
3812
+
3813
+ .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
3814
+ color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
3815
+ text-decoration-line: none;
3816
+ }
3817
+
3818
+ button.pf-v6-c-breadcrumb__link {
3819
+ border: none;
3820
+ }
3821
+
3822
+ .pf-v6-c-breadcrumb__dropdown {
3823
+ margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
3824
+ margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
3825
+ margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
3826
+ margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
3827
+ }
3828
+
3829
+ .pf-v6-c-breadcrumb__heading {
3830
+ display: inline;
3831
+ font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
3832
+ }
3833
+
3834
+ .pf-v6-c-breadcrumb__link,
3835
+ .pf-v6-c-breadcrumb__heading {
3836
+ white-space: normal;
3837
+ }
3838
+
3839
+ .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
3840
+ display: none;
3841
+ }
3842
+
3843
3843
  .pf-v6-c-spinner {
3844
3844
  --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
3845
3845
  --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);