@patternfly/react-templates 6.2.0-prerelease.18 → 6.2.0-prerelease.19

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-Cdv2INad.css → output-mmagDx4d.css} +1336 -1336
  6. package/package.json +3 -3
package/dist/umd/assets/{output-Cdv2INad.css → output-mmagDx4d.css} RENAMED
@@ -3,476 +3,86 @@
3
3
  pointer-events: none;
4
4
  }
5
5
 
6
- .pf-v6-c-menu-toggle {
7
- --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
8
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
9
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
10
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
11
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
12
- --pf-v6-c-menu-toggle--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
13
- --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
14
- --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
15
- --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
16
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
17
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
18
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
19
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--action--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--action--default);
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--action--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__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
42
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
43
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
44
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
45
- --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
46
- --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
47
- --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
48
- --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
49
- --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
50
- --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
51
- --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
52
- --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
53
- --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
54
- --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
55
- --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
56
- --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
57
- --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
58
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
59
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
60
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
61
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
62
- --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
63
- --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
64
- --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
65
- --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
66
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
67
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
68
- --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
69
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
70
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
71
- --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
72
- --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
73
- --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
74
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
75
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
76
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
77
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
78
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
79
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
80
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
81
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
82
- --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
83
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
84
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
85
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
86
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
87
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
88
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
89
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
90
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
91
- --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
92
- --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
93
- --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
94
- --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
95
- --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
96
- --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
97
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
98
- --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));
99
- --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
100
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
101
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
102
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
103
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
104
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
105
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
106
- --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
107
- --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
108
- --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
109
- --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
110
- --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
111
- --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
112
- --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
113
- --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
114
- --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
115
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
116
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
117
- --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
118
- --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
119
- --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
120
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
121
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
122
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
123
- --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
124
- --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
125
- --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
126
- --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
127
- --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
128
- --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
129
- --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
130
- --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
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%);
131
21
  }
132
22
 
133
- .pf-v6-c-menu-toggle {
134
- position: relative;
135
- display: inline-flex;
136
- gap: var(--pf-v6-c-menu-toggle--Gap);
137
- align-items: center;
138
- justify-content: center;
139
- min-width: var(--pf-v6-c-menu-toggle--MinWidth);
140
- max-width: 100%;
141
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
142
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
143
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
144
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
145
- font-size: var(--pf-v6-c-menu-toggle--FontSize);
146
- line-height: var(--pf-v6-c-menu-toggle--LineHeight);
147
- color: var(--pf-v6-c-menu-toggle--Color);
148
- cursor: pointer;
149
- background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
150
- border: 0;
151
- transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
152
- transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
153
- transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
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);
154
28
  }
155
29
 
156
- .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
157
- border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
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);
158
34
  }
159
35
 
160
- .pf-v6-c-menu-toggle::before {
161
- position: absolute;
162
- inset-block-start: 0;
163
- inset-block-end: 0;
164
- inset-inline-start: 0;
165
- inset-inline-end: 0;
166
- z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
167
- pointer-events: none;
168
- content: "";
169
- border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
170
- transition: inherit;
36
+ .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
37
+ align-self: center;
38
+ transform: none;
171
39
  }
172
40
 
173
- .pf-v6-c-menu-toggle.pf-m-primary {
174
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
175
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
176
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
177
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
178
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
179
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
180
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
181
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
182
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
183
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
184
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
185
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
186
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
187
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
188
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
189
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
190
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
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));
191
46
  }
192
47
 
193
- .pf-v6-c-menu-toggle.pf-m-secondary {
194
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
195
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
196
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
197
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
198
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
199
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
200
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
201
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
202
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
203
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
204
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
205
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
206
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
207
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
208
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
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);
209
53
  }
210
54
 
211
- .pf-v6-c-menu-toggle.pf-m-full-height {
212
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
213
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
214
- --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
215
- align-items: center;
216
- height: 100%;
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);
217
59
  }
218
60
 
219
- .pf-v6-c-menu-toggle.pf-m-full-width {
220
- width: 100%;
61
+ .pf-v6-c-check__body {
62
+ grid-column: 2;
221
63
  }
222
64
 
223
- .pf-v6-c-menu-toggle.pf-m-plain {
224
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
225
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
226
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
227
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
228
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
229
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
230
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
231
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
232
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
233
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
234
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
235
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
236
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
237
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
238
- }
239
-
240
- .pf-v6-c-menu-toggle.pf-m-plain::before {
241
- border: none;
242
- }
243
-
244
- .pf-v6-c-menu-toggle:is(:hover, :focus) {
245
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
246
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
247
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
248
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
249
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
250
- }
251
-
252
- .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
253
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
254
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
255
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
256
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
257
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
258
- }
259
-
260
- .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
261
- border: 0;
262
- }
263
-
264
- .pf-v6-c-menu-toggle.pf-m-small {
265
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
266
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
267
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
268
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
269
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
270
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
271
- --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);
272
- --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);
273
- }
274
-
275
- .pf-v6-c-menu-toggle.pf-m-success {
276
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
277
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
278
- }
279
-
280
- .pf-v6-c-menu-toggle.pf-m-warning {
281
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
282
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
283
- }
284
-
285
- .pf-v6-c-menu-toggle.pf-m-danger {
286
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
287
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
288
- }
289
-
290
- .pf-v6-c-menu-toggle.pf-m-placeholder {
291
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
292
- }
293
-
294
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
295
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
296
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
297
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
298
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
299
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
300
- }
301
-
302
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
303
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
304
- pointer-events: none;
305
- }
306
-
307
- .pf-v6-c-menu-toggle.pf-m-split-button {
308
- --pf-v6-c-menu-toggle--Gap: 0;
309
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
310
- padding: 0;
311
- }
312
-
313
- .pf-v6-c-menu-toggle.pf-m-split-button > * {
314
- position: relative;
315
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
316
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
317
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
318
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
319
- }
320
-
321
- .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
322
- border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
323
- border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
324
- }
325
-
326
- .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
327
- border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
328
- border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
329
- }
330
-
331
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
332
- --pf-v6-c-check__label--Color: currentcolor;
333
- --pf-v6-c-check__label--disabled--Color: currentcolor;
334
- align-items: center;
335
- align-self: stretch;
336
- }
337
-
338
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
339
- --pf-v6-c-check__input--TranslateY: 0;
340
- align-self: center;
341
- }
342
-
343
- .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
344
- 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);
345
- }
346
-
347
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
348
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
349
- }
350
-
351
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
352
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
353
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
354
- }
355
-
356
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
357
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
358
- --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);
359
- }
360
-
361
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
362
- --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);
363
- }
364
-
365
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
366
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
367
- }
368
-
369
- .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,
370
- .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,
371
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
372
- padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
373
- }
374
-
375
- .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,
376
- .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,
377
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
378
- padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
379
- }
380
-
381
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
382
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
383
- }
384
-
385
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
386
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
387
- color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
388
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
389
- }
390
-
391
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
392
- content: none;
393
- }
394
-
395
- .pf-v6-c-menu-toggle.pf-m-typeahead {
396
- --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
397
- --pf-v6-c-menu-toggle--Gap: 0;
398
- align-items: stretch;
399
- padding: 0;
400
- }
401
-
402
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
403
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
404
- }
405
-
406
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
407
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
408
- display: flex;
409
- align-items: stretch;
410
- }
411
-
412
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
413
- --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
414
- flex: 1;
415
- }
416
-
417
- .pf-v6-c-menu-toggle__button {
418
- gap: var(--pf-v6-c-menu-toggle__button--Gap);
419
- align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
420
- min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
421
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
422
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
423
- color: inherit;
424
- background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
425
- border: 0;
426
- }
427
-
428
- .pf-v6-c-menu-toggle__button.pf-m-text {
429
- display: inline-flex;
430
- align-items: baseline;
431
- }
432
-
433
- .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) {
434
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
435
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
436
- }
437
-
438
- .pf-v6-c-menu-toggle__text {
439
- overflow: hidden;
440
- text-overflow: ellipsis;
441
- white-space: nowrap;
442
- min-width: 0;
443
- }
444
-
445
- .pf-v6-c-menu-toggle__count {
446
- display: flex;
447
- flex-wrap: nowrap;
448
- }
449
-
450
- .pf-v6-c-menu-toggle__icon {
451
- flex-shrink: 0;
452
- }
453
-
454
- .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
455
- .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
456
- .pf-v6-c-menu-toggle__icon.pf-m-avatar svg {
457
- margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
458
- margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
65
+ .pf-v6-c-check__label,
66
+ .pf-v6-c-check__input {
67
+ justify-self: start;
459
68
  }
460
69
 
461
- .pf-v6-c-menu-toggle__controls {
462
- display: flex;
463
- gap: var(--pf-v6-c-menu-toggle__controls--Gap);
464
- align-items: center;
465
- justify-content: center;
466
- margin-inline-start: auto;
70
+ label.pf-v6-c-check, .pf-v6-c-check__label,
71
+ .pf-v6-c-check__input {
72
+ cursor: pointer;
467
73
  }
468
74
 
469
- .pf-v6-c-menu-toggle__toggle-icon {
470
- min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
471
- color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
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;
472
80
  }
473
81
 
474
- .pf-v6-c-menu-toggle__status-icon {
475
- color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
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);
476
86
  }
477
87
 
478
88
  .pf-v6-c-button {
@@ -1123,12 +733,387 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1123
733
  align-items: center;
1124
734
  }
1125
735
 
1126
- .pf-v6-c-label {
1127
- --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1128
- --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1129
- --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1130
- --pf-v6-c-label--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1131
- --pf-v6-c-label--MaxWidth: 100%;
736
+ .pf-v6-c-text-input-group {
737
+ --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
738
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
739
+ --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
740
+ --pf-v6-c-text-input-group--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
741
+ --pf-v6-c-text-input-group--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--default);
742
+ --pf-v6-c-text-input-group--BorderWidth: var(--pf-t--global--border--width--control--default);
743
+ --pf-v6-c-text-input-group__LineHeight: var(--pf-t--global--font--line-height--body);
744
+ --pf-v6-c-text-input-group__FontSize: var(--pf-t--global--font--size--body--default);
745
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-t--global--border--color--hover);
746
+ --pf-v6-c-text-input-group--m-hover--m-success--BorderColor: var(--pf-t--global--border--color--status--success--hover);
747
+ --pf-v6-c-text-input-group--m-hover--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
748
+ --pf-v6-c-text-input-group--m-hover--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
749
+ --pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
750
+ --pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
751
+ --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
752
+ --pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--sm) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
753
+ --pf-v6-c-text-input-group__main--RowGap: var(--pf-t--global--spacer--xs);
754
+ --pf-v6-c-text-input-group__main--ColumnGap: var(--pf-t--global--spacer--xs);
755
+ --pf-v6-c-text-input-group__text--BorderRadius--base: var(--pf-t--global--border--radius--small);
756
+ --pf-v6-c-text-input-group__text--BorderStartStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
757
+ --pf-v6-c-text-input-group__text--BorderStartEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
758
+ --pf-v6-c-text-input-group__text--BorderEndEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
759
+ --pf-v6-c-text-input-group__text--BorderEndStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
760
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
761
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
762
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
763
+ --pf-v6-c-text-input-group__text-input--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
764
+ --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
765
+ --pf-v6-c-text-input-group__text-input--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
766
+ --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
767
+ --pf-v6-c-text-input-group__text-input--MinWidth: 12ch;
768
+ --pf-v6-c-text-input-group__text-input--m-hint--Color: var(--pf-t--global--text--color--placeholder);
769
+ --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-t--global--text--color--placeholder);
770
+ --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
771
+ --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
772
+ --pf-v6-c-text-input-group__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
773
+ --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
774
+ --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
775
+ --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
776
+ --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
777
+ --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
778
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
779
+ --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
780
+ --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
781
+ --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
782
+ --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
783
+ --pf-v6-c-text-input-group__icon--TranslateY: -50%;
784
+ --pf-v6-c-text-input-group__utilities--child--MarginInlineStart: var(--pf-t--global--spacer--xs);
785
+ --pf-v6-c-text-input-group--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
786
+ --pf-v6-c-text-input-group--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
787
+ }
788
+
789
+ .pf-v6-c-text-input-group {
790
+ position: relative;
791
+ display: flex;
792
+ width: 100%;
793
+ font-size: var(--pf-v6-c-text-input-group__FontSize);
794
+ line-height: var(--pf-v6-c-text-input-group__LineHeight);
795
+ color: var(--pf-v6-c-text-input-group--Color, inherit);
796
+ background-color: var(--pf-v6-c-text-input-group--BackgroundColor);
797
+ border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
798
+ border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
799
+ border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
800
+ border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
801
+ }
802
+
803
+ .pf-v6-c-text-input-group::before {
804
+ position: absolute;
805
+ inset: 0;
806
+ pointer-events: none;
807
+ content: "";
808
+ border: var(--pf-v6-c-text-input-group--BorderWidth) solid var(--pf-v6-c-text-input-group--BorderColor);
809
+ border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
810
+ border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
811
+ border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
812
+ border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
813
+ }
814
+
815
+ .pf-v6-c-text-input-group.pf-m-disabled {
816
+ --pf-v6-c-text-input-group--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
817
+ --pf-v6-c-text-input-group__icon--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--Color);
818
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--m-status--Color);
819
+ --pf-v6-c-text-input-group--BackgroundColor: var(--pf-v6-c-text-input-group--m-disabled--BackgroundColor);
820
+ pointer-events: none;
821
+ }
822
+
823
+ .pf-v6-c-text-input-group.pf-m-plain {
824
+ --pf-v6-c-text-input-group--BackgroundColor: transparent;
825
+ }
826
+
827
+ .pf-v6-c-text-input-group.pf-m-plain::before {
828
+ border: 0;
829
+ }
830
+
831
+ .pf-v6-c-text-input-group.pf-m-success {
832
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-success--BorderColor);
833
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-success--BorderColor);
834
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-success__icon--m-status--Color);
835
+ }
836
+
837
+ .pf-v6-c-text-input-group.pf-m-warning {
838
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-warning--BorderColor);
839
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-warning--BorderColor);
840
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color);
841
+ }
842
+
843
+ .pf-v6-c-text-input-group.pf-m-error {
844
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-error--BorderColor);
845
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-error--BorderColor);
846
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-error__icon--m-status--Color);
847
+ }
848
+
849
+ .pf-v6-c-text-input-group:hover {
850
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-hover--BorderColor);
851
+ }
852
+
853
+ .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) {
854
+ --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd);
855
+ }
856
+
857
+ .pf-v6-c-text-input-group:has(> .pf-v6-c-text-input-group__utilities) {
858
+ --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd);
859
+ --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd);
860
+ }
861
+
862
+ .pf-v6-c-text-input-group__main {
863
+ display: flex;
864
+ flex: 1;
865
+ flex-wrap: wrap;
866
+ gap: var(--pf-v6-c-text-input-group__main--RowGap) var(--pf-v6-c-text-input-group__main--ColumnGap);
867
+ min-width: 0;
868
+ }
869
+
870
+ .pf-v6-c-text-input-group__main.pf-m-icon {
871
+ --pf-v6-c-text-input-group__text--Position: relative;
872
+ --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart);
873
+ display: inline-flex;
874
+ align-items: center;
875
+ justify-content: center;
876
+ min-width: calc(var(--pf-v6-c-text-input-group__LineHeight) * var(--pf-v6-c-text-input-group__FontSize));
877
+ }
878
+
879
+ .pf-v6-c-text-input-group__main > :first-child:not(.pf-v6-c-text-input-group__text) {
880
+ margin-inline-start: var(--pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart);
881
+ }
882
+
883
+ .pf-v6-c-text-input-group__main .pf-v6-c-label-group__main {
884
+ padding-block-start: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart);
885
+ padding-block-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd);
886
+ padding-inline-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd);
887
+ }
888
+
889
+ .pf-v6-c-text-input-group__text {
890
+ position: var(--pf-v6-c-text-input-group__text--Position, revert);
891
+ display: inline-grid;
892
+ flex: 1;
893
+ grid-template-areas: "text-input";
894
+ grid-template-columns: 1fr;
895
+ }
896
+
897
+ .pf-v6-c-text-input-group__icon {
898
+ position: absolute;
899
+ inset-block-start: 50%;
900
+ inset-inline-start: var(--pf-v6-c-text-input-group__icon--InsetInlineStart);
901
+ font-size: var(--pf-v6-c-text-input-group__icon--FontSize);
902
+ color: var(--pf-v6-c-text-input-group__icon--Color);
903
+ transform: translateY(var(--pf-v6-c-text-input-group__icon--TranslateY));
904
+ }
905
+
906
+ .pf-v6-c-text-input-group__icon.pf-m-status {
907
+ inset-inline-start: auto;
908
+ inset-inline-end: var(--pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd);
909
+ color: var(--pf-v6-c-text-input-group__icon--m-status--Color);
910
+ }
911
+
912
+ .pf-v6-c-text-input-group__text-input {
913
+ overflow: hidden;
914
+ text-overflow: ellipsis;
915
+ white-space: nowrap;
916
+ position: relative;
917
+ width: 100%;
918
+ min-width: var(--pf-v6-c-text-input-group__text-input--MinWidth);
919
+ padding-block-start: var(--pf-v6-c-text-input-group__text-input--PaddingBlockStart);
920
+ padding-block-end: var(--pf-v6-c-text-input-group__text-input--PaddingBlockEnd);
921
+ padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
922
+ padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
923
+ background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
924
+ border: 0;
925
+ outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
926
+ }
927
+
928
+ .pf-v6-c-text-input-group__text-input, .pf-v6-c-text-input-group__text-input.pf-m-hint {
929
+ grid-area: text-input;
930
+ }
931
+
932
+ .pf-v6-c-text-input-group__text-input.pf-m-hint {
933
+ color: var(--pf-v6-c-text-input-group__text-input--m-hint--Color);
934
+ }
935
+
936
+ .pf-v6-c-text-input-group__text-input::placeholder {
937
+ color: var(--pf-v6-c-text-input-group__text-input--placeholder--Color);
938
+ }
939
+
940
+ .pf-v6-c-text-input-group__utilities {
941
+ display: flex;
942
+ align-items: center;
943
+ margin-inline-start: var(--pf-v6-c-text-input-group__utilities--MarginInlineStart);
944
+ margin-inline-end: var(--pf-v6-c-text-input-group__utilities--MarginInlineEnd);
945
+ }
946
+
947
+ .pf-v6-c-text-input-group__utilities > * + * {
948
+ margin-inline-start: var(--pf-v6-c-text-input-group__utilities--child--MarginInlineStart);
949
+ }
950
+
951
+ .pf-v6-c-text-input-group__group {
952
+ display: flex;
953
+ }
954
+
955
+ .pf-v6-c-label-group {
956
+ --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
957
+ --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
958
+ --pf-v6-c-label-group--MaxWidth: 100%;
959
+ --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
960
+ --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
961
+ --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
962
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
963
+ --pf-v6-c-label-group__main--MaxWidth: 100%;
964
+ --pf-v6-c-label-group__main--MinWidth: 0;
965
+ --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
966
+ --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
967
+ --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
968
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
969
+ --pf-v6-c-label-group__list--MaxWidth: 100%;
970
+ --pf-v6-c-label-group__list--MinWidth: 0;
971
+ --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
972
+ --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
973
+ --pf-v6-c-label-group__list-item--MaxWidth: 100%;
974
+ --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
975
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
976
+ --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
977
+ --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
978
+ --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
979
+ --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
980
+ --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
981
+ --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
982
+ --pf-v6-c-label-group__label--MaxWidth: 18ch;
983
+ --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
984
+ --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
985
+ --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
986
+ --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
987
+ --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
988
+ --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
989
+ --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
990
+ --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
991
+ --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
992
+ --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
993
+ }
994
+
995
+ .pf-v6-c-label-group {
996
+ display: inline-flex;
997
+ row-gap: var(--pf-v6-c-label-group--RowGap);
998
+ column-gap: var(--pf-v6-c-label-group--ColumnGap);
999
+ align-items: center;
1000
+ max-width: var(--pf-v6-c-label-group--MaxWidth);
1001
+ }
1002
+
1003
+ .pf-v6-c-label-group.pf-m-category {
1004
+ padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
1005
+ padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
1006
+ padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
1007
+ padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
1008
+ background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
1009
+ border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
1010
+ border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
1011
+ }
1012
+
1013
+ .pf-v6-c-label-group.pf-m-vertical {
1014
+ --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
1015
+ --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
1016
+ --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
1017
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
1018
+ --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
1019
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
1020
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
1021
+ }
1022
+
1023
+ .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
1024
+ align-items: flex-start;
1025
+ }
1026
+
1027
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
1028
+ flex-direction: column;
1029
+ align-items: flex-start;
1030
+ max-width: var(--pf-v6-c-label-group__list--MaxWidth);
1031
+ }
1032
+
1033
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
1034
+ flex-direction: column;
1035
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
1036
+ }
1037
+
1038
+ .pf-v6-c-label-group.pf-m-editable,
1039
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1040
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
1041
+ display: flex;
1042
+ }
1043
+
1044
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1045
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
1046
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
1047
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
1048
+ flex: 1;
1049
+ }
1050
+
1051
+ .pf-v6-c-label-group__main {
1052
+ display: flex;
1053
+ flex: 1;
1054
+ flex-wrap: wrap;
1055
+ row-gap: var(--pf-v6-c-label-group__main--RowGap);
1056
+ column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
1057
+ align-items: baseline;
1058
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
1059
+ }
1060
+
1061
+ .pf-v6-c-label-group__list {
1062
+ display: inline-flex;
1063
+ flex-wrap: wrap;
1064
+ row-gap: var(--pf-v6-c-label-group__list--RowGap);
1065
+ column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
1066
+ min-width: var(--pf-v6-c-label-group__list--MinWidth);
1067
+ }
1068
+
1069
+ .pf-v6-c-label-group__list-item {
1070
+ display: inline-flex;
1071
+ max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
1072
+ }
1073
+
1074
+ .pf-v6-c-label-group__label {
1075
+ overflow: hidden;
1076
+ text-overflow: ellipsis;
1077
+ white-space: nowrap;
1078
+ max-width: var(--pf-v6-c-label-group__label--MaxWidth);
1079
+ }
1080
+
1081
+ .pf-v6-c-label-group__close {
1082
+ display: flex;
1083
+ align-self: flex-start;
1084
+ }
1085
+
1086
+ .pf-v6-c-label-group__close .pf-v6-c-button {
1087
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
1088
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
1089
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
1090
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
1091
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
1092
+ }
1093
+
1094
+ .pf-v6-c-label-group__textarea {
1095
+ min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
1096
+ padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
1097
+ padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
1098
+ padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
1099
+ padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
1100
+ white-space: nowrap;
1101
+ resize: none;
1102
+ border: 0;
1103
+ -ms-overflow-style: none;
1104
+ scrollbar-width: none;
1105
+ }
1106
+
1107
+ .pf-v6-c-label-group__textarea::-webkit-scrollbar {
1108
+ display: none;
1109
+ }
1110
+
1111
+ .pf-v6-c-label {
1112
+ --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1113
+ --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1114
+ --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1115
+ --pf-v6-c-label--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1116
+ --pf-v6-c-label--MaxWidth: 100%;
1132
1117
  --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)));
1133
1118
  --pf-v6-c-label--BorderWidth: 0;
1134
1119
  --pf-v6-c-label--BorderColor: transparent;
@@ -1655,1048 +1640,867 @@ input.pf-v6-c-label__content {
1655
1640
  outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
1656
1641
  }
1657
1642
 
1658
- .pf-v6-c-text-input-group {
1659
- --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
1660
- --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
1661
- --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
1662
- --pf-v6-c-text-input-group--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
1663
- --pf-v6-c-text-input-group--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--default);
1664
- --pf-v6-c-text-input-group--BorderWidth: var(--pf-t--global--border--width--control--default);
1665
- --pf-v6-c-text-input-group__LineHeight: var(--pf-t--global--font--line-height--body);
1666
- --pf-v6-c-text-input-group__FontSize: var(--pf-t--global--font--size--body--default);
1667
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-t--global--border--color--hover);
1668
- --pf-v6-c-text-input-group--m-hover--m-success--BorderColor: var(--pf-t--global--border--color--status--success--hover);
1669
- --pf-v6-c-text-input-group--m-hover--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
1670
- --pf-v6-c-text-input-group--m-hover--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
1671
- --pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
1672
- --pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
1673
- --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
1674
- --pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--sm) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
1675
- --pf-v6-c-text-input-group__main--RowGap: var(--pf-t--global--spacer--xs);
1676
- --pf-v6-c-text-input-group__main--ColumnGap: var(--pf-t--global--spacer--xs);
1677
- --pf-v6-c-text-input-group__text--BorderRadius--base: var(--pf-t--global--border--radius--small);
1678
- --pf-v6-c-text-input-group__text--BorderStartStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1679
- --pf-v6-c-text-input-group__text--BorderStartEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1680
- --pf-v6-c-text-input-group__text--BorderEndEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1681
- --pf-v6-c-text-input-group__text--BorderEndStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1682
- --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
1683
- --pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
1684
- --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
1685
- --pf-v6-c-text-input-group__text-input--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
1686
- --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1687
- --pf-v6-c-text-input-group__text-input--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
1688
- --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1689
- --pf-v6-c-text-input-group__text-input--MinWidth: 12ch;
1690
- --pf-v6-c-text-input-group__text-input--m-hint--Color: var(--pf-t--global--text--color--placeholder);
1691
- --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-t--global--text--color--placeholder);
1692
- --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
1693
- --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
1694
- --pf-v6-c-text-input-group__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
1695
- --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1696
- --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1697
- --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
1698
- --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
1699
- --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1700
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
1701
- --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
1702
- --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
1703
- --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
1704
- --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
1705
- --pf-v6-c-text-input-group__icon--TranslateY: -50%;
1706
- --pf-v6-c-text-input-group__utilities--child--MarginInlineStart: var(--pf-t--global--spacer--xs);
1707
- --pf-v6-c-text-input-group--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
1708
- --pf-v6-c-text-input-group--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1709
- }
1710
-
1711
- .pf-v6-c-text-input-group {
1712
- position: relative;
1713
- display: flex;
1714
- width: 100%;
1715
- font-size: var(--pf-v6-c-text-input-group__FontSize);
1716
- line-height: var(--pf-v6-c-text-input-group__LineHeight);
1717
- color: var(--pf-v6-c-text-input-group--Color, inherit);
1718
- background-color: var(--pf-v6-c-text-input-group--BackgroundColor);
1719
- border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
1720
- border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
1721
- border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
1722
- border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
1723
- }
1724
-
1725
- .pf-v6-c-text-input-group::before {
1726
- position: absolute;
1727
- inset: 0;
1728
- pointer-events: none;
1729
- content: "";
1730
- border: var(--pf-v6-c-text-input-group--BorderWidth) solid var(--pf-v6-c-text-input-group--BorderColor);
1731
- border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
1732
- border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
1733
- border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
1734
- border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
1735
- }
1736
-
1737
- .pf-v6-c-text-input-group.pf-m-disabled {
1738
- --pf-v6-c-text-input-group--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
1739
- --pf-v6-c-text-input-group__icon--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--Color);
1740
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--m-status--Color);
1741
- --pf-v6-c-text-input-group--BackgroundColor: var(--pf-v6-c-text-input-group--m-disabled--BackgroundColor);
1742
- pointer-events: none;
1743
- }
1744
-
1745
- .pf-v6-c-text-input-group.pf-m-plain {
1746
- --pf-v6-c-text-input-group--BackgroundColor: transparent;
1747
- }
1748
-
1749
- .pf-v6-c-text-input-group.pf-m-plain::before {
1750
- border: 0;
1751
- }
1752
-
1753
- .pf-v6-c-text-input-group.pf-m-success {
1754
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-success--BorderColor);
1755
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-success--BorderColor);
1756
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-success__icon--m-status--Color);
1757
- }
1758
-
1759
- .pf-v6-c-text-input-group.pf-m-warning {
1760
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-warning--BorderColor);
1761
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-warning--BorderColor);
1762
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color);
1763
- }
1764
-
1765
- .pf-v6-c-text-input-group.pf-m-error {
1766
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-error--BorderColor);
1767
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-error--BorderColor);
1768
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-error__icon--m-status--Color);
1769
- }
1770
-
1771
- .pf-v6-c-text-input-group:hover {
1772
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-hover--BorderColor);
1773
- }
1774
-
1775
- .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) {
1776
- --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd);
1777
- }
1778
-
1779
- .pf-v6-c-text-input-group:has(> .pf-v6-c-text-input-group__utilities) {
1780
- --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd);
1781
- --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd);
1782
- }
1783
-
1784
- .pf-v6-c-text-input-group__main {
1785
- display: flex;
1786
- flex: 1;
1787
- flex-wrap: wrap;
1788
- gap: var(--pf-v6-c-text-input-group__main--RowGap) var(--pf-v6-c-text-input-group__main--ColumnGap);
1789
- min-width: 0;
1643
+ .pf-v6-c-menu-toggle {
1644
+ --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
1645
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
1646
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1647
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
1648
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1649
+ --pf-v6-c-menu-toggle--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
1650
+ --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
1651
+ --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
1652
+ --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
1653
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
1654
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
1655
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
1656
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--action--default);
1657
+ --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
1658
+ --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
1659
+ --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
1660
+ --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
1661
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
1662
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
1663
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--action--default);
1664
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
1665
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
1666
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
1667
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
1668
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
1669
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
1670
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
1671
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
1672
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1673
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
1674
+ --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
1675
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1676
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
1677
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
1678
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
1679
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
1680
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
1681
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
1682
+ --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
1683
+ --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
1684
+ --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
1685
+ --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
1686
+ --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
1687
+ --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
1688
+ --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
1689
+ --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
1690
+ --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
1691
+ --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
1692
+ --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
1693
+ --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
1694
+ --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
1695
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
1696
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
1697
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
1698
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
1699
+ --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
1700
+ --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
1701
+ --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
1702
+ --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
1703
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
1704
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
1705
+ --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
1706
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
1707
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
1708
+ --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
1709
+ --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
1710
+ --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
1711
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
1712
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
1713
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
1714
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
1715
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
1716
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1717
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
1718
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
1719
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
1720
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
1721
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
1722
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
1723
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
1724
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
1725
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
1726
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
1727
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
1728
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
1729
+ --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
1730
+ --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
1731
+ --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
1732
+ --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
1733
+ --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
1734
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
1735
+ --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));
1736
+ --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1737
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1738
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1739
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
1740
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
1741
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
1742
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
1743
+ --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
1744
+ --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
1745
+ --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
1746
+ --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
1747
+ --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
1748
+ --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
1749
+ --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
1750
+ --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
1751
+ --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
1752
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1753
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
1754
+ --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
1755
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
1756
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
1757
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
1758
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
1759
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
1760
+ --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
1761
+ --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
1762
+ --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
1763
+ --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
1764
+ --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
1765
+ --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
1766
+ --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
1767
+ --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
1790
1768
  }
1791
1769
 
1792
- .pf-v6-c-text-input-group__main.pf-m-icon {
1793
- --pf-v6-c-text-input-group__text--Position: relative;
1794
- --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart);
1770
+ .pf-v6-c-menu-toggle {
1771
+ position: relative;
1795
1772
  display: inline-flex;
1773
+ gap: var(--pf-v6-c-menu-toggle--Gap);
1796
1774
  align-items: center;
1797
1775
  justify-content: center;
1798
- min-width: calc(var(--pf-v6-c-text-input-group__LineHeight) * var(--pf-v6-c-text-input-group__FontSize));
1799
- }
1800
-
1801
- .pf-v6-c-text-input-group__main > :first-child:not(.pf-v6-c-text-input-group__text) {
1802
- margin-inline-start: var(--pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart);
1803
- }
1804
-
1805
- .pf-v6-c-text-input-group__main .pf-v6-c-label-group__main {
1806
- padding-block-start: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart);
1807
- padding-block-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd);
1808
- padding-inline-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd);
1809
- }
1810
-
1811
- .pf-v6-c-text-input-group__text {
1812
- position: var(--pf-v6-c-text-input-group__text--Position, revert);
1813
- display: inline-grid;
1814
- flex: 1;
1815
- grid-template-areas: "text-input";
1816
- grid-template-columns: 1fr;
1817
- }
1818
-
1819
- .pf-v6-c-text-input-group__icon {
1820
- position: absolute;
1821
- inset-block-start: 50%;
1822
- inset-inline-start: var(--pf-v6-c-text-input-group__icon--InsetInlineStart);
1823
- font-size: var(--pf-v6-c-text-input-group__icon--FontSize);
1824
- color: var(--pf-v6-c-text-input-group__icon--Color);
1825
- transform: translateY(var(--pf-v6-c-text-input-group__icon--TranslateY));
1826
- }
1827
-
1828
- .pf-v6-c-text-input-group__icon.pf-m-status {
1829
- inset-inline-start: auto;
1830
- inset-inline-end: var(--pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd);
1831
- color: var(--pf-v6-c-text-input-group__icon--m-status--Color);
1832
- }
1833
-
1834
- .pf-v6-c-text-input-group__text-input {
1835
- overflow: hidden;
1836
- text-overflow: ellipsis;
1837
- white-space: nowrap;
1838
- position: relative;
1839
- width: 100%;
1840
- min-width: var(--pf-v6-c-text-input-group__text-input--MinWidth);
1841
- padding-block-start: var(--pf-v6-c-text-input-group__text-input--PaddingBlockStart);
1842
- padding-block-end: var(--pf-v6-c-text-input-group__text-input--PaddingBlockEnd);
1843
- padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
1844
- padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
1845
- background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
1776
+ min-width: var(--pf-v6-c-menu-toggle--MinWidth);
1777
+ max-width: 100%;
1778
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
1779
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
1780
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
1781
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
1782
+ font-size: var(--pf-v6-c-menu-toggle--FontSize);
1783
+ line-height: var(--pf-v6-c-menu-toggle--LineHeight);
1784
+ color: var(--pf-v6-c-menu-toggle--Color);
1785
+ cursor: pointer;
1786
+ background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
1846
1787
  border: 0;
1847
- outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
1848
- }
1849
-
1850
- .pf-v6-c-text-input-group__text-input, .pf-v6-c-text-input-group__text-input.pf-m-hint {
1851
- grid-area: text-input;
1852
- }
1853
-
1854
- .pf-v6-c-text-input-group__text-input.pf-m-hint {
1855
- color: var(--pf-v6-c-text-input-group__text-input--m-hint--Color);
1856
- }
1857
-
1858
- .pf-v6-c-text-input-group__text-input::placeholder {
1859
- color: var(--pf-v6-c-text-input-group__text-input--placeholder--Color);
1788
+ transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
1789
+ transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
1790
+ transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
1860
1791
  }
1861
1792
 
1862
- .pf-v6-c-text-input-group__utilities {
1863
- display: flex;
1864
- align-items: center;
1865
- margin-inline-start: var(--pf-v6-c-text-input-group__utilities--MarginInlineStart);
1866
- margin-inline-end: var(--pf-v6-c-text-input-group__utilities--MarginInlineEnd);
1793
+ .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
1794
+ border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1867
1795
  }
1868
1796
 
1869
- .pf-v6-c-text-input-group__utilities > * + * {
1870
- margin-inline-start: var(--pf-v6-c-text-input-group__utilities--child--MarginInlineStart);
1797
+ .pf-v6-c-menu-toggle::before {
1798
+ position: absolute;
1799
+ inset-block-start: 0;
1800
+ inset-block-end: 0;
1801
+ inset-inline-start: 0;
1802
+ inset-inline-end: 0;
1803
+ z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
1804
+ pointer-events: none;
1805
+ content: "";
1806
+ border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
1807
+ transition: inherit;
1871
1808
  }
1872
1809
 
1873
- .pf-v6-c-text-input-group__group {
1874
- display: flex;
1810
+ .pf-v6-c-menu-toggle.pf-m-primary {
1811
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
1812
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
1813
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
1814
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
1815
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
1816
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
1817
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
1818
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
1819
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
1820
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
1821
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
1822
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
1823
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
1824
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
1825
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
1826
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
1827
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
1875
1828
  }
1876
1829
 
1877
- .pf-v6-c-label-group {
1878
- --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
1879
- --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
1880
- --pf-v6-c-label-group--MaxWidth: 100%;
1881
- --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
1882
- --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
1883
- --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
1884
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
1885
- --pf-v6-c-label-group__main--MaxWidth: 100%;
1886
- --pf-v6-c-label-group__main--MinWidth: 0;
1887
- --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
1888
- --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
1889
- --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
1890
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
1891
- --pf-v6-c-label-group__list--MaxWidth: 100%;
1892
- --pf-v6-c-label-group__list--MinWidth: 0;
1893
- --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
1894
- --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
1895
- --pf-v6-c-label-group__list-item--MaxWidth: 100%;
1896
- --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1897
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1898
- --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1899
- --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1900
- --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
1901
- --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
1902
- --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
1903
- --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1904
- --pf-v6-c-label-group__label--MaxWidth: 18ch;
1905
- --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
1906
- --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1907
- --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1908
- --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1909
- --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1910
- --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
1911
- --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
1912
- --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
1913
- --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
1914
- --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
1830
+ .pf-v6-c-menu-toggle.pf-m-secondary {
1831
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
1832
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
1833
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
1834
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
1835
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
1836
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
1837
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
1838
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
1839
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
1840
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
1841
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
1842
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
1843
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
1844
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
1845
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
1915
1846
  }
1916
1847
 
1917
- .pf-v6-c-label-group {
1918
- display: inline-flex;
1919
- row-gap: var(--pf-v6-c-label-group--RowGap);
1920
- column-gap: var(--pf-v6-c-label-group--ColumnGap);
1848
+ .pf-v6-c-menu-toggle.pf-m-full-height {
1849
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
1850
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
1851
+ --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
1921
1852
  align-items: center;
1922
- max-width: var(--pf-v6-c-label-group--MaxWidth);
1923
- }
1924
-
1925
- .pf-v6-c-label-group.pf-m-category {
1926
- padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
1927
- padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
1928
- padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
1929
- padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
1930
- background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
1931
- border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
1932
- border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
1933
- }
1934
-
1935
- .pf-v6-c-label-group.pf-m-vertical {
1936
- --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
1937
- --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
1938
- --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
1939
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
1940
- --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
1941
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
1942
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
1943
- }
1944
-
1945
- .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
1946
- align-items: flex-start;
1947
- }
1948
-
1949
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
1950
- flex-direction: column;
1951
- align-items: flex-start;
1952
- max-width: var(--pf-v6-c-label-group__list--MaxWidth);
1953
- }
1954
-
1955
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
1956
- flex-direction: column;
1957
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
1958
- }
1959
-
1960
- .pf-v6-c-label-group.pf-m-editable,
1961
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1962
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
1963
- display: flex;
1964
- }
1965
-
1966
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1967
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
1968
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
1969
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
1970
- flex: 1;
1853
+ height: 100%;
1971
1854
  }
1972
1855
 
1973
- .pf-v6-c-label-group__main {
1974
- display: flex;
1975
- flex: 1;
1976
- flex-wrap: wrap;
1977
- row-gap: var(--pf-v6-c-label-group__main--RowGap);
1978
- column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
1979
- align-items: baseline;
1980
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
1856
+ .pf-v6-c-menu-toggle.pf-m-full-width {
1857
+ width: 100%;
1981
1858
  }
1982
1859
 
1983
- .pf-v6-c-label-group__list {
1984
- display: inline-flex;
1985
- flex-wrap: wrap;
1986
- row-gap: var(--pf-v6-c-label-group__list--RowGap);
1987
- column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
1988
- min-width: var(--pf-v6-c-label-group__list--MinWidth);
1860
+ .pf-v6-c-menu-toggle.pf-m-plain {
1861
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
1862
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
1863
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
1864
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
1865
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
1866
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
1867
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
1868
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
1869
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
1870
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
1871
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
1872
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
1873
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
1874
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
1989
1875
  }
1990
1876
 
1991
- .pf-v6-c-label-group__list-item {
1992
- display: inline-flex;
1993
- max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
1877
+ .pf-v6-c-menu-toggle.pf-m-plain::before {
1878
+ border: none;
1994
1879
  }
1995
1880
 
1996
- .pf-v6-c-label-group__label {
1997
- overflow: hidden;
1998
- text-overflow: ellipsis;
1999
- white-space: nowrap;
2000
- max-width: var(--pf-v6-c-label-group__label--MaxWidth);
1881
+ .pf-v6-c-menu-toggle:is(:hover, :focus) {
1882
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
1883
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
1884
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
1885
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
1886
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
2001
1887
  }
2002
1888
 
2003
- .pf-v6-c-label-group__close {
2004
- display: flex;
2005
- align-self: flex-start;
1889
+ .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
1890
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
1891
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
1892
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
1893
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
1894
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
2006
1895
  }
2007
1896
 
2008
- .pf-v6-c-label-group__close .pf-v6-c-button {
2009
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
2010
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
2011
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
2012
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
2013
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
1897
+ .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
1898
+ border: 0;
2014
1899
  }
2015
1900
 
2016
- .pf-v6-c-label-group__textarea {
2017
- min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
2018
- padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
2019
- padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
2020
- padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
2021
- padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
2022
- white-space: nowrap;
2023
- resize: none;
2024
- border: 0;
2025
- -ms-overflow-style: none;
2026
- scrollbar-width: none;
1901
+ .pf-v6-c-menu-toggle.pf-m-small {
1902
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
1903
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
1904
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
1905
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
1906
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
1907
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
1908
+ --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);
1909
+ --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);
2027
1910
  }
2028
1911
 
2029
- .pf-v6-c-label-group__textarea::-webkit-scrollbar {
2030
- display: none;
1912
+ .pf-v6-c-menu-toggle.pf-m-success {
1913
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
1914
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
2031
1915
  }
2032
1916
 
2033
- .pf-v6-c-badge {
2034
- --pf-v6-c-badge--BorderColor: transparent;
2035
- --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
2036
- --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
2037
- --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
2038
- --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
2039
- --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2040
- --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2041
- --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
2042
- --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
2043
- --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
2044
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
2045
- --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
2046
- --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
2047
- --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
2048
- --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
2049
- --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
2050
- --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
2051
- --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
2052
- --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
2053
- --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1917
+ .pf-v6-c-menu-toggle.pf-m-warning {
1918
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
1919
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
2054
1920
  }
2055
1921
 
2056
- .pf-v6-c-badge {
2057
- position: relative;
2058
- display: inline-block;
2059
- min-width: var(--pf-v6-c-badge--MinWidth);
2060
- padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
2061
- padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
2062
- font-size: var(--pf-v6-c-badge--FontSize);
2063
- font-weight: var(--pf-v6-c-badge--FontWeight);
2064
- color: var(--pf-v6-c-badge--Color);
2065
- text-align: center;
2066
- white-space: nowrap;
2067
- background-color: var(--pf-v6-c-badge--BackgroundColor);
2068
- border-radius: var(--pf-v6-c-badge--BorderRadius);
1922
+ .pf-v6-c-menu-toggle.pf-m-danger {
1923
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
1924
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
2069
1925
  }
2070
1926
 
2071
- .pf-v6-c-badge::after {
2072
- position: absolute;
2073
- inset: 0;
2074
- pointer-events: none;
2075
- content: "";
2076
- border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
2077
- border-radius: inherit;
1927
+ .pf-v6-c-menu-toggle.pf-m-placeholder {
1928
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
2078
1929
  }
2079
1930
 
2080
- .pf-v6-c-badge.pf-m-read {
2081
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
2082
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
2083
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
1931
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
1932
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
1933
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
1934
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
1935
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
1936
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
2084
1937
  }
2085
1938
 
2086
- .pf-v6-c-badge.pf-m-unread {
2087
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
2088
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
2089
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
1939
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
1940
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
1941
+ pointer-events: none;
2090
1942
  }
2091
1943
 
2092
- .pf-v6-c-badge.pf-m-disabled {
2093
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
2094
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
1944
+ .pf-v6-c-menu-toggle.pf-m-split-button {
1945
+ --pf-v6-c-menu-toggle--Gap: 0;
1946
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
1947
+ padding: 0;
2095
1948
  }
2096
1949
 
2097
- .pf-v6-c-badge.pf-m-disabled::after {
2098
- border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
1950
+ .pf-v6-c-menu-toggle.pf-m-split-button > * {
1951
+ position: relative;
1952
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
1953
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
1954
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
1955
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
2099
1956
  }
2100
1957
 
2101
- .pf-v6-c-badge__toggle-icon {
2102
- margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
2103
- color: var(--pf-v6-c-badge__toggle-icon--Color);
1958
+ .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
1959
+ border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1960
+ border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
2104
1961
  }
2105
1962
 
2106
- .pf-v6-c-divider {
2107
- --pf-v6-c-divider--Display: flex;
2108
- --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
2109
- --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
2110
- --pf-v6-c-divider--before--FlexBasis: 100%;
1963
+ .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
1964
+ border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
1965
+ border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
2111
1966
  }
2112
1967
 
2113
- .pf-v6-c-divider {
2114
- flex-direction: row;
2115
- width: 100%;
2116
- height: var(--pf-v6-c-divider--Size);
2117
- --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
2118
- --pf-v6-hidden-visible--hidden--Display: none;
2119
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2120
- display: var(--pf-v6-hidden-visible--Display);
2121
- flex-shrink: 0;
2122
- align-items: stretch;
1968
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
1969
+ --pf-v6-c-check__label--Color: currentcolor;
1970
+ --pf-v6-c-check__label--disabled--Color: currentcolor;
1971
+ align-items: center;
2123
1972
  align-self: stretch;
2124
- justify-content: center;
2125
- border: 0;
2126
1973
  }
2127
1974
 
2128
- .pf-v6-c-divider.pf-m-hidden {
2129
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1975
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
1976
+ --pf-v6-c-check__input--TranslateY: 0;
1977
+ align-self: center;
2130
1978
  }
2131
1979
 
2132
- @media screen and (min-width: 36rem) {
2133
- .pf-v6-c-divider.pf-m-hidden-on-sm {
2134
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2135
- }
2136
- .pf-v6-c-divider.pf-m-visible-on-sm {
2137
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2138
- }
2139
- }
2140
- @media screen and (min-width: 48rem) {
2141
- .pf-v6-c-divider.pf-m-hidden-on-md {
2142
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2143
- }
2144
- .pf-v6-c-divider.pf-m-visible-on-md {
2145
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2146
- }
1980
+ .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
1981
+ 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);
2147
1982
  }
2148
- @media screen and (min-width: 62rem) {
2149
- .pf-v6-c-divider.pf-m-hidden-on-lg {
2150
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2151
- }
2152
- .pf-v6-c-divider.pf-m-visible-on-lg {
2153
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2154
- }
1983
+
1984
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
1985
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
2155
1986
  }
2156
- @media screen and (min-width: 75rem) {
2157
- .pf-v6-c-divider.pf-m-hidden-on-xl {
2158
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2159
- }
2160
- .pf-v6-c-divider.pf-m-visible-on-xl {
2161
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2162
- }
1987
+
1988
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
1989
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
1990
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
2163
1991
  }
2164
- @media screen and (min-width: 90.625rem) {
2165
- .pf-v6-c-divider.pf-m-hidden-on-2xl {
2166
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2167
- }
2168
- .pf-v6-c-divider.pf-m-visible-on-2xl {
2169
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2170
- }
1992
+
1993
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
1994
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
1995
+ --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);
2171
1996
  }
2172
- .pf-v6-c-divider::before {
2173
- flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
2174
- content: "";
2175
- background-color: var(--pf-v6-c-divider--Color);
1997
+
1998
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
1999
+ --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);
2176
2000
  }
2177
2001
 
2178
- .pf-v6-c-divider.pf-m-horizontal {
2179
- flex-direction: row;
2180
- width: 100%;
2181
- height: var(--pf-v6-c-divider--Size);
2002
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
2003
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
2182
2004
  }
2183
2005
 
2184
- .pf-v6-c-divider.pf-m-vertical {
2185
- flex-direction: column;
2186
- width: var(--pf-v6-c-divider--Size);
2187
- height: inherit;
2006
+ .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,
2007
+ .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,
2008
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
2009
+ padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
2188
2010
  }
2189
2011
 
2190
- .pf-v6-c-divider.pf-m-inset-none {
2191
- --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
2012
+ .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,
2013
+ .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,
2014
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
2015
+ padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
2192
2016
  }
2193
2017
 
2194
- .pf-v6-c-divider.pf-m-inset-xs {
2195
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2018
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
2019
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
2196
2020
  }
2197
2021
 
2198
- .pf-v6-c-divider.pf-m-inset-sm {
2199
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2022
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
2023
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
2024
+ color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
2025
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
2200
2026
  }
2201
2027
 
2202
- .pf-v6-c-divider.pf-m-inset-md {
2203
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2028
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
2029
+ content: none;
2204
2030
  }
2205
2031
 
2206
- .pf-v6-c-divider.pf-m-inset-lg {
2207
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2032
+ .pf-v6-c-menu-toggle.pf-m-typeahead {
2033
+ --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
2034
+ --pf-v6-c-menu-toggle--Gap: 0;
2035
+ align-items: stretch;
2036
+ padding: 0;
2208
2037
  }
2209
2038
 
2210
- .pf-v6-c-divider.pf-m-inset-xl {
2211
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2039
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
2040
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
2212
2041
  }
2213
2042
 
2214
- .pf-v6-c-divider.pf-m-inset-2xl {
2215
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2043
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
2044
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
2045
+ display: flex;
2046
+ align-items: stretch;
2216
2047
  }
2217
2048
 
2218
- .pf-v6-c-divider.pf-m-inset-3xl {
2219
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2049
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
2050
+ --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
2051
+ flex: 1;
2220
2052
  }
2221
2053
 
2222
- @media (min-width: 36rem) {
2223
- .pf-v6-c-divider.pf-m-horizontal-on-sm {
2224
- flex-direction: row;
2225
- width: 100%;
2226
- height: var(--pf-v6-c-divider--Size);
2227
- }
2054
+ .pf-v6-c-menu-toggle__button {
2055
+ gap: var(--pf-v6-c-menu-toggle__button--Gap);
2056
+ align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
2057
+ min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
2058
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
2059
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
2060
+ color: inherit;
2061
+ background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
2062
+ border: 0;
2228
2063
  }
2229
- @media (min-width: 36rem) {
2230
- .pf-v6-c-divider.pf-m-vertical-on-sm {
2231
- flex-direction: column;
2232
- width: var(--pf-v6-c-divider--Size);
2233
- height: inherit;
2234
- }
2064
+
2065
+ .pf-v6-c-menu-toggle__button.pf-m-text {
2066
+ display: inline-flex;
2067
+ align-items: baseline;
2235
2068
  }
2236
- @media (min-width: 36rem) {
2237
- .pf-v6-c-divider.pf-m-inset-none-on-sm {
2238
- --pf-v6-c-divider--before--FlexBasis: 100%;
2239
- }
2240
- .pf-v6-c-divider.pf-m-inset-xs-on-sm {
2241
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2242
- }
2243
- .pf-v6-c-divider.pf-m-inset-sm-on-sm {
2244
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2245
- }
2246
- .pf-v6-c-divider.pf-m-inset-md-on-sm {
2247
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2248
- }
2249
- .pf-v6-c-divider.pf-m-inset-lg-on-sm {
2250
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2251
- }
2252
- .pf-v6-c-divider.pf-m-inset-xl-on-sm {
2253
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2254
- }
2255
- .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
2256
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2257
- }
2258
- .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
2259
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2260
- }
2069
+
2070
+ .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) {
2071
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
2072
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
2261
2073
  }
2262
- @media (min-width: 48rem) {
2263
- .pf-v6-c-divider.pf-m-horizontal-on-md {
2264
- flex-direction: row;
2265
- width: 100%;
2266
- height: var(--pf-v6-c-divider--Size);
2267
- }
2074
+
2075
+ .pf-v6-c-menu-toggle__text {
2076
+ overflow: hidden;
2077
+ text-overflow: ellipsis;
2078
+ white-space: nowrap;
2079
+ min-width: 0;
2268
2080
  }
2269
- @media (min-width: 48rem) {
2270
- .pf-v6-c-divider.pf-m-vertical-on-md {
2271
- flex-direction: column;
2272
- width: var(--pf-v6-c-divider--Size);
2273
- height: inherit;
2274
- }
2081
+
2082
+ .pf-v6-c-menu-toggle__count {
2083
+ display: flex;
2084
+ flex-wrap: nowrap;
2275
2085
  }
2276
- @media (min-width: 48rem) {
2277
- .pf-v6-c-divider.pf-m-inset-none-on-md {
2278
- --pf-v6-c-divider--before--FlexBasis: 100%;
2279
- }
2280
- .pf-v6-c-divider.pf-m-inset-xs-on-md {
2281
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2282
- }
2283
- .pf-v6-c-divider.pf-m-inset-sm-on-md {
2284
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2285
- }
2286
- .pf-v6-c-divider.pf-m-inset-md-on-md {
2287
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2288
- }
2289
- .pf-v6-c-divider.pf-m-inset-lg-on-md {
2290
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2291
- }
2292
- .pf-v6-c-divider.pf-m-inset-xl-on-md {
2293
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2294
- }
2295
- .pf-v6-c-divider.pf-m-inset-2xl-on-md {
2296
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2297
- }
2298
- .pf-v6-c-divider.pf-m-inset-3xl-on-md {
2299
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2300
- }
2086
+
2087
+ .pf-v6-c-menu-toggle__icon {
2088
+ flex-shrink: 0;
2301
2089
  }
2302
- @media (min-width: 62rem) {
2303
- .pf-v6-c-divider.pf-m-horizontal-on-lg {
2304
- flex-direction: row;
2305
- width: 100%;
2306
- height: var(--pf-v6-c-divider--Size);
2307
- }
2090
+
2091
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
2092
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
2093
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar svg {
2094
+ margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
2095
+ margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
2308
2096
  }
2309
- @media (min-width: 62rem) {
2310
- .pf-v6-c-divider.pf-m-vertical-on-lg {
2311
- flex-direction: column;
2312
- width: var(--pf-v6-c-divider--Size);
2313
- height: inherit;
2314
- }
2097
+
2098
+ .pf-v6-c-menu-toggle__controls {
2099
+ display: flex;
2100
+ gap: var(--pf-v6-c-menu-toggle__controls--Gap);
2101
+ align-items: center;
2102
+ justify-content: center;
2103
+ margin-inline-start: auto;
2315
2104
  }
2316
- @media (min-width: 62rem) {
2317
- .pf-v6-c-divider.pf-m-inset-none-on-lg {
2318
- --pf-v6-c-divider--before--FlexBasis: 100%;
2319
- }
2320
- .pf-v6-c-divider.pf-m-inset-xs-on-lg {
2321
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2322
- }
2323
- .pf-v6-c-divider.pf-m-inset-sm-on-lg {
2324
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2325
- }
2326
- .pf-v6-c-divider.pf-m-inset-md-on-lg {
2327
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2328
- }
2329
- .pf-v6-c-divider.pf-m-inset-lg-on-lg {
2330
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2331
- }
2332
- .pf-v6-c-divider.pf-m-inset-xl-on-lg {
2333
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2334
- }
2335
- .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
2336
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2337
- }
2338
- .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
2339
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2340
- }
2105
+
2106
+ .pf-v6-c-menu-toggle__toggle-icon {
2107
+ min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
2108
+ color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
2341
2109
  }
2342
- @media (min-width: 75rem) {
2343
- .pf-v6-c-divider.pf-m-horizontal-on-xl {
2344
- flex-direction: row;
2345
- width: 100%;
2346
- height: var(--pf-v6-c-divider--Size);
2347
- }
2110
+
2111
+ .pf-v6-c-menu-toggle__status-icon {
2112
+ color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
2348
2113
  }
2349
- @media (min-width: 75rem) {
2350
- .pf-v6-c-divider.pf-m-vertical-on-xl {
2351
- flex-direction: column;
2352
- width: var(--pf-v6-c-divider--Size);
2353
- height: inherit;
2354
- }
2114
+
2115
+ .pf-v6-c-divider {
2116
+ --pf-v6-c-divider--Display: flex;
2117
+ --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
2118
+ --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
2119
+ --pf-v6-c-divider--before--FlexBasis: 100%;
2355
2120
  }
2356
- @media (min-width: 75rem) {
2357
- .pf-v6-c-divider.pf-m-inset-none-on-xl {
2358
- --pf-v6-c-divider--before--FlexBasis: 100%;
2359
- }
2360
- .pf-v6-c-divider.pf-m-inset-xs-on-xl {
2361
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2362
- }
2363
- .pf-v6-c-divider.pf-m-inset-sm-on-xl {
2364
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2365
- }
2366
- .pf-v6-c-divider.pf-m-inset-md-on-xl {
2367
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2368
- }
2369
- .pf-v6-c-divider.pf-m-inset-lg-on-xl {
2370
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2371
- }
2372
- .pf-v6-c-divider.pf-m-inset-xl-on-xl {
2373
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2374
- }
2375
- .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
2376
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2377
- }
2378
- .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
2379
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2380
- }
2121
+
2122
+ .pf-v6-c-divider {
2123
+ flex-direction: row;
2124
+ width: 100%;
2125
+ height: var(--pf-v6-c-divider--Size);
2126
+ --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
2127
+ --pf-v6-hidden-visible--hidden--Display: none;
2128
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2129
+ display: var(--pf-v6-hidden-visible--Display);
2130
+ flex-shrink: 0;
2131
+ align-items: stretch;
2132
+ align-self: stretch;
2133
+ justify-content: center;
2134
+ border: 0;
2381
2135
  }
2382
- @media (min-width: 90.625rem) {
2383
- .pf-v6-c-divider.pf-m-horizontal-on-2xl {
2384
- flex-direction: row;
2385
- width: 100%;
2386
- height: var(--pf-v6-c-divider--Size);
2387
- }
2136
+
2137
+ .pf-v6-c-divider.pf-m-hidden {
2138
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2388
2139
  }
2389
- @media (min-width: 90.625rem) {
2390
- .pf-v6-c-divider.pf-m-vertical-on-2xl {
2391
- flex-direction: column;
2392
- width: var(--pf-v6-c-divider--Size);
2393
- height: inherit;
2140
+
2141
+ @media screen and (min-width: 36rem) {
2142
+ .pf-v6-c-divider.pf-m-hidden-on-sm {
2143
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2144
+ }
2145
+ .pf-v6-c-divider.pf-m-visible-on-sm {
2146
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2394
2147
  }
2395
2148
  }
2396
- @media (min-width: 90.625rem) {
2397
- .pf-v6-c-divider.pf-m-inset-none-on-2xl {
2398
- --pf-v6-c-divider--before--FlexBasis: 100%;
2149
+ @media screen and (min-width: 48rem) {
2150
+ .pf-v6-c-divider.pf-m-hidden-on-md {
2151
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2399
2152
  }
2400
- .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
2401
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2153
+ .pf-v6-c-divider.pf-m-visible-on-md {
2154
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2402
2155
  }
2403
- .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
2404
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2156
+ }
2157
+ @media screen and (min-width: 62rem) {
2158
+ .pf-v6-c-divider.pf-m-hidden-on-lg {
2159
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2405
2160
  }
2406
- .pf-v6-c-divider.pf-m-inset-md-on-2xl {
2407
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2161
+ .pf-v6-c-divider.pf-m-visible-on-lg {
2162
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2408
2163
  }
2409
- .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
2410
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2164
+ }
2165
+ @media screen and (min-width: 75rem) {
2166
+ .pf-v6-c-divider.pf-m-hidden-on-xl {
2167
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2411
2168
  }
2412
- .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
2413
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2169
+ .pf-v6-c-divider.pf-m-visible-on-xl {
2170
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2414
2171
  }
2415
- .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
2416
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2172
+ }
2173
+ @media screen and (min-width: 90.625rem) {
2174
+ .pf-v6-c-divider.pf-m-hidden-on-2xl {
2175
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2417
2176
  }
2418
- .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
2419
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2177
+ .pf-v6-c-divider.pf-m-visible-on-2xl {
2178
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2420
2179
  }
2421
2180
  }
2422
- .pf-v6-c-check {
2423
- --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
2424
- --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
2425
- --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
2426
- --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
2427
- --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
2428
- --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
2429
- --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
2430
- --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
2431
- --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
2432
- --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
2433
- --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
2434
- --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
2435
- --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
2436
- --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
2437
- }
2438
-
2439
- .pf-v6-c-check {
2440
- display: grid;
2441
- grid-template-columns: auto 1fr;
2442
- grid-gap: var(--pf-v6-c-check--GridGap);
2443
- accent-color: var(--pf-v6-c-check--AccentColor);
2444
- }
2445
-
2446
- .pf-v6-c-check.pf-m-standalone {
2447
- display: inline-grid;
2448
- grid-template-columns: auto;
2449
- min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
2450
- }
2451
-
2452
- .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
2453
- align-self: center;
2454
- transform: none;
2455
- }
2456
-
2457
- .pf-v6-c-check__input {
2458
- align-self: start;
2459
- font-size: var(--pf-v6-c-check__label--FontSize);
2460
- line-height: var(--pf-v6-c-check__label--LineHeight);
2461
- transform: translateY(var(--pf-v6-c-check__input--TranslateY));
2181
+ .pf-v6-c-divider::before {
2182
+ flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
2183
+ content: "";
2184
+ background-color: var(--pf-v6-c-divider--Color);
2462
2185
  }
2463
2186
 
2464
- .pf-v6-c-check__label {
2465
- font-size: var(--pf-v6-c-check__label--FontSize);
2466
- font-weight: var(--pf-v6-c-check__label--FontWeight);
2467
- line-height: var(--pf-v6-c-check__label--LineHeight);
2468
- color: var(--pf-v6-c-check__label--Color);
2187
+ .pf-v6-c-divider.pf-m-horizontal {
2188
+ flex-direction: row;
2189
+ width: 100%;
2190
+ height: var(--pf-v6-c-divider--Size);
2469
2191
  }
2470
2192
 
2471
- .pf-v6-c-check__description {
2472
- grid-column: 2;
2473
- font-size: var(--pf-v6-c-check__description--FontSize);
2474
- color: var(--pf-v6-c-check__description--Color);
2193
+ .pf-v6-c-divider.pf-m-vertical {
2194
+ flex-direction: column;
2195
+ width: var(--pf-v6-c-divider--Size);
2196
+ height: inherit;
2475
2197
  }
2476
2198
 
2477
- .pf-v6-c-check__body {
2478
- grid-column: 2;
2199
+ .pf-v6-c-divider.pf-m-inset-none {
2200
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
2479
2201
  }
2480
2202
 
2481
- .pf-v6-c-check__label,
2482
- .pf-v6-c-check__input {
2483
- justify-self: start;
2203
+ .pf-v6-c-divider.pf-m-inset-xs {
2204
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2484
2205
  }
2485
2206
 
2486
- label.pf-v6-c-check, .pf-v6-c-check__label,
2487
- .pf-v6-c-check__input {
2488
- cursor: pointer;
2207
+ .pf-v6-c-divider.pf-m-inset-sm {
2208
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2489
2209
  }
2490
2210
 
2491
- .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
2492
- .pf-v6-c-check__input:disabled,
2493
- .pf-v6-c-check__input.pf-m-disabled {
2494
- --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
2495
- cursor: not-allowed;
2211
+ .pf-v6-c-divider.pf-m-inset-md {
2212
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2496
2213
  }
2497
2214
 
2498
- .pf-v6-c-check__label-required {
2499
- margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
2500
- font-size: var(--pf-v6-c-check__label-required--FontSize);
2501
- color: var(--pf-v6-c-check__label-required--Color);
2215
+ .pf-v6-c-divider.pf-m-inset-lg {
2216
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2502
2217
  }
2503
2218
 
2504
- .pf-v6-c-breadcrumb {
2505
- --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
2506
- --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
2507
- --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
2508
- --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
2509
- --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
2510
- --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
2511
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2512
- --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2513
- --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
2514
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
2515
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
2516
- --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
2517
- --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
2518
- --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
2519
- --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
2520
- --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
2521
- --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
2522
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2523
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
2524
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2525
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
2219
+ .pf-v6-c-divider.pf-m-inset-xl {
2220
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2526
2221
  }
2527
2222
 
2528
- .pf-v6-c-breadcrumb {
2529
- display: inline-flex;
2223
+ .pf-v6-c-divider.pf-m-inset-2xl {
2224
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2530
2225
  }
2531
2226
 
2532
- .pf-v6-c-breadcrumb__list {
2533
- display: flex;
2534
- flex-wrap: wrap;
2535
- align-items: center;
2227
+ .pf-v6-c-divider.pf-m-inset-3xl {
2228
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2536
2229
  }
2537
2230
 
2538
- .pf-v6-c-breadcrumb__item {
2539
- display: flex;
2540
- align-items: baseline;
2541
- font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
2542
- font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
2543
- line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
2544
- white-space: nowrap;
2545
- list-style: none;
2231
+ @media (min-width: 36rem) {
2232
+ .pf-v6-c-divider.pf-m-horizontal-on-sm {
2233
+ flex-direction: row;
2234
+ width: 100%;
2235
+ height: var(--pf-v6-c-divider--Size);
2236
+ }
2546
2237
  }
2547
-
2548
- .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
2549
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
2238
+ @media (min-width: 36rem) {
2239
+ .pf-v6-c-divider.pf-m-vertical-on-sm {
2240
+ flex-direction: column;
2241
+ width: var(--pf-v6-c-divider--Size);
2242
+ height: inherit;
2243
+ }
2550
2244
  }
2551
-
2552
- .pf-v6-c-breadcrumb__item:not(:last-child) {
2553
- margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
2245
+ @media (min-width: 36rem) {
2246
+ .pf-v6-c-divider.pf-m-inset-none-on-sm {
2247
+ --pf-v6-c-divider--before--FlexBasis: 100%;
2248
+ }
2249
+ .pf-v6-c-divider.pf-m-inset-xs-on-sm {
2250
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2251
+ }
2252
+ .pf-v6-c-divider.pf-m-inset-sm-on-sm {
2253
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2254
+ }
2255
+ .pf-v6-c-divider.pf-m-inset-md-on-sm {
2256
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2257
+ }
2258
+ .pf-v6-c-divider.pf-m-inset-lg-on-sm {
2259
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2260
+ }
2261
+ .pf-v6-c-divider.pf-m-inset-xl-on-sm {
2262
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2263
+ }
2264
+ .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
2265
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2266
+ }
2267
+ .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
2268
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2269
+ }
2554
2270
  }
2555
-
2556
- .pf-v6-c-breadcrumb__item-divider {
2557
- margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
2558
- font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
2559
- line-height: 1;
2560
- color: var(--pf-v6-c-breadcrumb__item-divider--Color);
2271
+ @media (min-width: 48rem) {
2272
+ .pf-v6-c-divider.pf-m-horizontal-on-md {
2273
+ flex-direction: row;
2274
+ width: 100%;
2275
+ height: var(--pf-v6-c-divider--Size);
2276
+ }
2561
2277
  }
2562
-
2563
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
2564
- scale: -1 1;
2278
+ @media (min-width: 48rem) {
2279
+ .pf-v6-c-divider.pf-m-vertical-on-md {
2280
+ flex-direction: column;
2281
+ width: var(--pf-v6-c-divider--Size);
2282
+ height: inherit;
2283
+ }
2565
2284
  }
2566
-
2567
- .pf-v6-c-breadcrumb__link {
2568
- padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
2569
- padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
2570
- font-size: inherit;
2571
- font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
2572
- line-height: inherit;
2573
- color: var(--pf-v6-c-breadcrumb__link--Color);
2574
- text-decoration: var(--pf-v6-c-breadcrumb__link--TextDecorationLine) var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
2575
- word-break: break-word;
2576
- background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
2285
+ @media (min-width: 48rem) {
2286
+ .pf-v6-c-divider.pf-m-inset-none-on-md {
2287
+ --pf-v6-c-divider--before--FlexBasis: 100%;
2288
+ }
2289
+ .pf-v6-c-divider.pf-m-inset-xs-on-md {
2290
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2291
+ }
2292
+ .pf-v6-c-divider.pf-m-inset-sm-on-md {
2293
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2294
+ }
2295
+ .pf-v6-c-divider.pf-m-inset-md-on-md {
2296
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2297
+ }
2298
+ .pf-v6-c-divider.pf-m-inset-lg-on-md {
2299
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2300
+ }
2301
+ .pf-v6-c-divider.pf-m-inset-xl-on-md {
2302
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2303
+ }
2304
+ .pf-v6-c-divider.pf-m-inset-2xl-on-md {
2305
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2306
+ }
2307
+ .pf-v6-c-divider.pf-m-inset-3xl-on-md {
2308
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2309
+ }
2577
2310
  }
2578
-
2579
- .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
2580
- --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
2581
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
2582
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
2311
+ @media (min-width: 62rem) {
2312
+ .pf-v6-c-divider.pf-m-horizontal-on-lg {
2313
+ flex-direction: row;
2314
+ width: 100%;
2315
+ height: var(--pf-v6-c-divider--Size);
2316
+ }
2583
2317
  }
2584
-
2585
- .pf-v6-c-breadcrumb__link.pf-m-current {
2586
- cursor: default;
2318
+ @media (min-width: 62rem) {
2319
+ .pf-v6-c-divider.pf-m-vertical-on-lg {
2320
+ flex-direction: column;
2321
+ width: var(--pf-v6-c-divider--Size);
2322
+ height: inherit;
2323
+ }
2587
2324
  }
2588
-
2589
- .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
2590
- color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
2591
- text-decoration: none;
2325
+ @media (min-width: 62rem) {
2326
+ .pf-v6-c-divider.pf-m-inset-none-on-lg {
2327
+ --pf-v6-c-divider--before--FlexBasis: 100%;
2328
+ }
2329
+ .pf-v6-c-divider.pf-m-inset-xs-on-lg {
2330
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2331
+ }
2332
+ .pf-v6-c-divider.pf-m-inset-sm-on-lg {
2333
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2334
+ }
2335
+ .pf-v6-c-divider.pf-m-inset-md-on-lg {
2336
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2337
+ }
2338
+ .pf-v6-c-divider.pf-m-inset-lg-on-lg {
2339
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2340
+ }
2341
+ .pf-v6-c-divider.pf-m-inset-xl-on-lg {
2342
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2343
+ }
2344
+ .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
2345
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2346
+ }
2347
+ .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
2348
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2349
+ }
2592
2350
  }
2593
-
2594
- button.pf-v6-c-breadcrumb__link {
2595
- border: none;
2351
+ @media (min-width: 75rem) {
2352
+ .pf-v6-c-divider.pf-m-horizontal-on-xl {
2353
+ flex-direction: row;
2354
+ width: 100%;
2355
+ height: var(--pf-v6-c-divider--Size);
2356
+ }
2596
2357
  }
2597
-
2598
- .pf-v6-c-breadcrumb__dropdown {
2599
- margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
2600
- margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
2601
- margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
2602
- margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
2358
+ @media (min-width: 75rem) {
2359
+ .pf-v6-c-divider.pf-m-vertical-on-xl {
2360
+ flex-direction: column;
2361
+ width: var(--pf-v6-c-divider--Size);
2362
+ height: inherit;
2363
+ }
2603
2364
  }
2604
-
2605
- .pf-v6-c-breadcrumb__heading {
2606
- display: inline;
2607
- font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
2365
+ @media (min-width: 75rem) {
2366
+ .pf-v6-c-divider.pf-m-inset-none-on-xl {
2367
+ --pf-v6-c-divider--before--FlexBasis: 100%;
2368
+ }
2369
+ .pf-v6-c-divider.pf-m-inset-xs-on-xl {
2370
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2371
+ }
2372
+ .pf-v6-c-divider.pf-m-inset-sm-on-xl {
2373
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2374
+ }
2375
+ .pf-v6-c-divider.pf-m-inset-md-on-xl {
2376
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2377
+ }
2378
+ .pf-v6-c-divider.pf-m-inset-lg-on-xl {
2379
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2380
+ }
2381
+ .pf-v6-c-divider.pf-m-inset-xl-on-xl {
2382
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2383
+ }
2384
+ .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
2385
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2386
+ }
2387
+ .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
2388
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2389
+ }
2608
2390
  }
2609
-
2610
- .pf-v6-c-breadcrumb__link,
2611
- .pf-v6-c-breadcrumb__heading {
2612
- white-space: normal;
2391
+ @media (min-width: 90.625rem) {
2392
+ .pf-v6-c-divider.pf-m-horizontal-on-2xl {
2393
+ flex-direction: row;
2394
+ width: 100%;
2395
+ height: var(--pf-v6-c-divider--Size);
2396
+ }
2613
2397
  }
2614
-
2615
- .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
2616
- display: none;
2398
+ @media (min-width: 90.625rem) {
2399
+ .pf-v6-c-divider.pf-m-vertical-on-2xl {
2400
+ flex-direction: column;
2401
+ width: var(--pf-v6-c-divider--Size);
2402
+ height: inherit;
2403
+ }
2617
2404
  }
2618
-
2619
- .pf-v6-c-spinner {
2620
- --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
2621
- --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
2622
- --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
2623
- --pf-v6-c-spinner--Color: var(--pf-t--global--icon--color--brand--default);
2624
- --pf-v6-c-spinner--AnimationDuration: 1.4s;
2625
- --pf-v6-c-spinner--AnimationTimingFunction: linear;
2626
- --pf-v6-c-spinner--StrokeWidth: 10;
2627
- --pf-v6-c-spinner__path--StrokeWidth: var(--pf-v6-c-spinner--StrokeWidth);
2628
- --pf-v6-c-spinner__path--AnimationTimingFunction: ease-in-out;
2629
- --pf-v6-c-spinner--m-sm--diameter: var(--pf-t--global--icon--size--md);
2630
- --pf-v6-c-spinner--m-md--diameter: var(--pf-t--global--icon--size--lg);
2631
- --pf-v6-c-spinner--m-lg--diameter: var(--pf-t--global--icon--size--xl);
2632
- --pf-v6-c-spinner--m-xl--diameter: var(--pf-t--global--icon--size--2xl);
2633
- --pf-v6-c-spinner--m-inline--diameter: 1em;
2405
+ @media (min-width: 90.625rem) {
2406
+ .pf-v6-c-divider.pf-m-inset-none-on-2xl {
2407
+ --pf-v6-c-divider--before--FlexBasis: 100%;
2408
+ }
2409
+ .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
2410
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2411
+ }
2412
+ .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
2413
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2414
+ }
2415
+ .pf-v6-c-divider.pf-m-inset-md-on-2xl {
2416
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2417
+ }
2418
+ .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
2419
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2420
+ }
2421
+ .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
2422
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2423
+ }
2424
+ .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
2425
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2426
+ }
2427
+ .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
2428
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2429
+ }
2430
+ }
2431
+ .pf-v6-c-badge {
2432
+ --pf-v6-c-badge--BorderColor: transparent;
2433
+ --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
2434
+ --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
2435
+ --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
2436
+ --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
2437
+ --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2438
+ --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2439
+ --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
2440
+ --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
2441
+ --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
2442
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
2443
+ --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
2444
+ --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
2445
+ --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
2446
+ --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
2447
+ --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
2448
+ --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
2449
+ --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
2450
+ --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
2451
+ --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
2634
2452
  }
2635
2453
 
2636
- .pf-v6-c-spinner {
2637
- width: var(--pf-v6-c-spinner--Width);
2638
- height: var(--pf-v6-c-spinner--Height);
2639
- overflow: hidden;
2640
- animation: pf-v6-c-spinner-animation-rotate calc(var(--pf-v6-c-spinner--AnimationDuration) * 2) var(--pf-v6-c-spinner--AnimationTimingFunction) infinite;
2454
+ .pf-v6-c-badge {
2455
+ position: relative;
2456
+ display: inline-block;
2457
+ min-width: var(--pf-v6-c-badge--MinWidth);
2458
+ padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
2459
+ padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
2460
+ font-size: var(--pf-v6-c-badge--FontSize);
2461
+ font-weight: var(--pf-v6-c-badge--FontWeight);
2462
+ color: var(--pf-v6-c-badge--Color);
2463
+ text-align: center;
2464
+ white-space: nowrap;
2465
+ background-color: var(--pf-v6-c-badge--BackgroundColor);
2466
+ border-radius: var(--pf-v6-c-badge--BorderRadius);
2641
2467
  }
2642
2468
 
2643
- .pf-v6-c-spinner.pf-m-inline {
2644
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-inline--diameter);
2469
+ .pf-v6-c-badge::after {
2470
+ position: absolute;
2471
+ inset: 0;
2472
+ pointer-events: none;
2473
+ content: "";
2474
+ border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
2475
+ border-radius: inherit;
2645
2476
  }
2646
2477
 
2647
- .pf-v6-c-spinner.pf-m-sm {
2648
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-sm--diameter);
2478
+ .pf-v6-c-badge.pf-m-read {
2479
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
2480
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
2481
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
2649
2482
  }
2650
2483
 
2651
- .pf-v6-c-spinner.pf-m-md {
2652
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-md--diameter);
2484
+ .pf-v6-c-badge.pf-m-unread {
2485
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
2486
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
2487
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
2653
2488
  }
2654
2489
 
2655
- .pf-v6-c-spinner.pf-m-lg {
2656
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-lg--diameter);
2490
+ .pf-v6-c-badge.pf-m-disabled {
2491
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
2492
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
2657
2493
  }
2658
2494
 
2659
- .pf-v6-c-spinner.pf-m-xl {
2660
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xl--diameter);
2495
+ .pf-v6-c-badge.pf-m-disabled::after {
2496
+ border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
2661
2497
  }
2662
2498
 
2663
- .pf-v6-c-spinner__path {
2664
- width: 100%;
2665
- height: 100%;
2666
- stroke: var(--pf-v6-c-spinner--Color);
2667
- stroke-dasharray: 283;
2668
- stroke-dashoffset: 280;
2669
- stroke-linecap: round;
2670
- stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
2671
- transform-origin: 50% 50%;
2672
- animation: pf-v6-c-spinner-animation-dash var(--pf-v6-c-spinner--AnimationDuration) var(--pf-v6-c-spinner__path--AnimationTimingFunction) infinite;
2499
+ .pf-v6-c-badge__toggle-icon {
2500
+ margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
2501
+ color: var(--pf-v6-c-badge__toggle-icon--Color);
2673
2502
  }
2674
2503
 
2675
- @keyframes pf-v6-c-spinner-animation-rotate {
2676
- 0% {
2677
- transform: rotate(0deg);
2678
- }
2679
- 100% {
2680
- transform: rotate(360deg);
2681
- }
2682
- }
2683
- @keyframes pf-v6-c-spinner-animation-dash {
2684
- 0% {
2685
- stroke-dashoffset: 280;
2686
- transform: rotate(0);
2687
- }
2688
- 15% {
2689
- stroke-width: calc(var(--pf-v6-c-spinner__path--StrokeWidth) - 4);
2690
- }
2691
- 40% {
2692
- stroke-dasharray: 220;
2693
- stroke-dashoffset: 150;
2694
- }
2695
- 100% {
2696
- stroke-dashoffset: 280;
2697
- transform: rotate(720deg);
2698
- }
2699
- }
2700
2504
  .pf-v6-c-menu {
2701
2505
  --pf-v6-c-menu--RowGap: var(--pf-t--global--spacer--sm);
2702
2506
  --pf-v6-c-menu--Width: auto;
@@ -3333,6 +3137,87 @@ button.pf-v6-c-breadcrumb__link {
3333
3137
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
3334
3138
  }
3335
3139
 
3140
+ .pf-v6-c-spinner {
3141
+ --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
3142
+ --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
3143
+ --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
3144
+ --pf-v6-c-spinner--Color: var(--pf-t--global--icon--color--brand--default);
3145
+ --pf-v6-c-spinner--AnimationDuration: 1.4s;
3146
+ --pf-v6-c-spinner--AnimationTimingFunction: linear;
3147
+ --pf-v6-c-spinner--StrokeWidth: 10;
3148
+ --pf-v6-c-spinner__path--StrokeWidth: var(--pf-v6-c-spinner--StrokeWidth);
3149
+ --pf-v6-c-spinner__path--AnimationTimingFunction: ease-in-out;
3150
+ --pf-v6-c-spinner--m-sm--diameter: var(--pf-t--global--icon--size--md);
3151
+ --pf-v6-c-spinner--m-md--diameter: var(--pf-t--global--icon--size--lg);
3152
+ --pf-v6-c-spinner--m-lg--diameter: var(--pf-t--global--icon--size--xl);
3153
+ --pf-v6-c-spinner--m-xl--diameter: var(--pf-t--global--icon--size--2xl);
3154
+ --pf-v6-c-spinner--m-inline--diameter: 1em;
3155
+ }
3156
+
3157
+ .pf-v6-c-spinner {
3158
+ width: var(--pf-v6-c-spinner--Width);
3159
+ height: var(--pf-v6-c-spinner--Height);
3160
+ overflow: hidden;
3161
+ animation: pf-v6-c-spinner-animation-rotate calc(var(--pf-v6-c-spinner--AnimationDuration) * 2) var(--pf-v6-c-spinner--AnimationTimingFunction) infinite;
3162
+ }
3163
+
3164
+ .pf-v6-c-spinner.pf-m-inline {
3165
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-inline--diameter);
3166
+ }
3167
+
3168
+ .pf-v6-c-spinner.pf-m-sm {
3169
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-sm--diameter);
3170
+ }
3171
+
3172
+ .pf-v6-c-spinner.pf-m-md {
3173
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-md--diameter);
3174
+ }
3175
+
3176
+ .pf-v6-c-spinner.pf-m-lg {
3177
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-lg--diameter);
3178
+ }
3179
+
3180
+ .pf-v6-c-spinner.pf-m-xl {
3181
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xl--diameter);
3182
+ }
3183
+
3184
+ .pf-v6-c-spinner__path {
3185
+ width: 100%;
3186
+ height: 100%;
3187
+ stroke: var(--pf-v6-c-spinner--Color);
3188
+ stroke-dasharray: 283;
3189
+ stroke-dashoffset: 280;
3190
+ stroke-linecap: round;
3191
+ stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
3192
+ transform-origin: 50% 50%;
3193
+ animation: pf-v6-c-spinner-animation-dash var(--pf-v6-c-spinner--AnimationDuration) var(--pf-v6-c-spinner__path--AnimationTimingFunction) infinite;
3194
+ }
3195
+
3196
+ @keyframes pf-v6-c-spinner-animation-rotate {
3197
+ 0% {
3198
+ transform: rotate(0deg);
3199
+ }
3200
+ 100% {
3201
+ transform: rotate(360deg);
3202
+ }
3203
+ }
3204
+ @keyframes pf-v6-c-spinner-animation-dash {
3205
+ 0% {
3206
+ stroke-dashoffset: 280;
3207
+ transform: rotate(0);
3208
+ }
3209
+ 15% {
3210
+ stroke-width: calc(var(--pf-v6-c-spinner__path--StrokeWidth) - 4);
3211
+ }
3212
+ 40% {
3213
+ stroke-dasharray: 220;
3214
+ stroke-dashoffset: 150;
3215
+ }
3216
+ 100% {
3217
+ stroke-dashoffset: 280;
3218
+ transform: rotate(720deg);
3219
+ }
3220
+ }
3336
3221
  .pf-v6-c-tooltip {
3337
3222
  --pf-v6-c-tooltip--MaxWidth: 18.75rem;
3338
3223
  --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
@@ -3462,4 +3347,119 @@ button.pf-v6-c-breadcrumb__link {
3462
3347
  background-color: var(--pf-v6-c-tooltip__arrow--BackgroundColor);
3463
3348
  box-shadow: var(--pf-v6-c-tooltip__arrow--BoxShadow);
3464
3349
  transform: translateX(var(--pf-v6-c-tooltip__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-tooltip__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-tooltip__arrow--Rotate, 0));
3350
+ }
3351
+
3352
+ .pf-v6-c-breadcrumb {
3353
+ --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
3354
+ --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
3355
+ --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3356
+ --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
3357
+ --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3358
+ --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
3359
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3360
+ --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3361
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
3362
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
3363
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
3364
+ --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
3365
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
3366
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
3367
+ --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
3368
+ --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
3369
+ --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
3370
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3371
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
3372
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3373
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
3374
+ }
3375
+
3376
+ .pf-v6-c-breadcrumb {
3377
+ display: inline-flex;
3378
+ }
3379
+
3380
+ .pf-v6-c-breadcrumb__list {
3381
+ display: flex;
3382
+ flex-wrap: wrap;
3383
+ align-items: center;
3384
+ }
3385
+
3386
+ .pf-v6-c-breadcrumb__item {
3387
+ display: flex;
3388
+ align-items: baseline;
3389
+ font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
3390
+ font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
3391
+ line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
3392
+ white-space: nowrap;
3393
+ list-style: none;
3394
+ }
3395
+
3396
+ .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
3397
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
3398
+ }
3399
+
3400
+ .pf-v6-c-breadcrumb__item:not(:last-child) {
3401
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
3402
+ }
3403
+
3404
+ .pf-v6-c-breadcrumb__item-divider {
3405
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
3406
+ font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
3407
+ line-height: 1;
3408
+ color: var(--pf-v6-c-breadcrumb__item-divider--Color);
3409
+ }
3410
+
3411
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
3412
+ scale: -1 1;
3413
+ }
3414
+
3415
+ .pf-v6-c-breadcrumb__link {
3416
+ padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
3417
+ padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
3418
+ font-size: inherit;
3419
+ font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
3420
+ line-height: inherit;
3421
+ color: var(--pf-v6-c-breadcrumb__link--Color);
3422
+ text-decoration: var(--pf-v6-c-breadcrumb__link--TextDecorationLine) var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
3423
+ word-break: break-word;
3424
+ background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
3425
+ }
3426
+
3427
+ .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
3428
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
3429
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
3430
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
3431
+ }
3432
+
3433
+ .pf-v6-c-breadcrumb__link.pf-m-current {
3434
+ cursor: default;
3435
+ }
3436
+
3437
+ .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
3438
+ color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
3439
+ text-decoration: none;
3440
+ }
3441
+
3442
+ button.pf-v6-c-breadcrumb__link {
3443
+ border: none;
3444
+ }
3445
+
3446
+ .pf-v6-c-breadcrumb__dropdown {
3447
+ margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
3448
+ margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
3449
+ margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
3450
+ margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
3451
+ }
3452
+
3453
+ .pf-v6-c-breadcrumb__heading {
3454
+ display: inline;
3455
+ font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
3456
+ }
3457
+
3458
+ .pf-v6-c-breadcrumb__link,
3459
+ .pf-v6-c-breadcrumb__heading {
3460
+ white-space: normal;
3461
+ }
3462
+
3463
+ .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
3464
+ display: none;
3465
3465
  }