@patternfly/quickstarts 6.0.0-alpha.6 → 6.0.0-prerelease.2

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 (22) hide show
  1. package/dist/index.es.js +7 -10
  2. package/dist/index.es.js.map +1 -1
  3. package/dist/index.js +7 -10
  4. package/dist/index.js.map +1 -1
  5. package/dist/patternfly-docs/quick-starts/design-guidelines/design-guidelines.md +122 -50
  6. package/dist/patternfly-global.css +1499 -5
  7. package/dist/patternfly-nested.css +622 -2413
  8. package/dist/quickstarts-full.es.js +371 -399
  9. package/dist/quickstarts-full.es.js.map +1 -1
  10. package/dist/quickstarts-standalone.css +5 -5
  11. package/dist/quickstarts-standalone.min.css +2 -6
  12. package/dist/quickstarts-vendor.css +44 -0
  13. package/dist/quickstarts.css +45 -1
  14. package/dist/quickstarts.min.css +1 -1
  15. package/package.json +11 -11
  16. package/src/catalog/QuickStartCatalog.tsx +1 -1
  17. package/src/catalog/QuickStartTile.tsx +3 -8
  18. package/src/catalog/QuickStartTileHeader.tsx +9 -13
  19. package/src/catalog/__tests__/QuickStartTile.spec.tsx +0 -1
  20. package/src/controller/QuickStartFooter.tsx +1 -0
  21. package/src/controller/QuickStartTaskHeaderList.tsx +2 -2
  22. package/src/controller/QuickStartTasks.tsx +1 -1
package/dist/patternfly-nested.css CHANGED
@@ -18,98 +18,12 @@
18
18
  :where(.pf-v6-m-dir-rtl, [dir="rtl"]) .pfext-quick-start__base .pf-v6-m-mirror-inline-rtl {
19
19
  scale: -1 1;
20
20
  }
21
- .pfext-quick-start__base :where(:root, .pf-v6-c-about-modal-box) {
22
- --pf-v6-c-about-modal-box--BackgroundImage: none;
23
- --pf-v6-c-about-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
24
- --pf-v6-c-about-modal-box--BackgroundPosition: bottom right;
25
- --pf-v6-c-about-modal-box--BackgroundSize--min-width: 200px;
26
- --pf-v6-c-about-modal-box--BackgroundSize--width: 60%;
27
- --pf-v6-c-about-modal-box--BackgroundSize--max-width: 600px;
28
- --pf-v6-c-about-modal-box--BackgroundSize: clamp(var(--pf-v6-c-about-modal-box--BackgroundSize--min-width), var(--pf-v6-c-about-modal-box--BackgroundSize--width), var(--pf-v6-c-about-modal-box--BackgroundSize--max-width));
29
- --pf-v6-c-about-modal-box--Height: 100%;
30
- --pf-v6-c-about-modal-box--lg--Height: 47.625rem;
31
- --pf-v6-c-about-modal-box--Width: 100%;
32
- --pf-v6-c-about-modal-box--sm--GridTemplateColumns: 5fr 1fr;
33
- --pf-v6-c-about-modal-box--lg--GridTemplateColumns: 1fr .6fr;
34
- --pf-v6-c-about-modal-box--BackgroundPosition:bottom right;
35
- --pf-v6-c-about-modal-box__brand--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
36
- --pf-v6-c-about-modal-box__brand--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
37
- --pf-v6-c-about-modal-box__brand--PaddingInlineStart: var(--pf-t--global--spacer--xl);
38
- --pf-v6-c-about-modal-box__brand--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
39
- --pf-v6-c-about-modal-box__brand--sm--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
40
- --pf-v6-c-about-modal-box__brand--sm--PaddingInlineStart: var(--pf-t--global--spacer--3xl);
41
- --pf-v6-c-about-modal-box__brand--sm--PaddingBlockEnd: var(--pf-t--global--spacer--3xl);
42
- --pf-v6-c-about-modal-box__close--ZIndex: var(--pf-t--global--z-index--2xl);
43
- --pf-v6-c-about-modal-box__close--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
44
- --pf-v6-c-about-modal-box__close--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
45
- --pf-v6-c-about-modal-box__close--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
46
- --pf-v6-c-about-modal-box__close--sm--PaddingBlockEnd: var(--pf-t--global--spacer--3xl);
47
- --pf-v6-c-about-modal-box__close--lg--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
48
- --pf-v6-c-about-modal-box__close--c-button--FontSize: var(--pf-t--global--icon--size--lg);
49
- --pf-v6-c-about-modal-box__brand-image--Height: 2.3125rem;
50
- --pf-v6-c-about-modal-box__header--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
51
- --pf-v6-c-about-modal-box__header--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
52
- --pf-v6-c-about-modal-box__header--PaddingInlineStart: var(--pf-t--global--spacer--xl);
53
- --pf-v6-c-about-modal-box__header--sm--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
54
- --pf-v6-c-about-modal-box__header--sm--PaddingInlineStart: var(--pf-t--global--spacer--3xl);
55
- --pf-v6-c-about-modal-box__strapline--PaddingBlockStart: var(--pf-t--global--spacer--xl);
56
- --pf-v6-c-about-modal-box__strapline--FontSize: var(--pf-t--global--font--size--body--sm);
57
- --pf-v6-c-about-modal-box__strapline--Color: var(--pf-t--global--text--color--subtle);
58
- --pf-v6-c-about-modal-box__strapline--sm--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
59
- --pf-v6-c-about-modal-box__content--MarginBlockStart: var(--pf-t--global--spacer--xl);
60
- --pf-v6-c-about-modal-box__content--MarginInlineEnd: var(--pf-t--global--spacer--xl);
61
- --pf-v6-c-about-modal-box__content--MarginBlockEnd: var(--pf-t--global--spacer--xl);
62
- --pf-v6-c-about-modal-box__content--MarginInlineStart: var(--pf-t--global--spacer--xl);
63
- --pf-v6-c-about-modal-box__content--sm--MarginBlockStart: var(--pf-t--global--spacer--2xl);
64
- --pf-v6-c-about-modal-box__content--sm--MarginInlineEnd: var(--pf-t--global--spacer--3xl);
65
- --pf-v6-c-about-modal-box__content--sm--MarginBlockEnd: var(--pf-t--global--spacer--2xl);
66
- --pf-v6-c-about-modal-box__content--sm--MarginInlineStart: var(--pf-t--global--spacer--3xl);
67
- }
68
- .pfext-quick-start__base :where(.pf-v6-m-dir-rtl, [dir="rtl"]) :where(:root, .pf-v6-c-about-modal-box) {
69
- --pf-v6-c-about-modal-box--BackgroundPosition:bottom left;
70
- }
71
- @media screen and (min-width: 36rem) {
72
- .pfext-quick-start__base :where(:root, .pf-v6-c-about-modal-box) {
73
- --pf-v6-c-about-modal-box__brand--PaddingInlineEnd: var(--pf-v6-c-about-modal-box__brand--sm--PaddingInlineEnd);
74
- --pf-v6-c-about-modal-box__brand--PaddingInlineStart: var(--pf-v6-c-about-modal-box__brand--sm--PaddingInlineStart);
75
- --pf-v6-c-about-modal-box__brand--PaddingBlockEnd: var(--pf-v6-c-about-modal-box__brand--sm--PaddingBlockEnd);
76
- }
77
- }
78
- @media only screen and (min-width: 36rem) {
79
- .pfext-quick-start__base :where(:root, .pf-v6-c-about-modal-box) {
80
- --pf-v6-c-about-modal-box__close--PaddingBlockEnd: var(--pf-v6-c-about-modal-box__close--sm--PaddingBlockEnd);
81
- }
82
- }
83
- @media only screen and (min-width: 62rem) {
84
- .pfext-quick-start__base :where(:root, .pf-v6-c-about-modal-box) {
85
- --pf-v6-c-about-modal-box__close--PaddingInlineEnd: var(--pf-v6-c-about-modal-box__close--lg--PaddingInlineEnd);
86
- }
87
- }
88
- @media only screen and (min-width: 36rem) {
89
- .pfext-quick-start__base :where(:root, .pf-v6-c-about-modal-box) {
90
- --pf-v6-c-about-modal-box__header--PaddingInlineEnd: var(--pf-v6-c-about-modal-box__header--sm--PaddingInlineEnd);
91
- --pf-v6-c-about-modal-box__header--PaddingInlineStart: var(--pf-v6-c-about-modal-box__header--sm--PaddingInlineStart);
92
- }
93
- }
94
- @media only screen and (min-width: 36rem) {
95
- .pfext-quick-start__base :where(:root, .pf-v6-c-about-modal-box) {
96
- --pf-v6-c-about-modal-box__strapline--PaddingBlockStart: var(--pf-v6-c-about-modal-box__strapline--sm--PaddingBlockStart);
97
- }
98
- }
99
- @media only screen and (min-width: 36rem) {
100
- .pfext-quick-start__base :where(:root, .pf-v6-c-about-modal-box) {
101
- --pf-v6-c-about-modal-box__content--MarginBlockStart: var(--pf-v6-c-about-modal-box__content--sm--MarginBlockStart);
102
- --pf-v6-c-about-modal-box__content--MarginInlineEnd: var(--pf-v6-c-about-modal-box__content--sm--MarginInlineEnd);
103
- --pf-v6-c-about-modal-box__content--MarginBlockEnd: var(--pf-v6-c-about-modal-box__content--sm--MarginBlockEnd);
104
- --pf-v6-c-about-modal-box__content--MarginInlineStart: var(--pf-v6-c-about-modal-box__content--sm--MarginInlineStart);
105
- }
106
- }
107
- .pfext-quick-start__base :where(:root, .pf-v6-c-accordion) {
21
+ .pfext-quick-start__base .pf-v6-c-accordion {
108
22
  --pf-v6-c-accordion--BackgroundColor: var(--pf-t--global--background--color--primary--default);
109
23
  --pf-v6-c-accordion--RowGap: var(--pf-t--global--spacer--xs);
110
24
  --pf-v6-c-accordion__item--BorderRadius: var(--pf-t--global--border--radius--200);
111
25
  --pf-v6-c-accordion__item--m-expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
112
- --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-t--global--spacer--sm);
26
+ --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
113
27
  --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
114
28
  --pf-v6-c-accordion__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
115
29
  --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -118,7 +32,7 @@
118
32
  --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
119
33
  --pf-v6-c-accordion__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
120
34
  --pf-v6-c-accordion__toggle--BorderRadius: var(--pf-t--global--border--radius--small);
121
- --pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-t--global--spacer--md);
35
+ --pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
122
36
  --pf-v6-c-accordion__toggle-text--Color: var(--pf-t--global--text--color--regular);
123
37
  --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--default);
124
38
  --pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
@@ -248,9 +162,9 @@
248
162
  .pfext-quick-start__base .pf-v6-c-accordion__expandable-content-body + .pf-v6-c-accordion__expandable-content-body {
249
163
  --pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart);
250
164
  }
251
- .pfext-quick-start__base :where(:root, .pf-v6-c-action-list) {
165
+ .pfext-quick-start__base .pf-v6-c-action-list {
252
166
  --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
253
- --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal);
167
+ --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--default);
254
168
  --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default);
255
169
  --pf-v6-c-action-list--m-icons--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
256
170
  }
@@ -274,7 +188,7 @@
274
188
  .pfext-quick-start__base .pf-v6-c-action-list__group.pf-m-icons {
275
189
  column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
276
190
  }
277
- .pfext-quick-start__base :where(:root, .pf-v6-c-alert) {
191
+ .pfext-quick-start__base .pf-v6-c-alert {
278
192
  --pf-v6-c-alert--BoxShadow: var(--pf-t--global--box-shadow--lg);
279
193
  --pf-v6-c-alert--BackgroundColor: var(--pf-t--global--background--color--floating--default);
280
194
  --pf-v6-c-alert--GridTemplateColumns: max-content 1fr max-content;
@@ -292,9 +206,11 @@
292
206
  --pf-v6-c-alert--FontSize: var(--pf-t--global--font--size--body--default);
293
207
  --pf-v6-c-alert__toggle--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
294
208
  --pf-v6-c-alert__toggle--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
209
+ --pf-v6-c-alert__toggle--MarginInlineStart: calc(-1 * var(--pf-t--global--spacer--action--horizontal--plain--default));
295
210
  --pf-v6-c-alert__toggle--MarginInlineEnd: var(--pf-t--global--spacer--sm);
296
211
  --pf-v6-c-alert__toggle-icon--Rotate: 0;
297
- --pf-v6-c-alert__toggle-icon--Transition: var(--pf-t--global--transition);
212
+ --pf-v6-c-alert__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
213
+ --pf-v6-c-alert__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
298
214
  --pf-v6-c-alert__icon--Color: var(--pf-t--global--icon--color--regular);
299
215
  --pf-v6-c-alert__icon--MarginBlockStart: 0.25rem;
300
216
  --pf-v6-c-alert__icon--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
@@ -408,20 +324,19 @@
408
324
  .pfext-quick-start__base .pf-v6-c-alert__toggle {
409
325
  margin-block-start: var(--pf-v6-c-alert__toggle--MarginBlockStart);
410
326
  margin-block-end: var(--pf-v6-c-alert__toggle--MarginBlockEnd);
327
+ margin-inline-start: var(--pf-v6-c-alert__toggle--MarginInlineStart);
411
328
  margin-inline-end: var(--pf-v6-c-alert__toggle--MarginInlineEnd);
412
329
  }
413
330
  .pfext-quick-start__base .pf-v6-c-alert__toggle-icon {
414
331
  display: inline-block;
415
- transition: var(--pf-v6-c-alert__toggle-icon--Transition);
332
+ transition: transform var(--pf-v6-c-alert__toggle-icon--TransitionDuration) var(--pf-v6-c-alert__toggle-icon--TransitionTimingFunction);
416
333
  transform: rotate(var(--pf-v6-c-alert__toggle-icon--Rotate));
417
334
  }
418
335
  .pfext-quick-start__base :where(.pf-v6-m-dir-rtl, [dir="rtl"]) .pf-v6-c-alert__toggle-icon {
419
336
  scale: -1 1;
420
337
  }
421
338
  .pfext-quick-start__base .pf-v6-c-alert__icon {
422
- display: flex;
423
339
  grid-area: icon;
424
- margin-block-start: var(--pf-v6-c-alert__icon--MarginBlockStart);
425
340
  margin-inline-end: var(--pf-v6-c-alert__icon--MarginInlineEnd);
426
341
  font-size: var(--pf-v6-c-alert__icon--FontSize);
427
342
  color: var(--pf-v6-c-alert__icon--Color);
@@ -451,10 +366,6 @@
451
366
  margin-block-start: var(--pf-v6-c-alert__action--MarginBlockStart);
452
367
  margin-block-end: var(--pf-v6-c-alert__action--MarginBlockEnd);
453
368
  margin-inline-end: var(--pf-v6-c-alert__action--MarginInlineEnd);
454
- transform: translateY(var(--pf-v6-c-alert__action--TranslateY));
455
- }
456
- .pfext-quick-start__base .pf-v6-c-alert__action > .pf-v6-c-button {
457
- --pf-v6-c-button--LineHeight: 1;
458
369
  }
459
370
  .pfext-quick-start__base .pf-v6-c-alert__action-group {
460
371
  grid-area: actiongroup;
@@ -463,30 +374,7 @@
463
374
  .pfext-quick-start__base .pf-v6-c-alert__action-group > .pf-v6-c-button:not(:last-child) {
464
375
  margin-inline-end: var(--pf-v6-c-alert__action-group__c-button--not-last-child--MarginInlineEnd);
465
376
  }
466
- .pfext-quick-start__base :where(:root, .pf-v6-c-alert-group) {
467
- --pf-v6-c-alert-group__item--MarginBlockStart: var(--pf-t--global--spacer--gap--group--vertical);
468
- --pf-v6-c-alert-group--m-toast--InsetBlockStart: var(--pf-t--global--spacer--2xl);
469
- --pf-v6-c-alert-group--m-toast--InsetInlineEnd: var(--pf-t--global--spacer--xl);
470
- --pf-v6-c-alert-group--m-toast--MaxWidth: 37.5rem;
471
- --pf-v6-c-alert-group--m-toast--ZIndex: var(--pf-t--global--z-index--2xl);
472
- --pf-v6-c-alert-group__overflow-button--BorderWidth: 0;
473
- --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
474
- --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
475
- --pf-v6-c-alert-group__overflow-button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
476
- --pf-v6-c-alert-group__overflow-button--PaddingBlockEnd: var(--pf-t--global--spacer--md);
477
- --pf-v6-c-alert-group__overflow-button--PaddingInlineStart: var(--pf-t--global--spacer--md);
478
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-t--global--text--color--link--default);
479
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-t--global--box-shadow--lg);
480
- --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-t--global--background--color--floating--default);
481
- --pf-v6-c-alert-group__overflow-button--hover--Color: var(--pf-t--global--text--color--link--hover);
482
- --pf-v6-c-alert-group__overflow-button--hover--BackgroundColor: var(--pf-t--global--background--color--floating--hover);
483
- --pf-v6-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
484
- --pf-v6-c-alert-group__overflow-button--focus--Color: var(--pf-t--global--text--color--link--hover);
485
- --pf-v6-c-alert-group__overflow-button--focus--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
486
- --pf-v6-c-alert-group__overflow-button--active--Color: var(--pf-t--global--text--color--link--hover);
487
- --pf-v6-c-alert-group__overflow-button--active--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
488
- }
489
- .pfext-quick-start__base :where(:root, .pf-v6-c-avatar) {
377
+ .pfext-quick-start__base .pf-v6-c-avatar {
490
378
  --pf-v6-c-avatar--BorderColor: transparent;
491
379
  --pf-v6-c-avatar--BorderWidth: 0;
492
380
  --pf-v6-c-avatar--BorderRadius: var(--pf-t--global--border--radius--pill);
@@ -503,7 +391,233 @@
503
391
  --pf-v6-c-avatar--m-bordered--BorderColor: var(--pf-t--global--border--color--default);
504
392
  --pf-v6-c-avatar--m-bordered--BorderWidth: var(--pf-t--global--border--width--box--default);
505
393
  }
506
- .pfext-quick-start__base :where(:root, .pf-v6-c-backdrop) {
394
+ .pfext-quick-start__base .pf-v6-c-avatar {
395
+ width: var(--pf-v6-c-avatar--Width);
396
+ height: var(--pf-v6-c-avatar--Height);
397
+ border: var(--pf-v6-c-avatar--BorderWidth) solid var(--pf-v6-c-avatar--BorderColor);
398
+ border-radius: var(--pf-v6-c-avatar--BorderRadius);
399
+ }
400
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-bordered {
401
+ --pf-v6-c-avatar--BorderColor: var(--pf-v6-c-avatar--m-bordered--BorderColor);
402
+ --pf-v6-c-avatar--BorderWidth: var(--pf-v6-c-avatar--m-bordered--BorderWidth);
403
+ }
404
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
405
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width);
406
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height);
407
+ }
408
+ @media (min-width: 36rem) {
409
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
410
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width));
411
+ }
412
+ }
413
+ @media (min-width: 48rem) {
414
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
415
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-md, var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width)));
416
+ }
417
+ }
418
+ @media (min-width: 62rem) {
419
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
420
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-lg, var(--pf-v6-c-avatar--m-sm--Width-on-md, var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width))));
421
+ }
422
+ }
423
+ @media (min-width: 75rem) {
424
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
425
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-xl, var(--pf-v6-c-avatar--m-sm--Width-on-lg, var(--pf-v6-c-avatar--m-sm--Width-on-md, var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width)))));
426
+ }
427
+ }
428
+ @media (min-width: 90.625rem) {
429
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
430
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-2xl, var(--pf-v6-c-avatar--m-sm--Width-on-xl, var(--pf-v6-c-avatar--m-sm--Width-on-lg, var(--pf-v6-c-avatar--m-sm--Width-on-md, var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width))))));
431
+ }
432
+ }
433
+ @media (min-width: 36rem) {
434
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
435
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height));
436
+ }
437
+ }
438
+ @media (min-width: 48rem) {
439
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
440
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-md, var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height)));
441
+ }
442
+ }
443
+ @media (min-width: 62rem) {
444
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
445
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-lg, var(--pf-v6-c-avatar--m-sm--Height-on-md, var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height))));
446
+ }
447
+ }
448
+ @media (min-width: 75rem) {
449
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
450
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-xl, var(--pf-v6-c-avatar--m-sm--Height-on-lg, var(--pf-v6-c-avatar--m-sm--Height-on-md, var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height)))));
451
+ }
452
+ }
453
+ @media (min-width: 90.625rem) {
454
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
455
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-2xl, var(--pf-v6-c-avatar--m-sm--Height-on-xl, var(--pf-v6-c-avatar--m-sm--Height-on-lg, var(--pf-v6-c-avatar--m-sm--Height-on-md, var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height))))));
456
+ }
457
+ }
458
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
459
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width);
460
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height);
461
+ }
462
+ @media (min-width: 36rem) {
463
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
464
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width));
465
+ }
466
+ }
467
+ @media (min-width: 48rem) {
468
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
469
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-md, var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width)));
470
+ }
471
+ }
472
+ @media (min-width: 62rem) {
473
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
474
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-lg, var(--pf-v6-c-avatar--m-md--Width-on-md, var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width))));
475
+ }
476
+ }
477
+ @media (min-width: 75rem) {
478
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
479
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-xl, var(--pf-v6-c-avatar--m-md--Width-on-lg, var(--pf-v6-c-avatar--m-md--Width-on-md, var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width)))));
480
+ }
481
+ }
482
+ @media (min-width: 90.625rem) {
483
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
484
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-2xl, var(--pf-v6-c-avatar--m-md--Width-on-xl, var(--pf-v6-c-avatar--m-md--Width-on-lg, var(--pf-v6-c-avatar--m-md--Width-on-md, var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width))))));
485
+ }
486
+ }
487
+ @media (min-width: 36rem) {
488
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
489
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height));
490
+ }
491
+ }
492
+ @media (min-width: 48rem) {
493
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
494
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-md, var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height)));
495
+ }
496
+ }
497
+ @media (min-width: 62rem) {
498
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
499
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-lg, var(--pf-v6-c-avatar--m-md--Height-on-md, var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height))));
500
+ }
501
+ }
502
+ @media (min-width: 75rem) {
503
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
504
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-xl, var(--pf-v6-c-avatar--m-md--Height-on-lg, var(--pf-v6-c-avatar--m-md--Height-on-md, var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height)))));
505
+ }
506
+ }
507
+ @media (min-width: 90.625rem) {
508
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
509
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-2xl, var(--pf-v6-c-avatar--m-md--Height-on-xl, var(--pf-v6-c-avatar--m-md--Height-on-lg, var(--pf-v6-c-avatar--m-md--Height-on-md, var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height))))));
510
+ }
511
+ }
512
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
513
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width);
514
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height);
515
+ }
516
+ @media (min-width: 36rem) {
517
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
518
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width));
519
+ }
520
+ }
521
+ @media (min-width: 48rem) {
522
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
523
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-md, var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width)));
524
+ }
525
+ }
526
+ @media (min-width: 62rem) {
527
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
528
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-lg, var(--pf-v6-c-avatar--m-lg--Width-on-md, var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width))));
529
+ }
530
+ }
531
+ @media (min-width: 75rem) {
532
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
533
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-xl, var(--pf-v6-c-avatar--m-lg--Width-on-lg, var(--pf-v6-c-avatar--m-lg--Width-on-md, var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width)))));
534
+ }
535
+ }
536
+ @media (min-width: 90.625rem) {
537
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
538
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-2xl, var(--pf-v6-c-avatar--m-lg--Width-on-xl, var(--pf-v6-c-avatar--m-lg--Width-on-lg, var(--pf-v6-c-avatar--m-lg--Width-on-md, var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width))))));
539
+ }
540
+ }
541
+ @media (min-width: 36rem) {
542
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
543
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height));
544
+ }
545
+ }
546
+ @media (min-width: 48rem) {
547
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
548
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-md, var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height)));
549
+ }
550
+ }
551
+ @media (min-width: 62rem) {
552
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
553
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-lg, var(--pf-v6-c-avatar--m-lg--Height-on-md, var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height))));
554
+ }
555
+ }
556
+ @media (min-width: 75rem) {
557
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
558
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-xl, var(--pf-v6-c-avatar--m-lg--Height-on-lg, var(--pf-v6-c-avatar--m-lg--Height-on-md, var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height)))));
559
+ }
560
+ }
561
+ @media (min-width: 90.625rem) {
562
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
563
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-2xl, var(--pf-v6-c-avatar--m-lg--Height-on-xl, var(--pf-v6-c-avatar--m-lg--Height-on-lg, var(--pf-v6-c-avatar--m-lg--Height-on-md, var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height))))));
564
+ }
565
+ }
566
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
567
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width);
568
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height);
569
+ }
570
+ @media (min-width: 36rem) {
571
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
572
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width));
573
+ }
574
+ }
575
+ @media (min-width: 48rem) {
576
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
577
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-md, var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width)));
578
+ }
579
+ }
580
+ @media (min-width: 62rem) {
581
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
582
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-lg, var(--pf-v6-c-avatar--m-xl--Width-on-md, var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width))));
583
+ }
584
+ }
585
+ @media (min-width: 75rem) {
586
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
587
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-xl, var(--pf-v6-c-avatar--m-xl--Width-on-lg, var(--pf-v6-c-avatar--m-xl--Width-on-md, var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width)))));
588
+ }
589
+ }
590
+ @media (min-width: 90.625rem) {
591
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
592
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-2xl, var(--pf-v6-c-avatar--m-xl--Width-on-xl, var(--pf-v6-c-avatar--m-xl--Width-on-lg, var(--pf-v6-c-avatar--m-xl--Width-on-md, var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width))))));
593
+ }
594
+ }
595
+ @media (min-width: 36rem) {
596
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
597
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height));
598
+ }
599
+ }
600
+ @media (min-width: 48rem) {
601
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
602
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-md, var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height)));
603
+ }
604
+ }
605
+ @media (min-width: 62rem) {
606
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
607
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-lg, var(--pf-v6-c-avatar--m-xl--Height-on-md, var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height))));
608
+ }
609
+ }
610
+ @media (min-width: 75rem) {
611
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
612
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-xl, var(--pf-v6-c-avatar--m-xl--Height-on-lg, var(--pf-v6-c-avatar--m-xl--Height-on-md, var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height)))));
613
+ }
614
+ }
615
+ @media (min-width: 90.625rem) {
616
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
617
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-2xl, var(--pf-v6-c-avatar--m-xl--Height-on-xl, var(--pf-v6-c-avatar--m-xl--Height-on-lg, var(--pf-v6-c-avatar--m-xl--Height-on-md, var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height))))));
618
+ }
619
+ }
620
+ .pfext-quick-start__base .pf-v6-c-backdrop {
507
621
  --pf-v6-c-backdrop--Position: fixed;
508
622
  --pf-v6-c-backdrop--ZIndex: var(--pf-t--global--z-index--lg);
509
623
  --pf-v6-c-backdrop--BackgroundColor: var(--pf-t--global--background--color--backdrop--default);
@@ -520,31 +634,7 @@
520
634
  .pfext-quick-start__base .pf-v6-c-backdrop__open {
521
635
  overflow: hidden;
522
636
  }
523
- .pfext-quick-start__base :where(:root, .pf-v6-c-background-image) {
524
- --pf-v6-c-background-image--BackgroundColor: var(--pf-t--global--background--color--primary--default);
525
- --pf-v6-c-background-image--BackgroundImage: none;
526
- --pf-v6-c-background-image--BackgroundSize--min-width: 200px;
527
- --pf-v6-c-background-image--BackgroundSize--width: 60%;
528
- --pf-v6-c-background-image--BackgroundSize--max-width: 600px;
529
- --pf-v6-c-background-image--BackgroundSize: clamp(var(--pf-v6-c-background-image--BackgroundSize--min-width), var(--pf-v6-c-background-image--BackgroundSize--width), var(--pf-v6-c-background-image--BackgroundSize--max-width));
530
- }
531
- .pfext-quick-start__base :where(:root, .pf-v6-c-back-to-top) {
532
- --pf-v6-c-back-to-top--InsetInlineEnd: var(--pf-t--global--spacer--2xl);
533
- --pf-v6-c-back-to-top--InsetBlockEnd: var(--pf-t--global--spacer--lg);
534
- --pf-v6-c-back-to-top--md--InsetBlockEnd: var(--pf-t--global--spacer--2xl);
535
- --pf-v6-c-back-to-top--c-button--FontSize: var(--pf-t--global--font--size--body--sm);
536
- --pf-v6-c-back-to-top--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
537
- --pf-v6-c-back-to-top--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
538
- --pf-v6-c-back-to-top--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
539
- --pf-v6-c-back-to-top--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
540
- --pf-v6-c-back-to-top--c-button--BoxShadow: var(--pf-t--global--box-shadow--sm);
541
- }
542
- @media (min-width: 48rem) {
543
- .pfext-quick-start__base :where(:root, .pf-v6-c-back-to-top) {
544
- --pf-v6-c-back-to-top--InsetBlockEnd: var(--pf-v6-c-back-to-top--md--InsetBlockEnd);
545
- }
546
- }
547
- .pfext-quick-start__base :where(:root, .pf-v6-c-badge) {
637
+ .pfext-quick-start__base .pf-v6-c-badge {
548
638
  --pf-v6-c-badge--BorderColor: transparent;
549
639
  --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
550
640
  --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
@@ -609,62 +699,7 @@
609
699
  margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
610
700
  color: var(--pf-v6-c-badge__toggle-icon--Color);
611
701
  }
612
- .pfext-quick-start__base :where(:root, .pf-v6-c-banner) {
613
- --pf-v6-c-banner--PaddingBlockStart: var(--pf-t--global--spacer--xs);
614
- --pf-v6-c-banner--PaddingInlineEnd: var(--pf-t--global--spacer--md);
615
- --pf-v6-c-banner--md--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
616
- --pf-v6-c-banner--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
617
- --pf-v6-c-banner--PaddingInlineStart: var(--pf-t--global--spacer--md);
618
- --pf-v6-c-banner--md--PaddingInlineStart: var(--pf-t--global--spacer--lg);
619
- --pf-v6-c-banner--FontSize: var(--pf-t--global--font--size--body--default);
620
- --pf-v6-c-banner--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
621
- --pf-v6-c-banner--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
622
- --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
623
- --pf-v6-c-banner--link--TextDecoration: underline;
624
- --pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
625
- --pf-v6-c-banner--link--hover--FontWeight: var(--pf-t--global--font--weight--body--bold);
626
- --pf-v6-c-banner--link--disabled--Color: var(--pf-v6-c-banner--Color);
627
- --pf-v6-c-banner--link--disabled--TextDecoration: none;
628
- --pf-v6-c-banner--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
629
- --pf-v6-c-banner--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md);
630
- --pf-v6-c-banner--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
631
- --pf-v6-c-banner--m-danger--Color: var(--pf-t--global--text--color--status--on-danger--default);
632
- --pf-v6-c-banner--m-success--BackgroundColor: var(--pf-t--global--color--status--success--default);
633
- --pf-v6-c-banner--m-success--Color: var(--pf-t--global--text--color--status--on-success--default);
634
- --pf-v6-c-banner--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
635
- --pf-v6-c-banner--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
636
- --pf-v6-c-banner--m-info--BackgroundColor: var(--pf-t--global--color--status--info--default);
637
- --pf-v6-c-banner--m-info--Color: var(--pf-t--global--text--color--status--on-info--default);
638
- --pf-v6-c-banner--m-custom--BackgroundColor: var(--pf-t--global--color--status--custom--default);
639
- --pf-v6-c-banner--m-custom--Color: var(--pf-t--global--text--color--status--on-custom--default);
640
- --pf-v6-c-banner--m-red--BackgroundColor: var(--pf-t--global--color--nonstatus--red--default);
641
- --pf-v6-c-banner--m-red--Color: var(--pf-t--global--text--color--nonstatus--on-red--default);
642
- --pf-v6-c-banner--m-orangered--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--default);
643
- --pf-v6-c-banner--m-orangered--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--default);
644
- --pf-v6-c-banner--m-orange--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--default);
645
- --pf-v6-c-banner--m-orange--Color: var(--pf-t--global--text--color--nonstatus--on-orange--default);
646
- --pf-v6-c-banner--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
647
- --pf-v6-c-banner--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
648
- --pf-v6-c-banner--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
649
- --pf-v6-c-banner--m-green--Color: var(--pf-t--global--text--color--nonstatus--on-green--default);
650
- --pf-v6-c-banner--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
651
- --pf-v6-c-banner--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
652
- --pf-v6-c-banner--m-blue--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--default);
653
- --pf-v6-c-banner--m-blue--Color: var(--pf-t--global--text--color--nonstatus--on-blue--default);
654
- --pf-v6-c-banner--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
655
- --pf-v6-c-banner--m-purple--Color: var(--pf-t--global--text--color--nonstatus--on-purple--default);
656
- }
657
- @media (min-width: 48rem) {
658
- .pfext-quick-start__base :where(:root, .pf-v6-c-banner) {
659
- --pf-v6-c-banner--PaddingInlineEnd: var(--pf-v6-c-banner--md--PaddingInlineEnd);
660
- --pf-v6-c-banner--PaddingInlineStart: var(--pf-v6-c-banner--md--PaddingInlineStart);
661
- }
662
- }
663
- .pfext-quick-start__base :where(:root, .pf-v6-c-brand) {
664
- --pf-v6-c-brand--Width: auto;
665
- --pf-v6-c-brand--Height: auto;
666
- }
667
- .pfext-quick-start__base :where(:root, .pf-v6-c-breadcrumb) {
702
+ .pfext-quick-start__base .pf-v6-c-breadcrumb {
668
703
  --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
669
704
  --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
670
705
  --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -762,11 +797,12 @@
762
797
  .pfext-quick-start__base .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
763
798
  display: none;
764
799
  }
765
- .pfext-quick-start__base :where(:root, .pf-v6-c-button) {
800
+ .pfext-quick-start__base .pf-v6-c-button {
766
801
  --pf-v6-c-button--Display: inline-flex;
767
802
  --pf-v6-c-button--AlignItems: baseline;
768
803
  --pf-v6-c-button--JustifyContent: center;
769
804
  --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
805
+ --pf-v6-c-button--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--PaddingBlockStart) + var(--pf-v6-c-button--PaddingBlockEnd));
770
806
  --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
771
807
  --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
772
808
  --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
@@ -803,6 +839,7 @@
803
839
  --pf-v6-c-button--m-primary--m-clicked__icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
804
840
  --pf-v6-c-button--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
805
841
  --pf-v6-c-button--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
842
+ --pf-v6-c-button--m-secondary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
806
843
  --pf-v6-c-button--m-secondary__icon--Color: var(--pf-t--global--icon--color--brand--default);
807
844
  --pf-v6-c-button--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
808
845
  --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
@@ -821,6 +858,7 @@
821
858
  --pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--danger--clicked);
822
859
  --pf-v6-c-button--m-tertiary--Color: var(--pf-t--global--text--color--brand--default);
823
860
  --pf-v6-c-button--m-tertiary--BorderColor: var(--pf-t--global--border--color--default);
861
+ --pf-v6-c-button--m-tertiary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
824
862
  --pf-v6-c-button--m-tertiary__icon--Color: var(--pf-t--global--icon--color--brand--default);
825
863
  --pf-v6-c-button--m-tertiary--hover--Color: var(--pf-t--global--text--color--brand--hover);
826
864
  --pf-v6-c-button--m-tertiary--hover--BorderColor: var(--pf-t--global--border--color--hover);
@@ -875,7 +913,6 @@
875
913
  --pf-v6-c-button--m-plain--Color: var(--pf-t--global--icon--color--regular);
876
914
  --pf-v6-c-button--m-plain__icon--Color: var(--pf-t--global--text--color--regular);
877
915
  --pf-v6-c-button--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
878
- --pf-v6-c-button--m-plain--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--PaddingBlockStart) + var(--pf-v6-c-button--PaddingBlockEnd));
879
916
  --pf-v6-c-button--m-plain--hover--Color: var(--pf-t--global--icon--color--regular);
880
917
  --pf-v6-c-button--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
881
918
  --pf-v6-c-button--m-plain--m-clicked--Color: var(--pf-t--global--icon--color--regular);
@@ -890,7 +927,9 @@
890
927
  --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: 0;
891
928
  --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: 0;
892
929
  --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: 0;
930
+ --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-t--global--icon--color--subtle);
893
931
  --pf-v6-c-button--m-plain--m-no-padding--BackgroundColor: transparent;
932
+ --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-t--global--icon--color--regular);
894
933
  --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
895
934
  --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
896
935
  --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
@@ -978,7 +1017,7 @@
978
1017
  --pf-v6-c-button__icon--MarginInlineEnd: 0;
979
1018
  --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
980
1019
  --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
981
- --pf-v6-c-button__progress--width: calc(var(--pf-v6-c-spinner--m-md--diameter) + var(--pf-t--global--spacer--sm));
1020
+ --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
982
1021
  --pf-v6-c-button__progress--Opacity: 0;
983
1022
  --pf-v6-c-button__progress--TranslateY: -50%;
984
1023
  --pf-v6-c-button__progress--TranslateX: 0;
@@ -989,7 +1028,7 @@
989
1028
  --pf-v6-c-button--m-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width) / 2);
990
1029
  --pf-v6-c-button--m-in-progress--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
991
1030
  --pf-v6-c-button--m-in-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width));
992
- --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-v6-c-spinner--Color);
1031
+ --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
993
1032
  --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
994
1033
  --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
995
1034
  --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
@@ -1002,6 +1041,7 @@
1002
1041
  gap: var(--pf-v6-c-button--Gap);
1003
1042
  align-items: var(--pf-v6-c-button--AlignItems);
1004
1043
  justify-content: var(--pf-v6-c-button--JustifyContent);
1044
+ min-width: var(--pf-v6-c-button--MinWidth);
1005
1045
  padding-block-start: var(--pf-v6-c-button--PaddingBlockStart);
1006
1046
  padding-block-end: var(--pf-v6-c-button--PaddingBlockEnd);
1007
1047
  padding-inline-start: var(--pf-v6-c-button--PaddingInlineStart);
@@ -1052,6 +1092,7 @@
1052
1092
  .pfext-quick-start__base .pf-v6-c-button.pf-m-secondary {
1053
1093
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-secondary--Color);
1054
1094
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-secondary--BorderColor);
1095
+ --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-secondary--TransitionDuration);
1055
1096
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-secondary__icon--Color);
1056
1097
  --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-secondary--hover--Color);
1057
1098
  --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-secondary--hover--BorderColor);
@@ -1077,6 +1118,7 @@
1077
1118
  .pfext-quick-start__base .pf-v6-c-button.pf-m-tertiary {
1078
1119
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-tertiary--Color);
1079
1120
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-tertiary--BorderColor);
1121
+ --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-tertiary--TransitionDuration);
1080
1122
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-tertiary__icon--Color);
1081
1123
  --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-tertiary--hover--Color);
1082
1124
  --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-tertiary--hover--BorderColor);
@@ -1237,9 +1279,9 @@
1237
1279
  --pf-v6-c-button--disabled--BackgroundColor: var(--pf-v6-c-button--m-plain--disabled--BackgroundColor);
1238
1280
  --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineEnd);
1239
1281
  --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineStart);
1240
- min-width: var(--pf-v6-c-button--m-plain--MinWidth);
1241
1282
  }
1242
1283
  .pfext-quick-start__base .pf-v6-c-button.pf-m-plain.pf-m-no-padding {
1284
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding__icon--Color);
1243
1285
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--BackgroundColor);
1244
1286
  --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor);
1245
1287
  --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor);
@@ -1271,6 +1313,7 @@
1271
1313
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
1272
1314
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--hover--BorderColor);
1273
1315
  --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
1316
+ --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color);
1274
1317
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
1275
1318
  text-decoration: var(--pf-v6-c-button--hover--TextDecorationLine) var(--pf-v6-c-button--hover--TextDecorationStyle);
1276
1319
  }
@@ -1343,66 +1386,7 @@
1343
1386
  display: inline-flex;
1344
1387
  align-items: center;
1345
1388
  }
1346
- .pfext-quick-start__base :where(:root, .pf-v6-c-calendar-month) {
1347
- --pf-v6-c-calendar-month--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1348
- --pf-v6-c-calendar-month--PaddingBlockStart: var(--pf-t--global--spacer--lg);
1349
- --pf-v6-c-calendar-month--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
1350
- --pf-v6-c-calendar-month--PaddingBlockEnd: var(--pf-t--global--spacer--md);
1351
- --pf-v6-c-calendar-month--PaddingInlineStart: var(--pf-t--global--spacer--lg);
1352
- --pf-v6-c-calendar-month--FontSize: var(--pf-t--global--font--size--sm);
1353
- --pf-v6-c-calendar-month__header--MarginBlockEnd: var(--pf-t--global--spacer--md);
1354
- --pf-v6-c-calendar-month__header--Gap: var(--pf-t--global--spacer--xs);
1355
- --pf-v6-c-calendar-month__header-year--Width: 9ch;
1356
- --pf-v6-c-calendar-month__header-nav-control--MarginInlineEnd: 0;
1357
- --pf-v6-c-calendar-month__header-nav-control--MarginInlineStart: 0;
1358
- --pf-v6-c-calendar-month__days--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
1359
- --pf-v6-c-calendar-month__days--BorderBlockEndColor: var(--pf-t--global--border--color--default);
1360
- --pf-v6-c-calendar-month__day--PaddingBlockEnd: var(--pf-t--global--spacer--md);
1361
- --pf-v6-c-calendar-month__day--FontWeight: var(--pf-t--global--font--weight--body--default);
1362
- --pf-v6-c-calendar-month__day--Color: var(--pf-t--global--text--color--regular);
1363
- --pf-v6-c-calendar-month__dates-cell--PaddingBlockStart: 0.125rem;
1364
- --pf-v6-c-calendar-month__dates-cell--PaddingInlineEnd: 0.125rem;
1365
- --pf-v6-c-calendar-month__dates-cell--PaddingBlockEnd: 0.125rem;
1366
- --pf-v6-c-calendar-month__dates-cell--PaddingInlineStart: 0.125rem;
1367
- --pf-v6-c-calendar-month__dates-row--first-child__dates-cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
1368
- --pf-v6-c-calendar-month__dates-cell--m-current__date--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
1369
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--BackgroundColor: var(--pf-t--global--color--brand--default);
1370
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--hover--BackgroundColor: var(--pf-t--global--color--brand--default);
1371
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--BackgroundColor: var(--pf-t--global--color--brand--default);
1372
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--after--BorderColor: var(--pf-t--global--border--color--brand--default);
1373
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--Color: var(--pf-t--global--text--color--on-brand--default);
1374
- --pf-v6-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
1375
- --pf-v6-c-calendar-month__dates-cell--before--InsetBlockStart: 0;
1376
- --pf-v6-c-calendar-month__dates-cell--before--InsetInlineEnd: 0;
1377
- --pf-v6-c-calendar-month__dates-cell--before--InsetBlockEnd: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockEnd);
1378
- --pf-v6-c-calendar-month__dates-cell--before--InsetInlineStart: 0;
1379
- --pf-v6-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
1380
- --pf-v6-c-calendar-month__dates-cell--m-in-range--m-start-range--before--InsetInlineStart: 50%;
1381
- --pf-v6-c-calendar-month__dates-cell--m-in-range--m-end-range--before--InsetInlineEnd: 50%;
1382
- --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
1383
- --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderWidth: var(--pf-t--global--border--width--regular);
1384
- --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderColor: var(--pf-t--global--border--color--hover);
1385
- --pf-v6-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
1386
- --pf-v6-c-calendar-month__dates-cell--m-adjacent-month__date--Color: var(--pf-t--global--text--color--subtle);
1387
- --pf-v6-c-calendar-month__date--Width: 4ch;
1388
- --pf-v6-c-calendar-month__date--Height: 4ch;
1389
- --pf-v6-c-calendar-month__date--BorderRadius: var(--pf-t--global--border--radius--large);
1390
- --pf-v6-c-calendar-month__date--Color: var(--pf-t--global--text--color--regular);
1391
- --pf-v6-c-calendar-month__date--BackgroundColor: transparent;
1392
- --pf-v6-c-calendar-month__date--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1393
- --pf-v6-c-calendar-month__date--disabled--Color: var(--pf-t--global--text--color--on-disabled);
1394
- --pf-v6-c-calendar-month__date--after--BorderWidth: var(--pf-t--global--border--width--regular);
1395
- --pf-v6-c-calendar-month__date--after--BorderColor: transparent;
1396
- --pf-v6-c-calendar-month__date--after--OutlineOffset: 0;
1397
- --pf-v6-c-calendar-month__date--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
1398
- --pf-v6-c-calendar-month__date--hover--BorderWidth: var(--pf-t--global--border--width--regular);
1399
- --pf-v6-c-calendar-month__date--hover--BorderColor: var(--pf-t--global--border--color--hover);
1400
- --pf-v6-c-calendar-month__date--focus--Color: var(--pf-t--global--icon--color--on-brand--clicked);
1401
- --pf-v6-c-calendar-month__date--focus--BackgroundColor: var(--pf-t--global--color--brand--default);
1402
- --pf-v6-c-calendar-month__date--focus--after--BorderColor: var(--pf-t--global--border--color--hover);
1403
- --pf-v6-c-calendar-month__date--after--focus--OutlineOffset: -2px;
1404
- }
1405
- .pfext-quick-start__base :where(:root, .pf-v6-c-card) {
1389
+ .pfext-quick-start__base .pf-v6-c-card {
1406
1390
  --pf-v6-c-card--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1407
1391
  --pf-v6-c-card--BorderColor: var(--pf-t--global--border--color--default);
1408
1392
  --pf-v6-c-card--BorderStyle: solid;
@@ -1424,16 +1408,19 @@
1424
1408
  --pf-v6-c-card__footer--FontSize: var(--pf-t--global--font--size--body--default);
1425
1409
  --pf-v6-c-card__footer--Color: var(--pf-t--global--text--color--subtle);
1426
1410
  --pf-v6-c-card__actions--PaddingInlineStart: var(--pf-t--global--spacer--md);
1427
- --pf-v6-c-card__actions--Gap: var(--pf-t--global--spacer--sm);
1411
+ --pf-v6-c-card__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--default);
1428
1412
  --pf-v6-c-card__actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
1429
1413
  --pf-v6-c-card__actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
1430
1414
  --pf-v6-c-card__header-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
1431
1415
  --pf-v6-c-card__header-toggle--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
1432
1416
  --pf-v6-c-card__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
1433
1417
  --pf-v6-c-card__header-toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1);
1434
- --pf-v6-c-card__header-toggle-icon--Transition: var(--pf-t--global--transition);
1418
+ --pf-v6-c-card__header-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
1419
+ --pf-v6-c-card__header-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
1435
1420
  --pf-v6-c-card--m-expanded__header-toggle-icon--Rotate: 90deg;
1436
1421
  --pf-v6-c-card--m-selectable--BorderWidth: var(--pf-v6-c-card--BorderWidth);
1422
+ --pf-v6-c-card--m-clickable--m-current--BorderColor: var(--pf-t--global--border--color--clicked);
1423
+ --pf-v6-c-card--m-clickable--m-current--BorderWidth: var(--pf-t--global--border--width--box--clicked);
1437
1424
  --pf-v6-c-card--m-selectable--m-selected--BorderColor: var(--pf-t--global--border--color--clicked);
1438
1425
  --pf-v6-c-card--m-selectable--m-selected--BorderWidth: var(--pf-t--global--border--width--box--clicked);
1439
1426
  --pf-v6-c-card--m-selectable--hover--BorderColor: var(--pf-t--global--border--color--hover);
@@ -1500,23 +1487,25 @@
1500
1487
  .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable::before, .pfext-quick-start__base .pf-v6-c-card.pf-m-clickable::before {
1501
1488
  border: none;
1502
1489
  }
1503
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-check__label,
1504
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-radio__label {
1490
+ .pfext-quick-start__base .pf-v6-c-card.pf-m-current {
1491
+ --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-clickable--m-current--BorderColor);
1492
+ --pf-v6-c-card--BorderWidth: var(--pf-v6-c-card--m-clickable--m-current--BorderWidth);
1493
+ --pf-v6-c-card--m-selectable--hover--BorderColor: var(--pf-v6-c-card--m-clickable--m-current--BorderColor);
1494
+ --pf-v6-c-card--m-selectable--focus--BorderColor: var(--pf-v6-c-card--m-clickable--m-current--BorderColor);
1495
+ }
1496
+ .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__label, .pf-v6-c-radio__label) {
1505
1497
  position: unset;
1506
1498
  }
1507
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-check__label::before,
1508
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-radio__label::before {
1499
+ .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__label, .pf-v6-c-radio__label)::before {
1509
1500
  position: absolute;
1510
1501
  inset: 0;
1511
1502
  cursor: pointer;
1512
1503
  }
1513
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-check__input:where(:focus-visible) ~ .pf-v6-c-check__label,
1514
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-radio__input:where(:focus-visible) ~ .pf-v6-c-radio__label {
1504
+ .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__input, .pf-v6-c-radio__input):where(:focus-visible) ~ :is(.pf-v6-c-check__label, .pf-v6-c-radio__label) {
1515
1505
  --pf-v6-c-card--BackgroundColor: revert;
1516
1506
  --pf-v6-c-card--BorderColor: revert;
1517
1507
  }
1518
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-check__input:where(:checked) ~ .pf-v6-c-check__label,
1519
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-radio__input:where(:checked) ~ .pf-v6-c-radio__label, .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable.pf-m-selected {
1508
+ .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__input, .pf-v6-c-radio__input):where(:checked) ~ :is(.pf-v6-c-check__label, .pf-v6-c-radio__label), .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable.pf-m-selected {
1520
1509
  --pf-v6-c-card--BorderColor: revert;
1521
1510
  --pf-v6-c-card--m-selectable--BorderWidth: revert;
1522
1511
  }
@@ -1524,8 +1513,7 @@
1524
1513
  --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-selectable--m-clickable--m-current--BorderColor);
1525
1514
  --pf-v6-c-card--BorderWidth: var(--pf-v6-c-card--m-selectable--m-clickable--m-current--BorderWidth);
1526
1515
  }
1527
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-check__input:where(:disabled) ~ .pf-v6-c-check__label,
1528
- .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions .pf-v6-c-radio__input:where(:disabled) ~ .pf-v6-c-radio__label, .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable.pf-m-disabled {
1516
+ .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__input, .pf-v6-c-radio__input):where(:disabled) ~ :is(.pf-v6-c-check__label, .pf-v6-c-radio__label), .pfext-quick-start__base .pf-v6-c-card.pf-m-selectable.pf-m-clickable.pf-m-disabled {
1529
1517
  --pf-v6-c-card--BackgroundColor: var(--pf-v6-c-card--m-selectable--m-disabled--BackgroundColor);
1530
1518
  }
1531
1519
  .pfext-quick-start__base .pf-v6-c-card.pf-m-compact {
@@ -1596,7 +1584,7 @@
1596
1584
  }
1597
1585
  .pfext-quick-start__base .pf-v6-c-card__header-toggle-icon {
1598
1586
  display: inline-block;
1599
- transition: var(--pf-v6-c-card__header-toggle-icon--Transition);
1587
+ transition: transform var(--pf-v6-c-card__header-toggle-icon--TransitionDuration) var(--pf-v6-c-card__header-toggle-icon--TransitionTimingFunction);
1600
1588
  }
1601
1589
  .pfext-quick-start__base :where(.pf-v6-m-dir-rtl, [dir="rtl"]) .pf-v6-c-card__header-toggle-icon {
1602
1590
  scale: -1 1;
@@ -1628,15 +1616,13 @@
1628
1616
  --pf-v6-c-card__actions--MarginBlockStart: 0;
1629
1617
  --pf-v6-c-card__actions--MarginBlockEnd: 0;
1630
1618
  }
1631
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-check__label,
1632
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-radio__label {
1619
+ .pfext-quick-start__base .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__label, .pf-v6-c-radio__label, .pf-v6-c-card__clickable-action) {
1633
1620
  position: absolute;
1634
1621
  inset: 0;
1635
1622
  justify-self: auto;
1636
1623
  cursor: pointer;
1637
1624
  }
1638
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-check__label::before,
1639
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-radio__label::before {
1625
+ .pfext-quick-start__base .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__label, .pf-v6-c-radio__label, .pf-v6-c-card__clickable-action)::before {
1640
1626
  position: absolute;
1641
1627
  inset: 0;
1642
1628
  z-index: -1;
@@ -1645,28 +1631,24 @@
1645
1631
  border: var(--pf-v6-c-card--m-selectable--BorderWidth) solid var(--pf-v6-c-card--BorderColor, transparent);
1646
1632
  border-radius: var(--pf-v6-c-card--BorderRadius);
1647
1633
  }
1648
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-check__label:hover,
1649
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-radio__label:hover {
1634
+ .pfext-quick-start__base .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__label, .pf-v6-c-radio__label, .pf-v6-c-card__clickable-action):hover {
1650
1635
  --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-selectable--hover--BorderColor);
1651
1636
  }
1652
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-check__input:where(:checked) ~ .pf-v6-c-check__label,
1653
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-radio__input:where(:checked) ~ .pf-v6-c-radio__label,
1637
+ .pfext-quick-start__base .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__input, .pf-v6-c-radio__input):where(:checked) ~ :is(.pf-v6-c-radio__label, .pf-v6-c-check__label),
1654
1638
  .pfext-quick-start__base .pf-v6-c-card.pf-m-selected {
1655
1639
  --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-selectable--m-selected--BorderColor);
1656
1640
  --pf-v6-c-card--m-selectable--BorderWidth: var(--pf-v6-c-card--m-selectable--m-selected--BorderWidth);
1657
1641
  }
1658
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-check__input:where(:focus-visible) ~ .pf-v6-c-check__label,
1659
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-radio__input:where(:focus-visible) ~ .pf-v6-c-radio__label {
1642
+ .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-card__clickable-action:where(:focus-visible),
1643
+ .pfext-quick-start__base .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__input, .pf-v6-c-radio__input, .pf-v6-c-card__clickable-action):where(:focus-visible) ~ :is(.pf-v6-c-check__label, .pf-v6-c-radio__label) {
1660
1644
  --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-selectable--focus--BorderColor);
1661
1645
  --pf-v6-c-card--BorderWidth: var(--pf-v6-c-card--m-selectable--focus--BorderWidth);
1662
1646
  }
1663
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-check__input:where(:focus-visible):where(:checked) ~ .pf-v6-c-check__label,
1664
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-radio__input:where(:focus-visible):where(:checked) ~ .pf-v6-c-radio__label {
1647
+ .pfext-quick-start__base .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__input, .pf-v6-c-radio__input):where(:focus-visible):where(:checked) ~ :is(.pf-v6-c-check__label, .pf-v6-c-radio__label) {
1665
1648
  --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-selectable--m-selected--focus--BorderColor);
1666
1649
  --pf-v6-c-card--BorderWidth: var(--pf-v6-c-card--m-selectable--m-selected--focus--BorderWidth);
1667
1650
  }
1668
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-check__input:where(:disabled) ~ .pf-v6-c-check__label,
1669
- .pfext-quick-start__base .pf-v6-c-card__selectable-actions .pf-v6-c-radio__input:where(:disabled) ~ .pf-v6-c-radio__label,
1651
+ .pfext-quick-start__base .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__input, .pf-v6-c-radio__input):where(:disabled) ~ :is(.pf-v6-c-check__label, .pf-v6-c-radio__label),
1670
1652
  .pfext-quick-start__base .pf-v6-c-card.pf-m-disabled {
1671
1653
  --pf-v6-c-card__title-text--Color: var(--pf-v6-c-card--m-selectable--m-disabled__title-text--Color);
1672
1654
  --pf-v6-c-card__body--Color: var(--pf-v6-c-card--m-selectable--m-disabled__body--Color);
@@ -1674,6 +1656,14 @@
1674
1656
  --pf-v6-c-card--BackgroundColor: var(--pf-v6-c-card--m-selectable--m-disabled--BackgroundColor);
1675
1657
  --pf-v6-c-card--BorderColor: var(--pf-v6-c-card--m-selectable--m-disabled--BorderColor);
1676
1658
  }
1659
+ .pfext-quick-start__base .pf-v6-c-card__clickable-action {
1660
+ background: none;
1661
+ border: 0;
1662
+ outline: 0;
1663
+ }
1664
+ .pfext-quick-start__base .pf-v6-c-card__clickable-action:disabled, .pfext-quick-start__base .pf-v6-c-card__clickable-action.pf-m-disabled {
1665
+ pointer-events: none;
1666
+ }
1677
1667
  .pfext-quick-start__base .pf-v6-c-card__header,
1678
1668
  .pfext-quick-start__base .pf-v6-c-card__title,
1679
1669
  .pfext-quick-start__base .pf-v6-c-card__body,
@@ -1710,10 +1700,10 @@
1710
1700
  font-size: var(--pf-v6-c-card__footer--FontSize);
1711
1701
  color: var(--pf-v6-c-card__footer--Color);
1712
1702
  }
1713
- .pfext-quick-start__base :where(:root, .pf-v6-c-check) {
1714
- --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
1703
+ .pfext-quick-start__base .pf-v6-c-check {
1704
+ --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
1715
1705
  --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
1716
- --pf-v6-c-check--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
1706
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
1717
1707
  --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
1718
1708
  --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
1719
1709
  --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -1735,7 +1725,7 @@
1735
1725
  .pfext-quick-start__base .pf-v6-c-check.pf-m-standalone {
1736
1726
  display: inline-grid;
1737
1727
  grid-template-columns: auto;
1738
- min-height: var(--pf-v6-c-check--MinHeight);
1728
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
1739
1729
  }
1740
1730
  .pfext-quick-start__base .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
1741
1731
  align-self: center;
@@ -1780,7 +1770,7 @@
1780
1770
  font-size: var(--pf-v6-c-check__label-required--FontSize);
1781
1771
  color: var(--pf-v6-c-check__label-required--Color);
1782
1772
  }
1783
- .pfext-quick-start__base :where(:root, .pf-v6-c-clipboard-copy) {
1773
+ .pfext-quick-start__base .pf-v6-c-clipboard-copy {
1784
1774
  --pf-v6-c-clipboard-copy__toggle-icon--Transition: .2s ease-in 0s;
1785
1775
  --pf-v6-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
1786
1776
  --pf-v6-c-clipboard-copy__expandable-content--MarginBlockStart: var(--pf-t--global--spacer--xs);
@@ -1796,12 +1786,12 @@
1796
1786
  --pf-v6-c-clipboard-copy__expandable-content--BorderColor: var(--pf-t--global--border--color--default);
1797
1787
  --pf-v6-c-clipboard-copy__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
1798
1788
  --pf-v6-c-clipboard-copy__expandable-content--OutlineOffset: var(--pf-t--global--spacer--xs);
1799
- --pf-v6-c-clipboard-copy__group--Gap: var(--pf-t--global--spacer--xs);
1789
+ --pf-v6-c-clipboard-copy__group--Gap: var(--pf-t--global--spacer--gap--control-to-control--default);
1800
1790
  --pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart: var(--pf-t--global--spacer--xs);
1801
1791
  --pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
1802
1792
  --pf-v6-c-clipboard-copy--m-inline--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
1803
- --pf-v6-c-clipboard-copy__actions--Gap: var(--pf-t--global--spacer--sm);
1804
- --pf-v6-c-clipboard-copy__actions--MarginInlineStart: var(--pf-t--global--spacer--xs);
1793
+ --pf-v6-c-clipboard-copy__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--plain);
1794
+ --pf-v6-c-clipboard-copy__actions--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--compact);
1805
1795
  --pf-v6-c-clipboard-copy__actions-item--button--Color: var(--pf-t--global--icon--color--subtle);
1806
1796
  --pf-v6-c-clipboard-copy__actions-item--button--hover--Color: var(--pf-t--global--icon--color--regular);
1807
1797
  --pf-v6-c-clipboard-copy__text--m-code--FontFamily: var(--pf-t--global--font--family--mono);
@@ -1830,7 +1820,7 @@
1830
1820
  --pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--Color);
1831
1821
  --pf-v6-c-button--m-plain--hover__icon--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--hover--Color);
1832
1822
  }
1833
- .pfext-quick-start__base :where(:root, .pf-v6-c-code-block) {
1823
+ .pfext-quick-start__base .pf-v6-c-code-block {
1834
1824
  --pf-v6-c-code-block--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
1835
1825
  --pf-v6-c-code-block--BorderRadius: var(--pf-t--global--border--radius--medium);
1836
1826
  --pf-v6-c-code-block__header--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
@@ -1877,62 +1867,11 @@
1877
1867
  .pfext-quick-start__base .pf-v6-c-code-block__code {
1878
1868
  font-family: var(--pf-v6-c-code-block__code--FontFamily, inherit);
1879
1869
  }
1880
- .pfext-quick-start__base :where(:root, .pf-v6-c-code-editor) {
1881
- --pf-v6-c-code-editor__controls--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1882
- --pf-v6-c-code-editor__controls--Gap: var(--pf-t--global--spacer--xs);
1883
- --pf-v6-c-code-editor__header--before--BorderBlockEndWidth: var(--pf-t--global--border--width--box--default);
1884
- --pf-v6-c-code-editor__header--before--BorderBlockEndColor: var(--pf-t--global--border--color--default);
1885
- --pf-v6-c-code-editor__header-content--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
1886
- --pf-v6-c-code-editor__header-content--m-plain--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1887
- --pf-v6-c-code-editor__header-content--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1888
- --pf-v6-c-code-editor__header-content--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1889
- --pf-v6-c-code-editor__header-content--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1890
- --pf-v6-c-code-editor__header-content--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1891
- --pf-v6-c-code-editor__header-content--BorderStartStartRadius: var(--pf-t--global--border--radius--medium);
1892
- --pf-v6-c-code-editor__header-content--BorderStartEndRadius: var(--pf-t--global--border--radius--medium);
1893
- --pf-v6-c-code-editor__upload--PaddingInlineStart: var(--pf-t--global--spacer--md);
1894
- --pf-v6-c-code-editor__upload--PaddingInlineEnd: var(--pf-t--global--spacer--md);
1895
- --pf-v6-c-code-editor__upload--PaddingBlockStart: var(--pf-t--global--spacer--md);
1896
- --pf-v6-c-code-editor__upload--PaddingBlockEnd: var(--pf-t--global--spacer--md);
1897
- --pf-v6-c-code-editor__upload--BorderRadius: var(--pf-t--global--border--radius--medium);
1898
- --pf-v6-c-code-editor__main--BorderColor: var(--pf-t--global--border--color--default);
1899
- --pf-v6-c-code-editor__main--BorderWidth: var(--pf-t--global--border--width--box--default);
1900
- --pf-v6-c-code-editor__main--BorderEndStartRadius: var(--pf-t--global--border--radius--medium);
1901
- --pf-v6-c-code-editor__main--BorderEndEndRadius: var(--pf-t--global--border--radius--medium);
1902
- --pf-v6-c-code-editor__main--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1903
- --pf-v6-c-code-editor--m-read-only__main--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
1904
- --pf-v6-c-code-editor__upload--before--BorderWidth: 0;
1905
- --pf-v6-c-code-editor__upload--before--BorderColor: transparent;
1906
- --pf-v6-c-code-editor__main--m-drag-hover--before--BorderWidth: var(--pf-t--global--border--width--divider--hover);
1907
- --pf-v6-c-code-editor__main--m-drag-hover--before--BorderColor: var( --pf-t--global--border--color--clicked);
1908
- --pf-v6-c-code-editor__main--m-drag-hover--after--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1909
- --pf-v6-c-code-editor__main--m-drag-hover--after--Opacity: .1;
1910
- --pf-v6-c-code-editor__code--PaddingBlockStart: var(--pf-t--global--spacer--sm);
1911
- --pf-v6-c-code-editor__code--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1912
- --pf-v6-c-code-editor__code--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
1913
- --pf-v6-c-code-editor__code--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1914
- --pf-v6-c-code-editor__code-pre--FontSize: var(--pf-t--global--font--size--sm);
1915
- --pf-v6-c-code-editor__code-pre--FontFamily: var(--pf-t--global--font--family--mono);
1916
- --pf-v6-c-code-editor__header-main--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1917
- --pf-v6-c-code-editor__header-main--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1918
- --pf-v6-c-code-editor__tab--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1919
- --pf-v6-c-code-editor__tab--Color: var(--pf-t--global--text--color--subtle);
1920
- --pf-v6-c-code-editor__tab--PaddingBlockStart: var(--pf-t--global--spacer--sm);
1921
- --pf-v6-c-code-editor__tab--PaddingInlineEnd: var( --pf-t--global--spacer--sm);
1922
- --pf-v6-c-code-editor__tab--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
1923
- --pf-v6-c-code-editor__tab--PaddingInlineStart: var( --pf-t--global--spacer--sm);
1924
- --pf-v6-c-code-editor__tab--BorderBlockStartWidth: var(--pf-t--global--border--width--box--default);
1925
- --pf-v6-c-code-editor__tab--BorderInlineEndWidth: var(--pf-t--global--border--width--box--default);
1926
- --pf-v6-c-code-editor__tab--BorderBlockEndWidth: 0;
1927
- --pf-v6-c-code-editor__tab--BorderInlineStartWidth: var(--pf-t--global--border--width--box--default);
1928
- --pf-v6-c-code-editor__tab--BorderColor: var(--pf-t--global--border--color--default);
1929
- --pf-v6-c-code-editor__tab--BorderStartEndRadius: var(--pf-t--global--border--radius--medium);
1930
- --pf-v6-c-code-editor__tab-icon--text--MarginInlineStart: var(--pf-t--global--spacer--sm);
1931
- }
1932
- .pfext-quick-start__base :where(:root, .pf-v6-c-content) {
1870
+ .pfext-quick-start__base :root {
1933
1871
  --pf-v6-c-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
1934
1872
  --pf-v6-c-content--LineHeight: var(--pf-t--global--font--line-height--body);
1935
1873
  --pf-v6-c-content--FontSize: var(--pf-t--global--font--size--body--default);
1874
+ --pf-v6-c-content--m-editorial--FontSize: var(--pf-t--global--font--size--body--lg);
1936
1875
  --pf-v6-c-content--FontWeight: var(--pf-t--global--font--weight--body--default);
1937
1876
  --pf-v6-c-content--Color: var(--pf-t--global--text--color--regular);
1938
1877
  --pf-v6-c-content--heading--FontFamily: var(--pf-t--global--font--family--heading);
@@ -1969,6 +1908,7 @@
1969
1908
  --pf-v6-c-content--small--MarginBlockEnd: var(--pf-t--global--spacer--md);
1970
1909
  --pf-v6-c-content--small--LineHeight: var(--pf-t--global--font--line-height--body);
1971
1910
  --pf-v6-c-content--small--FontSize: var(--pf-t--global--font--size--body--sm);
1911
+ --pf-v6-c-content--m-editorial--small--FontSize: var(--pf-t--global--font--size--body--default);
1972
1912
  --pf-v6-c-content--small--Color: var(--pf-t--global--text--color--subtle);
1973
1913
  --pf-v6-c-content--a--Color: var(--pf-t--global--text--color--link--default);
1974
1914
  --pf-v6-c-content--a--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
@@ -1988,19 +1928,25 @@
1988
1928
  --pf-v6-c-content--list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
1989
1929
  --pf-v6-c-content--list--nested--MarginBlockStart: var(--pf-v6-c-content--list--Gap);
1990
1930
  --pf-v6-c-content--ul--ListStyle: var(--pf-t--global--list-style);
1991
- --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--2xl);
1992
- --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--md);
1931
+ --pf-v6-c-content--dl--GridTemplateColumns--dt: 12ch;
1932
+ --pf-v6-c-content--dl--GridTemplateColumns--dd: 1fr;
1933
+ --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
1934
+ --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
1993
1935
  --pf-v6-c-content--dt--FontWeight: var(--pf-t--global--font--weight--body--bold);
1994
1936
  --pf-v6-c-content--dt--MarginBlockStart: var(--pf-t--global--spacer--md);
1995
1937
  --pf-v6-c-content--dt--sm--MarginBlockStart: 0;
1996
1938
  --pf-v6-c-content--hr--Height: var(--pf-t--global--border--width--divider--default);
1997
1939
  --pf-v6-c-content--hr--BackgroundColor: var(--pf-t--global--border--color--default);
1998
1940
  }
1999
- .pfext-quick-start__base .pf-v6-c-content {
1941
+ .pfext-quick-start__base [class*=pf-v6-c-content] {
2000
1942
  font-size: var(--pf-v6-c-content--FontSize);
2001
1943
  line-height: var(--pf-v6-c-content--LineHeight);
2002
1944
  color: var(--pf-v6-c-content--Color);
2003
1945
  }
1946
+ .pfext-quick-start__base [class*=pf-v6-c-content].pf-m-editorial {
1947
+ --pf-v6-c-content--FontSize: var(--pf-v6-c-content--m-editorial--FontSize);
1948
+ --pf-v6-c-content--small--FontSize: var(--pf-v6-c-content--m-editorial--small--FontSize);
1949
+ }
2004
1950
  .pfext-quick-start__base :is(.pf-v6-c-content--a, .pf-v6-c-content a) {
2005
1951
  color: var(--pf-v6-c-content--a--Color);
2006
1952
  text-decoration: var(--pf-v6-c-content--a--TextDecorationLine) var(--pf-v6-c-content--a--TextDecorationStyle);
@@ -2144,7 +2090,7 @@ ul) {
2144
2090
  }
2145
2091
  @media screen and (min-width: 36rem) {
2146
2092
  .pfext-quick-start__base :is(.pf-v6-c-content--dl, .pf-v6-c-content dl) {
2147
- grid-template: auto/auto 1fr;
2093
+ grid-template: auto/var(--pf-v6-c-content--dl--GridTemplateColumns--dt) var(--pf-v6-c-content--dl--GridTemplateColumns--dd);
2148
2094
  grid-row-gap: var(--pf-v6-c-content--dl--RowGap);
2149
2095
  grid-column-gap: var(--pf-v6-c-content--dl--ColumnGap);
2150
2096
  }
@@ -2170,305 +2116,10 @@ ul) {
2170
2116
  grid-column: 2;
2171
2117
  }
2172
2118
  }
2173
- .pfext-quick-start__base :where(:root, .pf-v6-c-data-list) {
2174
- --pf-v6-c-data-list--FontSize: var( --pf-t--global--font--size--body);
2175
- --pf-v6-c-data-list--LineHeight: var(--pf-t--global--font--line-height--body);
2176
- --pf-v6-c-data-list--BorderBlockStartColor: var(--pf-t--global--border--color--default);
2177
- --pf-v6-c-data-list--BorderBlockStartWidth: var(--pf-t--global--border--width--strong);
2178
- --pf-v6-c-data-list--sm--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
2179
- --pf-v6-c-data-list--sm--BorderBlockStartColor: var(--pf-t--global--border--color--default);
2180
- --pf-v6-c-data-list--MarginInlineStart: var(--pf-t--global--spacer--md);
2181
- --pf-v6-c-data-list__item--BackgroundColor: var( --pf-t--global--background--color--primary--default);
2182
- --pf-v6-c-data-list__item--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
2183
- --pf-v6-c-data-list__item--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
2184
- --pf-v6-c-data-list__item--m-clickable--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
2185
- --pf-v6-c-data-list__item--BorderBlockEndColor: var(--pf-t--global--border--color--default);
2186
- --pf-v6-c-data-list__item--BorderBlockEndWidth: var(--pf-t--global--border--width--strong);
2187
- --pf-v6-c-data-list__item--sm--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
2188
- --pf-v6-c-data-list__item--sm--BorderBlockEndColor: var(--pf-t--global--border--color--default);
2189
- --pf-v6-c-data-list__item-row--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2190
- --pf-v6-c-data-list__item-row--PaddingInlineStart: var(--pf-t--global--spacer--md);
2191
- --pf-v6-c-data-list__item-row--xl--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2192
- --pf-v6-c-data-list__item-row--xl--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2193
- --pf-v6-c-data-list__item-content--md--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
2194
- --pf-v6-c-data-list__cell--PaddingBlockStart: var(--pf-t--global--spacer--lg);
2195
- --pf-v6-c-data-list__cell--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
2196
- --pf-v6-c-data-list__cell--MarginInlineEnd: var(--pf-t--global--spacer--xl);
2197
- --pf-v6-c-data-list__cell--md--PaddingBlockEnd: 0;
2198
- --pf-v6-c-data-list__cell--m-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
2199
- --pf-v6-c-data-list__cell--cell--PaddingBlockStart: 0;
2200
- --pf-v6-c-data-list__cell--cell--md--PaddingBlockStart: var(--pf-t--global--spacer--lg);
2201
- --pf-v6-c-data-list__cell--m-icon--cell--PaddingBlockStart: var(--pf-t--global--spacer--lg);
2202
- --pf-v6-c-data-list--cell--MinWidth: initial;
2203
- --pf-v6-c-data-list--cell--Overflow: visible;
2204
- --pf-v6-c-data-list--cell--TextOverflow: clip;
2205
- --pf-v6-c-data-list--cell--WhiteSpace: normal;
2206
- --pf-v6-c-data-list--cell--WordBreak: normal;
2207
- --pf-v6-c-data-list--cell--m-truncate--MinWidth: 5ch;
2208
- --pf-v6-c-data-list__toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1);
2209
- --pf-v6-c-data-list__toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2210
- --pf-v6-c-data-list__toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2211
- --pf-v6-c-data-list__toggle-icon--Height: calc(var(--pf-v6-c-data-list--FontSize) * var(--pf-v6-c-data-list--LineHeight));
2212
- --pf-v6-c-data-list__toggle-icon--Transition: .2s ease-in 0s;
2213
- --pf-v6-c-data-list__toggle-icon--Rotate: 0;
2214
- --pf-v6-c-data-list__item--m-expanded__toggle-icon--Rotate: 90deg;
2215
- --pf-v6-c-data-list__item-draggable-button--BackgroundColor: transparent;
2216
- --pf-v6-c-data-list__item-draggable-button--PaddingInlineStart: var(--pf-t--global--spacer--md);
2217
- --pf-v6-c-data-list__item-draggable-button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2218
- --pf-v6-c-data-list__item-draggable-button--MarginBlockStart: calc(var(--pf-t--global--spacer--lg) * -1);
2219
- --pf-v6-c-data-list__item-draggable-button--MarginBlockEnd: calc(var(--pf-t--global--spacer--lg) * -1);
2220
- --pf-v6-c-data-list__item-draggable-button--PaddingBlockStart: var(--pf-t--global--spacer--lg);
2221
- --pf-v6-c-data-list__item-draggable-button--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
2222
- --pf-v6-c-data-list__item-draggable-button--MarginInlineStart: calc(var(--pf-t--global--spacer--md) * -1);
2223
- --pf-v6-c-data-list__item-draggable-button-icon--Color: var(--pf-t--global--icon--color--subtle);
2224
- --pf-v6-c-data-list__item-draggable-button--m-disabled__draggable-icon--Color: var(--pf-t--global--icon--color--disabled);
2225
- --pf-v6-c-data-list__item-draggable-button--hover__draggable-icon--Color: var(--pf-t--global--icon--color--regular);
2226
- --pf-v6-c-data-list__item-draggable-button--focus__draggable-icon--Color: var(--pf-t--global--icon--color--regular);
2227
- --pf-v6-c-data-list__item--m-ghost-row--after--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2228
- --pf-v6-c-data-list__item--m-ghost-row--after--Opacity: .6;
2229
- --pf-v6-c-data-list__item-control--PaddingBlockStart: var(--pf-t--global--spacer--lg);
2230
- --pf-v6-c-data-list__item-control--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
2231
- --pf-v6-c-data-list__item-control--MarginInlineEnd: var(--pf-t--global--spacer--md);
2232
- --pf-v6-c-data-list__item-control--md--MarginInlineEnd: var(--pf-t--global--spacer--xl);
2233
- --pf-v6-c-data-list__item-control--not-last-child--MarginInlineEnd: var(--pf-t--global--spacer--md);
2234
- --pf-v6-c-data-list__check--Height: calc(var(--pf-v6-c-data-list--FontSize) * var(--pf-v6-c-data-list--LineHeight));
2235
- --pf-v6-c-data-list__check--MarginBlockStart: -0.0625rem;
2236
- --pf-v6-c-data-list__item-action--Display: flex;
2237
- --pf-v6-c-data-list__item-action--PaddingBlockStart: var(--pf-t--global--spacer--lg);
2238
- --pf-v6-c-data-list__item-action--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
2239
- --pf-v6-c-data-list__item-action--MarginInlineStart: var(--pf-t--global--spacer--md);
2240
- --pf-v6-c-data-list__item-action--md--MarginInlineStart: var(--pf-t--global--spacer--xl);
2241
- --pf-v6-c-data-list__item-action--Gap: var(--pf-t--global--spacer--gap--action-to-action--default);
2242
- --pf-v6-c-data-list__action--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
2243
- --pf-v6-c-data-list__action--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
2244
- --pf-v6-c-data-list__expandable-content--BackgroundColor: var( --pf-t--global--background--color--primary--default);
2245
- --pf-v6-c-data-list__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
2246
- --pf-v6-c-data-list__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
2247
- --pf-v6-c-data-list__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
2248
- --pf-v6-c-data-list__expandable-content--MaxHeight: 37.5rem;
2249
- --pf-v6-c-data-list__expandable-content-body--PaddingBlockStart: var(--pf-t--global--spacer--md);
2250
- --pf-v6-c-data-list__expandable-content-body--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2251
- --pf-v6-c-data-list__expandable-content-body--PaddingBlockEnd: var(--pf-t--global--spacer--md);
2252
- --pf-v6-c-data-list__expandable-content-body--PaddingInlineStart: var(--pf-t--global--spacer--md);
2253
- --pf-v6-c-data-list__expandable-content-body--md--PaddingBlockStart: var(--pf-t--global--spacer--lg);
2254
- --pf-v6-c-data-list__expandable-content-body--xl--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2255
- --pf-v6-c-data-list__expandable-content-body--md--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
2256
- --pf-v6-c-data-list__expandable-content-body--xl--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2257
- --pf-v6-c-data-list__expandable-content-body--BorderRadius: var(--pf-t--global--border--radius--small);
2258
- --pf-v6-c-data-list--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
2259
- --pf-v6-c-data-list--m-compact--LineHeight: var(--pf-t--global--font--line-height--body);
2260
- --pf-v6-c-data-list--m-compact__check--FontSize: var(--pf-t--global--font--size--body--default);
2261
- --pf-v6-c-data-list--m-compact__cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2262
- --pf-v6-c-data-list--m-compact__cell--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2263
- --pf-v6-c-data-list--m-compact__cell--md--PaddingBlockEnd: 0;
2264
- --pf-v6-c-data-list--m-compact__cell-cell--PaddingBlockStart: 0;
2265
- --pf-v6-c-data-list--m-compact__cell-cell--md--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2266
- --pf-v6-c-data-list--m-compact__cell--cell--MarginInlineEnd: var(--pf-t--global--spacer--md);
2267
- --pf-v6-c-data-list--m-compact__item-control--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2268
- --pf-v6-c-data-list--m-compact__item-control--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2269
- --pf-v6-c-data-list--m-compact__item-control--MarginInlineEnd: var(--pf-t--global--spacer--md);
2270
- --pf-v6-c-data-list--m-compact__item-action--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2271
- --pf-v6-c-data-list--m-compact__item-action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2272
- --pf-v6-c-data-list--m-compact__item-action--MarginInlineStart: var(--pf-t--global--spacer--md);
2273
- --pf-v6-c-data-list--m-compact__action--MarginBlockStart: calc(var(--pf-v6-c-data-list--m-compact__item-action--PaddingBlockStart) * -1);
2274
- --pf-v6-c-data-list--m-compact__action--MarginBlockEnd: calc(var(--pf-v6-c-data-list--m-compact__item-action--PaddingBlockEnd) * -1);
2275
- --pf-v6-c-data-list--m-compact__item-content--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2276
- --pf-v6-c-data-list--m-compact__item-draggable-button--MarginBlockStart: calc(var(--pf-t--global--spacer--sm) * -1);
2277
- --pf-v6-c-data-list--m-compact__item-draggable-button--MarginBlockEnd: calc(var(--pf-t--global--spacer--sm) * -1);
2278
- --pf-v6-c-data-list--m-compact__item-draggable-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2279
- --pf-v6-c-data-list--m-compact__item-draggable-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2280
- --pf-v6-c-data-list--m-compact__cell--m-icon--cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2281
- }
2282
- @media screen and (min-width: 36rem) {
2283
- .pfext-quick-start__base :where(:root, .pf-v6-c-data-list) {
2284
- --pf-v6-c-data-list--BorderBlockStartColor: var(--pf-v6-c-data-list--sm--BorderBlockStartColor);
2285
- --pf-v6-c-data-list--BorderBlockStartWidth: var(--pf-v6-c-data-list--sm--BorderBlockStartWidth);
2286
- }
2287
- }
2288
- @media screen and (min-width: 36rem) {
2289
- .pfext-quick-start__base :where(:root, .pf-v6-c-data-list) {
2290
- --pf-v6-c-data-list__item--BorderBlockEndWidth: var(--pf-v6-c-data-list__item--sm--BorderBlockEndWidth);
2291
- --pf-v6-c-data-list__item--BorderBlockEndColor: var(--pf-v6-c-data-list__item--sm--BorderBlockEndColor);
2292
- }
2293
- }
2294
- .pfext-quick-start__base :where(:root, .pf-v6-c-description-list) {
2295
- --pf-v6-c-description-list--RowGap: var(--pf-t--global--spacer--lg);
2296
- --pf-v6-c-description-list--ColumnGap: var(--pf-t--global--spacer--lg);
2297
- --pf-v6-c-description-list--GridTemplateColumns--count: 1;
2298
- --pf-v6-c-description-list--GridTemplateColumns--width: 1fr;
2299
- --pf-v6-c-description-list--GridTemplateColumns--min: 0;
2300
- --pf-v6-c-description-list__group--RowGap: var(--pf-t--global--spacer--sm);
2301
- --pf-v6-c-description-list__group--ColumnGap: var(--pf-t--global--spacer--sm);
2302
- --pf-v6-c-description-list__group--GridTemplateColumns: auto;
2303
- --pf-v6-c-description-list__group--GridTemplateRows: auto 1fr;
2304
- --pf-v6-c-description-list__group--GridColumn: auto;
2305
- --pf-v6-c-description-list--m-compact--RowGap: var(--pf-t--global--spacer--md);
2306
- --pf-v6-c-description-list--m-compact--ColumnGap: var(--pf-t--global--spacer--sm);
2307
- --pf-v6-c-description-list__term--Display: inline;
2308
- --pf-v6-c-description-list__term--sm--Display: flex;
2309
- --pf-v6-c-description-list__term--FontWeight: var(--pf-t--global--font--weight--body--bold);
2310
- --pf-v6-c-description-list__term--FontSize: var(--pf-t--global--font--size--body--sm);
2311
- --pf-v6-c-description-list__term--LineHeight: var(--pf-t--global--font--line-height--body);
2312
- --pf-v6-c-description-list__term-icon--MinWidth: var(--pf-t--global--font--size--body--sm);
2313
- --pf-v6-c-description-list__term-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
2314
- --pf-v6-c-description-list__term-icon--Color: var(--pf-t--global--icon--color--subtle);
2315
- --pf-v6-c-description-list--m-vertical__group--GridTemplateColumns: repeat(var(--pf-v6-c-description-list--GridTemplateColumns--count));
2316
- --pf-v6-c-description-list--m-vertical__group--GridTemplateRows: auto 1fr;
2317
- --pf-v6-c-description-list--m-horizontal__term--width: 12ch;
2318
- --pf-v6-c-description-list--m-horizontal__description--width: minmax(10ch, auto);
2319
- --pf-v6-c-description-list--m-horizontal__group--GridTemplateColumns: var(--pf-v6-c-description-list__term--width) var(--pf-v6-c-description-list--m-horizontal__description--width);
2320
- --pf-v6-c-description-list--m-horizontal__group--GridTemplateRows: auto;
2321
- --pf-v6-c-description-list--m-1-col--GridTemplateColumns--count: 1;
2322
- --pf-v6-c-description-list--m-2-col--GridTemplateColumns--count: 2;
2323
- --pf-v6-c-description-list--m-3-col--GridTemplateColumns--count: 3;
2324
- --pf-v6-c-description-list--m-auto-fit--GridTemplateColumns--min: 15.625rem;
2325
- --pf-v6-c-description-list--m-auto-fit--GridTemplateColumns--minmax--min: var(--pf-v6-c-description-list--m-auto-fit--GridTemplateColumns--min);
2326
- --pf-v6-c-description-list__text--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
2327
- --pf-v6-c-description-list__text--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
2328
- --pf-v6-c-description-list__text--m-help-text--TextUnderlineOffset: 0.25rem;
2329
- --pf-v6-c-description-list__text--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
2330
- --pf-v6-c-description-list__text--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
2331
- --pf-v6-c-description-list--m-display-lg__description--FontSize: var(--pf-t--global--font--size--body--lg);
2332
- --pf-v6-c-description-list--m-display-2xl__description--FontSize: var(--pf-t--global--font--size--heading--lg);
2333
- --pf-v6-c-description-list--m-horizontal__term--width-on-sm:inherit;
2334
- --pf-v6-c-description-list--m-horizontal__term--width-on-md:inherit;
2335
- --pf-v6-c-description-list--m-horizontal__term--width-on-lg:inherit;
2336
- --pf-v6-c-description-list--m-horizontal__term--width-on-xl:inherit;
2337
- --pf-v6-c-description-list--m-horizontal__term--width-on-2xl:inherit;
2338
- --pf-v6-c-description-list__term--width:var(--pf-v6-c-description-list--m-horizontal__term--width);
2339
- }
2340
- @media screen and (min-width: 36rem) {
2341
- .pfext-quick-start__base :where(:root, .pf-v6-c-description-list) {
2342
- --pf-v6-c-description-list__term--Display: var(--pf-v6-c-description-list__term--sm--Display);
2343
- }
2344
- }
2345
- @media (min-width: 36rem) {
2346
- .pfext-quick-start__base :where(:root, .pf-v6-c-description-list) {
2347
- --pf-v6-c-description-list__term--width:var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width));
2348
- }
2349
- }
2350
- @media (min-width: 48rem) {
2351
- .pfext-quick-start__base :where(:root, .pf-v6-c-description-list) {
2352
- --pf-v6-c-description-list__term--width:var(--pf-v6-c-description-list--m-horizontal__term--width-on-md, var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width)));
2353
- }
2354
- }
2355
- @media (min-width: 62rem) {
2356
- .pfext-quick-start__base :where(:root, .pf-v6-c-description-list) {
2357
- --pf-v6-c-description-list__term--width:var(--pf-v6-c-description-list--m-horizontal__term--width-on-lg, var(--pf-v6-c-description-list--m-horizontal__term--width-on-md, var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width))));
2358
- }
2359
- }
2360
- @media (min-width: 75rem) {
2361
- .pfext-quick-start__base :where(:root, .pf-v6-c-description-list) {
2362
- --pf-v6-c-description-list__term--width:var(--pf-v6-c-description-list--m-horizontal__term--width-on-xl, var(--pf-v6-c-description-list--m-horizontal__term--width-on-lg, var(--pf-v6-c-description-list--m-horizontal__term--width-on-md, var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width)))));
2363
- }
2364
- }
2365
- @media (min-width: 90.625rem) {
2366
- .pfext-quick-start__base :where(:root, .pf-v6-c-description-list) {
2367
- --pf-v6-c-description-list__term--width:var(--pf-v6-c-description-list--m-horizontal__term--width-on-2xl, var(--pf-v6-c-description-list--m-horizontal__term--width-on-xl, var(--pf-v6-c-description-list--m-horizontal__term--width-on-lg, var(--pf-v6-c-description-list--m-horizontal__term--width-on-md, var(--pf-v6-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v6-c-description-list--m-horizontal__term--width))))));
2368
- }
2369
- }
2370
- .pfext-quick-start__base :where(:root, .pf-v6-c-draggable) {
2371
- --pf-v6-c-draggable--Cursor: auto;
2372
- --pf-v6-c-draggable--m-dragging--Cursor: grabbing;
2373
- --pf-v6-c-draggable--m-dragging--BoxShadow: var(--pf-t--global--box-shadow--md);
2374
- --pf-v6-c-draggable--m-dragging--BackgroundColor: transparent;
2375
- --pf-v6-c-draggable--m-dragging--after--BorderWidth: var(--pf-t--global--border--width--regular);
2376
- --pf-v6-c-draggable--m-dragging--after--BorderColor: var(--pf-t--global--border--color--brand--default);
2377
- --pf-v6-c-draggable--m-dragging--after--BorderRadius: var(--pf-t--global--border--radius--small);
2378
- --pf-v6-c-draggable--m-drag-outside--Cursor: not-allowed;
2379
- --pf-v6-c-draggable--m-drag-outside--after--BorderColor: var(--pf-t--global--border--color--status--danger--default);
2380
- }
2381
- .pfext-quick-start__base :where(:root, .pf-v6-c-droppable) {
2382
- --pf-v6-c-droppable--before--BackgroundColor: transparent;
2383
- --pf-v6-c-droppable--before--Opacity: 0;
2384
- --pf-v6-c-droppable--after--BorderWidth: 0;
2385
- --pf-v6-c-droppable--after--BorderColor: transparent;
2386
- --pf-v6-c-droppable--m-dragging--before--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2387
- --pf-v6-c-droppable--m-dragging--before--Opacity: .6;
2388
- --pf-v6-c-droppable--m-dragging--after--BorderWidth: var(--pf-t--global--border--width--regular);
2389
- --pf-v6-c-droppable--m-dragging--after--BorderColor: var(--pf-t--global--border--color--brand--default);
2390
- --pf-v6-c-droppable--m-dragging--after--BorderRadius: var(--pf-t--global--border--radius--small);
2391
- --pf-v6-c-droppable--m-drag-outside--after--BorderColor: var(--pf-t--global--border--color--status--danger--default);
2392
- }
2393
- .pfext-quick-start__base :where(:root, .pf-v6-c-dual-list-selector) {
2394
- --pf-v6-c-dual-list-selector__header--GridArea: pane-header;
2395
- --pf-v6-c-dual-list-selector__tools--GridArea: pane-tools;
2396
- --pf-v6-c-dual-list-selector__status--GridArea: pane-status;
2397
- --pf-v6-c-dual-list-selector__menu--GridArea: pane-menu;
2398
- --pf-v6-c-dual-list-selector__controls--GridArea: controls;
2399
- --pf-v6-c-dual-list-selector--m-chosen__header--GridArea: pane-header-c;
2400
- --pf-v6-c-dual-list-selector--m-chosen__tools--GridArea: pane-tools-c;
2401
- --pf-v6-c-dual-list-selector--m-chosen__status--GridArea: pane-status-c;
2402
- --pf-v6-c-dual-list-selector--m-chosen__menu--GridArea: pane-menu-c;
2403
- --pf-v6-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min: 12.5rem;
2404
- --pf-v6-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max: 28.125rem;
2405
- --pf-v6-c-dual-list-selector__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
2406
- --pf-v6-c-dual-list-selector__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
2407
- --pf-v6-c-dual-list-selector__title-text--FontSize: var(--pf-t--global--font--size--body--lg);
2408
- --pf-v6-c-dual-list-selector__tools--MarginBlockEnd: var(--pf-t--global--spacer--md);
2409
- --pf-v6-c-dual-list-selector__tools-filter--tools-actions--MarginInlineStart: var(--pf-t--global--spacer--sm);
2410
- --pf-v6-c-dual-list-selector__menu--BorderWidth: var(--pf-t--global--border--width--regular);
2411
- --pf-v6-c-dual-list-selector__menu--BorderColor: var(--pf-t--global--border--color--default);
2412
- --pf-v6-c-dual-list-selector__menu--BorderRadius: var(--pf-t--global--border--radius--small);
2413
- --pf-v6-c-dual-list-selector__menu--MinHeight: 12.5rem;
2414
- --pf-v6-c-dual-list-selector__menu--MaxHeight: 20rem;
2415
- --pf-v6-c-dual-list-selector__menu--MarginBlockStart: var(--pf-t--global--spacer--md);
2416
- --pf-v6-c-dual-list-selector__list-item-row--FontSize: var(--pf-t--global--font--size--sm);
2417
- --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
2418
- --pf-v6-c-dual-list-selector__list-item-row--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
2419
- --pf-v6-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
2420
- --pf-v6-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
2421
- --pf-v6-c-dual-list-selector__list-item--m-ghost-row--Opacity: .4;
2422
- --pf-v6-c-dual-list-selector__item--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2423
- --pf-v6-c-dual-list-selector__item--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2424
- --pf-v6-c-dual-list-selector__item--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2425
- --pf-v6-c-dual-list-selector__item--PaddingInlineStart: var(--pf-t--global--spacer--md);
2426
- --pf-v6-c-dual-list-selector__item--m-expandable--PaddingInlineStart: var(--pf-t--global--spacer--md);
2427
- --pf-v6-c-dual-list-selector__item--indent--base: calc(var(--pf-t--global--spacer--md) + var(--pf-t--global--spacer--sm) + var(--pf-v6-c-dual-list-selector__list-item-row--FontSize));
2428
- --pf-v6-c-dual-list-selector__item--nested-indent--base: calc(var(--pf-v6-c-dual-list-selector__item--indent--base) - var(--pf-t--global--spacer--md));
2429
- --pf-v6-c-dual-list-selector__draggable--item--PaddingInlineStart: var(--pf-t--global--spacer--xs);
2430
- --pf-v6-c-dual-list-selector__item-text--Color: var(--pf-t--global--text--color--subtle);
2431
- --pf-v6-c-dual-list-selector__list-item-row--m-selected__text--Color: var(--pf-t--global--text--color--regular);
2432
- --pf-v6-c-dual-list-selector__list-item--m-disabled__item-text--Color: var(--pf-t--global--text--color--disabled);
2433
- --pf-v6-c-dual-list-selector__status--MarginBlockEnd: var(--pf-t--global--spacer--sm);
2434
- --pf-v6-c-dual-list-selector__status-text--FontSize: var(--pf-t--global--font--size--sm);
2435
- --pf-v6-c-dual-list-selector__status-text--Color: var(--pf-t--global--text--color--subtle);
2436
- --pf-v6-c-dual-list-selector__controls--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2437
- --pf-v6-c-dual-list-selector__controls--PaddingInlineStart: var(--pf-t--global--spacer--md);
2438
- --pf-v6-c-dual-list-selector__controls--Gap: var(--pf-t--global--spacer--sm);
2439
- --pf-v6-c-dual-list-selector__controls--MarginBlockStart: var(--pf-t--global--spacer--md);
2440
- --pf-v6-c-dual-list-selector__item-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2441
- --pf-v6-c-dual-list-selector__list__list__item-toggle--InsetInlineStart: 0;
2442
- --pf-v6-c-dual-list-selector__list__list__item-toggle--TranslateX: -100%;
2443
- --pf-v6-c-dual-list-selector__item-check--MarginInlineEnd: var(--pf-t--global--spacer--sm);
2444
- --pf-v6-c-dual-list-selector__item-count--MarginInlineStart: var(--pf-t--global--spacer--sm);
2445
- --pf-v6-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
2446
- --pf-v6-c-dual-list-selector__item-toggle-icon--Rotate: 0;
2447
- --pf-v6-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
2448
- --pf-v6-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-t--global--transition);
2449
- --pf-v6-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-v6-c-dual-list-selector__list-item-row--FontSize);
2450
- --pf-v6-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
2451
- }
2452
2119
  .pfext-quick-start__base :where(.pf-v6-m-dir-rtl, [dir="rtl"]) :is(.pf-v6-c-dual-list-selector__controls-item, .pf-v6-c-dual-list-selector__item-toggle-icon) {
2453
2120
  scale: -1 1;
2454
2121
  }
2455
- .pfext-quick-start__base :where(:root, .pf-v6-c-date-picker) {
2456
- --pf-v6-c-date-picker--m-top__calendar--InsetBlockStart: 0;
2457
- --pf-v6-c-date-picker--m-top__calendar--TranslateY: calc(-100% - var(--pf-t--global--spacer--xs));
2458
- --pf-v6-c-date-picker__helper-text--MarginBlockStart: var(--pf-t--global--spacer--sm);
2459
- --pf-v6-c-date-picker__input--c-form-control--Width: calc(var(--pf-v6-c-date-picker__input--c-form-control--width-chars) * 1ch + var(--pf-v6-c-date-picker__input--c-form-control--width-base));
2460
- --pf-v6-c-date-picker__input--c-form-control--width-base: calc(var(--pf-t--global--spacer--xl) + var(--pf-t--global--spacer--sm));
2461
- --pf-v6-c-date-picker__input--c-form-control--width-chars: 11;
2462
- --pf-v6-c-date-picker__calendar--BackgroundColor: var(--pf-t--global--background--color--floating--default);
2463
- --pf-v6-c-date-picker__calendar--BoxShadow: var(--pf-t--global--box-shadow--md);
2464
- --pf-v6-c-date-picker__calendar--ZIndex: var(--pf-t--global--z-index--sm);
2465
- --pf-v6-c-date-picker__calendar--InsetBlockStart: calc(100% + var(--pf-t--global--spacer--xs));
2466
- --pf-v6-c-date-picker__calendar--InsetInlineEnd: auto;
2467
- --pf-v6-c-date-picker__calendar--InsetInlineStart: 0;
2468
- --pf-v6-c-date-picker__calendar--m-align-right--InsetInlineEnd: 0;
2469
- --pf-v6-c-date-picker__calendar--m-align-right--InsetInlineStart: auto;
2470
- }
2471
- .pfext-quick-start__base :where(:root, .pf-v6-c-divider) {
2122
+ .pfext-quick-start__base .pf-v6-c-divider {
2472
2123
  --pf-v6-c-divider--Display: flex;
2473
2124
  --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
2474
2125
  --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
@@ -2770,7 +2421,7 @@ ul) {
2770
2421
  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2771
2422
  }
2772
2423
  }
2773
- .pfext-quick-start__base :where(:root, .pf-v6-c-drawer) {
2424
+ .pfext-quick-start__base .pf-v6-c-drawer {
2774
2425
  --pf-v6-c-drawer__section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2775
2426
  --pf-v6-c-drawer__section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2776
2427
  --pf-v6-c-drawer__content--FlexBasis: 100%;
@@ -2781,7 +2432,8 @@ ul) {
2781
2432
  --pf-v6-c-drawer__panel--MinWidth: 50%;
2782
2433
  --pf-v6-c-drawer__panel--MaxHeight: auto;
2783
2434
  --pf-v6-c-drawer__panel--ZIndex: var(--pf-t--global--z-index--sm);
2784
- --pf-v6-c-drawer__panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2435
+ --pf-v6-c-drawer__panel--BackgroundColor: var(--pf-t--global--background--color--floating--default);
2436
+ --pf-v6-c-drawer__panel--m-inline--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2785
2437
  --pf-v6-c-drawer__panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2786
2438
  --pf-v6-c-drawer__panel--RowGap: var(--pf-t--global--spacer--sm);
2787
2439
  --pf-v6-c-drawer__panel--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -2803,7 +2455,7 @@ ul) {
2803
2455
  --pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--FlexDirection: column;
2804
2456
  --pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--md--FlexBasis--min: 1.5rem;
2805
2457
  --pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--MinHeight: 1.5rem;
2806
- --pf-v6-c-drawer__head--ColumnGap: var(--pf-t--global--spacer--sm);
2458
+ --pf-v6-c-drawer__head--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
2807
2459
  --pf-v6-c-drawer__head--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2808
2460
  --pf-v6-c-drawer__head--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2809
2461
  --pf-v6-c-drawer__head--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -2878,10 +2530,10 @@ ul) {
2878
2530
  --pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart: var(--pf-v6-c-drawer__panel--after--Width);
2879
2531
  }
2880
2532
  @media screen and (min-width: 75rem) {
2881
- .pfext-quick-start__base :where(:root, .pf-v6-c-drawer) {
2533
+ .pfext-quick-start__base .pf-v6-c-drawer {
2882
2534
  --pf-v6-c-drawer__panel--MinWidth: var(--pf-v6-c-drawer__panel--xl--MinWidth);
2883
2535
  }
2884
- .pfext-quick-start__base :where(:root, .pf-v6-c-drawer).pf-m-panel-bottom {
2536
+ .pfext-quick-start__base .pf-v6-c-drawer.pf-m-panel-bottom {
2885
2537
  --pf-v6-c-drawer__panel--MinWidth: auto;
2886
2538
  --pf-v6-c-drawer__panel--MinHeight: var(--pf-v6-c-drawer--m-panel-bottom__panel--xl--MinHeight);
2887
2539
  }
@@ -2900,6 +2552,9 @@ ul) {
2900
2552
  .pfext-quick-start__base :where(.pf-v6-m-dir-rtl, [dir="rtl"]) .pf-v6-c-drawer {
2901
2553
  --pf-v6-c-drawer--m-expanded--m-panel-left__panel--BoxShadow:var(--pf-t--global--box-shadow--md--left);
2902
2554
  }
2555
+ .pfext-quick-start__base .pf-v6-c-drawer.pf-m-inline, .pfext-quick-start__base .pf-v6-c-drawer.pf-m-static {
2556
+ --pf-v6-c-drawer__panel--BackgroundColor: var(--pf-v6-c-drawer__panel--m-inline--BackgroundColor);
2557
+ }
2903
2558
  .pfext-quick-start__base .pf-v6-c-drawer.pf-m-inline > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable), .pfext-quick-start__base .pf-v6-c-drawer.pf-m-static > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable) {
2904
2559
  padding-inline-start: var(--pf-v6-c-drawer--m-inline__panel--PaddingInlineStart);
2905
2560
  }
@@ -3089,9 +2744,6 @@ ul) {
3089
2744
  .pfext-quick-start__base .pf-v6-c-drawer__body:last-child {
3090
2745
  flex: 1 1;
3091
2746
  }
3092
- .pfext-quick-start__base .pf-v6-c-drawer__body > .pf-v6-c-page__main {
3093
- height: 100%;
3094
- }
3095
2747
  .pfext-quick-start__base .pf-v6-c-drawer__splitter {
3096
2748
  position: relative;
3097
2749
  display: none;
@@ -3586,7 +3238,7 @@ ul) {
3586
3238
  display: none;
3587
3239
  }
3588
3240
  }
3589
- .pfext-quick-start__base :where(:root, .pf-v6-c-empty-state) {
3241
+ .pfext-quick-start__base .pf-v6-c-empty-state {
3590
3242
  --pf-v6-c-empty-state--PaddingBlockStart: var(--pf-t--global--spacer--xl);
3591
3243
  --pf-v6-c-empty-state--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
3592
3244
  --pf-v6-c-empty-state--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
@@ -3624,7 +3276,7 @@ ul) {
3624
3276
  --pf-v6-c-empty-state--m-xs__body--MarginBlockStart: var(--pf-t--global--spacer--md);
3625
3277
  --pf-v6-c-empty-state--m-xl__body--FontSize: var(--pf-t--global--font--size--body--lg);
3626
3278
  --pf-v6-c-empty-state--m-xl__body--MarginBlockStart: var(--pf-t--global--spacer--xl);
3627
- --pf-v6-c-empty-state__footer--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical);
3279
+ --pf-v6-c-empty-state__footer--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
3628
3280
  --pf-v6-c-empty-state__footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
3629
3281
  --pf-v6-c-empty-state--m-xs__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
3630
3282
  --pf-v6-c-empty-state__actions--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
@@ -3717,13 +3369,8 @@ ul) {
3717
3369
  gap: var(--pf-v6-c-empty-state__actions--RowGap) var(--pf-v6-c-empty-state__actions--ColumnGap);
3718
3370
  justify-content: center;
3719
3371
  }
3720
- .pfext-quick-start__base :where(:root, .pf-v6-c-expandable-section) {
3721
- --pf-v6-c-expandable-section__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
3722
- --pf-v6-c-expandable-section__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
3723
- --pf-v6-c-expandable-section__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3724
- --pf-v6-c-expandable-section__toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3725
- --pf-v6-c-expandable-section__toggle--BackgroundColor: transparent;
3726
- --pf-v6-c-expandable-section__toggle--ColumnGap: calc(var(--pf-t--global--spacer--xs) + var(--pf-t--global--spacer--sm));
3372
+ .pfext-quick-start__base .pf-v6-c-expandable-section {
3373
+ --pf-v6-c-expandable-section--Gap: var(--pf-t--global--spacer--sm);
3727
3374
  --pf-v6-c-expandable-section__toggle-icon--MinWidth: 1em;
3728
3375
  --pf-v6-c-expandable-section__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
3729
3376
  --pf-v6-c-expandable-section__toggle-icon--Transition: .2s ease-in 0s;
@@ -3731,81 +3378,48 @@ ul) {
3731
3378
  --pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: 0;
3732
3379
  --pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate: 90deg;
3733
3380
  --pf-v6-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate: -90deg;
3734
- --pf-v6-c-expandable-section__toggle-text--Color: var(--pf-t--global--color--brand--default);
3735
- --pf-v6-c-expandable-section__toggle-text--hover--Color: var(--pf-t--global--color--brand--hover);
3736
- --pf-v6-c-expandable-section--m-expanded__toggle-text--Color: var(--pf-t--global--color--brand--hover);
3737
- --pf-v6-c-expandable-section__content--PaddingBlockStart: var(--pf-t--global--spacer--sm);
3738
- --pf-v6-c-expandable-section__content--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3739
- --pf-v6-c-expandable-section__content--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3740
- --pf-v6-c-expandable-section__content--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3741
3381
  --pf-v6-c-expandable-section__content--MaxWidth: auto;
3742
3382
  --pf-v6-c-expandable-section--m-limit-width__content--MaxWidth: 46.875rem;
3383
+ --pf-v6-c-expandable-section--m-display-lg--PaddingBlockStart: var(--pf-t--global--spacer--sm);
3384
+ --pf-v6-c-expandable-section--m-display-lg--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3385
+ --pf-v6-c-expandable-section--m-display-lg--PaddingInlineStart: var(--pf-t--global--spacer--md);
3386
+ --pf-v6-c-expandable-section--m-display-lg--PaddingInlineEnd: var(--pf-t--global--spacer--md);
3387
+ --pf-v6-c-expandable-section--m-display-lg--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--md);
3743
3388
  --pf-v6-c-expandable-section--m-display-lg--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
3389
+ --pf-v6-c-expandable-section--m-display-lg--BorderWidth: var(--pf-t--global--border--width--box--default);
3744
3390
  --pf-v6-c-expandable-section--m-display-lg--BorderColor: var(--pf-t--global--border--color--default);
3745
3391
  --pf-v6-c-expandable-section--m-display-lg--BorderRadius: var(--pf-t--global--border--radius--medium);
3746
- --pf-v6-c-expandable-section--m-display-lg__toggle--PaddingBlockStart: var(--pf-t--global--spacer--md);
3747
- --pf-v6-c-expandable-section--m-display-lg__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
3748
- --pf-v6-c-expandable-section--m-display-lg__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--md);
3749
- --pf-v6-c-expandable-section--m-display-lg__toggle--PaddingInlineStart: var(--pf-t--global--spacer--lg);
3750
- --pf-v6-c-expandable-section--m-display-lg__toggle--BorderRadius: var(--pf-t--global--border--radius--medium);
3751
- --pf-v6-c-expandable-section--m-display-lg__toggle--Width: 100%;
3752
- --pf-v6-c-expandable-section--m-display-lg__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--hover);
3753
- --pf-v6-c-expandable-section--m-display-lg__toggle--active--BackgroundColor: var(--pf-t--global--background--color--secondary--hover);
3754
- --pf-v6-c-expandable-section--m-display-lg__toggle--focus--BackgroundColor: var(--pf-t--global--background--color--secondary--hover);
3755
- --pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
3756
- --pf-v6-c-expandable-section--m-display-lg__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
3757
- --pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineStart: var(--pf-t--global--spacer--lg);
3758
- --pf-v6-c-expandable-section--m-expanded--m-display-lg__toggle--BorderRadius: var(--pf-t--global--border--radius--medium) var(--pf-t--global--border--radius--medium) 0 0;
3759
- --pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart--base: calc(var(--pf-v6-c-expandable-section__toggle--ColumnGap) + var(--pf-v6-c-expandable-section__toggle-icon--MinWidth));
3760
- --pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart: calc(var(--pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart--base) + var(--pf-v6-c-expandable-section__toggle--PaddingInlineStart));
3761
- --pf-v6-c-expandable-section--m-display-lg--m-indented__content--PaddingInlineStart: calc(var(--pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart--base) + var(--pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineStart));
3762
- --pf-v6-c-expandable-section--m-truncate--PaddingBlockStart: var(--pf-t--global--spacer--sm);
3763
- --pf-v6-c-expandable-section--m-truncate--PaddingInlineEnd: var(--pf-t--global--spacer--md);
3764
- --pf-v6-c-expandable-section--m-truncate--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3765
- --pf-v6-c-expandable-section--m-truncate--PaddingInlineStart: var(--pf-t--global--spacer--md);
3766
- --pf-v6-c-expandable-section--m-truncate__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3392
+ --pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) + var(--pf-t--global--spacer--gap--text-to-element--default) + var(--pf-v6-c-expandable-section__toggle-icon--MinWidth));
3767
3393
  --pf-v6-c-expandable-section--m-truncate__content--LineClamp: 3;
3394
+ --pf-v6-c-expandable-section--m-truncate--Gap: var(--pf-t--global--spacer--xs);
3395
+ }
3396
+ .pfext-quick-start__base .pf-v6-c-expandable-section {
3397
+ display: flex;
3398
+ flex-direction: column;
3399
+ gap: var(--pf-v6-c-expandable-section--Gap);
3768
3400
  }
3769
3401
  .pfext-quick-start__base .pf-v6-c-expandable-section.pf-m-expanded {
3770
- --pf-v6-c-expandable-section__toggle-text--Color: var(--pf-v6-c-expandable-section--m-expanded__toggle-text--Color);
3771
3402
  --pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate);
3772
3403
  --pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate);
3773
- --pf-v6-c-expandable-section--m-display-lg--after--BackgroundColor: var(--pf-v6-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor);
3774
- --pf-v6-c-expandable-section--m-display-lg__toggle--BorderRadius: var(--pf-v6-c-expandable-section--m-expanded--m-display-lg__toggle--BorderRadius);
3404
+ --pf-v6-c-expandable-section--m-display-lg--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-display-lg--m-expanded--PaddingBlockEnd);
3775
3405
  }
3776
3406
  .pfext-quick-start__base .pf-v6-c-expandable-section.pf-m-limit-width {
3777
3407
  --pf-v6-c-expandable-section__content--MaxWidth: var(--pf-v6-c-expandable-section--m-limit-width__content--MaxWidth);
3778
3408
  }
3779
3409
  .pfext-quick-start__base .pf-v6-c-expandable-section.pf-m-display-lg {
3780
- --pf-v6-c-expandable-section__toggle--PaddingBlockStart: var(--pf-v6-c-expandable-section--m-display-lg__toggle--PaddingBlockStart);
3781
- --pf-v6-c-expandable-section__toggle--PaddingInlineEnd: var(--pf-v6-c-expandable-section--m-display-lg__toggle--PaddingInlineEnd);
3782
- --pf-v6-c-expandable-section__toggle--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-display-lg__toggle--PaddingBlockEnd);
3783
- --pf-v6-c-expandable-section__toggle--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-display-lg__toggle--PaddingInlineStart);
3784
- --pf-v6-c-expandable-section__toggle--hover--BackgroundColor: var(--pf-v6-c-expandable-section--m-display-lg__toggle--hover--BackgroundColor);
3785
- --pf-v6-c-expandable-section__toggle--active--BackgroundColor: var(--pf-v6-c-expandable-section--m-display-lg__toggle--active--BackgroundColor);
3786
- --pf-v6-c-expandable-section__toggle--focus--BackgroundColor: var(--pf-v6-c-expandable-section--m-display-lg__toggle--focus--BackgroundColor);
3787
- --pf-v6-c-expandable-section__toggle--BorderRadius: var(--pf-v6-c-expandable-section--m-display-lg__toggle--BorderRadius);
3788
- --pf-v6-c-expandable-section__toggle--Width: var(--pf-v6-c-expandable-section--m-display-lg__toggle--Width);
3789
- --pf-v6-c-expandable-section__content--PaddingInlineEnd: var(--pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineEnd);
3790
- --pf-v6-c-expandable-section__content--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-display-lg__content--PaddingBlockEnd);
3791
- --pf-v6-c-expandable-section__content--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineStart);
3792
- --pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-display-lg--m-indented__content--PaddingInlineStart);
3410
+ padding-block-start: var(--pf-v6-c-expandable-section--m-display-lg--PaddingBlockStart);
3411
+ padding-block-end: var(--pf-v6-c-expandable-section--m-display-lg--PaddingBlockEnd);
3412
+ padding-inline-start: var(--pf-v6-c-expandable-section--m-display-lg--PaddingInlineStart);
3413
+ padding-inline-end: var(--pf-v6-c-expandable-section--m-display-lg--PaddingInlineEnd);
3793
3414
  background-color: var(--pf-v6-c-expandable-section--m-display-lg--BackgroundColor);
3794
- border: solid 1px var(--pf-v6-c-expandable-section--m-display-lg--BorderColor);
3415
+ border: var(--pf-v6-c-expandable-section--m-display-lg--BorderWidth) solid var(--pf-v6-c-expandable-section--m-display-lg--BorderColor);
3795
3416
  border-radius: var(--pf-v6-c-expandable-section--m-display-lg--BorderRadius);
3796
3417
  }
3797
3418
  .pfext-quick-start__base .pf-v6-c-expandable-section.pf-m-indented {
3798
3419
  --pf-v6-c-expandable-section__content--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart);
3799
3420
  }
3800
3421
  .pfext-quick-start__base .pf-v6-c-expandable-section.pf-m-truncate {
3801
- --pf-v6-c-expandable-section__toggle--PaddingBlockStart: 0;
3802
- --pf-v6-c-expandable-section__toggle--PaddingInlineEnd: 0;
3803
- --pf-v6-c-expandable-section__toggle--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-truncate__toggle--PaddingBlockEnd);
3804
- --pf-v6-c-expandable-section__toggle--PaddingInlineStart: 0;
3805
- --pf-v6-c-expandable-section__content--PaddingBlockStart: 0;
3806
- --pf-v6-c-expandable-section__content--PaddingInlineEnd: 0;
3807
- --pf-v6-c-expandable-section__content--PaddingBlockEnd: 0;
3808
- --pf-v6-c-expandable-section__content--PaddingInlineStart: 0;
3422
+ --pf-v6-c-expandable-section--Gap: var(--pf-v6-c-expandable-section--m-truncate--Gap);
3809
3423
  }
3810
3424
  .pfext-quick-start__base .pf-v6-c-expandable-section.pf-m-truncate:not(.pf-m-expanded) .pf-v6-c-expandable-section__content {
3811
3425
  display: -webkit-box;
@@ -3813,23 +3427,8 @@ ul) {
3813
3427
  -webkit-line-clamp: var(--pf-v6-c-expandable-section--m-truncate__content--LineClamp);
3814
3428
  overflow: hidden;
3815
3429
  }
3816
- .pfext-quick-start__base .pf-v6-c-expandable-section__toggle {
3817
- display: flex;
3818
- column-gap: var(--pf-v6-c-expandable-section__toggle--ColumnGap);
3819
- width: var(--pf-v6-c-expandable-section__toggle--Width, initial);
3820
- padding-block-start: var(--pf-v6-c-expandable-section__toggle--PaddingBlockStart);
3821
- padding-block-end: var(--pf-v6-c-expandable-section__toggle--PaddingBlockEnd);
3822
- padding-inline-start: var(--pf-v6-c-expandable-section__toggle--PaddingInlineStart);
3823
- padding-inline-end: var(--pf-v6-c-expandable-section__toggle--PaddingInlineEnd);
3824
- background-color: var(--pf-v6-c-expandable-section__toggle--BackgroundColor);
3825
- border: none;
3826
- border-radius: var(--pf-v6-c-expandable-section__toggle--BorderRadius, 0);
3827
- }
3828
- .pfext-quick-start__base .pf-v6-c-expandable-section__toggle:is(:hover, :focus) {
3829
- --pf-v6-c-expandable-section__toggle-text--Color: var(--pf-v6-c-expandable-section__toggle-text--hover--Color);
3830
- --pf-v6-c-expandable-section__toggle--BackgroundColor: var(--pf-v6-c-expandable-section__toggle--hover--BackgroundColor, initial);
3831
- }
3832
3430
  .pfext-quick-start__base .pf-v6-c-expandable-section__toggle-icon {
3431
+ display: inline-block;
3833
3432
  min-width: var(--pf-v6-c-expandable-section__toggle-icon--MinWidth);
3834
3433
  color: var(--pf-v6-c-expandable-section__toggle-icon--Color);
3835
3434
  transition: var(--pf-v6-c-expandable-section__toggle-icon--Transition);
@@ -3841,37 +3440,17 @@ ul) {
3841
3440
  .pfext-quick-start__base .pf-v6-c-expandable-section__toggle-icon.pf-m-expand-top {
3842
3441
  --pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate);
3843
3442
  }
3844
- .pfext-quick-start__base .pf-v6-c-expandable-section__toggle-text {
3845
- color: var(--pf-v6-c-expandable-section__toggle-text--Color);
3846
- }
3847
3443
  .pfext-quick-start__base .pf-v6-c-expandable-section__content {
3848
3444
  max-width: var(--pf-v6-c-expandable-section__content--MaxWidth);
3849
- padding-block-start: var(--pf-v6-c-expandable-section__content--PaddingBlockStart);
3850
- padding-block-end: var(--pf-v6-c-expandable-section__content--PaddingBlockEnd);
3851
- padding-inline-start: var(--pf-v6-c-expandable-section__content--PaddingInlineStart);
3852
- padding-inline-end: var(--pf-v6-c-expandable-section__content--PaddingInlineEnd);
3853
- }
3854
- .pfext-quick-start__base :where(:root, .pf-v6-c-file-upload) {
3855
- --pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--sm);
3856
- --pf-v6-c-file-upload--PaddingBlockStart: var(--pf-t--global--spacer--sm);
3857
- --pf-v6-c-file-upload--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3858
- --pf-v6-c-file-upload--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3859
- --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3860
- --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
3861
- --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
3862
- --pf-v6-c-file-upload--BorderColor: transparent;
3863
- --pf-v6-c-file-upload--BorderStyle: solid;
3864
- --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
3865
- --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
3866
- --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
3867
- --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
3868
- }
3869
- .pfext-quick-start__base :where(:root, .pf-v6-c-form) {
3870
- --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--lg);
3871
- --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--sm);
3445
+ padding-block-end: var(--pf-v6-c-expandable-section__content--PaddingBlockEnd, 0);
3446
+ padding-inline-start: var(--pf-v6-c-expandable-section__content--PaddingInlineStart, 0);
3447
+ }
3448
+ .pfext-quick-start__base .pf-v6-c-form {
3449
+ --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
3450
+ --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--gap--group--vertical);
3872
3451
  --pf-v6-c-form__group--m-action--MarginBlockStart: var(--pf-t--global--spacer--xl);
3873
3452
  --pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth: 9.375rem;
3874
- --pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap: var(--pf-t--global--spacer--md);
3453
+ --pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
3875
3454
  --pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth: 1fr;
3876
3455
  --pf-v6-c-form--m-limit-width--MaxWidth: 55rem;
3877
3456
  --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: calc((((((var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body)) + (2 * var(--pf-t--global--border--width--control--default))) - var(--pf-t--global--font--size--body--default)) / 2) + var(--pf-t--global--font--size--body--default)) - ((((var(--pf-t--global--font--size--body--sm) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--sm)) / 2) + var(--pf-t--global--font--size--body--sm)) + var(--pf-t--global--border--width--control--default));
@@ -3888,13 +3467,12 @@ ul) {
3888
3467
  --pf-v6-c-form__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
3889
3468
  --pf-v6-c-form__label-required--Color: var(--pf-t--global--color--status--danger--default);
3890
3469
  --pf-v6-c-form__group-label-help--FontSize: var(--pf-t--global--font--size--body--sm);
3891
- --pf-v6-c-form__group-label--m-info--Gap: var(--pf-t--global--spacer--sm);
3470
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--horizontal);
3892
3471
  --pf-v6-c-form__group-label-info--FontSize: var(--pf-t--global--font--size--body--sm);
3893
- --pf-v6-c-form--m-horizontal__group-label--m-info--Gap: var(--pf-t--global--spacer--sm);
3894
- --pf-v6-c-form__group-control--m-inline--child--MarginInlineEnd: var(--pf-t--global--spacer--lg);
3472
+ --pf-v6-c-form--m-horizontal__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--group--vertical);
3473
+ --pf-v6-c-form__group-control--m-inline--Gap: var(--pf-t--global--spacer--gap--group--horizontal);
3895
3474
  --pf-v6-c-form__group-control__helper-text--MarginBlockEnd: var(--pf-t--global--spacer--xs);
3896
- --pf-v6-c-form__group-control--Gap: var(--pf-t--global--spacer--sm);
3897
- --pf-v6-c-form__group-control--m-stack--Gap: var(--pf-t--global--spacer--sm);
3475
+ --pf-v6-c-form__group-control--m-stack--Gap: var(--pf-t--global--spacer--gap--group--vertical);
3898
3476
  --pf-v6-c-form__group-control--m-stack__helper-text--MarginBlockStart: calc(var(--pf-v6-c-form__group-control--m-stack--Gap) * -1 + var(--pf-v6-c-form__helper-text--MarginBlockStart--base));
3899
3477
  --pf-v6-c-form__actions--child--MarginBlockStart: var(--pf-t--global--spacer--sm);
3900
3478
  --pf-v6-c-form__actions--child--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -3907,7 +3485,7 @@ ul) {
3907
3485
  --pf-v6-c-form__helper-text--MarginBlockStart--base: var(--pf-t--global--spacer--xs);
3908
3486
  --pf-v6-c-form__helper-text--MarginBlockStart: var(--pf-v6-c-form__helper-text--MarginBlockStart--base);
3909
3487
  --pf-v6-c-form__section--MarginBlockStart: var(--pf-t--global--spacer--xl);
3910
- --pf-v6-c-form__section--Gap: var(--pf-t--global--spacer--md);
3488
+ --pf-v6-c-form__section--Gap: var(--pf-v6-c-form--GridGap);
3911
3489
  --pf-v6-c-form__section-title--FontSize: var(--pf-t--global--font--size--heading--xs);
3912
3490
  --pf-v6-c-form__section-title--FontWeight: var(--pf-t--global--font--weight--heading--default);
3913
3491
  --pf-v6-c-form__section-title--MarginBlockEnd: calc(var(--pf-t--global--spacer--sm) * -1);
@@ -3925,7 +3503,8 @@ ul) {
3925
3503
  --pf-v6-c-form__field-group__field-group--field-group__field-group-toggle--after--BorderBlockStartWidth: var(--pf-v6-c-form__field-group-header-toggle--BorderWidth--base);
3926
3504
  --pf-v6-c-form__field-group-toggle-button--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
3927
3505
  --pf-v6-c-form__field-group-toggle-button--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
3928
- --pf-v6-c-form__field-group-toggle-icon--Transition: var(--pf-t--global--transition);
3506
+ --pf-v6-c-form__field-group-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
3507
+ --pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
3929
3508
  --pf-v6-c-form__field-group-toggle-icon--MinWidth: var(--pf-t--global--font--size--body--default);
3930
3509
  --pf-v6-c-form__field-group-toggle-icon--Rotate: 0;
3931
3510
  --pf-v6-c-form__field-group--m-expanded__toggle-icon--Rotate: 90deg;
@@ -3971,8 +3550,8 @@ ul) {
3971
3550
  transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
3972
3551
  }
3973
3552
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label.pf-m-info {
3553
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
3974
3554
  flex-direction: column;
3975
- gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
3976
3555
  align-items: flex-start;
3977
3556
  }
3978
3557
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label-main {
@@ -3999,8 +3578,8 @@ ul) {
3999
3578
  transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4000
3579
  }
4001
3580
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label.pf-m-info {
3581
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4002
3582
  flex-direction: column;
4003
- gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4004
3583
  align-items: flex-start;
4005
3584
  }
4006
3585
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label-main {
@@ -4027,8 +3606,8 @@ ul) {
4027
3606
  transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4028
3607
  }
4029
3608
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label.pf-m-info {
3609
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4030
3610
  flex-direction: column;
4031
- gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4032
3611
  align-items: flex-start;
4033
3612
  }
4034
3613
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label-main {
@@ -4055,8 +3634,8 @@ ul) {
4055
3634
  transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4056
3635
  }
4057
3636
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label.pf-m-info {
3637
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4058
3638
  flex-direction: column;
4059
- gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4060
3639
  align-items: flex-start;
4061
3640
  }
4062
3641
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label-main {
@@ -4083,8 +3662,8 @@ ul) {
4083
3662
  transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4084
3663
  }
4085
3664
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-lg .pf-v6-c-form__group-label.pf-m-info {
3665
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4086
3666
  flex-direction: column;
4087
- gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4088
3667
  align-items: flex-start;
4089
3668
  }
4090
3669
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-lg .pf-v6-c-form__group-label-main {
@@ -4111,8 +3690,8 @@ ul) {
4111
3690
  transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4112
3691
  }
4113
3692
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-xl .pf-v6-c-form__group-label.pf-m-info {
3693
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4114
3694
  flex-direction: column;
4115
- gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4116
3695
  align-items: flex-start;
4117
3696
  }
4118
3697
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-xl .pf-v6-c-form__group-label-main {
@@ -4139,8 +3718,8 @@ ul) {
4139
3718
  transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4140
3719
  }
4141
3720
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-2xl .pf-v6-c-form__group-label.pf-m-info {
3721
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4142
3722
  flex-direction: column;
4143
- gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4144
3723
  align-items: flex-start;
4145
3724
  }
4146
3725
  .pfext-quick-start__base .pf-v6-c-form.pf-m-horizontal-on-2xl .pf-v6-c-form__group-label-main {
@@ -4180,13 +3759,13 @@ ul) {
4180
3759
  }
4181
3760
  .pfext-quick-start__base .pf-v6-c-form__group-label.pf-m-info {
4182
3761
  display: flex;
3762
+ gap: var(--pf-v6-c-form__group-label--m-info--Gap);
4183
3763
  align-items: flex-end;
4184
3764
  }
4185
3765
  .pfext-quick-start__base .pf-v6-c-form__group-label-main {
4186
3766
  flex-grow: 1;
4187
3767
  }
4188
3768
  .pfext-quick-start__base .pf-v6-c-form__group-label-info {
4189
- margin-inline-start: var(--pf-v6-c-form__group-label-info--MarginInlineStart);
4190
3769
  font-size: var(--pf-v6-c-form__group-label-info--FontSize);
4191
3770
  }
4192
3771
  .pfext-quick-start__base .pf-v6-c-form__label {
@@ -4222,12 +3801,7 @@ ul) {
4222
3801
  .pfext-quick-start__base .pf-v6-c-form__group-control.pf-m-inline {
4223
3802
  display: flex;
4224
3803
  flex-flow: row wrap;
4225
- }
4226
- .pfext-quick-start__base .pf-v6-c-form__group-control.pf-m-inline > * {
4227
- margin-inline-end: var(--pf-v6-c-form__group-control--m-inline--child--MarginInlineEnd);
4228
- }
4229
- .pfext-quick-start__base .pf-v6-c-form__group-control.pf-m-inline > :last-child {
4230
- --pf-v6-c-form__group-control--m-inline--child--MarginInlineEnd: 0;
3804
+ gap: var(--pf-v6-c-form__group-control--m-inline--Gap);
4231
3805
  }
4232
3806
  .pfext-quick-start__base .pf-v6-c-form__group-control.pf-m-stack {
4233
3807
  --pf-v6-c-form__helper-text--MarginBlockStart: var(--pf-v6-c-form__group-control--m-stack__helper-text--MarginBlockStart);
@@ -4311,7 +3885,7 @@ ul) {
4311
3885
  display: inline-block;
4312
3886
  min-width: var(--pf-v6-c-form__field-group-toggle-icon--MinWidth);
4313
3887
  text-align: center;
4314
- transition: var(--pf-v6-c-form__field-group-toggle-icon--Transition);
3888
+ transition: transform var(--pf-v6-c-form__field-group-toggle-icon--TransitionDuration) var(--pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction);
4315
3889
  transform: rotate(var(--pf-v6-c-form__field-group-toggle-icon--Rotate));
4316
3890
  }
4317
3891
  .pfext-quick-start__base :where(.pf-v6-m-dir-rtl, [dir="rtl"]) .pf-v6-c-form__field-group-toggle-icon {
@@ -4358,8 +3932,8 @@ ul) {
4358
3932
  .pfext-quick-start__base .pf-v6-c-form__field-group-body > .pf-v6-c-form__field-group:last-child {
4359
3933
  margin-block-end: var(--pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd);
4360
3934
  }
4361
- .pfext-quick-start__base :where(:root, .pf-v6-c-form-control) {
4362
- --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--sm);
3935
+ .pfext-quick-start__base .pf-v6-c-form-control {
3936
+ --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
4363
3937
  --pf-v6-c-form-control--Color: var(--pf-t--global--text--color--regular);
4364
3938
  --pf-v6-c-form-control--FontSize: var(--pf-t--global--font--size--body--default);
4365
3939
  --pf-v6-c-form-control--LineHeight: var(--pf-t--global--font--line-height--body);
@@ -4367,9 +3941,11 @@ ul) {
4367
3941
  --pf-v6-c-form-control--OutlineOffset: -6px;
4368
3942
  --pf-v6-c-form-control--BorderRadius: var(--pf-t--global--border--radius--small);
4369
3943
  --pf-v6-c-form-control--before--BorderWidth: var(--pf-t--global--border--width--control--default);
3944
+ --pf-v6-c-form-control--before--BorderStyle: solid;
4370
3945
  --pf-v6-c-form-control--before--BorderColor: var(--pf-t--global--border--color--default);
4371
3946
  --pf-v6-c-form-control--before--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
4372
3947
  --pf-v6-c-form-control--after--BorderWidth: var(--pf-t--global--border--width--control--default);
3948
+ --pf-v6-c-form-control--after--BorderStyle: solid;
4373
3949
  --pf-v6-c-form-control--after--BorderColor: transparent;
4374
3950
  --pf-v6-c-form-control--after--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
4375
3951
  --pf-v6-c-form-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
@@ -4381,8 +3957,9 @@ ul) {
4381
3957
  --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control--inset--base);
4382
3958
  --pf-v6-c-form-control--hover--after--BorderWidth: var(--pf-t--global--border--width--control--hover);
4383
3959
  --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-t--global--border--color--hover);
4384
- --pf-v6-c-form-control--focus--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
4385
- --pf-v6-c-form-control--focus--after--BorderColor: var(--pf-t--global--border--color--clicked);
3960
+ --pf-v6-c-form-control--m-success--hover--after--BorderColor: var(--pf-t--global--border--color--status--success--hover);
3961
+ --pf-v6-c-form-control--m-warning--hover--after--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
3962
+ --pf-v6-c-form-control--m-error--hover--after--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
4386
3963
  --pf-v6-c-form-control--m-expanded--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
4387
3964
  --pf-v6-c-form-control--m-expanded--after--BorderColor: var(--pf-t--global--border--color--clicked);
4388
3965
  --pf-v6-c-form-control--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
@@ -4390,12 +3967,11 @@ ul) {
4390
3967
  --pf-v6-c-form-control--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
4391
3968
  --pf-v6-c-form-control--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
4392
3969
  --pf-v6-c-form-control--m-disabled--after--BorderColor: transparent;
4393
- --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
4394
- --pf-v6-c-form-control--m-readonly--BorderColor: transparent;
3970
+ --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-t--global--background--color--control--read-only);
3971
+ --pf-v6-c-form-control--m-readonly--BorderColor: var(--pf-t--global--border--color--control--read-only);
4395
3972
  --pf-v6-c-form-control--m-readonly--hover--after--BorderColor: revert;
4396
- --pf-v6-c-form-control--m-readonly--focus--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
4397
- --pf-v6-c-form-control--m-readonly--focus--after--BorderColor: var(--pf-t--global--border--color--clicked);
4398
3973
  --pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor: transparent;
3974
+ --pf-v6-c-form-control--m-readonly--m-plain--BorderColor: transparent;
4399
3975
  --pf-v6-c-form-control--m-readonly--m-plain--inset--base: 0;
4400
3976
  --pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset: 0;
4401
3977
  --pf-v6-c-form-control--m-success--after--BorderWidth: var(--pf-t--global--border--width--control--default);
@@ -4419,13 +3995,17 @@ ul) {
4419
3995
  --pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd: calc((var(--pf-v6-c-form-control__icon--FontSize) * 2) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart));
4420
3996
  --pf-v6-c-form-control--textarea--Width: var(--pf-v6-c-form-control--Width);
4421
3997
  --pf-v6-c-form-control--textarea--Height: auto;
3998
+ --pf-v6-c-form-control--textarea--PaddingBlockStart--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
3999
+ --pf-v6-c-form-control--textarea--PaddingBlockEnd--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
4000
+ --pf-v6-c-form-control--textarea--PaddingInlineEnd--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
4001
+ --pf-v6-c-form-control--textarea--PaddingInlineStart--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
4422
4002
  --pf-v6-c-form-control__icon--Color: var(--pf-t--global--icon--color--regular);
4423
4003
  --pf-v6-c-form-control__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
4424
4004
  --pf-v6-c-form-control__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
4425
4005
  --pf-v6-c-form-control--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
4426
4006
  --pf-v6-c-form-control--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
4427
4007
  --pf-v6-c-form-control--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
4428
- --pf-v6-c-form-control__utilities--Gap: var(--pf-t--global--spacer--sm);
4008
+ --pf-v6-c-form-control__utilities--Gap: var(--pf-t--global--spacer--gap--group--horizontal);
4429
4009
  --pf-v6-c-form-control__utilities--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
4430
4010
  --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
4431
4011
  --pf-v6-c-form-control__toggle-icon--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
@@ -4454,12 +4034,12 @@ ul) {
4454
4034
  }
4455
4035
  .pfext-quick-start__base .pf-v6-c-form-control::before {
4456
4036
  border-color: var(--pf-v6-c-form-control--before--BorderColor);
4457
- border-style: var(--pf-v6-c-form-control--before--BorderStyle, solid);
4037
+ border-style: var(--pf-v6-c-form-control--before--BorderStyle);
4458
4038
  border-width: var(--pf-v6-c-form-control--before--BorderWidth);
4459
4039
  border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
4460
4040
  }
4461
4041
  .pfext-quick-start__base .pf-v6-c-form-control::after {
4462
- border: var(--pf-v6-c-form-control--after--BorderWidth) var(--pf-v6-c-form-control--after--BorderStyle, solid) var(--pf-v6-c-form-control--after--BorderColor);
4042
+ border: var(--pf-v6-c-form-control--after--BorderWidth) var(--pf-v6-c-form-control--after--BorderStyle) var(--pf-v6-c-form-control--after--BorderColor);
4463
4043
  border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
4464
4044
  }
4465
4045
  .pfext-quick-start__base .pf-v6-c-form-control > :is(input, select, textarea) {
@@ -4473,41 +4053,51 @@ ul) {
4473
4053
  background-color: transparent;
4474
4054
  border: none;
4475
4055
  border-radius: var(--pf-v6-c-form-control--BorderRadius);
4056
+ outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
4476
4057
  -moz-appearance: none;
4477
4058
  -webkit-appearance: none;
4478
4059
  }
4479
- .pfext-quick-start__base .pf-v6-c-form-control > :is(input, select, textarea):focus {
4480
- outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
4481
- }
4482
4060
  .pfext-quick-start__base .pf-v6-c-form-control > ::placeholder {
4483
4061
  color: var(--pf-v6-c-form-control--m-placeholder--Color);
4484
4062
  }
4485
4063
  .pfext-quick-start__base .pf-v6-c-form-control > :is(input, select) {
4486
4064
  text-overflow: ellipsis;
4487
4065
  }
4066
+ .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea {
4067
+ padding-block-start: var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset);
4068
+ padding-block-end: var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset);
4069
+ padding-inline-start: var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset);
4070
+ padding-inline-end: var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset);
4071
+ }
4072
+ .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea.pf-m-success, .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea.pf-m-warning, .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea.pf-m-error {
4073
+ --pf-v6-c-form-control--m-status--PaddingInlineEnd--offset: calc(var(--pf-v6-c-form-control__icon--FontSize) + var(--pf-v6-c-form-control--ColumnGap));
4074
+ }
4075
+ .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea > textarea {
4076
+ padding-block-start: calc(var(--pf-v6-c-form-control--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
4077
+ padding-block-end: calc(var(--pf-v6-c-form-control--PaddingBlockEnd) - var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset));
4078
+ padding-inline-start: calc(var(--pf-v6-c-form-control--PaddingInlineStart) - var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset));
4079
+ padding-inline-end: calc(var(--pf-v6-c-form-control--PaddingInlineEnd) - var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset) + var(--pf-v6-c-form-control--m-status--PaddingInlineEnd--offset, 0));
4080
+ outline-offset: 0;
4081
+ scrollbar-gutter: stable;
4082
+ }
4488
4083
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-readonly {
4489
4084
  --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--BackgroundColor);
4490
- --pf-v6-c-form-control--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
4085
+ --pf-v6-c-form-control--before--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
4491
4086
  }
4492
4087
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-readonly:hover {
4493
4088
  --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
4494
4089
  }
4495
4090
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-readonly:not(.pf-m-success, .pf-m-warning, .pf-m-error) {
4496
4091
  --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
4497
- --pf-v6-c-form-control--focus--after--BorderWidth: var(--pf-v6-c-form-control--m-readonly--focus--after--BorderWidth);
4498
- --pf-v6-c-form-control--focus--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--focus--after--BorderColor);
4499
4092
  }
4500
4093
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-readonly.pf-m-plain {
4501
4094
  --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor);
4095
+ --pf-v6-c-form-control--m-readonly--BorderColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BorderColor);
4502
4096
  --pf-v6-c-form-control--inset--base: var(--pf-v6-c-form-control--m-readonly--m-plain--inset--base);
4503
4097
  --pf-v6-c-form-control--before--BorderStyle: none;
4504
4098
  --pf-v6-c-form-control--after--BorderStyle: none;
4505
4099
  --pf-v6-c-form-control--OutlineOffset: var(--pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset);
4506
4100
  }
4507
- .pfext-quick-start__base .pf-v6-c-form-control:hover {
4508
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--hover--after--BorderColor);
4509
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--hover--after--BorderWidth);
4510
- }
4511
4101
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-expanded {
4512
4102
  --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-expanded--after--BorderColor);
4513
4103
  --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-expanded--after--BorderWidth);
@@ -4524,6 +4114,7 @@ ul) {
4524
4114
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-error {
4525
4115
  --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd);
4526
4116
  --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-error--after--BorderColor);
4117
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-error--hover--after--BorderColor);
4527
4118
  --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
4528
4119
  --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd);
4529
4120
  --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
@@ -4534,6 +4125,7 @@ ul) {
4534
4125
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-success {
4535
4126
  --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd);
4536
4127
  --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-success--after--BorderColor);
4128
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-success--hover--after--BorderColor);
4537
4129
  --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-success__icon--m-status--Color);
4538
4130
  --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd);
4539
4131
  --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-success--after--BorderWidth);
@@ -4544,6 +4136,7 @@ ul) {
4544
4136
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-warning {
4545
4137
  --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd);
4546
4138
  --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-warning--after--BorderColor);
4139
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-warning--hover--after--BorderColor);
4547
4140
  --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-warning__icon--m-status--Color);
4548
4141
  --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd);
4549
4142
  --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-warning--after--BorderWidth);
@@ -4551,6 +4144,10 @@ ul) {
4551
4144
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-warning.pf-m-icon {
4552
4145
  --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
4553
4146
  }
4147
+ .pfext-quick-start__base .pf-v6-c-form-control:hover {
4148
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--hover--after--BorderColor);
4149
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--hover--after--BorderWidth);
4150
+ }
4554
4151
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-icon {
4555
4152
  --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
4556
4153
  }
@@ -4620,49 +4217,7 @@ ul) {
4620
4217
  .pfext-quick-start__base select ~ .pf-v6-c-form-control__utilities {
4621
4218
  --pf-v6-c-form-control__utilities--PaddingInlineEnd: 0;
4622
4219
  }
4623
- .pfext-quick-start__base :where(:root, .pf-v6-c-hint) {
4624
- --pf-v6-c-hint--GridRowGap: var(--pf-t--global--spacer--sm);
4625
- --pf-v6-c-hint--PaddingBlockStart: var(--pf-t--global--spacer--lg);
4626
- --pf-v6-c-hint--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
4627
- --pf-v6-c-hint--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
4628
- --pf-v6-c-hint--PaddingInlineStart: var(--pf-t--global--spacer--lg);
4629
- --pf-v6-c-hint--BackgroundColor: var(--pf-t--global--background--color--primary--default);
4630
- --pf-v6-c-hint--BorderColor: var(--pf-t--global--border--color--status--info--default);
4631
- --pf-v6-c-hint--BorderWidth: var(--pf-t--global--border--width--box--status--default);
4632
- --pf-v6-c-hint--BorderRadius: var(--pf-t--global--border--radius--medium);
4633
- --pf-v6-c-hint--Color: var(--pf-t--global--text--color--regular);
4634
- --pf-v6-c-hint__title--FontWeight: var(--pf-t--global--font--weight--body--bold);
4635
- --pf-v6-c-hint__body--FontSize: var(--pf-t--global--font--size--body--default);
4636
- --pf-v6-c-hint__footer--MarginBlockStart: var(--pf-t--global--spacer--sm);
4637
- --pf-v6-c-hint__footer--child--MarginInlineEnd: var(--pf-t--global--spacer--md);
4638
- --pf-v6-c-hint__actions--MarginInlineStart: var(--pf-t--global--spacer--2xl);
4639
- --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
4640
- --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
4641
- }
4642
- .pfext-quick-start__base :where(:root, .pf-v6-c-helper-text) {
4643
- --pf-v6-c-helper-text--Gap: var(--pf-t--global--spacer--xs);
4644
- --pf-v6-c-helper-text--FontSize: var(--pf-t--global--font--size--body--sm);
4645
- --pf-v6-c-helper-text__item-icon--Color: var(--pf-t--global--icon--color--regular);
4646
- --pf-v6-c-helper-text__item-text--Color: var(--pf-t--global--text--color--regular);
4647
- --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-t--global--font--weight--body--default);
4648
- --pf-v6-c-helper-text__item-icon--m-indeterminate--Color: var(--pf-t--global--icon--color--subtle);
4649
- --pf-v6-c-helper-text__item-text--m-indeterminate--Color: var(--pf-t--global--text--color--subtle);
4650
- --pf-v6-c-helper-text__item-icon--m-warning--Color: var(--pf-t--global--icon--color--status--warning--default);
4651
- --pf-v6-c-helper-text__item-text--m-warning--FontWeight: var(--pf-t--global--font--weight--body--bold);
4652
- --pf-v6-c-helper-text__item-icon--m-success--Color: var(--pf-t--global--icon--color--status--success--default);
4653
- --pf-v6-c-helper-text__item-text--m-success--FontWeight: var(--pf-t--global--font--weight--body--bold);
4654
- --pf-v6-c-helper-text__item-icon--m-error--Color: var(--pf-t--global--icon--color--status--danger--default);
4655
- --pf-v6-c-helper-text__item-text--m-error--FontWeight: var(--pf-t--global--font--weight--body--bold);
4656
- --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-t--global--icon--color--regular);
4657
- --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color: var(--pf-t--global--icon--color--subtle);
4658
- --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color: var(--pf-t--global--text--color--subtle);
4659
- --pf-v6-c-helper-text--m-dynamic--m-warning__item-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
4660
- --pf-v6-c-helper-text--m-dynamic--m-warning__item-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
4661
- --pf-v6-c-helper-text--m-dynamic--m-success__item-icon--Color: var(--pf-t--global--icon--color--status--success--default);
4662
- --pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
4663
- --pf-v6-c-helper-text__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--xs);
4664
- }
4665
- .pfext-quick-start__base :where(:root, .pf-v6-c-icon) {
4220
+ .pfext-quick-start__base .pf-v6-c-icon {
4666
4221
  --pf-v6-c-icon--Width: var(--pf-t--global--icon--size--font--body--default);
4667
4222
  --pf-v6-c-icon--Height: var(--pf-t--global--icon--size--font--body--default);
4668
4223
  --pf-v6-c-icon--m-sm--Width: var(--pf-t--global--icon--size--sm);
@@ -4913,16 +4468,8 @@ ul) {
4913
4468
  opacity: var(--pf-v6-c-icon__progress--Opacity, 0);
4914
4469
  transform: translateY(calc(-50% - calc(.5 * var(--pf-v6-c-icon__content--svg--VerticalAlign))));
4915
4470
  }
4916
- .pfext-quick-start__base :where(:root, .pf-v6-c-inline-edit) {
4917
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
4918
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
4919
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
4920
- --pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--plain);
4921
- --pf-v6-c-inline-edit__group--m-footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
4922
- --pf-v6-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
4923
- }
4924
- .pfext-quick-start__base :where(:root, .pf-v6-c-input-group) {
4925
- --pf-v6-c-input-group--Gap: var(--pf-t--global--spacer--xs);
4471
+ .pfext-quick-start__base .pf-v6-c-input-group {
4472
+ --pf-v6-c-input-group--Gap: var(--pf-t--global--spacer--gap--control-to-control--default);
4926
4473
  --pf-v6-c-input-group__item--offset: var(--pf-t--global--border--width--control--default);
4927
4474
  --pf-v6-c-input-group__item--BorderWidth--base: var(--pf-t--global--border--width--control--default);
4928
4475
  --pf-v6-c-input-group__item--BorderColor--base: var(--pf-t--global--border--color--default);
@@ -4990,58 +4537,7 @@ ul) {
4990
4537
  .pfext-quick-start__base label.pf-v6-c-input-group__text {
4991
4538
  cursor: pointer;
4992
4539
  }
4993
- .pfext-quick-start__base :where(:root, .pf-v6-c-jump-links) {
4994
- --pf-v6-c-jump-links__list--Display: flex;
4995
- --pf-v6-c-jump-links__list--PaddingBlockStart: 0;
4996
- --pf-v6-c-jump-links__list--PaddingInlineEnd: var(--pf-t--global--spacer--md);
4997
- --pf-v6-c-jump-links__list--PaddingBlockEnd: 0;
4998
- --pf-v6-c-jump-links__list--PaddingInlineStart: var(--pf-t--global--spacer--md);
4999
- --pf-v6-c-jump-links--m-vertical__list--PaddingBlockStart: var(--pf-t--global--spacer--md);
5000
- --pf-v6-c-jump-links--m-vertical__list--PaddingInlineEnd: 0;
5001
- --pf-v6-c-jump-links--m-vertical__list--PaddingBlockEnd: var(--pf-t--global--spacer--md);
5002
- --pf-v6-c-jump-links--m-vertical__list--PaddingInlineStart: 0;
5003
- --pf-v6-c-jump-links__list--FlexDirection: row;
5004
- --pf-v6-c-jump-links--m-vertical__list--FlexDirection: column;
5005
- --pf-v6-c-jump-links__list--before--BorderColor: var(--pf-t--global--border--color--default);
5006
- --pf-v6-c-jump-links__list--before--BorderBlockStartWidth: var(--pf-t--global--border--width--box--default);
5007
- --pf-v6-c-jump-links__list--before--BorderInlineEndWidth: 0;
5008
- --pf-v6-c-jump-links__list--before--BorderBlockEndWidth: 0;
5009
- --pf-v6-c-jump-links__list--before--BorderInlineStartWidth: 0;
5010
- --pf-v6-c-jump-links--m-vertical__list--before--BorderInlineStartWidth: var(--pf-t--global--border--width--box--default);
5011
- --pf-v6-c-jump-links--m-vertical__list--before--BorderBlockStartWidth: 0;
5012
- --pf-v6-c-jump-links__list__list--MarginBlockStart: calc(var(--pf-t--global--spacer--sm) * -1);
5013
- --pf-v6-c-jump-links__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5014
- --pf-v6-c-jump-links__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
5015
- --pf-v6-c-jump-links__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
5016
- --pf-v6-c-jump-links__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
5017
- --pf-v6-c-jump-links__list__list__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5018
- --pf-v6-c-jump-links__list__list__link--PaddingInlineStart: var(--pf-t--global--spacer--lg);
5019
- --pf-v6-c-jump-links__list__list__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
5020
- --pf-v6-c-jump-links__link--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--sm));
5021
- --pf-v6-c-jump-links__link--before--BorderBlockStartWidth: 0;
5022
- --pf-v6-c-jump-links__link--before--BorderInlineEndWidth: 0;
5023
- --pf-v6-c-jump-links__link--before--BorderBlockEndWidth: 0;
5024
- --pf-v6-c-jump-links__link--before--BorderInlineStartWidth: 0;
5025
- --pf-v6-c-jump-links__link--before--BorderColor: transparent;
5026
- --pf-v6-c-jump-links__item--m-current__link--before--BorderBlockStartWidth: var(--pf-t--global--border--width--extra-strong);
5027
- --pf-v6-c-jump-links__item--m-current__link--before--BorderInlineStartWidth: 0;
5028
- --pf-v6-c-jump-links__item--m-current__link--before--BorderColor: var(--pf-t--global--border--color--clicked);
5029
- --pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderBlockStartWidth: 0;
5030
- --pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderInlineStartWidth: var(--pf-t--global--border--width--extra-strong);
5031
- --pf-v6-c-jump-links__link-text--Color: var(--pf-t--global--text--color--subtle);
5032
- --pf-v6-c-jump-links__link--hover__link-text--Color: var(--pf-t--global--text--color--subtle);
5033
- --pf-v6-c-jump-links__item--m-current__link-text--Color: var(--pf-t--global--text--color--regular);
5034
- --pf-v6-c-jump-links__label--MarginBlockEnd: var(--pf-t--global--spacer--md);
5035
- --pf-v6-c-jump-links__label--Display: block;
5036
- --pf-v6-c-jump-links__toggle--MarginBlockEnd: 0;
5037
- --pf-v6-c-jump-links--m-expanded__toggle--MarginBlockEnd: var(--pf-t--global--spacer--sm);
5038
- --pf-v6-c-jump-links__toggle--Display: none;
5039
- --pf-v6-c-jump-links__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5040
- --pf-v6-c-jump-links__toggle-icon--Transition: var(--pf-t--global--transition);
5041
- --pf-v6-c-jump-links__toggle-icon--Rotate: 0;
5042
- --pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
5043
- }
5044
- .pfext-quick-start__base :where(:root, .pf-v6-c-label) {
4540
+ .pfext-quick-start__base .pf-v6-c-label {
5045
4541
  --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
5046
4542
  --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
5047
4543
  --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
@@ -5204,7 +4700,7 @@ ul) {
5204
4700
  --pf-v6-c-label--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
5205
4701
  --pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset: 0.0625rem;
5206
4702
  --pf-v6-c-label__content--MaxWidth: 100%;
5207
- --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--xs);
4703
+ --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
5208
4704
  --pf-v6-c-label__content--Cursor: initial;
5209
4705
  --pf-v6-c-label__icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
5210
4706
  --pf-v6-c-label__text--MaxWidth: 100%;
@@ -5528,7 +5024,7 @@ ul) {
5528
5024
  margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
5529
5025
  outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
5530
5026
  }
5531
- .pfext-quick-start__base :where(:root, .pf-v6-c-label-group) {
5027
+ .pfext-quick-start__base .pf-v6-c-label-group {
5532
5028
  --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
5533
5029
  --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
5534
5030
  --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
@@ -5655,7 +5151,7 @@ ul) {
5655
5151
  .pfext-quick-start__base .pf-v6-c-label-group__textarea::-webkit-scrollbar {
5656
5152
  display: none;
5657
5153
  }
5658
- .pfext-quick-start__base :where(:root, .pf-v6-c-list) {
5154
+ .pfext-quick-start__base .pf-v6-c-list {
5659
5155
  --pf-v6-c-list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
5660
5156
  --pf-v6-c-list--ul--ListStyle: var(--pf-t--global--list-style);
5661
5157
  --pf-v6-c-list--Gap: var(--pf-t--global--spacer--sm);
@@ -5721,108 +5217,7 @@ ul) {
5721
5217
  line-height: 1;
5722
5218
  color: var(--pf-v6-c-list__item-icon--Color);
5723
5219
  }
5724
- .pfext-quick-start__base :where(:root, .pf-v6-c-login) {
5725
- --pf-v6-c-login--PaddingBlockStart: var(--pf-t--global--spacer--lg);
5726
- --pf-v6-c-login--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
5727
- --pf-v6-c-login__container--xl--GridColumnGap: var(--pf-t--global--spacer--3xl);
5728
- --pf-v6-c-login__container--MaxWidth: 31.25rem;
5729
- --pf-v6-c-login__container--xl--MaxWidth: none;
5730
- --pf-v6-c-login__container--PaddingInlineStart: 6.125rem;
5731
- --pf-v6-c-login__container--PaddingInlineEnd: 6.125rem;
5732
- --pf-v6-c-login__container--xl--GridTemplateColumns: 34rem minmax(auto, 34rem);
5733
- --pf-v6-c-login__header--MarginBlockEnd: var(--pf-t--global--spacer--md);
5734
- --pf-v6-c-login__header--PaddingInlineStart: var(--pf-t--global--spacer--md);
5735
- --pf-v6-c-login__header--PaddingInlineEnd: var(--pf-t--global--spacer--md);
5736
- --pf-v6-c-login__header--xl--MarginBlockEnd: var(--pf-t--global--spacer--2xl);
5737
- --pf-v6-c-login__header--xl--MarginBlockStart: var(--pf-t--global--spacer--3xl);
5738
- --pf-v6-c-login__header--c-brand--MarginBlockEnd: var(--pf-t--global--spacer--lg);
5739
- --pf-v6-c-login__header--c-brand--xl--MarginBlockEnd: var(--pf-t--global--spacer--2xl);
5740
- --pf-v6-c-login__main--BackgroundColor: var(--pf-t--global--background--color--primary--default);
5741
- --pf-v6-c-login__main--MarginBlockEnd: var(--pf-t--global--spacer--lg);
5742
- --pf-v6-c-login__main--BorderRadius: var(--pf-t--global--border--radius--large);
5743
- --pf-v6-c-login__main-header--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
5744
- --pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
5745
- --pf-v6-c-login__main-header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
5746
- --pf-v6-c-login__main-header--PaddingInlineStart: var(--pf-t--global--spacer--xl);
5747
- --pf-v6-c-login__main-header--md--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
5748
- --pf-v6-c-login__main-header--md--PaddingInlineStart: var(--pf-t--global--spacer--2xl);
5749
- --pf-v6-c-login__main-header--ColumnGap: var(--pf-t--global--spacer--md);
5750
- --pf-v6-c-login__main-header--RowGap: var(--pf-t--global--spacer--md);
5751
- --pf-v6-c-login__main-header-desc--MarginBlockEnd: var(--pf-t--global--spacer--sm);
5752
- --pf-v6-c-login__main-header-desc--md--MarginBlockEnd: 0;
5753
- --pf-v6-c-login__main-header-desc--FontSize: var(--pf-t--global--font--size--body--default);
5754
- --pf-v6-c-login__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
5755
- --pf-v6-c-login__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
5756
- --pf-v6-c-login__main-body--PaddingInlineStart: var(--pf-t--global--spacer--xl);
5757
- --pf-v6-c-login__main-body--md--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
5758
- --pf-v6-c-login__main-body--md--PaddingInlineStart: var(--pf-t--global--spacer--2xl);
5759
- --pf-v6-c-login__main-footer--PaddingBlockEnd: var(--pf-t--global--spacer--3xl);
5760
- --pf-v6-c-login__main-footer--c-title--MarginBlockEnd: var(--pf-t--global--spacer--md);
5761
- --pf-v6-c-login__main-footer-links--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5762
- --pf-v6-c-login__main-footer-links--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
5763
- --pf-v6-c-login__main-footer-links--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
5764
- --pf-v6-c-login__main-footer-links--PaddingInlineStart: var(--pf-t--global--spacer--3xl);
5765
- --pf-v6-c-login__main-footer-links--Gap: var(--pf-t--global--spacer--md);
5766
- --pf-v6-c-login__main-footer-links-item--c-button--FontSize: var(--pf-t--global--icon--size--xl);
5767
- --pf-v6-c-login__main-footer-band--PaddingBlockStart: var(--pf-t--global--spacer--lg);
5768
- --pf-v6-c-login__main-footer-band--PaddingInlineEnd: var(--pf-t--global--spacer--md);
5769
- --pf-v6-c-login__main-footer-band--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
5770
- --pf-v6-c-login__main-footer-band--PaddingInlineStart: var(--pf-t--global--spacer--md);
5771
- --pf-v6-c-login__main-footer-band--BorderBlockStartColor: var(--pf-t--global--border--color--default);
5772
- --pf-v6-c-login__main-footer-band--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
5773
- --pf-v6-c-login__main-footer-band-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
5774
- --pf-v6-c-login__footer--PaddingInlineStart: var(--pf-t--global--spacer--md);
5775
- --pf-v6-c-login__footer--PaddingInlineEnd: var(--pf-t--global--spacer--md);
5776
- --pf-v6-c-login__footer--c-list--PaddingBlockStart: var(--pf-t--global--spacer--md);
5777
- --pf-v6-c-login__footer--c-list--xl--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
5778
- }
5779
- @media (min-width: 75rem) {
5780
- .pfext-quick-start__base :where(:root, .pf-v6-c-login) {
5781
- --pf-v6-c-login__container--MaxWidth: var(--pf-v6-c-login__container--xl--MaxWidth);
5782
- }
5783
- }
5784
- @media (min-width: 36rem) {
5785
- .pfext-quick-start__base :where(:root, .pf-v6-c-login) {
5786
- --pf-v6-c-login__header--PaddingInlineEnd: 0;
5787
- --pf-v6-c-login__header--PaddingInlineStart: 0;
5788
- }
5789
- }
5790
- @media (min-width: 75rem) {
5791
- .pfext-quick-start__base :where(:root, .pf-v6-c-login) {
5792
- --pf-v6-c-login__header--MarginBlockEnd: var(--pf-v6-c-login__header--xl--MarginBlockEnd);
5793
- --pf-v6-c-login__header--c-brand--MarginBlockEnd: var(--pf-v6-c-login__header--c-brand--xl--MarginBlockEnd);
5794
- }
5795
- }
5796
- @media (min-width: 75rem) {
5797
- .pfext-quick-start__base :where(:root, .pf-v6-c-login) {
5798
- --pf-v6-c-login__main--MarginBlockEnd: 0;
5799
- }
5800
- }
5801
- @media (min-width: 48rem) {
5802
- .pfext-quick-start__base :where(:root, .pf-v6-c-login) {
5803
- --pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-v6-c-login__main-header--md--PaddingInlineEnd);
5804
- --pf-v6-c-login__main-header--PaddingInlineStart: var(--pf-v6-c-login__main-header--md--PaddingInlineStart);
5805
- --pf-v6-c-login__main-header-desc--MarginBlockEnd: var(--pf-v6-c-login__main-header-desc--md--MarginBlockEnd);
5806
- }
5807
- }
5808
- @media (min-width: 48rem) {
5809
- .pfext-quick-start__base :where(:root, .pf-v6-c-login) {
5810
- --pf-v6-c-login__main-body--PaddingInlineEnd: var(--pf-v6-c-login__main-body--md--PaddingInlineEnd);
5811
- --pf-v6-c-login__main-body--PaddingInlineStart: var(--pf-v6-c-login__main-body--md--PaddingInlineStart);
5812
- }
5813
- }
5814
- @media (min-width: 36rem) {
5815
- .pfext-quick-start__base :where(:root, .pf-v6-c-login) {
5816
- --pf-v6-c-login__footer--PaddingInlineEnd: 0;
5817
- --pf-v6-c-login__footer--PaddingInlineStart: 0;
5818
- }
5819
- }
5820
- @media (min-width: 75rem) {
5821
- .pfext-quick-start__base :where(:root, .pf-v6-c-login) {
5822
- --pf-v6-c-login__footer--c-list--PaddingBlockStart: var(--pf-v6-c-login__footer--c-list--xl--PaddingBlockStart);
5823
- }
5824
- }
5825
- .pfext-quick-start__base :where(:root, .pf-v6-c-masthead) {
5220
+ .pfext-quick-start__base .pf-v6-c-masthead {
5826
5221
  --pf-v6-c-masthead--RowGap: var(--pf-t--global--spacer--sm);
5827
5222
  --pf-v6-c-masthead--ColumnGap: var(--pf-t--global--spacer--gutter--default);
5828
5223
  --pf-v6-c-masthead--BorderWidth: var(--pf-t--global--border--width--divider--default);
@@ -6091,7 +5486,7 @@ ul) {
6091
5486
  padding-inline-start: var(--pf-t--global--spacer--2xl);
6092
5487
  padding-inline-end: var(--pf-t--global--spacer--2xl);
6093
5488
  }
6094
- .pfext-quick-start__base :where(:root, .pf-v6-c-menu) {
5489
+ .pfext-quick-start__base .pf-v6-c-menu {
6095
5490
  --pf-v6-c-menu--RowGap: var(--pf-t--global--spacer--sm);
6096
5491
  --pf-v6-c-menu--Width: auto;
6097
5492
  --pf-v6-c-menu--MinWidth: auto;
@@ -6177,13 +5572,13 @@ ul) {
6177
5572
  --pf-v6-c-menu--m-flyout__menu--InsetInlineStart: calc(100% + var(--pf-v6-c-menu--m-flyout__menu--left-offset));
6178
5573
  --pf-v6-c-menu--m-flyout__menu--m-top--InsetBlockEnd: calc(var(--pf-v6-c-menu__list--PaddingBlockStart) * -1);
6179
5574
  --pf-v6-c-menu--m-flyout__menu--m-left--InsetInlineEnd: calc(100% + var(--pf-v6-c-menu--m-flyout__menu--m-left--right-offset));
6180
- --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--transition--duration);
6181
- --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--transition--duration);
5575
+ --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--motion--duration--slide-in--default);
5576
+ --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
6182
5577
  --pf-v6-c-menu--m-drilldown__content--Transition: transform var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform), height var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--height);
6183
5578
  --pf-v6-c-menu--m-drilldown--c-menu--InsetBlockStart: 0;
6184
- --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--transition--duration);
5579
+ --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
6185
5580
  --pf-v6-c-menu--m-drilldown--c-menu--Transition: transform var(--pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform);
6186
- --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--transition--duration);
5581
+ --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
6187
5582
  --pf-v6-c-menu--m-drilldown__list--Transition: transform var(--pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform);
6188
5583
  --pf-v6-c-menu--m-drilled-in--c-menu__list-item--m-current-path--c-menu--ZIndex: var(--pf-t--global--z-index--xs);
6189
5584
  }
@@ -6644,8 +6039,8 @@ ul) {
6644
6039
  --pf-v6-c-menu-toggle--BorderColor: transparent;
6645
6040
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
6646
6041
  }
6647
- .pfext-quick-start__base :where(:root, .pf-v6-c-menu-toggle) {
6648
- --pf-v6-c-menu-toggle--ColumnGap: var(--pf-t--global--spacer--sm);
6042
+ .pfext-quick-start__base .pf-v6-c-menu-toggle {
6043
+ --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
6649
6044
  --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
6650
6045
  --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
6651
6046
  --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
@@ -6673,17 +6068,19 @@ ul) {
6673
6068
  --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
6674
6069
  --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
6675
6070
  --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
6071
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
6072
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
6073
+ --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
6676
6074
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
6677
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
6678
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
6679
- --pf-v6-c-menu-toggle--m-button--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
6680
- --pf-v6-c-menu-toggle--m-button--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
6681
- --pf-v6-c-menu-toggle--m-button--BorderRadius: var(--pf-t--global--border--radius--pill);
6682
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-button--PaddingInlineStart);
6683
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-button--PaddingInlineEnd);
6075
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
6076
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
6077
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
6078
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
6079
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
6080
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
6684
6081
  --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
6685
6082
  --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
6686
- --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-v6-c-menu-toggle--m-button--BorderRadius);
6083
+ --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
6687
6084
  --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
6688
6085
  --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
6689
6086
  --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
@@ -6694,11 +6091,11 @@ ul) {
6694
6091
  --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
6695
6092
  --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
6696
6093
  --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
6697
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-button--PaddingInlineStart);
6698
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-button--PaddingInlineEnd);
6094
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
6095
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
6699
6096
  --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
6700
6097
  --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
6701
- --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-v6-c-menu-toggle--m-button--BorderRadius);
6098
+ --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
6702
6099
  --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
6703
6100
  --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
6704
6101
  --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
@@ -6706,52 +6103,62 @@ ul) {
6706
6103
  --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
6707
6104
  --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
6708
6105
  --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
6709
- --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
6106
+ --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
6710
6107
  --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
6711
- --pf-v6-c-menu-toggle__controls--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) + var(--pf-t--global--spacer--sm) + var(--pf-t--global--spacer--sm));
6712
6108
  --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
6713
6109
  --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
6714
6110
  --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
6715
6111
  --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
6716
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
6717
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
6718
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderRadius: var(--pf-v6-c-menu-toggle--m-button--BorderRadius);
6719
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
6720
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
6721
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
6722
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
6723
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
6724
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
6112
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
6113
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
6114
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
6115
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
6116
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
6117
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
6118
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
6119
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
6120
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
6121
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
6122
+ --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
6725
6123
  --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
6124
+ --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
6726
6125
  --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
6727
6126
  --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
6728
6127
  --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
6729
6128
  --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));
6730
6129
  --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
6130
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
6131
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
6132
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
6133
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
6731
6134
  --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
6732
6135
  --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
6733
6136
  --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
6734
6137
  --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
6735
6138
  --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
6736
- --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--icon--color--disabled);
6139
+ --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
6140
+ --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
6141
+ --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
6737
6142
  --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
6738
6143
  --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
6739
6144
  --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
6740
6145
  --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
6741
6146
  --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
6742
6147
  --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
6743
- --pf-v6-c-menu-toggle__status-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
6148
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
6744
6149
  --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
6745
6150
  --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
6746
6151
  --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
6747
6152
  --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
6748
6153
  --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
6749
6154
  --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
6155
+ --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
6156
+ --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
6750
6157
  }
6751
6158
  .pfext-quick-start__base .pf-v6-c-menu-toggle {
6752
6159
  position: relative;
6753
6160
  display: inline-flex;
6754
- column-gap: var(--pf-v6-c-menu-toggle--ColumnGap);
6161
+ gap: var(--pf-v6-c-menu-toggle--Gap);
6755
6162
  align-items: center;
6756
6163
  justify-content: center;
6757
6164
  min-width: var(--pf-v6-c-menu-toggle--MinWidth);
@@ -6800,6 +6207,7 @@ ul) {
6800
6207
  --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
6801
6208
  --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
6802
6209
  --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
6210
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
6803
6211
  }
6804
6212
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-secondary {
6805
6213
  --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
@@ -6814,6 +6222,7 @@ ul) {
6814
6222
  --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
6815
6223
  --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
6816
6224
  --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
6225
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
6817
6226
  }
6818
6227
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-full-height {
6819
6228
  --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
@@ -6826,6 +6235,8 @@ ul) {
6826
6235
  width: 100%;
6827
6236
  }
6828
6237
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-plain {
6238
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
6239
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
6829
6240
  --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
6830
6241
  --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
6831
6242
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
@@ -6833,6 +6244,8 @@ ul) {
6833
6244
  --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
6834
6245
  --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
6835
6246
  --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
6247
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
6248
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
6836
6249
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
6837
6250
  }
6838
6251
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-plain::before {
@@ -6852,14 +6265,6 @@ ul) {
6852
6265
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
6853
6266
  --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
6854
6267
  }
6855
- .pfext-quick-start__base .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
6856
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
6857
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
6858
- }
6859
- .pfext-quick-start__base .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
6860
- .pfext-quick-start__base .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
6861
- pointer-events: none;
6862
- }
6863
6268
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-primary::before, .pfext-quick-start__base .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
6864
6269
  border: 0;
6865
6270
  }
@@ -6869,9 +6274,6 @@ ul) {
6869
6274
  --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
6870
6275
  --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
6871
6276
  }
6872
- .pfext-quick-start__base .pf-v6-c-menu-toggle:has(.pf-v6-c-button) {
6873
- background-color: transparent;
6874
- }
6875
6277
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-success {
6876
6278
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
6877
6279
  --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
@@ -6884,8 +6286,23 @@ ul) {
6884
6286
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
6885
6287
  --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
6886
6288
  }
6289
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-placeholder {
6290
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
6291
+ }
6292
+ .pfext-quick-start__base .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
6293
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
6294
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
6295
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
6296
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
6297
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
6298
+ }
6299
+ .pfext-quick-start__base .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
6300
+ .pfext-quick-start__base .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
6301
+ pointer-events: none;
6302
+ }
6887
6303
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button {
6888
- --pf-v6-c-menu-toggle--ColumnGap: 0;
6304
+ --pf-v6-c-menu-toggle--Gap: 0;
6305
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
6889
6306
  padding: 0;
6890
6307
  }
6891
6308
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button > * {
@@ -6904,7 +6321,6 @@ ul) {
6904
6321
  border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
6905
6322
  }
6906
6323
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
6907
- --pf-v6-c-menu-toggle--PaddingInlineEnd: 0;
6908
6324
  --pf-v6-c-check__label--Color: currentcolor;
6909
6325
  --pf-v6-c-check__label--disabled--Color: currentcolor;
6910
6326
  align-items: center;
@@ -6914,47 +6330,50 @@ ul) {
6914
6330
  --pf-v6-c-check__input--TranslateY: 0;
6915
6331
  align-self: center;
6916
6332
  }
6917
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-plain {
6918
- --pf-v6-c-menu-toggle--BorderColor: transparent;
6919
- }
6920
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action {
6921
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
6333
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
6334
+ 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);
6922
6335
  }
6923
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action > :not(:first-child) {
6924
- border-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartWidth) solid var(--pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor);
6336
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
6337
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
6925
6338
  }
6926
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action > :has(.pf-v6-c-menu-toggle__controls) {
6927
- padding-inline-end: 0;
6339
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
6340
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
6341
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
6928
6342
  }
6929
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary {
6930
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BorderInlineStartColor);
6343
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
6344
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
6345
+ --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);
6931
6346
  }
6932
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])) {
6933
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor);
6347
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
6348
+ --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);
6934
6349
  }
6935
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])):is(:hover, :focus) {
6936
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--hover--BackgroundColor);
6350
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
6351
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
6937
6352
  }
6938
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary.pf-m-expanded {
6939
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--expanded--child--BackgroundColor);
6353
+ .pfext-quick-start__base .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__toggle-icon:only-child)):first-child,
6354
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):first-child, .pfext-quick-start__base .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__toggle-icon:only-child)):first-child,
6355
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
6356
+ padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
6940
6357
  }
6941
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary {
6942
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderInlineStartColor);
6358
+ .pfext-quick-start__base .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__toggle-icon:only-child)):last-child,
6359
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):last-child, .pfext-quick-start__base .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__toggle-icon:only-child)):last-child,
6360
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
6361
+ padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
6943
6362
  }
6944
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action:is(.pf-m-disabled, :disabled) {
6945
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--child--disabled--BorderInlineStartColor);
6946
- }
6947
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action:is(.pf-m-disabled, :disabled)::before {
6948
- content: none;
6363
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
6364
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
6949
6365
  }
6950
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action > :is(.pf-m-disabled, :disabled) {
6951
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--child--disabled--BorderInlineStartColor);
6366
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
6367
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
6952
6368
  color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
6953
6369
  background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
6954
6370
  }
6371
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
6372
+ content: none;
6373
+ }
6955
6374
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-typeahead {
6956
6375
  --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
6957
- --pf-v6-c-menu-toggle--ColumnGap: 0;
6376
+ --pf-v6-c-menu-toggle--Gap: 0;
6958
6377
  align-items: stretch;
6959
6378
  padding: 0;
6960
6379
  }
@@ -6971,6 +6390,7 @@ ul) {
6971
6390
  flex: 1;
6972
6391
  }
6973
6392
  .pfext-quick-start__base .pf-v6-c-menu-toggle__button {
6393
+ gap: var(--pf-v6-c-menu-toggle__button--Gap);
6974
6394
  align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
6975
6395
  min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
6976
6396
  padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
@@ -6979,13 +6399,13 @@ ul) {
6979
6399
  background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
6980
6400
  border: 0;
6981
6401
  }
6982
- .pfext-quick-start__base .pf-v6-c-menu-toggle__button:has(.pf-v6-c-menu-toggle__controls) {
6983
- padding-inline-start: 0;
6984
- }
6985
6402
  .pfext-quick-start__base .pf-v6-c-menu-toggle__button.pf-m-text {
6986
6403
  display: inline-flex;
6987
6404
  align-items: baseline;
6988
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart);
6405
+ }
6406
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check.pf-m-standalone, .pfext-quick-start__base .pf-v6-c-menu-toggle__button:has(> .pf-v6-c-menu-toggle__controls:only-child) {
6407
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
6408
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
6989
6409
  }
6990
6410
  .pfext-quick-start__base .pf-v6-c-menu-toggle__text {
6991
6411
  overflow: hidden;
@@ -6997,7 +6417,6 @@ ul) {
6997
6417
  display: flex;
6998
6418
  flex-wrap: nowrap;
6999
6419
  }
7000
- .pfext-quick-start__base .pf-v6-c-menu-toggle__icon,
7001
6420
  .pfext-quick-start__base .pf-v6-c-menu-toggle__controls,
7002
6421
  .pfext-quick-start__base .pf-v6-c-menu-toggle__toggle-icon {
7003
6422
  display: flex;
@@ -7006,10 +6425,15 @@ ul) {
7006
6425
  }
7007
6426
  .pfext-quick-start__base .pf-v6-c-menu-toggle__icon {
7008
6427
  flex-shrink: 0;
7009
- min-height: var(--pf-v6-c-menu-toggle__icon--MinHeight);
6428
+ }
6429
+ .pfext-quick-start__base .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
6430
+ .pfext-quick-start__base .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
6431
+ .pfext-quick-start__base .pf-v6-c-menu-toggle__icon.pf-m-avatar svg {
6432
+ margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
6433
+ margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
7010
6434
  }
7011
6435
  .pfext-quick-start__base .pf-v6-c-menu-toggle__controls {
7012
- min-width: var(--pf-v6-c-menu-toggle__controls--MinWidth);
6436
+ gap: var(--pf-v6-c-menu-toggle__controls--Gap);
7013
6437
  margin-inline-start: auto;
7014
6438
  }
7015
6439
  .pfext-quick-start__base .pf-v6-c-menu-toggle__toggle-icon {
@@ -7017,10 +6441,9 @@ ul) {
7017
6441
  color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
7018
6442
  }
7019
6443
  .pfext-quick-start__base .pf-v6-c-menu-toggle__status-icon {
7020
- margin-inline-end: var(--pf-v6-c-menu-toggle__status-icon--MarginInlineEnd);
7021
6444
  color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
7022
6445
  }
7023
- .pfext-quick-start__base :where(:root, .pf-v6-c-modal-box) {
6446
+ .pfext-quick-start__base .pf-v6-c-modal-box {
7024
6447
  --pf-v6-c-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
7025
6448
  --pf-v6-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--large);
7026
6449
  --pf-v6-c-modal-box--BoxShadow: var(--pf-t--global--box-shadow--lg);
@@ -7047,6 +6470,7 @@ ul) {
7047
6470
  --pf-v6-c-modal-box__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
7048
6471
  --pf-v6-c-modal-box__header--Gap: var(--pf-t--global--spacer--md);
7049
6472
  --pf-v6-c-modal-box__header-main--Gap: var(--pf-t--global--spacer--md);
6473
+ --pf-v6-c-modal-box__header-main--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
7050
6474
  --pf-v6-c-modal-box__title--LineHeight: var(--pf-t--global--font--line-height--heading);
7051
6475
  --pf-v6-c-modal-box__title--FontFamily: var(--pf-t--global--font--family--heading);
7052
6476
  --pf-v6-c-modal-box__title--FontWeight: var(--pf-t--global--font--weight--heading--default);
@@ -7072,7 +6496,7 @@ ul) {
7072
6496
  --pf-v6-c-modal-box__footer--c-button--sm--MarginInlineEnd: calc(var(--pf-v6-c-modal-box__footer--c-button--MarginInlineEnd) / 2);
7073
6497
  }
7074
6498
  @media (min-width: 75rem) {
7075
- .pfext-quick-start__base :where(:root, .pf-v6-c-modal-box) {
6499
+ .pfext-quick-start__base .pf-v6-c-modal-box {
7076
6500
  --pf-v6-c-modal-box--m-align-top--spacer: var(--pf-v6-c-modal-box--m-align-top--xl--spacer);
7077
6501
  }
7078
6502
  }
@@ -7150,6 +6574,7 @@ ul) {
7150
6574
  flex-grow: 1;
7151
6575
  gap: var(--pf-v6-c-modal-box__header-main--Gap);
7152
6576
  min-width: 0;
6577
+ padding-block-start: var(--pf-v6-c-modal-box__header-main--PaddingBlockStart);
7153
6578
  }
7154
6579
  .pfext-quick-start__base .pf-v6-c-modal-box__title,
7155
6580
  .pfext-quick-start__base .pf-v6-c-modal-box__title-text {
@@ -7208,278 +6633,22 @@ ul) {
7208
6633
  --pf-v6-c-modal-box__footer--c-button--MarginInlineEnd: var(--pf-v6-c-modal-box__footer--c-button--sm--MarginInlineEnd);
7209
6634
  }
7210
6635
  }
7211
- .pfext-quick-start__base :where(:root, .pf-v6-c-multiple-file-upload) {
7212
- --pf-v6-c-multiple-file-upload--GridTemplateColumns: 1fr;
7213
- --pf-v6-c-multiple-file-upload--Gap: var(--pf-t--global--spacer--md);
7214
- --pf-v6-c-multiple-file-upload__main--TextAlign: center;
7215
- --pf-v6-c-multiple-file-upload__main--GridTemplateColumns: auto;
7216
- --pf-v6-c-multiple-file-upload__main--GridTemplateRows: auto;
7217
- --pf-v6-c-multiple-file-upload__main--GridTemplateAreas:
7218
- "title"
7219
- "upload"
7220
- "info";
7221
- --pf-v6-c-multiple-file-upload__main--PaddingBlockStart: var(--pf-t--global--spacer--xl);
7222
- --pf-v6-c-multiple-file-upload__main--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
7223
- --pf-v6-c-multiple-file-upload__main--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
7224
- --pf-v6-c-multiple-file-upload__main--PaddingInlineStart: var(--pf-t--global--spacer--xl);
7225
- --pf-v6-c-multiple-file-upload__main--BorderWidth: var(--pf-t--global--border--width--regular);
7226
- --pf-v6-c-multiple-file-upload__main--BorderStyle: dashed;
7227
- --pf-v6-c-multiple-file-upload__main--BorderColor: var(--pf-t--global--border--color--default);
7228
- --pf-v6-c-multiple-file-upload__main--BorderRadius: var(--pf-t--global--border--radius--medium);
7229
- --pf-v6-c-multiple-file-upload__title--Display: grid;
7230
- --pf-v6-c-multiple-file-upload__title--GridTemplateColumns: auto;
7231
- --pf-v6-c-multiple-file-upload__title--Gap: var(--pf-t--global--spacer--lg);
7232
- --pf-v6-c-multiple-file-upload__title-text--Color: var(--pf-t--global--text--color--regular);
7233
- --pf-v6-c-multiple-file-upload__title-text--FontFamily: var(--pf-t--global--font--family--heading);
7234
- --pf-v6-c-multiple-file-upload__title-text--FontSize: var(--pf-t--global--font--size--heading--sm);
7235
- --pf-v6-c-multiple-file-upload__title-text--FontWeight: var(--pf-t--global--font--weight--heading--default);
7236
- --pf-v6-c-multiple-file-upload__title-icon--Color: var(--pf-t--global--icon--color--regular);
7237
- --pf-v6-c-multiple-file-upload__title-icon--FontSize: var(--pf-t--global--icon--size--xl);
7238
- --pf-v6-c-multiple-file-upload__title-text-separator--Display: block;
7239
- --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart: var(--pf-t--global--spacer--sm);
7240
- --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockEnd: var(--pf-t--global--spacer--sm);
7241
- --pf-v6-c-multiple-file-upload__title-text-separator--Color: var(--pf-t--global--text--color--regular);
7242
- --pf-v6-c-multiple-file-upload__title-text-separator--FontFamily: var(--pf-t--global--font--family--body);
7243
- --pf-v6-c-multiple-file-upload__title-text-separator--FontSize: var(--pf-t--global--font--size--body--lg);
7244
- --pf-v6-c-multiple-file-upload__title-text-separator--FontWeight: var(--pf-t--global--font--weight--body--default);
7245
- --pf-v6-c-multiple-file-upload__info--FontSize: var(--pf-t--global--font--size--body--default);
7246
- --pf-v6-c-multiple-file-upload__info--Color: var(--pf-t--global--text--color--subtle);
7247
- --pf-v6-c-multiple-file-upload__info--MarginBlockStart: var(--pf-t--global--spacer--lg);
7248
- --pf-v6-c-multiple-file-upload--m-drag-over__main--BorderStyle: dashed;
7249
- --pf-v6-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-t--global--border--color--clicked);
7250
- --pf-v6-c-multiple-file-upload--m-horizontal--GridTemplateColumns: fit-content(100%);
7251
- --pf-v6-c-multiple-file-upload--m-horizontal__main--TextAlign: start;
7252
- --pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns: 1fr auto;
7253
- --pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas:
7254
- "title upload"
7255
- "info upload";
7256
- --pf-v6-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--lg);
7257
- --pf-v6-c-multiple-file-upload--m-horizontal__main--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
7258
- --pf-v6-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns: auto 1fr;
7259
- --pf-v6-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-t--global--spacer--sm);
7260
- --pf-v6-c-multiple-file-upload--m-horizontal__title-icon--FontSize: var(--pf-t--global--font--size--heading--xs);
7261
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
7262
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--Display: inline;
7263
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--MarginBlockStart: 0;
7264
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontFamily: var(--pf-t--global--font--family--heading);
7265
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontSize: var(--pf-t--global--font--size--heading--xs);
7266
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontWeight: var(--pf-t--global--font--weight--heading--default);
7267
- --pf-v6-c-multiple-file-upload--m-horizontal__info--MarginBlockStart: 0;
7268
- --pf-v6-c-multiple-file-upload__status--PaddingBlockStart: var(--pf-t--global--spacer--sm);
7269
- --pf-v6-c-multiple-file-upload__status--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
7270
- --pf-v6-c-multiple-file-upload__status--PaddingInlineStart: var(--pf-t--global--spacer--md);
7271
- --pf-v6-c-multiple-file-upload__status--PaddingInlineEnd: var(--pf-t--global--spacer--md);
7272
- --pf-v6-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
7273
- --pf-v6-c-multiple-file-upload__status-progress--Gap: var(--pf-t--global--spacer--sm);
7274
- --pf-v6-c-multiple-file-upload__status-progress-icon--Color: var(--pf-t--global--icon--color--brand--default);
7275
- --pf-v6-c-multiple-file-upload__status-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
7276
- --pf-v6-c-multiple-file-upload__status-item--PaddingBlockEnd: var(--pf-t--global--spacer--md);
7277
- --pf-v6-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
7278
- --pf-v6-c-multiple-file-upload__status-item--Gap: var(--pf-t--global--spacer--sm);
7279
- --pf-v6-c-multiple-file-upload__status-item--BorderWidth: var(--pf-t--global--border--width--regular);
7280
- --pf-v6-c-multiple-file-upload__status-item--BorderColor: var(--pf-t--global--border--color--default);
7281
- --pf-v6-c-multiple-file-upload__status-item-icon--Color: var(--pf-t--global--icon--color--regular);
7282
- --pf-v6-c-multiple-file-upload__status-item-progress--GridTemplateColumns: fit-content(100%) max-content;
7283
- --pf-v6-c-multiple-file-upload__status-item-progress--Gap: var(--pf-t--global--spacer--sm);
7284
- --pf-v6-c-multiple-file-upload__status-item-progress-text--Color: var(--pf-t--global--text--color--regular);
7285
- --pf-v6-c-multiple-file-upload__status-item-progress-size--Color: var(--pf-t--global--text--color--subtle);
7286
- }
7287
- .pfext-quick-start__base :where(:root, .pf-v6-c-nav) {
7288
- --pf-v6-c-nav__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
7289
- --pf-v6-c-nav__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
7290
- --pf-v6-c-nav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
7291
- --pf-v6-c-nav__link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
7292
- --pf-v6-c-nav__list--RowGap: var(--pf-t--global--spacer--sm);
7293
- --pf-v6-c-nav__list--ColumnGap: var(--pf-t--global--spacer--xs);
7294
- --pf-v6-c-nav--PaddingBlockStart: var(--pf-t--global--spacer--md);
7295
- --pf-v6-c-nav--PaddingBlockEnd: var(--pf-t--global--spacer--md);
7296
- --pf-v6-c-nav--PaddingInlineStart: 0;
7297
- --pf-v6-c-nav--PaddingInlineEnd: 0;
7298
- --pf-v6-c-nav--RowGap: var(--pf-t--global--spacer--lg);
7299
- --pf-v6-c-nav--ColumnGap: 0;
7300
- --pf-v6-c-nav--AlignItems: baseline;
7301
- --pf-v6-c-nav--FontSize: var(--pf-t--global--font--size--body--default);
7302
- --pf-v6-c-nav--FontWeight: var(--pf-t--global--font--weight--body--default);
7303
- --pf-v6-c-nav--LineHeight: var(--pf-t--global--font--line-height--body);
7304
- --pf-v6-c-nav--OutlineOffset: calc(var(--pf-t--global--spacer--xs) * -1);
7305
- --pf-v6-c-nav--BackgroundColor: transparent;
7306
- --pf-v6-c-nav__list--ScrollSnapTypeAxis: x;
7307
- --pf-v6-c-nav__list--ScrollSnapTypeStrictness: proximity;
7308
- --pf-v6-c-nav__list--ScrollSnapType: var(--pf-v6-c-nav__list--ScrollSnapTypeAxis) var(--pf-v6-c-nav__list--ScrollSnapTypeStrictness);
7309
- --pf-v6-c-nav__item--ScrollSnapAlign: end;
7310
- --pf-v6-c-nav__section-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
7311
- --pf-v6-c-nav__section-title--Color: var(--pf-t--global--text--color--regular);
7312
- --pf-v6-c-nav__section-title--PaddingBlockStart: var(--pf-v6-c-nav__link--PaddingBlockStart);
7313
- --pf-v6-c-nav__section-title--PaddingBlockEnd: var(--pf-v6-c-nav__link--PaddingBlockEnd);
7314
- --pf-v6-c-nav__section-title--PaddingInlineStart: var(--pf-v6-c-nav__link--PaddingInlineStart);
7315
- --pf-v6-c-nav__section-title--PaddingInlineEnd: var(--pf-v6-c-nav__link--PaddingInlineEnd);
7316
- --pf-v6-c-nav__item--RowGap: var(--pf-v6-c-nav__list--RowGap);
7317
- --pf-v6-c-nav__item__toggle-icon--Rotate: 0;
7318
- --pf-v6-c-nav__item--m-expanded__toggle-icon--Rotate: 90deg;
7319
- --pf-v6-c-nav__link--ColumnGap: var(--pf-t--global--spacer--sm);
7320
- --pf-v6-c-nav__link--AlignItems: baseline;
7321
- --pf-v6-c-nav__link--BorderRadius: var(--pf-t--global--border--radius--small);
7322
- --pf-v6-c-nav__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
7323
- --pf-v6-c-nav__link--WhiteSpace: normal;
7324
- --pf-v6-c-nav__link--Color: var(--pf-t--global--text--color--subtle);
7325
- --pf-v6-c-nav__link--hover--Color: var(--pf-t--global--text--color--regular);
7326
- --pf-v6-c-nav__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--hover);
7327
- --pf-v6-c-nav__link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--clicked);
7328
- --pf-v6-c-nav__link--m-current--Color: var(--pf-t--global--text--color--regular);
7329
- --pf-v6-c-nav__link-icon--Color: var(--pf-t--global--icon--color--subtle);
7330
- --pf-v6-c-nav__link--m-current__link-icon--Color: var(--pf-t--global--icon--color--regular);
7331
- --pf-v6-c-nav__subnav--RowGap: var(--pf-t--global--border--width--extra-strong);
7332
- --pf-v6-c-nav__subnav--PaddingInlineStart: var(--pf-t--global--spacer--md);
7333
- --pf-v6-c-nav__scroll-button--BorderColor: var(--pf-t--global--border--color--default);
7334
- --pf-v6-c-nav__scroll-button--BorderWidth: var(--pf-t--global--border--width--divider--default);
7335
- --pf-v6-c-nav__scroll-button--first-of-type--c-button--BorderStartStartRadius: var(--pf-t--global--border--radius--pill);
7336
- --pf-v6-c-nav__scroll-button--first-of-type--c-button--BorderEndStartRadius: var(--pf-t--global--border--radius--pill);
7337
- --pf-v6-c-nav__scroll-button--last-of-type--c-button--BorderStartEndRadius: var(--pf-t--global--border--radius--pill);
7338
- --pf-v6-c-nav__scroll-button--last-of-type--c-button--BorderEndEndRadius: var(--pf-t--global--border--radius--pill);
7339
- --pf-v6-c-nav__toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7340
- --pf-v6-c-nav__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7341
- --pf-v6-c-nav__toggle--TranslateY: calc((var(--pf-v6-c-nav--LineHeight) * var(--pf-v6-c-nav--FontSize) / 2) - 50%);
7342
- --pf-v6-c-nav--m-horizontal__list--PaddingBlockStart: 0;
7343
- --pf-v6-c-nav--m-horizontal__list--PaddingBlockEnd: 0;
7344
- --pf-v6-c-nav--m-horizontal__list--PaddingInlineStart: 0;
7345
- --pf-v6-c-nav--m-horizontal__list--PaddingInlineEnd: 0;
7346
- --pf-v6-c-nav--m-horizontal--m-scrollable__list--PaddingInlineStart: var(--pf-v6-c-nav__list--ColumnGap);
7347
- --pf-v6-c-nav--m-horizontal--m-scrollable__list--PaddingInlineEnd: var(--pf-v6-c-nav__list--ColumnGap);
7348
- --pf-v6-c-nav--m-horizontal--m-subnav--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7349
- --pf-v6-c-nav--m-horizontal--m-subnav--BorderRadius: var(--pf-t--global--border--radius--pill);
7350
- --pf-v6-c-nav--m-horizontal--m-subnav__list--PaddingBlockStart: var(--pf-t--global--spacer--xs);
7351
- --pf-v6-c-nav--m-horizontal--m-subnav__list--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
7352
- --pf-v6-c-nav--m-horizontal--m-subnav__list--PaddingInlineStart: var(--pf-t--global--spacer--md);
7353
- --pf-v6-c-nav--m-horizontal--m-subnav__list--PaddingInlineEnd: var(--pf-t--global--spacer--md);
7354
- --pf-v6-c-nav--m-horizontal--m-subnav--m-scrollable__list--PaddingInlineStart: var(--pf-v6-c-nav__list--ColumnGap);
7355
- --pf-v6-c-nav--m-horizontal--m-subnav--m-scrollable__list--PaddingInlineEnd: var(--pf-v6-c-nav__list--ColumnGap);
7356
- --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingBlockStart: var(--pf-t--global--spacer--xs);
7357
- --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
7358
- --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
7359
- --pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
7360
- }
7361
- .pfext-quick-start__base :where(:root, .pf-v6-c-notification-badge) {
7362
- --pf-v6-c-notification-badge--BackgroundColor: transparent;
7363
- --pf-v6-c-notification-badge--MinWidth: 40px;
7364
- --pf-v6-c-notification-badge--Gap: var(--pf-t--global--spacer--xs);
7365
- --pf-v6-c-notification-badge--PaddingBlockStart: var(--pf-t--global--spacer--sm);
7366
- --pf-v6-c-notification-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7367
- --pf-v6-c-notification-badge--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
7368
- --pf-v6-c-notification-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7369
- --pf-v6-c-notification-badge--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--sm));
7370
- --pf-v6-c-notification-badge--MarginInlineEnd: calc(-1 * var(--pf-t--global--spacer--sm));
7371
- --pf-v6-c-notification-badge--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--sm));
7372
- --pf-v6-c-notification-badge--MarginInlineStart: calc(-1 * var(--pf-t--global--spacer--sm));
7373
- --pf-v6-c-notification-badge--before--BorderColor: transparent;
7374
- --pf-v6-c-notification-badge--BorderRadius: var(--pf-t--global--border--radius--small);
7375
- --pf-v6-c-notification-badge--before--BorderWidth: var(--pf-t--global--border--width--control--default);
7376
- --pf-v6-c-notification-badge--m-read--Color: var(--pf-t--global--text--color--regular);
7377
- --pf-v6-c-notification-badge--m-read--before--BorderColor: var(--pf-t--global--border--color--default);
7378
- --pf-v6-c-notification-badge--m-read--hover--before--BorderColor: var(--pf-t--global--border--color--hover);
7379
- --pf-v6-c-notification-badge--m-read--m-expanded--before--BorderColor: var(--pf-t--global--border--color--clicked);
7380
- --pf-v6-c-notification-badge--m-read--BackgroundColor: var(--pf-t--global--background--color--control--default);
7381
- --pf-v6-c-notification-badge--m-read--m-expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
7382
- --pf-v6-c-notification-badge--m-read--m-expanded--before--BorderColor: var(--pf-t--global--border--color--clicked);
7383
- --pf-v6-c-notification-badge--m-unread--Color: var(--pf-t--global--icon--color--on-brand--default);
7384
- --pf-v6-c-notification-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
7385
- --pf-v6-c-notification-badge--m-unread--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
7386
- --pf-v6-c-notification-badge--m-unread--m-expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
7387
- --pf-v6-c-notification-badge--m-attention--Color: var(--pf-t--global--icon--color--status--on-danger--default);
7388
- --pf-v6-c-notification-badge--m-attention--BackgroundColor: var(--pf-t--global--color--status--danger--default);
7389
- --pf-v6-c-notification-badge--m-attention--hover--BackgroundColor: var(--pf-t--global--color--status--danger--hover);
7390
- --pf-v6-c-notification-badge--m-attention--m-expanded--BackgroundColor: var(--pf-t--global--color--status--danger--clicked);
7391
- }
7392
- .pfext-quick-start__base :where(:root, .pf-v6-c-notification-drawer) {
7393
- --pf-v6-c-notification-drawer--BackgroundColor: var(--pf-t--global--background--color--floating--default);
7394
- --pf-v6-c-notification-drawer__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
7395
- --pf-v6-c-notification-drawer__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
7396
- --pf-v6-c-notification-drawer__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
7397
- --pf-v6-c-notification-drawer__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
7398
- --pf-v6-c-notification-drawer__header--BackgroundColor: var(--pf-t--global--background--color--floating--default);
7399
- --pf-v6-c-notification-drawer__header--ZIndex: var(--pf-t--global--z-index--sm);
7400
- --pf-v6-c-notification-drawer__header-title--FontSize: var(--pf-t--global--font--size--heading--md);
7401
- --pf-v6-c-notification-drawer__header-title--FontWeight: var(--pf-t--global--font--weight--heading--default);
7402
- --pf-v6-c-notification-drawer__header-title--LineHeight: var(--pf-t--global--font--line-height--heading);
7403
- --pf-v6-c-notification-drawer__header-title--FontFamily: var(--pf-t--global--font--family--heading);
7404
- --pf-v6-c-notification-drawer__header-status--MarginInlineStart: var(--pf-t--global--spacer--md);
7405
- --pf-v6-c-notification-drawer__header-status--FontWeight: var(--pf-t--global--font--weight--body--bold);
7406
- --pf-v6-c-notification-drawer__header-status--FontSize: var(--pf-t--global--font--size--body--default);
7407
- --pf-v6-c-notification-drawer__header-status--Color: var(--pf-t--global--text--color--subtle);
7408
- --pf-v6-c-notification-drawer__body--ZIndex: var(--pf-t--global--z-index--xs);
7409
- --pf-v6-c-notification-drawer__body--PaddingBlockStart: 0;
7410
- --pf-v6-c-notification-drawer__body--PaddingBlockEnd: var(--pf-t--global--spacer--md);
7411
- --pf-v6-c-notification-drawer__list--Gap: var(--pf-t--global--spacer--sm);
7412
- --pf-v6-c-notification-drawer__list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
7413
- --pf-v6-c-notification-drawer__list--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
7414
- --pf-v6-c-notification-drawer__list-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
7415
- --pf-v6-c-notification-drawer__list-item--PaddingInlineEnd: var(--pf-t--global--spacer--md);
7416
- --pf-v6-c-notification-drawer__list-item--PaddingBlockEnd: var(--pf-t--global--spacer--md);
7417
- --pf-v6-c-notification-drawer__list-item--PaddingInlineStart: var(--pf-t--global--spacer--md);
7418
- --pf-v6-c-notification-drawer__list-item--BackgroundColor: var(--pf-t--global--background--color--primary--default);
7419
- --pf-v6-c-notification-drawer__list-item--BorderWidth: var(--pf-t--global--border--width--box--status--default);
7420
- --pf-v6-c-notification-drawer__list-item--BorderRadius: var(--pf-t--global--border--radius--medium);
7421
- --pf-v6-c-notification-drawer__list-item--m-info__list-item-header-icon--Color: var(--pf-t--global--icon--color--status--info--default);
7422
- --pf-v6-c-notification-drawer__list-item--m-info__list-item--BorderColor: var(--pf-t--global--border--color--status--info--default);
7423
- --pf-v6-c-notification-drawer__list-item--m-warning__list-item-header-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
7424
- --pf-v6-c-notification-drawer__list-item--m-warning__list-item--BorderColor: var(--pf-t--global--border--color--status--warning--default);
7425
- --pf-v6-c-notification-drawer__list-item--m-danger__list-item-header-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
7426
- --pf-v6-c-notification-drawer__list-item--m-danger__list-item--BorderColor: var(--pf-t--global--border--color--status--danger--default);
7427
- --pf-v6-c-notification-drawer__list-item--m-success__list-item-header-icon--Color: var(--pf-t--global--icon--color--status--success--default);
7428
- --pf-v6-c-notification-drawer__list-item--m-success__list-item--BorderColor: var(--pf-t--global--border--color--status--success--default);
7429
- --pf-v6-c-notification-drawer__list-item--m-custom__list-item-header-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
7430
- --pf-v6-c-notification-drawer__list-item--m-custom__list-item--BorderColor: var(--pf-t--global--border--color--status--custom--default);
7431
- --pf-v6-c-notification-drawer__list-item--m-read--BackgroundColor: var(--pf-t--global--background--color--primary--default);
7432
- --pf-v6-c-notification-drawer__list-item--m-read--BorderWidth: var(--pf-t--global--border--width--box--status--read);
7433
- --pf-v6-c-notification-drawer__list-item--m-read--BorderColor: var(--pf-t--global--border--color--default);
7434
- --pf-v6-c-notification-drawer__list-item--m-hoverable--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
7435
- --pf-v6-c-notification-drawer__list-item-header--MarginBlockEnd: var(--pf-t--global--spacer--xs);
7436
- --pf-v6-c-notification-drawer__list-item-header-icon--Color: inherit;
7437
- --pf-v6-c-notification-drawer__list-item-header-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
7438
- --pf-v6-c-notification-drawer__list-item-header-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
7439
- --pf-v6-c-notification-drawer__list-item-header-title--max-lines: 1;
7440
- --pf-v6-c-notification-drawer__list-item-action--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
7441
- --pf-v6-c-notification-drawer__list-item-description--MarginBlockEnd: var(--pf-t--global--spacer--sm);
7442
- --pf-v6-c-notification-drawer__list-item-timestamp--Color: var(--pf-t--global--text--color--subtle);
7443
- --pf-v6-c-notification-drawer__list-item-timestamp--FontSize: var(--pf-t--global--font--size--body--default);
7444
- --pf-v6-c-notification-drawer__group--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
7445
- --pf-v6-c-notification-drawer__group--m-expanded--group--BorderBlockEndColor: var(--pf-t--global--border--color--default);
7446
- --pf-v6-c-notification-drawer__group--m-expanded--MinHeight: 0;
7447
- --pf-v6-c-notification-drawer__group--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--md);
7448
- --pf-v6-c-notification-drawer__group-toggle--PaddingBlockStart: var(--pf-t--global--spacer--md);
7449
- --pf-v6-c-notification-drawer__group-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
7450
- --pf-v6-c-notification-drawer__group-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--md);
7451
- --pf-v6-c-notification-drawer__group-toggle--PaddingInlineStart: var(--pf-t--global--spacer--lg);
7452
- --pf-v6-c-notification-drawer__group-toggle--BackgroundColor: var(--pf-t--global--background--color--floating--default);
7453
- --pf-v6-c-notification-drawer__group-toggle--OutlineOffset: -0.25rem;
7454
- --pf-v6-c-notification-drawer__group-toggle-title--MarginInlineEnd: var(--pf-t--global--spacer--md);
7455
- --pf-v6-c-notification-drawer__group-toggle-title--FontSize: var(--pf-t--global--font--size--body--lg);
7456
- --pf-v6-c-notification-drawer__group-toggle-title--max-lines: 1;
7457
- --pf-v6-c-notification-drawer__group-toggle-count--MarginInlineEnd: var(--pf-t--global--spacer--md);
7458
- --pf-v6-c-notification-drawer__group-toggle-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
7459
- --pf-v6-c-notification-drawer__group-toggle-icon--Color: var(--pf-t--global--icon--color--regular);
7460
- --pf-v6-c-notification-drawer__group-toggle-icon--Transition: .2s ease-in 0s;
7461
- --pf-v6-c-notification-drawer__group--m-expanded__group-toggle-icon--Rotate: 90deg;
7462
- }
7463
- .pfext-quick-start__base :where(:root, .pf-v6-c-overflow-menu) {
7464
- --pf-v6-c-overflow-menu--ColumnGap: var(--pf-t--global--spacer--md);
7465
- --pf-v6-c-overflow-menu__group--ColumnGap: var(--pf-t--global--spacer--md);
7466
- --pf-v6-c-overflow-menu__group--m-button-group--ColumnGap: var(--pf-t--global--spacer--sm);
7467
- --pf-v6-c-overflow-menu__group--m-icon-button-group--ColumnGap: var(--pf-t--global--spacer--xs);
7468
- }
7469
- .pfext-quick-start__base :where(:root, .pf-v6-c-page) {
6636
+ .pfext-quick-start__base .pf-v6-c-page {
7470
6637
  --pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7471
6638
  --pf-v6-c-page--inset: var(--pf-t--global--spacer--inset--page-chrome);
7472
6639
  --pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
7473
6640
  --pf-v6-c-page__sidebar--ZIndex: var(--pf-t--global--z-index--sm);
7474
6641
  --pf-v6-c-page__sidebar--Width: 18.125rem;
6642
+ --pf-v6-c-page__sidebar--xl--Width: auto;
7475
6643
  --pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7476
6644
  --pf-v6-c-page__sidebar--BoxShadow: none;
7477
- --pf-v6-c-page__sidebar--Transition: var(--pf-t--global--transition);
6645
+ --pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
6646
+ --pf-v6-c-page__sidebar--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
7478
6647
  --pf-v6-c-page__sidebar--TranslateX: -100%;
7479
6648
  --pf-v6-c-page__sidebar--TranslateZ: 0;
7480
6649
  --pf-v6-c-page__sidebar--m-expanded--TranslateX: 0;
7481
6650
  --pf-v6-c-page__sidebar--xl--TranslateX: 0;
7482
- --pf-v6-c-page__sidebar--MarginInlineEnd: 0;
6651
+ --pf-v6-c-page__sidebar--MarginInlineEnd: calc(var(--pf-t--global--spacer--inset--page-chrome) / 2);
7483
6652
  --pf-v6-c-page__sidebar--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
7484
6653
  --pf-v6-c-page__sidebar--PaddingInlineStart: 0;
7485
6654
  --pf-v6-c-page__sidebar--PaddingInlineEnd: 0;
@@ -7492,7 +6661,7 @@ ul) {
7492
6661
  --pf-v6-c-page__sidebar-title--LineHeight: var(--pf-t--global--font--line-height--heading);
7493
6662
  --pf-v6-c-page__sidebar-title--FontFamily: var(--pf-t--global--font--family--heading);
7494
6663
  --pf-v6-c-page__sidebar-title--FontWeight: var(--pf-t--global--font--weight--heading--default);
7495
- --pf-v6-c-page__sidebar-body--PaddingInlineEnd: var(--pf-t--global--spacer--inset--page-chrome);
6664
+ --pf-v6-c-page__sidebar-body--PaddingInlineEnd: calc(var(--pf-t--global--spacer--inset--page-chrome) / 2);
7496
6665
  --pf-v6-c-page__sidebar-body--PaddingInlineStart: var(--pf-t--global--spacer--inset--page-chrome);
7497
6666
  --pf-v6-c-page__sidebar-body--m-page-insets--PaddingInlineEnd: var(--pf-v6-c-page--inset);
7498
6667
  --pf-v6-c-page__sidebar-body--m-page-insets--PaddingInlineStart: var(--pf-v6-c-page--inset);
@@ -7505,8 +6674,8 @@ ul) {
7505
6674
  --pf-v6-c-page__main-container--BackgroundColor: var(--pf-t--global--background--color--primary--default);
7506
6675
  --pf-v6-c-page__main-container--MarginInlineStart: var(--pf-v6-c-page--inset);
7507
6676
  --pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page--inset);
7508
- --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--large);
7509
- --pf-v6-c-page__main-container--BorderWidth: var(--pf-t--global--spacer--sm);
6677
+ --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--medium);
6678
+ --pf-v6-c-page__main-container--BorderWidth: 0.25rem;
7510
6679
  --pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
7511
6680
  --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
7512
6681
  --pf-v6-c-page__main-section--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -7546,7 +6715,7 @@ ul) {
7546
6715
  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
7547
6716
  }
7548
6717
  @media screen and (min-width: 75rem) {
7549
- .pfext-quick-start__base :where(:root, .pf-v6-c-page) {
6718
+ .pfext-quick-start__base .pf-v6-c-page {
7550
6719
  --pf-v6-c-page__sidebar--TranslateX: var(--pf-v6-c-page__sidebar--xl--TranslateX);
7551
6720
  }
7552
6721
  }
@@ -7562,6 +6731,7 @@ ul) {
7562
6731
  }
7563
6732
  @media (min-width: 75rem) {
7564
6733
  .pfext-quick-start__base .pf-v6-c-page {
6734
+ --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--xl--Width);
7565
6735
  grid-template-areas: "header header" "sidebar main";
7566
6736
  grid-template-columns: var(--pf-v6-c-page__sidebar--Width) 1fr;
7567
6737
  }
@@ -7592,7 +6762,7 @@ ul) {
7592
6762
  overflow-y: auto;
7593
6763
  -webkit-overflow-scrolling: touch;
7594
6764
  background-color: var(--pf-v6-c-page__sidebar--BackgroundColor);
7595
- transition: var(--pf-v6-c-page__sidebar--Transition);
6765
+ transition: transform var(--pf-v6-c-page__sidebar--TransitionDuration) var(--pf-v6-c-page__sidebar--TransitionTimingFunction);
7596
6766
  transform: translateX(var(--pf-v6-c-page__sidebar--TranslateX)) translateZ(var(--pf-v6-c-page__sidebar--TranslateZ));
7597
6767
  }
7598
6768
  .pfext-quick-start__base :where(.pf-v6-m-dir-rtl, [dir="rtl"]) .pf-v6-c-page__sidebar {
@@ -7892,6 +7062,9 @@ ul) {
7892
7062
  flex-direction: column;
7893
7063
  flex-grow: 1;
7894
7064
  }
7065
+ .pfext-quick-start__base .pf-v6-c-page__main {
7066
+ overflow: auto;
7067
+ }
7895
7068
  .pfext-quick-start__base .pf-v6-c-page__main-subnav {
7896
7069
  padding-block-start: var(--pf-v6-c-page__main-subnav--PaddingBlockStart);
7897
7070
  padding-block-end: var(--pf-v6-c-page__main-subnav--PaddingBlockEnd);
@@ -8047,13 +7220,13 @@ ul) {
8047
7220
  .pfext-quick-start__base .pf-v6-c-page__main-group {
8048
7221
  flex-shrink: 0;
8049
7222
  }
8050
- .pfext-quick-start__base .pf-v6-c-page__drawer {
8051
- grid-area: main;
7223
+ .pfext-quick-start__base .pf-v6-c-page__drawer .pf-v6-c-page__main-container {
7224
+ align-self: revert;
8052
7225
  }
8053
- .pfext-quick-start__base .pf-v6-c-page__drawer > .pf-v6-c-drawer {
8054
- flex: 1 0 auto;
7226
+ .pfext-quick-start__base .pf-v6-c-page__drawer .pf-v6-c-page__main-container.pf-m-fill {
7227
+ flex-grow: 1;
8055
7228
  }
8056
- .pfext-quick-start__base :where(:root, .pf-v6-c-pagination) {
7229
+ .pfext-quick-start__base .pf-v6-c-pagination {
8057
7230
  --pf-v6-c-pagination--inset: 0;
8058
7231
  --pf-v6-c-pagination--ColumnGap: var(--pf-t--global--spacer--lg);
8059
7232
  --pf-v6-c-pagination--m-page-insets--inset: var(--pf-t--global--spacer--lg);
@@ -8063,7 +7236,7 @@ ul) {
8063
7236
  --pf-v6-c-pagination__nav--ColumnGap: var(--pf-t--global--spacer--sm);
8064
7237
  --pf-v6-c-pagination__nav-page-select--FontSize: var(--pf-t--global--font--size--body--default);
8065
7238
  --pf-v6-c-pagination__nav-page-select--ColumnGap: var(--pf-t--global--spacer--sm);
8066
- --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc((var(--pf-v6-c-form-control--PaddingInlineEnd) + var(--pf-v6-c-form-control--PaddingInlineStart)) + (var(--pf-v6-c-form-control--before--BorderWidth) * 2));
7239
+ --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--border--width--control--default) * 2);
8067
7240
  --pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;
8068
7241
  --pf-v6-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
8069
7242
  --pf-v6-c-pagination__total-items--Display: block;
@@ -8072,17 +7245,23 @@ ul) {
8072
7245
  --pf-v6-c-pagination--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8073
7246
  --pf-v6-c-pagination--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
8074
7247
  --pf-v6-c-pagination--m-sticky--PaddingBlockStart: var(--pf-t--global--spacer--md);
8075
- --pf-v6-c-pagination--m-sticky--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
8076
7248
  --pf-v6-c-pagination--m-sticky--PaddingBlockEnd: var(--pf-t--global--spacer--md);
8077
7249
  --pf-v6-c-pagination--m-sticky--PaddingInlineStart: var(--pf-t--global--spacer--lg);
8078
- --pf-v6-c-pagination--m-sticky--ZIndex: 100;
7250
+ --pf-v6-c-pagination--m-sticky--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
7251
+ --pf-v6-c-pagination--m-sticky--ZIndex: var(--pf-t--global--z-index--xs);
8079
7252
  --pf-v6-c-pagination--m-sticky--InsetBlockStart: 0;
8080
7253
  --pf-v6-c-pagination--m-bottom--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8081
7254
  --pf-v6-c-pagination--m-bottom--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
8082
- --pf-v6-c-pagination--m-bottom--InsetBlockEnd: 0;
8083
- --pf-v6-c-pagination--m-bottom--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
8084
- --pf-v6-c-pagination--m-bottom--PaddingInlineStart: var(--pf-t--global--spacer--lg);
8085
7255
  --pf-v6-c-pagination--m-bottom--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
7256
+ --pf-v6-c-pagination--m-bottom--InsetBlockEnd: 0;
7257
+ --pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockStart: var(--pf-t--global--spacer--sm);
7258
+ --pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
7259
+ --pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7260
+ --pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7261
+ --pf-v6-c-pagination--m-bottom--m-static--PaddingBlockStart: var(--pf-t--global--spacer--gap--group--vertical);
7262
+ --pf-v6-c-pagination--m-bottom--m-static--PaddingBlockEnd: 0;
7263
+ --pf-v6-c-pagination--m-bottom--m-static--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7264
+ --pf-v6-c-pagination--m-bottom--m-static--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8086
7265
  --pf-v6-c-pagination__page-menu--Display--base: block;
8087
7266
  --pf-v6-c-pagination__page-menu--Display: none;
8088
7267
  --pf-v6-c-pagination--m-display-summary__page-menu--Display: none;
@@ -8091,7 +7270,7 @@ ul) {
8091
7270
  --pf-v6-c-pagination__page-menu--md--Display: var(--pf-v6-c-pagination__page-menu--Display--base);
8092
7271
  }
8093
7272
  @media screen and (min-width: 48rem) {
8094
- .pfext-quick-start__base :where(:root, .pf-v6-c-pagination) {
7273
+ .pfext-quick-start__base .pf-v6-c-pagination {
8095
7274
  --pf-v6-c-pagination--m-bottom--BoxShadow: none;
8096
7275
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination__page-menu--md--Display);
8097
7276
  --pf-v6-c-pagination__nav--Display: inline-flex;
@@ -8099,7 +7278,7 @@ ul) {
8099
7278
  }
8100
7279
  }
8101
7280
  @media screen and (min-width: 75rem) {
8102
- .pfext-quick-start__base :where(:root, .pf-v6-c-pagination) {
7281
+ .pfext-quick-start__base .pf-v6-c-pagination {
8103
7282
  --pf-v6-c-pagination__scroll-button--Width: var(--pf-v6-c-pagination__scroll-button--xl--Width);
8104
7283
  }
8105
7284
  }
@@ -8118,17 +7297,13 @@ ul) {
8118
7297
  position: sticky;
8119
7298
  inset-block-end: var(--pf-v6-c-pagination--m-bottom--InsetBlockEnd);
8120
7299
  justify-content: center;
8121
- padding-inline-start: var(--pf-v6-c-pagination--m-bottom--PaddingInlineStart);
8122
- padding-inline-end: var(--pf-v6-c-pagination--m-bottom--PaddingInlineEnd);
7300
+ padding-block-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockStart);
7301
+ padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockEnd);
7302
+ padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineStart);
7303
+ padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineEnd);
8123
7304
  background-color: var(--pf-v6-c-pagination--m-bottom--BackgroundColor);
8124
7305
  box-shadow: var(--pf-v6-c-pagination--m-bottom--BoxShadow);
8125
7306
  }
8126
- .pfext-quick-start__base .pf-v6-c-pagination.pf-m-bottom.pf-m-static {
8127
- --pf-v6-c-pagination--m-bottom--MarginBlockStart: 0;
8128
- --pf-v6-c-pagination--m-bottom--BorderBlockStartWidth: 0;
8129
- position: relative;
8130
- box-shadow: none;
8131
- }
8132
7307
  @media screen and (min-width: 48rem) {
8133
7308
  .pfext-quick-start__base .pf-v6-c-pagination.pf-m-bottom {
8134
7309
  --pf-v6-c-pagination--m-bottom--BorderBlockStartWidth: 0;
@@ -8136,17 +7311,29 @@ ul) {
8136
7311
  --pf-v6-c-pagination--m-bottom--InsetBlockEnd: auto;
8137
7312
  position: relative;
8138
7313
  justify-content: flex-end;
7314
+ padding-block-start: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingBlockStart);
7315
+ padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingBlockEnd);
7316
+ padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineStart);
7317
+ padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineEnd);
8139
7318
  }
8140
7319
  }
7320
+ .pfext-quick-start__base .pf-v6-c-pagination.pf-m-static {
7321
+ position: relative;
7322
+ padding-block-start: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingBlockStart);
7323
+ padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingBlockEnd);
7324
+ padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineStart);
7325
+ padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineEnd);
7326
+ box-shadow: none;
7327
+ }
8141
7328
  .pfext-quick-start__base .pf-v6-c-pagination.pf-m-sticky {
8142
7329
  --pf-v6-c-pagination--m-bottom--InsetBlockEnd: 0;
8143
7330
  position: sticky;
8144
7331
  inset-block-start: var(--pf-v6-c-pagination--m-sticky--InsetBlockStart);
8145
7332
  z-index: var(--pf-v6-c-pagination--m-sticky--ZIndex);
8146
- padding-block-start: var(--pf-v6-c-pagination--m-sticky--PaddingBlockStart);
8147
- padding-block-end: var(--pf-v6-c-pagination--m-sticky--PaddingBlockEnd);
8148
- padding-inline-start: var(--pf-v6-c-pagination--m-sticky--PaddingInlineStart);
8149
- padding-inline-end: var(--pf-v6-c-pagination--m-sticky--PaddingInlineEnd);
7333
+ padding-block-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockStart);
7334
+ padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockEnd);
7335
+ padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineStart);
7336
+ padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineEnd);
8150
7337
  background-color: var(--pf-v6-c-pagination--m-sticky--BackgroundColor);
8151
7338
  box-shadow: var(--pf-v6-c-pagination--m-sticky--BoxShadow);
8152
7339
  }
@@ -8271,7 +7458,7 @@ ul) {
8271
7458
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--2xl);
8272
7459
  }
8273
7460
  }
8274
- .pfext-quick-start__base :where(:root, .pf-v6-c-panel) {
7461
+ .pfext-quick-start__base .pf-v6-c-panel {
8275
7462
  --pf-v6-c-panel--Width: auto;
8276
7463
  --pf-v6-c-panel--MinWidth: auto;
8277
7464
  --pf-v6-c-panel--MaxWidth: none;
@@ -8362,7 +7549,7 @@ ul) {
8362
7549
  padding-inline-end: var(--pf-v6-c-panel__footer--PaddingInlineEnd);
8363
7550
  box-shadow: var(--pf-v6-c-panel__footer--BoxShadow);
8364
7551
  }
8365
- .pfext-quick-start__base :where(:root, .pf-v6-c-popover) {
7552
+ .pfext-quick-start__base .pf-v6-c-popover {
8366
7553
  --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
8367
7554
  --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
8368
7555
  --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
@@ -8553,181 +7740,10 @@ ul) {
8553
7740
  .pfext-quick-start__base .pf-v6-c-popover__footer {
8554
7741
  margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
8555
7742
  }
8556
- .pfext-quick-start__base :where(:root, .pf-v6-c-progress) {
8557
- --pf-v6-c-progress--GridGap: var(--pf-t--global--spacer--md);
8558
- --pf-v6-c-progress__bar--Height: var(--pf-t--global--spacer--md);
8559
- --pf-v6-c-progress__bar--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
8560
- --pf-v6-c-progress__measure--m-static-width--MinWidth: 4.5ch;
8561
- --pf-v6-c-progress__status--Gap: var(--pf-t--global--spacer--sm);
8562
- --pf-v6-c-progress__status-icon--Color: var(--pf-t--global--icon--color--regular);
8563
- --pf-v6-c-progress__indicator--Height: var(--pf-v6-c-progress__bar--Height);
8564
- --pf-v6-c-progress__indicator--BackgroundColor: var(--pf-t--global--color--brand--default);
8565
- --pf-v6-c-progress__helper-text--MarginBlockStart: calc(var(--pf-t--global--spacer--sm) - var(--pf-v6-c-progress--GridGap));
8566
- --pf-v6-c-progress--m-success__indicator--BackgroundColor: var(--pf-t--global--color--status--success--default);
8567
- --pf-v6-c-progress--m-warning__indicator--BackgroundColor: var(--pf-t--global--color--status--warning--default);
8568
- --pf-v6-c-progress--m-danger__indicator--BackgroundColor: var(--pf-t--global--color--status--danger--default);
8569
- --pf-v6-c-progress--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
8570
- --pf-v6-c-progress--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
8571
- --pf-v6-c-progress--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
8572
- --pf-v6-c-progress--m-inside__indicator--MinWidth: var(--pf-t--global--spacer--xl);
8573
- --pf-v6-c-progress--m-inside__measure--Color: var(--pf-t--global--text--color--on-brand--default);
8574
- --pf-v6-c-progress--m-success--m-inside__measure--Color: var(--pf-t--global--text--color--status--on-success--default);
8575
- --pf-v6-c-progress--m-warning--m-inside__measure--Color: var(--pf-t--global--text--color--status--on-warning--default);
8576
- --pf-v6-c-progress--m-danger--m-inside__measure--Color: var(--pf-t--global--text--color--status--on-danger--default);
8577
- --pf-v6-c-progress--m-inside__measure--FontSize: var(--pf-t--global--font--size--sm);
8578
- --pf-v6-c-progress--m-outside__measure--FontSize: var(--pf-t--global--font--size--sm);
8579
- --pf-v6-c-progress--m-sm__bar--Height: var(--pf-t--global--spacer--sm);
8580
- --pf-v6-c-progress--m-sm__measure--FontSize: var(--pf-t--global--font--size--body--sm);
8581
- --pf-v6-c-progress--m-lg__bar--Height: var(--pf-t--global--spacer--lg);
8582
- }
8583
- .pfext-quick-start__base :where(:root, .pf-v6-c-progress-stepper) {
8584
- --pf-v6-c-progress-stepper--m-vertical--GridAutoFlow: row;
8585
- --pf-v6-c-progress-stepper--m-vertical--GridTemplateColumns: auto 1fr;
8586
- --pf-v6-c-progress-stepper--m-vertical__step-connector--before--InsetBlockStart: 0;
8587
- --pf-v6-c-progress-stepper--m-vertical__step-connector--before--InsetInlineStart: calc(var(--pf-v6-c-progress-stepper__step-icon--Width) / 2);
8588
- --pf-v6-c-progress-stepper--m-vertical__step-connector--before--Width: auto;
8589
- --pf-v6-c-progress-stepper--m-vertical__step-connector--before--Height: 100%;
8590
- --pf-v6-c-progress-stepper--m-vertical__step-connector--before--BorderInlineEndWidth: var(--pf-t--global--border--width--box--default);
8591
- --pf-v6-c-progress-stepper--m-vertical__step-connector--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
8592
- --pf-v6-c-progress-stepper--m-vertical__step-connector--before--BorderBlockEndWidth: 0;
8593
- --pf-v6-c-progress-stepper--m-vertical__step-connector--before--BorderBlockEndColor: transparent;
8594
- --pf-v6-c-progress-stepper--m-vertical__step-connector--before--Transform: translateX(-50%);
8595
- --pf-v6-c-progress-stepper--m-vertical__step-main--MarginBlockStart: 0px;
8596
- --pf-v6-c-progress-stepper--m-vertical__step-main--MarginInlineEnd: 0;
8597
- --pf-v6-c-progress-stepper--m-vertical__step-main--MarginBlockEnd: var(--pf-t--global--spacer--xl);
8598
- --pf-v6-c-progress-stepper--m-vertical__step-main--MarginInlineStart: var(--pf-t--global--spacer--sm);
8599
- --pf-v6-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns: 1fr;
8600
- --pf-v6-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
8601
- --pf-v6-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow: auto;
8602
- --pf-v6-c-progress-stepper--m-vertical--m-compact__step-main--MarginBlockStart: 0;
8603
- --pf-v6-c-progress-stepper--m-vertical--m-compact__step-main--MarginInlineEnd: 0;
8604
- --pf-v6-c-progress-stepper--m-vertical--m-compact__step-main--MarginInlineStart: 0;
8605
- --pf-v6-c-progress-stepper--m-vertical--m-center__step-main--MarginInlineEnd: 0;
8606
- --pf-v6-c-progress-stepper--m-vertical--m-center__step-main--MarginInlineStart: 0;
8607
- --pf-v6-c-progress-stepper--m-horizontal--GridAutoFlow: column;
8608
- --pf-v6-c-progress-stepper--m-horizontal--GridTemplateColumns: initial;
8609
- --pf-v6-c-progress-stepper--m-horizontal__step-connector--before--InsetBlockStart: calc(var(--pf-v6-c-progress-stepper__step-icon--Height) / 2);
8610
- --pf-v6-c-progress-stepper--m-horizontal__step-connector--before--InsetInlineStart: 0;
8611
- --pf-v6-c-progress-stepper--m-horizontal__step-connector--before--Width: 100%;
8612
- --pf-v6-c-progress-stepper--m-horizontal__step-connector--before--Height: auto;
8613
- --pf-v6-c-progress-stepper--m-horizontal__step-connector--before--BorderInlineEndWidth: 0;
8614
- --pf-v6-c-progress-stepper--m-horizontal__step-connector--before--BorderInlineEndColor: unset;
8615
- --pf-v6-c-progress-stepper--m-horizontal__step-connector--before--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
8616
- --pf-v6-c-progress-stepper--m-horizontal__step-connector--before--BorderBlockEndColor: var(--pf-t--global--border--color--default);
8617
- --pf-v6-c-progress-stepper--m-horizontal__step-connector--before--Transform: translateY(-50%);
8618
- --pf-v6-c-progress-stepper--m-horizontal__step-main--MarginBlockStart: var(--pf-t--global--spacer--sm);
8619
- --pf-v6-c-progress-stepper--m-horizontal__step-main--MarginInlineEnd: var(--pf-t--global--spacer--sm);
8620
- --pf-v6-c-progress-stepper--m-horizontal__step-main--MarginBlockEnd: 0;
8621
- --pf-v6-c-progress-stepper--m-horizontal__step-main--MarginInlineStart: 0;
8622
- --pf-v6-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns: repeat(auto-fill, 1.75rem);
8623
- --pf-v6-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBlockEnd: 0;
8624
- --pf-v6-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow: 2;
8625
- --pf-v6-c-progress-stepper--m-compact--GridAutoFlow: row;
8626
- --pf-v6-c-progress-stepper--m-compact__step-main--MarginBlockStart: 0;
8627
- --pf-v6-c-progress-stepper--m-compact__step-main--MarginBlockEnd: var(--pf-t--global--spacer--sm);
8628
- --pf-v6-c-progress-stepper--m-compact__step-connector--MinWidth: 1.75rem;
8629
- --pf-v6-c-progress-stepper--m-compact__step-icon--Width: 1.125rem;
8630
- --pf-v6-c-progress-stepper--m-compact__step-icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
8631
- --pf-v6-c-progress-stepper--m-compact__step-title--FontSize: var(--pf-t--global--font--size--body--lg);
8632
- --pf-v6-c-progress-stepper--m-compact__step-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
8633
- --pf-v6-c-progress-stepper--m-compact__pficon--MarginBlockStart: 2px;
8634
- --pf-v6-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginBlockStart: -3px;
8635
- --pf-v6-c-progress-stepper--m-center__step-connector--before--InsetInlineStart: 50%;
8636
- --pf-v6-c-progress-stepper--m-center--GridTemplateColumns: 1fr;
8637
- --pf-v6-c-progress-stepper--m-center__step-connector--JustifyContent: center;
8638
- --pf-v6-c-progress-stepper--m-center__step-main--MarginInlineEnd: var(--pf-t--global--spacer--xs);
8639
- --pf-v6-c-progress-stepper--m-center__step-main--MarginInlineStart: var(--pf-t--global--spacer--xs);
8640
- --pf-v6-c-progress-stepper--m-center__step-main--TextAlign: center;
8641
- --pf-v6-c-progress-stepper--m-center__step-description--MarginInlineEnd: 0;
8642
- --pf-v6-c-progress-stepper--m-center__step-description--MarginInlineStart: 0;
8643
- --pf-v6-c-progress-stepper--GridTemplateRows: auto 1fr;
8644
- --pf-v6-c-progress-stepper__step-connector--JustifyContent: flex-start;
8645
- --pf-v6-c-progress-stepper__step-icon--ZIndex: var(--pf-t--global--z-index--xs);
8646
- --pf-v6-c-progress-stepper__step-icon--Width: 1.5rem;
8647
- --pf-v6-c-progress-stepper__step-icon--Height: var(--pf-v6-c-progress-stepper__step-icon--Width);
8648
- --pf-v6-c-progress-stepper__step-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
8649
- --pf-v6-c-progress-stepper__step-icon--Color: var(--pf-t--global--icon--color--regular);
8650
- --pf-v6-c-progress-stepper__step-icon--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8651
- --pf-v6-c-progress-stepper__step-icon--BorderWidth: var(--pf-t--global--border--width--box--default);
8652
- --pf-v6-c-progress-stepper__step-icon--BorderColor: var(--pf-t--global--border--color--default);
8653
- --pf-v6-c-progress-stepper__step--m-current__step-icon--Color: var(--pf-t--global--icon--color--brand--default);
8654
- --pf-v6-c-progress-stepper__step--m-info__step-icon--Color: var(--pf-t--global--icon--color--status--info--default);
8655
- --pf-v6-c-progress-stepper__step--m-success__step-icon--Color: var(--pf-t--global--icon--color--status--success--default);
8656
- --pf-v6-c-progress-stepper__step--m-warning__step-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
8657
- --pf-v6-c-progress-stepper__step--m-danger__step-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
8658
- --pf-v6-c-progress-stepper__step--m-custom__step-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
8659
- --pf-v6-c-progress-stepper__pficon--MarginBlockStart: 3px;
8660
- --pf-v6-c-progress-stepper__fa-exclamation-triangle--MarginBlockStart: -2px;
8661
- --pf-v6-c-progress-stepper__step-title--Color: var(--pf-t--global--text--color--regular);
8662
- --pf-v6-c-progress-stepper__step-title--TextAlign: start;
8663
- --pf-v6-c-progress-stepper__step-title--FontSize: var(--pf-t--global--font--size--body--lg);
8664
- --pf-v6-c-progress-stepper__step-title--FontWeight: var(--pf-t--global--font--weight--body--default);
8665
- --pf-v6-c-progress-stepper__step--m-current__step-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
8666
- --pf-v6-c-progress-stepper__step--m-current__step-title--Color: var(--pf-t--global--text--color--regular);
8667
- --pf-v6-c-progress-stepper__step--m-pending__step-title--Color: var(--pf-t--global--text--color--subtle);
8668
- --pf-v6-c-progress-stepper__step--m-danger__step-title--Color: var(--pf-t--global--text--color--status--danger--default);
8669
- --pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineStart: 0;
8670
- --pf-v6-c-progress-stepper__step-title--m-help-text--PaddingInlineEnd: 0;
8671
- --pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
8672
- --pf-v6-c-progress-stepper__step-title--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
8673
- --pf-v6-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset: 0.25rem;
8674
- --pf-v6-c-progress-stepper__step-title--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
8675
- --pf-v6-c-progress-stepper__step-title--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
8676
- --pf-v6-c-progress-stepper__step-title--m-help-text--hover--Color: var(--pf-t--global--text--color--brand--hover);
8677
- --pf-v6-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
8678
- --pf-v6-c-progress-stepper__step-description--MarginBlockStart: var(--pf-t--global--spacer--xs);
8679
- --pf-v6-c-progress-stepper__step-description--FontSize: var(--pf-t--global--font--size--body--sm);
8680
- --pf-v6-c-progress-stepper__step-description--Color: var(--pf-t--global--text--color--subtle);
8681
- --pf-v6-c-progress-stepper__step-description--TextAlign: start;
8682
- --pf-v6-c-progress-stepper--GridAutoFlow: var(--pf-v6-c-progress-stepper--m-vertical--GridAutoFlow);
8683
- --pf-v6-c-progress-stepper--GridTemplateColumns: var(--pf-v6-c-progress-stepper--m-vertical--GridTemplateColumns);
8684
- --pf-v6-c-progress-stepper__step-connector--before--InsetBlockStart: var(--pf-v6-c-progress-stepper--m-vertical__step-connector--before--InsetBlockStart);
8685
- --pf-v6-c-progress-stepper__step-connector--before--InsetInlineStart: var(--pf-v6-c-progress-stepper--m-vertical__step-connector--before--InsetInlineStart);
8686
- --pf-v6-c-progress-stepper__step-connector--before--Width: var(--pf-v6-c-progress-stepper--m-vertical__step-connector--before--Width);
8687
- --pf-v6-c-progress-stepper__step-connector--before--Height: var(--pf-v6-c-progress-stepper--m-vertical__step-connector--before--Height);
8688
- --pf-v6-c-progress-stepper__step-connector--before--BorderInlineEndWidth: var(--pf-v6-c-progress-stepper--m-vertical__step-connector--before--BorderInlineEndWidth);
8689
- --pf-v6-c-progress-stepper__step-connector--before--BorderInlineEndColor: var(--pf-v6-c-progress-stepper--m-vertical__step-connector--before--BorderInlineEndColor);
8690
- --pf-v6-c-progress-stepper__step-connector--before--BorderBlockEndWidth: var(--pf-v6-c-progress-stepper--m-vertical__step-connector--before--BorderBlockEndWidth);
8691
- --pf-v6-c-progress-stepper__step-connector--before--BorderBlockEndColor: var(--pf-v6-c-progress-stepper--m-vertical__step-connector--before--BorderBlockEndColor);
8692
- --pf-v6-c-progress-stepper__step-connector--before--Transform: var(--pf-v6-c-progress-stepper--m-vertical__step-connector--before--Transform);
8693
- --pf-v6-c-progress-stepper__step-main--MarginBlockStart: var(--pf-v6-c-progress-stepper--m-vertical__step-main--MarginBlockStart);
8694
- --pf-v6-c-progress-stepper__step-main--MarginInlineEnd: var(--pf-v6-c-progress-stepper--m-vertical__step-main--MarginInlineEnd);
8695
- --pf-v6-c-progress-stepper__step-main--MarginBlockEnd: var(--pf-v6-c-progress-stepper--m-vertical__step-main--MarginBlockEnd);
8696
- --pf-v6-c-progress-stepper__step-main--MarginInlineStart: var(--pf-v6-c-progress-stepper--m-vertical__step-main--MarginInlineStart);
8697
- --pf-v6-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-v6-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns);
8698
- --pf-v6-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-v6-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow);
8699
- --pf-v6-c-progress-stepper--m-compact__step-connector--PaddingBlockEnd: var(--pf-v6-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBlockEnd);
8700
- --pf-v6-c-progress-stepper--m-center__step-connector--before--Content: none;
8701
- --pf-v6-c-progress-stepper--m-center__step-main--before--Content: "";
8702
- }
8703
- @media screen and (min-width: 48rem) {
8704
- .pfext-quick-start__base :where(:root, .pf-v6-c-progress-stepper) {
8705
- --pf-v6-c-progress-stepper--GridAutoFlow: var(--pf-v6-c-progress-stepper--m-horizontal--GridAutoFlow);
8706
- --pf-v6-c-progress-stepper--GridTemplateColumns: var(--pf-v6-c-progress-stepper--m-horizontal--GridTemplateColumns);
8707
- --pf-v6-c-progress-stepper__step-connector--before--InsetBlockStart: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--InsetBlockStart);
8708
- --pf-v6-c-progress-stepper__step-connector--before--InsetInlineStart: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--InsetInlineStart);
8709
- --pf-v6-c-progress-stepper__step-connector--before--Width: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--Width);
8710
- --pf-v6-c-progress-stepper__step-connector--before--Height: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--Height);
8711
- --pf-v6-c-progress-stepper__step-connector--before--BorderInlineEndWidth: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--BorderInlineEndWidth);
8712
- --pf-v6-c-progress-stepper__step-connector--before--BorderInlineEndColor: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--BorderInlineEndColor);
8713
- --pf-v6-c-progress-stepper__step-connector--before--BorderBlockEndWidth: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--BorderBlockEndWidth);
8714
- --pf-v6-c-progress-stepper__step-connector--before--BorderBlockEndColor: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--BorderBlockEndColor);
8715
- --pf-v6-c-progress-stepper__step-connector--before--Transform: var(--pf-v6-c-progress-stepper--m-horizontal__step-connector--before--Transform);
8716
- --pf-v6-c-progress-stepper__step-main--MarginBlockStart: var(--pf-v6-c-progress-stepper--m-horizontal__step-main--MarginBlockStart);
8717
- --pf-v6-c-progress-stepper__step-main--MarginInlineEnd: var(--pf-v6-c-progress-stepper--m-horizontal__step-main--MarginInlineEnd);
8718
- --pf-v6-c-progress-stepper__step-main--MarginBlockEnd: var(--pf-v6-c-progress-stepper--m-horizontal__step-main--MarginBlockEnd);
8719
- --pf-v6-c-progress-stepper__step-main--MarginInlineStart: var(--pf-v6-c-progress-stepper--m-horizontal__step-main--MarginInlineStart);
8720
- --pf-v6-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-v6-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns);
8721
- --pf-v6-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-v6-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow);
8722
- --pf-v6-c-progress-stepper--m-compact__step-connector--PaddingBlockEnd: var(--pf-v6-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBlockEnd);
8723
- --pf-v6-c-progress-stepper--m-center__step-connector--before--Content: "";
8724
- --pf-v6-c-progress-stepper--m-center__step-main--before--Content: none;
8725
- }
8726
- }
8727
- .pfext-quick-start__base :where(:root, .pf-v6-c-radio) {
7743
+ .pfext-quick-start__base .pf-v6-c-radio {
8728
7744
  --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
8729
7745
  --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
8730
- --pf-v6-c-radio--Height: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
7746
+ --pf-v6-c-radio--m-standalone--MinHeight: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
8731
7747
  --pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
8732
7748
  --pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
8733
7749
  --pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -8750,7 +7766,7 @@ ul) {
8750
7766
  .pfext-quick-start__base .pf-v6-c-radio.pf-m-standalone {
8751
7767
  display: inline-grid;
8752
7768
  grid-template-columns: auto;
8753
- height: var(--pf-v6-c-check--Height);
7769
+ min-height: var(--pf-v6-c-radio--m-standalone--MinHeight);
8754
7770
  }
8755
7771
  .pfext-quick-start__base .pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
8756
7772
  align-self: center;
@@ -8797,210 +7813,7 @@ ul) {
8797
7813
  --pf-v6-c-radio__label--Color: var(--pf-v6-c-radio__label--disabled--Color);
8798
7814
  cursor: not-allowed;
8799
7815
  }
8800
- .pfext-quick-start__base :where(:root, .pf-v6-c-sidebar) {
8801
- --pf-v6-c-sidebar--inset: var(--pf-t--global--spacer--md);
8802
- --pf-v6-c-sidebar--xl--inset: var(--pf-t--global--spacer--lg);
8803
- --pf-v6-c-sidebar--BorderWidth--base: var(--pf-t--global--border--width--regular);
8804
- --pf-v6-c-sidebar--BorderColor--base: var(--pf-t--global--border--color--default);
8805
- --pf-v6-c-sidebar__panel--PaddingBlockStart: 0;
8806
- --pf-v6-c-sidebar__panel--PaddingInlineEnd: 0;
8807
- --pf-v6-c-sidebar__panel--PaddingBlockEnd: 0;
8808
- --pf-v6-c-sidebar__panel--PaddingInlineStart: 0;
8809
- --pf-v6-c-sidebar__panel--Order: -1;
8810
- --pf-v6-c-sidebar__panel--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
8811
- --pf-v6-c-sidebar__panel--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
8812
- --pf-v6-c-sidebar__panel--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
8813
- --pf-v6-c-sidebar__panel--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
8814
- --pf-v6-c-sidebar__content--PaddingBlockStart: 0;
8815
- --pf-v6-c-sidebar__content--PaddingInlineEnd: 0;
8816
- --pf-v6-c-sidebar__content--PaddingBlockEnd: 0;
8817
- --pf-v6-c-sidebar__content--PaddingInlineStart: 0;
8818
- --pf-v6-c-sidebar__content--Order: 1;
8819
- --pf-v6-c-sidebar__content--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
8820
- --pf-v6-c-sidebar__content--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
8821
- --pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
8822
- --pf-v6-c-sidebar__content--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
8823
- --pf-v6-c-sidebar__main--FlexDirection: column;
8824
- --pf-v6-c-sidebar__main--md--FlexDirection: row;
8825
- --pf-v6-c-sidebar__main--AlignItems: stretch;
8826
- --pf-v6-c-sidebar__main--md--AlignItems: flex-start;
8827
- --pf-v6-c-sidebar__main--child--MarginBlockStart: 0;
8828
- --pf-v6-c-sidebar--m-gutter__main--Gap: var(--pf-v6-c-sidebar--inset);
8829
- --pf-v6-c-sidebar__main--m-border--before--Display: none;
8830
- --pf-v6-c-sidebar__main--m-border--before--md--Display: block;
8831
- --pf-v6-c-sidebar__main--m-border--before--BorderWidth: var(--pf-v6-c-sidebar--BorderWidth--base);
8832
- --pf-v6-c-sidebar__main--m-border--before--BorderColor: var(--pf-v6-c-sidebar--BorderColor--base);
8833
- --pf-v6-c-sidebar--m-panel-right__panel--Order: -1;
8834
- --pf-v6-c-sidebar--m-panel-right__panel--md--Order: 1;
8835
- --pf-v6-c-sidebar--m-panel-right__content--md--Order: -1;
8836
- --pf-v6-c-sidebar--m-stack__main--FlexDirection: column;
8837
- --pf-v6-c-sidebar--m-stack__main--AlignItems: stretch;
8838
- --pf-v6-c-sidebar--m-stack__panel--Position: sticky;
8839
- --pf-v6-c-sidebar--m-stack__panel--InsetBlockStart: 0;
8840
- --pf-v6-c-sidebar--m-stack__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
8841
- --pf-v6-c-sidebar--m-stack--m-panel-right__panel--Order: -1;
8842
- --pf-v6-c-sidebar--m-split__main--AlignItems: flex-start;
8843
- --pf-v6-c-sidebar--m-split__main--FlexDirection: row;
8844
- --pf-v6-c-sidebar--m-split__panel--Position: static;
8845
- --pf-v6-c-sidebar--m-split__panel--InsetBlockStart: auto;
8846
- --pf-v6-c-sidebar--m-split--m-panel-right__panel--Order: 1;
8847
- --pf-v6-c-sidebar--m-split__main--m-border--before--Display: block;
8848
- --pf-v6-c-sidebar__panel--FlexBasis--base: auto;
8849
- --pf-v6-c-sidebar__panel--BoxShadow--base: var(--pf-t--global--box-shadow--md--bottom);
8850
- --pf-v6-c-sidebar__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
8851
- --pf-v6-c-sidebar__panel--InsetBlockStart: 0;
8852
- --pf-v6-c-sidebar__panel--md--InsetBlockStart: auto;
8853
- --pf-v6-c-sidebar__panel--Position: sticky;
8854
- --pf-v6-c-sidebar__panel--md--Position: static;
8855
- --pf-v6-c-sidebar__panel--FlexBasis-base: auto;
8856
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis-base);
8857
- --pf-v6-c-sidebar__panel--md--FlexBasis: 15.625rem;
8858
- --pf-v6-c-sidebar__panel--m-split--FlexBasis: 15.625rem;
8859
- --pf-v6-c-sidebar__panel--m-stack--FlexBasis: auto;
8860
- --pf-v6-c-sidebar__panel--ZIndex: var(--pf-t--global--z-index--xs);
8861
- --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8862
- --pf-v6-c-sidebar__panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
8863
- --pf-v6-c-sidebar__content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8864
- --pf-v6-c-sidebar__content--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
8865
- --pf-v6-c-sidebar__panel--m-sticky--InsetBlockStart: 0;
8866
- --pf-v6-c-sidebar__panel--m-sticky--Position: sticky;
8867
- }
8868
- .pfext-quick-start__base :where(:root, .pf-v6-c-simple-list) {
8869
- --pf-v6-c-simple-list__item-link--PaddingBlockStart: var(--pf-t--global--spacer--xs);
8870
- --pf-v6-c-simple-list__item-link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
8871
- --pf-v6-c-simple-list__item-link--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
8872
- --pf-v6-c-simple-list__item-link--PaddingInlineStart: var(--pf-t--global--spacer--md);
8873
- --pf-v6-c-simple-list__item-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
8874
- --pf-v6-c-simple-list__item-link--Color: var(--pf-t--global--text--color--subtle);
8875
- --pf-v6-c-simple-list__item-link--FontSize: var(--pf-t--global--font--size--body--default);
8876
- --pf-v6-c-simple-list__item-link--m-current--Color: var(--pf-t--global--text--color--regular);
8877
- --pf-v6-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
8878
- --pf-v6-c-simple-list__item-link--hover--Color: var(--pf-t--global--text--color--subtle);
8879
- --pf-v6-c-simple-list__item-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
8880
- --pf-v6-c-simple-list__item-link--BorderRadius: var(--pf-t--global--border--radius--tiny);
8881
- --pf-v6-c-simple-list__item-link--m-link--Color: var(--pf-t--global--text--color--link--default);
8882
- --pf-v6-c-simple-list__item-link--m-link--m-current--Color: var(--pf-t--global--text--color--link--hover);
8883
- --pf-v6-c-simple-list__item-link--m-link--hover--Color: var(--pf-t--global--text--color--link--hover);
8884
- --pf-v6-c-simple-list__title--PaddingBlockStart: var(--pf-t--global--spacer--sm);
8885
- --pf-v6-c-simple-list__title--PaddingInlineEnd: var(--pf-t--global--spacer--md);
8886
- --pf-v6-c-simple-list__title--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
8887
- --pf-v6-c-simple-list__title--PaddingInlineStart: var(--pf-t--global--spacer--md);
8888
- --pf-v6-c-simple-list__title--FontSize: var(--pf-t--global--font--size--body--sm);
8889
- --pf-v6-c-simple-list__title--Color: var(--pf-t--global--text--color--regular);
8890
- --pf-v6-c-simple-list__title--FontWeight: var(--pf-t--global--font--weight--body--bold);
8891
- --pf-v6-c-simple-list__section--section--MarginBlockStart: var(--pf-t--global--spacer--sm);
8892
- }
8893
- .pfext-quick-start__base :where(:root, .pf-v6-c-skeleton) {
8894
- --pf-v6-c-skeleton--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
8895
- --pf-v6-c-skeleton--Width: auto;
8896
- --pf-v6-c-skeleton--Height: auto;
8897
- --pf-v6-c-skeleton--BorderRadius: var(--pf-t--global--spacer--sm);
8898
- --pf-v6-c-skeleton--before--PaddingBlockEnd: 0;
8899
- --pf-v6-c-skeleton--before--Height: auto;
8900
- --pf-v6-c-skeleton--before--Content: " ";
8901
- --pf-v6-c-skeleton--after--LinearGradientAngle: 90deg;
8902
- --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
8903
- --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
8904
- --pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
8905
- --pf-v6-c-skeleton--after--TranslateX: -100%;
8906
- --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
8907
- --pf-v6-c-skeleton--after--AnimationDuration: 3s;
8908
- --pf-v6-c-skeleton--after--AnimationIterationCount: infinite;
8909
- --pf-v6-c-skeleton--after--AnimationTimingFunction: linear;
8910
- --pf-v6-c-skeleton--after--AnimationDelay: .5s;
8911
- --pf-v6-c-skeleton--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
8912
- --pf-v6-c-skeleton--m-circle--before--PaddingBlockEnd: 100%;
8913
- --pf-v6-c-skeleton--m-text-4xl--Height: calc(var(--pf-t--global--font--size--4xl) * var(--pf-t--global--font--line-height--heading));
8914
- --pf-v6-c-skeleton--m-text-3xl--Height: calc(var(--pf-t--global--font--size--3xl) * var(--pf-t--global--font--line-height--heading));
8915
- --pf-v6-c-skeleton--m-text-2xl--Height: calc(var(--pf-t--global--font--size--2xl) * var(--pf-t--global--font--line-height--heading));
8916
- --pf-v6-c-skeleton--m-text-xl--Height: calc(var(--pf-t--global--font--size--xl) * var(--pf-t--global--font--line-height--heading));
8917
- --pf-v6-c-skeleton--m-text-lg--Height: calc(var(--pf-t--global--font--size--lg) * var(--pf-t--global--font--line-height--body));
8918
- --pf-v6-c-skeleton--m-text-md--Height: calc(var(--pf-t--global--font--size--md) * var(--pf-t--global--font--line-height--body));
8919
- --pf-v6-c-skeleton--m-text-sm--Height: calc(var(--pf-t--global--font--size--sm) * var(--pf-t--global--font--line-height--body));
8920
- --pf-v6-c-skeleton--m-width-sm--Width: 6.25rem;
8921
- --pf-v6-c-skeleton--m-width-md--Width: 12.5rem;
8922
- --pf-v6-c-skeleton--m-width-lg--Width: 18.75rem;
8923
- --pf-v6-c-skeleton--m-width-25--Width: 25%;
8924
- --pf-v6-c-skeleton--m-width-33--Width: calc(100% / 3);
8925
- --pf-v6-c-skeleton--m-width-50--Width: 50%;
8926
- --pf-v6-c-skeleton--m-width-66--Width: calc(100% / 3 * 2);
8927
- --pf-v6-c-skeleton--m-width-75--Width: 75%;
8928
- --pf-v6-c-skeleton--m-height-sm--Height: 6.25rem;
8929
- --pf-v6-c-skeleton--m-height-md--Height: 12.5rem;
8930
- --pf-v6-c-skeleton--m-height-lg--Height: 18.75rem;
8931
- --pf-v6-c-skeleton--m-height-25--Height: 25%;
8932
- --pf-v6-c-skeleton--m-height-33--Height: calc(100% / 3);
8933
- --pf-v6-c-skeleton--m-height-50--Height: 50%;
8934
- --pf-v6-c-skeleton--m-height-66--Height: calc(100% / 3 * 2);
8935
- --pf-v6-c-skeleton--m-height-75--Height: 75%;
8936
- --pf-v6-c-skeleton--m-height-100--Height: 100%;
8937
- }
8938
- .pfext-quick-start__base :where(:root, .pf-v6-c-skip-to-content) {
8939
- --pf-v6-c-skip-to-content--InsetBlockStart: var(--pf-t--global--spacer--md);
8940
- --pf-v6-c-skip-to-content--ZIndex: var(--pf-t--global--z-index--2xl);
8941
- --pf-v6-c-skip-to-content--focus--InsetInlineStart: var(--pf-t--global--spacer--md);
8942
- }
8943
- .pfext-quick-start__base :where(:root, .pf-v6-c-slider) {
8944
- --pf-v6-c-slider--value: 0;
8945
- --pf-v6-c-slider__step--InsetInlineStart: 0;
8946
- --pf-v6-c-slider__rail--PaddingBlockStart: var(--pf-t--global--spacer--md);
8947
- --pf-v6-c-slider__rail--PaddingBlockEnd: var(--pf-t--global--spacer--md);
8948
- --pf-v6-c-slider__rail-track--Height: 0.25rem;
8949
- --pf-v6-c-slider__rail-track--before--base--BackgroundColor: var(--pf-t--global--border--color--default);
8950
- --pf-v6-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-t--global--border--color--hover);
8951
- --pf-v6-c-slider__rail-track--before--BorderRadius: var(--pf-t--global--border--radius--tiny);
8952
- --pf-v6-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop: var(--pf-v6-c-slider--value);
8953
- --pf-v6-c-slider__steps--FontSize: var(--pf-t--global--font--size--sm);
8954
- --pf-v6-c-slider__steps--Height: var(--pf-v6-c-slider__steps--FontSize);
8955
- --pf-v6-c-slider__step-tick--InsetBlockStart: var(--pf-t--global--spacer--md);
8956
- --pf-v6-c-slider__step-tick--Width: 0.25rem;
8957
- --pf-v6-c-slider__step-tick--Height: 0.25rem;
8958
- --pf-v6-c-slider__step-tick--BackgroundColor: var(--pf-t--global--icon--color--subtle);
8959
- --pf-v6-c-slider__step-tick--TranslateX: -50%;
8960
- --pf-v6-c-slider__step-tick--BorderRadius: var(--pf-t--global--border--radius--large);
8961
- --pf-v6-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-t--global--icon--color--brand--clicked);
8962
- --pf-v6-c-slider__step--first-child__step-tick--TranslateX: 0;
8963
- --pf-v6-c-slider__step--last-child__step-tick--TranslateX: -100%;
8964
- --pf-v6-c-slider__step-label--TranslateX: -50%;
8965
- --pf-v6-c-slider__step-label--InsetBlockStart: calc(var(--pf-t--global--spacer--xl) + var(--pf-v6-c-slider__rail-track--Height));
8966
- --pf-v6-c-slider__step--first-child__step-label--TranslateX: 0;
8967
- --pf-v6-c-slider__step--last-child__step-label--TranslateX: -100%;
8968
- --pf-v6-c-slider__thumb--InsetBlockStart: calc(var(--pf-v6-c-slider__rail-track--Height) / 2 + var(--pf-t--global--spacer--md));
8969
- --pf-v6-c-slider__thumb--Width: 1rem;
8970
- --pf-v6-c-slider__thumb--Height: 1rem;
8971
- --pf-v6-c-slider__thumb--InsetInlineStart: var(--pf-v6-c-slider--value);
8972
- --pf-v6-c-slider__thumb--BackgroundColor: var(--pf-t--global--color--brand--default);
8973
- --pf-v6-c-slider__thumb--TranslateX: -50%;
8974
- --pf-v6-c-slider__thumb--TranslateY: -50%;
8975
- --pf-v6-c-slider__thumb--BorderRadius: var(--pf-t--global--border--radius--large);
8976
- --pf-v6-c-slider__thumb--BoxShadow--base:
8977
- 0 0 0 2px var(--pf-t--global--background--color--primary--default),
8978
- 0 0 0 3px var(--pf-t--global--color--brand--default);
8979
- --pf-v6-c-slider__thumb--hover--BoxShadow: var(--pf-v6-c-slider__thumb--BoxShadow--base);
8980
- --pf-v6-c-slider__thumb--focus--BoxShadow: var(--pf-v6-c-slider__thumb--BoxShadow--base);
8981
- --pf-v6-c-slider__thumb--active--BoxShadow:
8982
- var(--pf-v6-c-slider__thumb--BoxShadow--base),
8983
- 0 0 2px 5px var(--pf-t--global--color--nonstatus--blue--clicked);
8984
- --pf-v6-c-slider__thumb--before--Width: 44px;
8985
- --pf-v6-c-slider__thumb--before--Height: var(--pf-v6-c-slider__thumb--before--Width);
8986
- --pf-v6-c-slider__thumb--before--BorderRadius: var(--pf-t--global--border--radius--large);
8987
- --pf-v6-c-slider__thumb--before--TranslateX: -50%;
8988
- --pf-v6-c-slider__thumb--before--TranslateY: -50%;
8989
- --pf-v6-c-slider__value--MarginInlineStart: var(--pf-t--global--spacer--md);
8990
- --pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-v6-c-form-control--PaddingInlineStart) + var(--pf-v6-c-form-control--PaddingInlineEnd) + 1.25rem);
8991
- --pf-v6-c-slider__value--c-form-control--width-chars: 3;
8992
- --pf-v6-c-slider__value--c-form-control--Width: calc(var(--pf-v6-c-slider__value--c-form-control--width-base) + var(--pf-v6-c-slider__value--c-form-control--width-chars) * 1ch);
8993
- --pf-v6-c-slider__value--m-floating--TranslateX: -50%;
8994
- --pf-v6-c-slider__value--m-floating--TranslateY: -100%;
8995
- --pf-v6-c-slider__value--m-floating--InsetInlineStart: var(--pf-v6-c-slider--value);
8996
- --pf-v6-c-slider__value--m-floating--ZIndex: var(--pf-t--global--z-index--sm);
8997
- --pf-v6-c-slider__actions--MarginInlineEnd: var(--pf-t--global--spacer--sm);
8998
- --pf-v6-c-slider__main--actions--MarginInlineStart: var(--pf-t--global--spacer--sm);
8999
- --pf-v6-c-slider--m-disabled__rail-track--before--fill--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9000
- --pf-v6-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor: var(--pf-t--global--icon--color--disabled);
9001
- --pf-v6-c-slider--m-disabled__thumb--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9002
- }
9003
- .pfext-quick-start__base :where(:root, .pf-v6-c-spinner) {
7816
+ .pfext-quick-start__base .pf-v6-c-spinner {
9004
7817
  --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
9005
7818
  --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
9006
7819
  --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
@@ -9073,410 +7886,7 @@ ul) {
9073
7886
  transform: rotate(720deg);
9074
7887
  }
9075
7888
  }
9076
- .pfext-quick-start__base :where(:root, .pf-v6-c-switch) {
9077
- --pf-v6-c-switch--FontSize: var(--pf-t--global--font--size--sm);
9078
- --pf-v6-c-switch--ColumnGap: var(--pf-t--global--spacer--sm);
9079
- --pf-v6-c-switch__toggle-icon--FontSize: calc(var(--pf-v6-c-switch--FontSize) * .625);
9080
- --pf-v6-c-switch__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
9081
- --pf-v6-c-switch__toggle-icon--InsetInlineStart: calc(var(--pf-v6-c-switch--FontSize) * .4);
9082
- --pf-v6-c-switch__toggle-icon--Offset: 0.125rem;
9083
- --pf-v6-c-switch__input--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
9084
- --pf-v6-c-switch--LineHeight: var(--pf-t--global--font--line-height--body);
9085
- --pf-v6-c-switch--Height: auto;
9086
- --pf-v6-c-switch__input--checked__toggle--BackgroundColor: var(--pf-t--global--color--brand--default);
9087
- --pf-v6-c-switch__input--checked__toggle--before--TranslateX: calc(100% + var(--pf-v6-c-switch__toggle-icon--Offset));
9088
- --pf-v6-c-switch__input--checked__toggle--BorderWidth: 0;
9089
- --pf-v6-c-switch__input--checked__label--Color: var(--pf-t--global--text--color--regular);
9090
- --pf-v6-c-switch__input--not-checked__label--Color: var(--pf-t--global--text--color--subtle);
9091
- --pf-v6-c-switch__input--disabled__label--Color: var(--pf-t--global--text--color--disabled);
9092
- --pf-v6-c-switch__input--disabled__toggle--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9093
- --pf-v6-c-switch__input--checked__toggle--before--BackgroundColor: var(--pf-t--global--icon--color--inverse);
9094
- --pf-v6-c-switch__input--not-checked__toggle--before--BackgroundColor: var(--pf-t--global--icon--color--subtle);
9095
- --pf-v6-c-switch__input--disabled__toggle--before--BackgroundColor: var(--pf-t--global--icon--color--on-disabled);
9096
- --pf-v6-c-switch__input--focus__toggle--OutlineWidth: var(--pf-t--global--border--width--strong);
9097
- --pf-v6-c-switch__input--focus__toggle--OutlineOffset: var(--pf-t--global--spacer--xs);
9098
- --pf-v6-c-switch__input--focus__toggle--OutlineColor: var(--pf-t--global--color--brand--default);
9099
- --pf-v6-c-switch__toggle--Height: calc(var(--pf-v6-c-switch--FontSize) * var(--pf-v6-c-switch--LineHeight));
9100
- --pf-v6-c-switch__toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
9101
- --pf-v6-c-switch__toggle--BorderColor: var(--pf-t--global--border--color--default);
9102
- --pf-v6-c-switch__toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
9103
- --pf-v6-c-switch__toggle--BorderRadius: var(--pf-t--global--border--radius--pill);
9104
- --pf-v6-c-switch__toggle--before--Width: calc(var(--pf-v6-c-switch--FontSize) - var(--pf-v6-c-switch__toggle-icon--Offset));
9105
- --pf-v6-c-switch__toggle--before--Height: var(--pf-v6-c-switch__toggle--before--Width);
9106
- --pf-v6-c-switch__toggle--before--InsetInlineStart: calc((var(--pf-v6-c-switch__toggle--Height) - var(--pf-v6-c-switch__toggle--before--Height)) / 2);
9107
- --pf-v6-c-switch__toggle--before--BorderRadius: var(--pf-t--global--border--radius--large);
9108
- --pf-v6-c-switch__toggle--before--Transition: transform .25s ease 0s;
9109
- --pf-v6-c-switch__toggle--Width: calc(var(--pf-v6-c-switch__toggle--Height) + var(--pf-v6-c-switch__toggle-icon--Offset) + var(--pf-v6-c-switch__toggle--before--Width));
9110
- }
9111
- .pfext-quick-start__base :where(:root, .pf-v6-c-tab-content) {
9112
- --pf-v6-c-tab-content__body--PaddingBlockStart: 0;
9113
- --pf-v6-c-tab-content__body--PaddingInlineEnd: 0;
9114
- --pf-v6-c-tab-content__body--PaddingBlockEnd: 0;
9115
- --pf-v6-c-tab-content__body--PaddingInlineStart: 0;
9116
- --pf-v6-c-tab-content--BackgroundColor: transparent;
9117
- --pf-v6-c-tab-content__body--m-padding--PaddingBlockStart: var(--pf-t--global--spacer--md);
9118
- --pf-v6-c-tab-content__body--m-padding--PaddingInlineEnd: var(--pf-t--global--spacer--md);
9119
- --pf-v6-c-tab-content__body--m-padding--PaddingBlockEnd: var(--pf-t--global--spacer--md);
9120
- --pf-v6-c-tab-content__body--m-padding--PaddingInlineStart: var(--pf-t--global--spacer--md);
9121
- --pf-v6-c-tab-content__body--m-padding--xl--PaddingBlockStart: var(--pf-t--global--spacer--lg);
9122
- --pf-v6-c-tab-content__body--m-padding--xl--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
9123
- --pf-v6-c-tab-content__body--m-padding--xl--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
9124
- --pf-v6-c-tab-content__body--m-padding--xl--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9125
- --pf-v6-c-tab-content--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
9126
- }
9127
- .pfext-quick-start__base :where(:root, .pf-v6-c-table[class*="pf-m-grid"]) {
9128
- --pf-v6-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
9129
- --pf-v6-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
9130
- --pf-v6-c-table__tbody--after--border-width--base: var(--pf-t--global--border--width--extra-strong);
9131
- --pf-v6-c-table__tbody--after--BorderInlineStartWidth: 0;
9132
- --pf-v6-c-table__tbody--after--BorderColor: var(--pf-t--global--border--color--clicked);
9133
- --pf-v6-c-table__tbody--responsive--m-expandable--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
9134
- --pf-v6-c-table__tr--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
9135
- --pf-v6-c-table__tr--responsive--last-child--BorderBlockEndWidth: var(--pf-v6-c-table__tbody--responsive--border-width--base);
9136
- --pf-v6-c-table__tr--responsive--GridColumnGap: var(--pf-t--global--spacer--md);
9137
- --pf-v6-c-table__tr--responsive--MarginBlockStart: var(--pf-v6-c-table__tbody--responsive--border-width--base);
9138
- --pf-v6-c-table__tr--responsive--PaddingBlockStart: var(--pf-t--global--spacer--md);
9139
- --pf-v6-c-table__tr--responsive--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
9140
- --pf-v6-c-table__tr--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--md);
9141
- --pf-v6-c-table__tr--responsive--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9142
- --pf-v6-c-table__tr--responsive--nested-table--PaddingBlockStart: var(--pf-t--global--spacer--xl);
9143
- --pf-v6-c-table__tr--responsive--nested-table--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
9144
- --pf-v6-c-table__tr--responsive--nested-table--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
9145
- --pf-v6-c-table__tr--responsive--nested-table--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9146
- --pf-v6-c-table__tbody--after__tr--BorderInlineStartWidth: 0;
9147
- --pf-v6-c-table__tbody--after__tr--BorderInlineStartColor: transparent;
9148
- --pf-v6-c-table__tbody--m-expanded--after__tr--BorderInlineStartWidth: var(--pf-v6-c-table__expandable-row--after--border-width--base);
9149
- --pf-v6-c-table__tbody--m-expanded--after__tr--BorderInlineStartColor: var(--pf-t--global--border--color--clicked);
9150
- --pf-v6-c-table__tbody--m-selected--after__tr--BorderInlineStartWidth: var(--pf-v6-c-table__expandable-row--after--border-width--base);
9151
- --pf-v6-c-table__tbody--m-selected--after__tr--BorderInlineStartColor: var(--pf-t--global--border--color--clicked);
9152
- --pf-v6-c-table--m-grid--cell--hidden-visible--Display: grid;
9153
- --pf-v6-c-table--m-grid--cell--PaddingBlockStart: 0;
9154
- --pf-v6-c-table--m-grid--cell--PaddingInlineEnd: 0;
9155
- --pf-v6-c-table--m-grid--cell--PaddingBlockEnd: 0;
9156
- --pf-v6-c-table--m-grid--cell--PaddingInlineStart: 0;
9157
- --pf-v6-c-table-td--responsive--GridColumnGap: var(--pf-t--global--spacer--md);
9158
- --pf-v6-c-table--cell--responsive--PaddingBlockStart: var(--pf-t--global--spacer--md);
9159
- --pf-v6-c-table--cell--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9160
- --pf-v6-c-table--cell--first-child--responsive--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9161
- --pf-v6-c-table--cell--responsive--PaddingInlineEnd: 0;
9162
- --pf-v6-c-table--cell--responsive--PaddingInlineStart: 0;
9163
- --pf-v6-c-table--m-compact__tr--responsive--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9164
- --pf-v6-c-table--m-compact__tr--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9165
- --pf-v6-c-table--m-compact__tr__td--responsive--PaddingBlockStart: var(--pf-t--global--spacer--xs);
9166
- --pf-v6-c-table--m-compact__tr__td--responsive--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
9167
- --pf-v6-c-table--m-compact__check--responsive--MarginBlockStart: 0.4375rem;
9168
- --pf-v6-c-table--m-compact__action--responsive--MarginBlockStart: calc(var(--pf-t--global--spacer--xs) * -1);
9169
- --pf-v6-c-table--m-compact__action--responsive--MarginBlockEnd: calc(var(--pf-t--global--spacer--xs) * -1);
9170
- --pf-v6-c-table--m-compact__toggle--c-button--responsive--MarginBlockEnd: calc(var(--pf-t--global--spacer--xs) * -1);
9171
- --pf-v6-c-table__expandable-row-content--responsive--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
9172
- --pf-v6-c-table__expandable-row-content--responsive--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9173
- --pf-v6-c-table__expandable-row-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9174
- --pf-v6-c-table__check--responsive--MarginInlineStart: var(--pf-v6-c-table__tbody--responsive--border-width--base);
9175
- --pf-v6-c-table__check--responsive--MarginBlockStart: 0.875rem;
9176
- --pf-v6-c-table--m-grid__favorite--MarginBlockStart: 0.5rem;
9177
- --pf-v6-c-table--m-grid__check--favorite--MarginInlineStart: var(--pf-t--global--spacer--xl);
9178
- --pf-v6-c-table__action--responsive--MarginInlineStart: var(--pf-t--global--spacer--xl);
9179
- --pf-v6-c-table--m-grid__favorite--action--MarginInlineStart: var(--pf-t--global--spacer--2xl);
9180
- --pf-v6-c-table--m-grid__check--favorite--action--MarginInlineStart: calc(var(--pf-v6-c-table--m-grid__check--favorite--MarginInlineStart) + var(--pf-v6-c-table--m-grid__favorite--action--MarginInlineStart));
9181
- --pf-v6-c-table__toggle__icon--Transition: .2s ease-in 0s;
9182
- --pf-v6-c-table__toggle--m-expanded__icon--Rotate: 180deg;
9183
- }
9184
- .pfext-quick-start__base :where(:root, .pf-v6-c-table) {
9185
- --pf-v6-c-table--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9186
- --pf-v6-c-table--BorderColor: var(--pf-t--global--border--color--default);
9187
- --pf-v6-c-table--border-width--base: var(--pf-t--global--border--width--divider--default);
9188
- --pf-v6-c-table__caption--FontSize: var(--pf-t--global--font--size--body--default);
9189
- --pf-v6-c-table__caption--Color: var(--pf-t--global--text--color--subtle);
9190
- --pf-v6-c-table__caption--PaddingBlockStart: var(--pf-t--global--spacer--md);
9191
- --pf-v6-c-table__caption--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
9192
- --pf-v6-c-table__caption--PaddingBlockEnd: var(--pf-t--global--spacer--md);
9193
- --pf-v6-c-table__caption--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9194
- --pf-v6-c-table__thead--cell--FontSize: var(--pf-t--global--font--size--body--sm);
9195
- --pf-v6-c-table__thead--cell--FontWeight: var(--pf-t--global--font--weight--body--bold);
9196
- --pf-v6-c-table__thead__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
9197
- --pf-v6-c-table__tbody--cell--PaddingBlockStart: var(--pf-v6-c-table--cell--Padding--base);
9198
- --pf-v6-c-table__tbody--cell--PaddingBlockEnd: var(--pf-v6-c-table--cell--Padding--base);
9199
- --pf-v6-c-table__tbody--cell--FontSize: var(--pf-t--global--font--size--body--default);
9200
- --pf-v6-c-table__tr--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
9201
- --pf-v6-c-table__tr--BorderBlockEndColor: var(--pf-t--global--border--color--default);
9202
- --pf-v6-c-table--cell--Padding--base: var(--pf-t--global--spacer--md);
9203
- --pf-v6-c-table--cell--PaddingBlockStart: var(--pf-v6-c-table--cell--Padding--base);
9204
- --pf-v6-c-table--cell--PaddingInlineEnd: var(--pf-v6-c-table--cell--Padding--base);
9205
- --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table--cell--Padding--base);
9206
- --pf-v6-c-table--cell--PaddingInlineStart: var(--pf-v6-c-table--cell--Padding--base);
9207
- --pf-v6-c-table--cell--FontSize: var(--pf-t--global--font--size--body--default);
9208
- --pf-v6-c-table--cell--FontWeight: var(--pf-t--global--font--weight--body--default);
9209
- --pf-v6-c-table--cell--LineHeight: var(--pf-t--global--font--line-height--body);
9210
- --pf-v6-c-table--cell--Color: var(--pf-t--global--text--color--regular);
9211
- --pf-v6-c-table--cell--first-last-child--PaddingInline: var(--pf-t--global--spacer--sm);
9212
- --pf-v6-c-table__tr--m-first-cell-offset-reset--cell--PaddingInlineStart: var(--pf-v6-c-table--cell--Padding--base);
9213
- --pf-v6-c-table--cell--MinWidth: 0;
9214
- --pf-v6-c-table--cell--MaxWidth: none;
9215
- --pf-v6-c-table--cell--Width: auto;
9216
- --pf-v6-c-table--cell--Overflow: visible;
9217
- --pf-v6-c-table--cell--TextOverflow: clip;
9218
- --pf-v6-c-table--cell--WhiteSpace: normal;
9219
- --pf-v6-c-table--cell--WordBreak: normal;
9220
- --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
9221
- --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
9222
- --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
9223
- --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
9224
- --pf-v6-c-table--cell--m-help--MinWidth: 11ch;
9225
- --pf-v6-c-table--m-truncate--cell--MaxWidth: 1px;
9226
- --pf-v6-c-table--m-truncate--cell--MinWidth: calc(5ch + var(--pf-v6-c-table--cell--PaddingInlineEnd) + var(--pf-v6-c-table--cell--PaddingInlineStart));
9227
- --pf-v6-c-table--m-truncate__text--MinWidth: 5ch;
9228
- --pf-v6-c-table--cell--hidden-visible--Display: table-cell;
9229
- --pf-v6-c-table__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9230
- --pf-v6-c-table__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9231
- --pf-v6-c-table__toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
9232
- --pf-v6-c-table__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9233
- --pf-v6-c-table__toggle--c-button__toggle-icon--Rotate: 270deg;
9234
- --pf-v6-c-table__toggle--c-button__toggle-icon--Transition: .2s ease-in 0s;
9235
- --pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate: 360deg;
9236
- --pf-v6-c-table__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9237
- --pf-v6-c-table__button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9238
- --pf-v6-c-table__button--PaddingInlineStart: var(--pf-t--global--spacer--md);
9239
- --pf-v6-c-table__button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
9240
- --pf-v6-c-table__button--Color: var(--pf-t--global--text--color--regular);
9241
- --pf-v6-c-table__button--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
9242
- --pf-v6-c-table__button--OutlineOffset: calc(var(--pf-t--global--border--width--strong) * -1);
9243
- --pf-v6-c-table__button--BorderRadius: var(--pf-t--global--border--radius--small);
9244
- --pf-v6-c-table__button--hover--Color: var(--pf-t--global--text--color--regular);
9245
- --pf-v6-c-table__button--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
9246
- --pf-v6-c-table__check--PaddingInlineStart: var(--pf-t--global--spacer--sm);
9247
- --pf-v6-c-table__check--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9248
- --pf-v6-c-table__favorite--c-button--FontSize: var(--pf-t--global--font--size--body--default);
9249
- --pf-v6-c-table--cell--m-favorite--Color: var(--pf-t--global--text--color--subtle);
9250
- --pf-v6-c-table__favorite--m-favorited--c-button--Color: var(--pf-t--global--color--favorite--clicked);
9251
- --pf-v6-c-table__tr--m-ghost-row--Opacity: .4;
9252
- --pf-v6-c-table__tr--m-ghost-row--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9253
- --pf-v6-c-table__action--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9254
- --pf-v6-c-table__action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9255
- --pf-v6-c-table__action--PaddingInlineStart: var(--pf-t--global--spacer--sm);
9256
- --pf-v6-c-table__action--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9257
- --pf-v6-c-table__expandable-row--Transition: var(--pf-t--global--transition);
9258
- --pf-v6-c-table__expandable-row-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
9259
- --pf-v6-c-table__expandable-row-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
9260
- --pf-v6-c-table__expandable-row-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
9261
- --pf-v6-c-table__expandable-row-content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
9262
- --pf-v6-c-table__expandable-row-content--BorderRadius: var(--pf-t--global--border--radius--small);
9263
- --pf-v6-c-table__expandable-row-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9264
- --pf-v6-c-table__control-row--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9265
- --pf-v6-c-table__control-row--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
9266
- --pf-v6-c-table__control-row__tbody--BorderBlockEndColor: var(--pf-t--global--border--color--default);
9267
- --pf-v6-c-table__icon-inline--MarginInlineEnd: var(--pf-t--global--spacer--sm);
9268
- --pf-v6-c-table__sort--MinWidth: calc(6ch + var(--pf-v6-c-table--cell--PaddingInlineEnd) + var(--pf-v6-c-table--cell--PaddingInlineStart) + var(--pf-v6-c-table__sort-indicator--MarginInlineStart));
9269
- --pf-v6-c-table__sort--m-selected__button--Color: var(--pf-t--global--color--brand--clicked);
9270
- --pf-v6-c-table__sort--m-help--MinWidth: 15ch;
9271
- --pf-v6-c-table__sort__button__text--Color: currentcolor;
9272
- --pf-v6-c-table__sort__button--hover__text--Color: currentcolor;
9273
- --pf-v6-c-table__sort-indicator--Color: var(--pf-t--global--icon--color--subtle);
9274
- --pf-v6-c-table__sort-indicator--MarginInlineStart: var(--pf-t--global--spacer--md);
9275
- --pf-v6-c-table__sort--m-selected__sort-indicator--Color: var(--pf-t--global--color--brand--clicked);
9276
- --pf-v6-c-table__sort__button--hover__sort-indicator--Color: var(--pf-t--global--text--color--regular);
9277
- --pf-v6-c-table__th--m-help--MinWidth: 11ch;
9278
- --pf-v6-c-table__column-help--MarginInlineStart: var(--pf-t--global--spacer--sm);
9279
- --pf-v6-c-table__compound-expansion-toggle__button--Color: var(--pf-t--global--icon--color--brand--default);
9280
- --pf-v6-c-table__compound-expansion-toggle__button--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
9281
- --pf-v6-c-table__compound-expansion-toggle__button--hover--Color: var(--pf-t--global--icon--color--brand--hover);
9282
- --pf-v6-c-table__compound-expansion-toggle__button--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
9283
- --pf-v6-c-table__compound-expansion-toggle__button--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
9284
- --pf-v6-c-table__compound-expansion-toggle__button--after--BorderColor: var(--pf-t--global--border--color--clicked);
9285
- --pf-v6-c-table__compound-expansion-toggle__button--after--BorderBlockStartWidth: 0;
9286
- --pf-v6-c-table__compound-expansion-toggle__button--hover--after--BorderBlockStartWidth: var(--pf-t--global--border--width--strong);
9287
- --pf-v6-c-table__compound-expansion-toggle--m-expanded__button--after--BorderBlockStartWidth: var(--pf-t--global--border--width--strong);
9288
- --pf-v6-c-table--compound-expansion--m-expanded--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
9289
- --pf-v6-c-table--m-compact__th--PaddingBlockStart: calc(var(--pf-t--global--spacer--sm) + var(--pf-t--global--spacer--xs));
9290
- --pf-v6-c-table--m-compact__th--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9291
- --pf-v6-c-table--m-compact--cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9292
- --pf-v6-c-table--m-compact--cell--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9293
- --pf-v6-c-table--m-compact__action--PaddingBlockStart: var(--pf-t--global--spacer--xs);
9294
- --pf-v6-c-table--m-compact__action--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
9295
- --pf-v6-c-table__expandable-row--m-expanded--BorderBlockEndColor: var(--pf-t--global--border--color--default);
9296
- --pf-v6-c-table__tr--m-clickable--BackgroundColor: transparent;
9297
- --pf-v6-c-table__tr--m-clickable--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
9298
- --pf-v6-c-table__tr--m-clickable--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
9299
- --pf-v6-c-table__tr--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
9300
- --pf-v6-c-table__tr--m-selected--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
9301
- --pf-v6-c-table__tbody--m-clickable--BackgroundColor: transparent;
9302
- --pf-v6-c-table__tbody--m-clickable--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
9303
- --pf-v6-c-table__tbody--m-clickable--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
9304
- --pf-v6-c-table__tbody--m-clickable--m-expanded--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
9305
- --pf-v6-c-table__tbody--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
9306
- --pf-v6-c-table__tbody--m-selected--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
9307
- --pf-v6-c-table__thead--m-nested-column-header--button--OutlineOffset: -0.1875rem;
9308
- --pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockStart: var(--pf-t--global--spacer--xs);
9309
- --pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockEnd: var(--pf-t--global--spacer--md);
9310
- --pf-v6-c-table__subhead--Color: var(--pf-t--global--text--color--subtle);
9311
- --pf-v6-c-table__nested-column-header__button--PaddingInlineStart: calc(var(--pf-v6-c-table__button--PaddingInlineStart) - var(--pf-t--global--spacer--control--horizontal--plain));
9312
- --pf-v6-c-table__nested-column-header__button--PaddingInlineEnd: calc(var(--pf-v6-c-table__button--PaddingInlineEnd) - (var(--pf-t--global--spacer--control--horizontal--plain) / 2));
9313
- --pf-v6-c-table--m-striped__tr--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
9314
- --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-t--global--z-index--xs);
9315
- --pf-v6-c-table--m-sticky-header--ZIndex: calc(var(--pf-t--global--z-index--xs) + 1);
9316
- --pf-v6-c-table--m-sticky-header--border--ZIndex: calc(var(--pf-t--global--z-index--xs) + 2);
9317
- }
9318
- .pfext-quick-start__base :where(:root, .pf-v6-c-table) {
9319
- --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
9320
- --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
9321
- --pf-v6-c-table__sticky-cell--ZIndex: var(--pf-t--global--z-index--xs);
9322
- --pf-v6-c-table__sticky-cell--InsetInlineEnd: auto;
9323
- --pf-v6-c-table__sticky-cell--InsetInlineStart: auto;
9324
- --pf-v6-c-table__sticky-cell--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9325
- --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
9326
- --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
9327
- --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
9328
- --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
9329
- --pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd: 0;
9330
- --pf-v6-c-table__sticky-cell--m-left--InsetInlineStart: 0;
9331
- --pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex: calc(var(--pf-v6-c-table__sticky-cell--ZIndex) + 1);
9332
- }
9333
- .pfext-quick-start__base :where(:root, .pf-v6-c-table) {
9334
- --pf-v6-c-table__tree-view-main--indent--base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-table__tree-view-icon--MinWidth));
9335
- --pf-v6-c-table__tree-view-main--nested-indent--base: calc(var(--pf-v6-c-table__tree-view-main--indent--base) - var(--pf-t--global--spacer--md));
9336
- --pf-v6-c-table__tree-view-main--c-button--MarginInlineEnd: var(--pf-t--global--spacer--sm);
9337
- --pf-v6-c-table__tree-view-main--PaddingInlineStart: var(--pf-v6-c-table__tree-view-main--indent--base);
9338
- --pf-v6-c-table__tree-view-main--MarginInlineStart: calc(var(--pf-v6-c-table--cell--PaddingInlineStart) * -1);
9339
- --pf-v6-c-table__tree-view-main--c-table__check--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9340
- --pf-v6-c-table__tree-view-main--c-table__check--MarginInlineEnd: var(--pf-t--global--spacer--sm);
9341
- --pf-v6-c-table__tree-view-icon--MinWidth: var(--pf-t--global--spacer--md);
9342
- --pf-v6-c-table__tree-view-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
9343
- --pf-v6-c-table--m-tree-view__toggle--Position: absolute;
9344
- --pf-v6-c-table--m-tree-view__toggle--InsetInlineStart: var(--pf-v6-c-table__tree-view-main--PaddingInlineStart);
9345
- --pf-v6-c-table--m-tree-view__toggle--TranslateX: -100%;
9346
- --pf-v6-c-table--m-tree-view__toggle__toggle-icon--MinWidth: var(--pf-t--global--spacer--md);
9347
- --pf-v6-c-table--m-no-inset__tree-view-main--PaddingInlineStart: 0;
9348
- --pf-v6-c-table--m-no-inset__tree-view-main--MarginInlineStart: 0;
9349
- }
9350
- .pfext-quick-start__base :where(:root, .pf-v6-c-tabs) {
9351
- --pf-v6-c-tabs--inset: 0;
9352
- --pf-v6-c-tabs--Width: auto;
9353
- --pf-v6-c-tabs--before--BorderColor: var(--pf-t--global--border--color--default);
9354
- --pf-v6-c-tabs--before--border-width--base: var(--pf-t--global--border--width--regular);
9355
- --pf-v6-c-tabs--before--BorderBlockStartWidth: 0;
9356
- --pf-v6-c-tabs--before--BorderInlineEndWidth: 0;
9357
- --pf-v6-c-tabs--before--BorderBlockEndWidth: var(--pf-v6-c-tabs--before--border-width--base);
9358
- --pf-v6-c-tabs--before--BorderInlineStartWidth: 0;
9359
- --pf-v6-c-tabs--m-vertical--inset: var(--pf-t--global--spacer--sm);
9360
- --pf-v6-c-tabs--m-page-insets--inset: var(--pf-t--global--spacer--md);
9361
- --pf-v6-c-tabs--m-vertical--Width: 100%;
9362
- --pf-v6-c-tabs--m-vertical--MaxWidth: 15.625rem;
9363
- --pf-v6-c-tabs--m-vertical--m-box--inset: var(--pf-t--global--spacer--md);
9364
- --pf-v6-c-tabs--m-vertical__list--before--BorderColor: var(--pf-v6-c-tabs--before--BorderColor);
9365
- --pf-v6-c-tabs--m-vertical__list--before--BorderBlockStartWidth: 0;
9366
- --pf-v6-c-tabs--m-vertical__list--before--BorderInlineEndWidth: 0;
9367
- --pf-v6-c-tabs--m-vertical__list--before--BorderBlockEndWidth: 0;
9368
- --pf-v6-c-tabs--m-vertical__list--before--BorderInlineStartWidth: var(--pf-v6-c-tabs--before--border-width--base);
9369
- --pf-v6-c-tabs__list--Display: flex;
9370
- --pf-v6-c-tabs__item--BackgroundColor: transparent;
9371
- --pf-v6-c-tabs__item--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9372
- --pf-v6-c-tabs__item--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9373
- --pf-v6-c-tabs__item--PaddingInlineStart: var(--pf-t--global--spacer--sm);
9374
- --pf-v6-c-tabs__item--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9375
- --pf-v6-c-tabs__item--ColumnGap: var(--pf-t--global--spacer--xs);
9376
- --pf-v6-c-tabs--m-vertical__item--PaddingInlineStart: var(--pf-t--global--spacer--md);
9377
- --pf-v6-c-tabs--m-vertical__item--PaddingInlineEnd: var(--pf-t--global--spacer--md);
9378
- --pf-v6-c-tabs__item--m-current--BackgroundColor: transparent;
9379
- --pf-v6-c-tabs--m-box__item--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
9380
- --pf-v6-c-tabs--m-box__item--m-current--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9381
- --pf-v6-c-tabs--m-box--m-secondary__item--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9382
- --pf-v6-c-tabs--m-box--m-secondary__item--m-current--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
9383
- --pf-v6-c-tabs__item--m-action--before--ZIndex: var(--pf-t--global--z-index--sm);
9384
- --pf-v6-c-tabs__link--Color: var(--pf-t--global--text--color--subtle);
9385
- --pf-v6-c-tabs__link--FontSize: var(--pf-t--global--font--size--sm);
9386
- --pf-v6-c-tabs__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
9387
- --pf-v6-c-tabs__link--BorderRadius: var(--pf-t--global--border--radius--small);
9388
- --pf-v6-c-tabs__link--PaddingBlockStart: var(--pf-t--global--spacer--xs);
9389
- --pf-v6-c-tabs__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9390
- --pf-v6-c-tabs__link--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
9391
- --pf-v6-c-tabs__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
9392
- --pf-v6-c-tabs__link--ColumnGap: var(--pf-t--global--spacer--sm);
9393
- --pf-v6-c-tabs__link--disabled--Color: var(--pf-t--global--text--color--on-disabled);
9394
- --pf-v6-c-tabs__link--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9395
- --pf-v6-c-tabs__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
9396
- --pf-v6-c-tabs__item--m-current__link--Color: var(--pf-t--global--text--color--regular);
9397
- --pf-v6-c-tabs__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
9398
- --pf-v6-c-tabs--m-vertical__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
9399
- --pf-v6-c-tabs--m-vertical__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9400
- --pf-v6-c-tabs--m-box__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
9401
- --pf-v6-c-tabs--m-box__link--disabled--Color: var(--pf-t--global--text--color--on-disabled);
9402
- --pf-v6-c-tabs--m-box__link--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9403
- --pf-v6-c-tabs--m-box__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
9404
- --pf-v6-c-tabs--m-box__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
9405
- --pf-v6-c-tabs--m-box--m-secondary__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
9406
- --pf-v6-c-tabs--m-box--m-secondary__link--disabled--Color: var(--pf-t--global--text--color--on-disabled);
9407
- --pf-v6-c-tabs--m-box--m-secondary__link--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9408
- --pf-v6-c-tabs--m-box--m-secondary__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
9409
- --pf-v6-c-tabs--m-box--m-secondary__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
9410
- --pf-v6-c-tabs--m-subtab__link--FontSize: var(--pf-t--global--font--size--xs);
9411
- --pf-v6-c-tabs__link--before--border-color--base: var(--pf-t--global--border--color--default);
9412
- --pf-v6-c-tabs__link--before--border-width--base: var(--pf-t--global--border--width--regular);
9413
- --pf-v6-c-tabs__link--before--BorderBlockStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
9414
- --pf-v6-c-tabs__link--before--BorderInlineEndColor: var(--pf-v6-c-tabs__link--before--border-color--base);
9415
- --pf-v6-c-tabs__link--before--BorderBlockEndColor: var(--pf-v6-c-tabs__link--before--border-color--base);
9416
- --pf-v6-c-tabs__link--before--BorderInlineStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
9417
- --pf-v6-c-tabs__link--before--BorderBlockStartWidth: 0;
9418
- --pf-v6-c-tabs__link--before--BorderInlineEndWidth: 0;
9419
- --pf-v6-c-tabs__link--before--BorderBlockEndWidth: 0;
9420
- --pf-v6-c-tabs__link--before--BorderInlineStartWidth: 0;
9421
- --pf-v6-c-tabs__link--before--InsetInlineStart: calc(var(--pf-v6-c-tabs__link--before--border-width--base) * -1);
9422
- --pf-v6-c-tabs__link--disabled--before--BorderInlineEndWidth: 0;
9423
- --pf-v6-c-tabs__link--disabled--before--BorderBlockEndWidth: var(--pf-v6-c-tabs--before--border-width--base);
9424
- --pf-v6-c-tabs__link--disabled--before--BorderInlineStartWidth: 0;
9425
- --pf-v6-c-tabs__link--after--InsetBlockStart: auto;
9426
- --pf-v6-c-tabs__link--after--InsetInlineEnd: 0;
9427
- --pf-v6-c-tabs__link--after--InsetBlockEnd: 0;
9428
- --pf-v6-c-tabs__link--after--BorderColor: var(--pf-t--global--border--color--default);
9429
- --pf-v6-c-tabs__link--after--BorderWidth: 0;
9430
- --pf-v6-c-tabs__link--after--BorderBlockStartWidth: 0;
9431
- --pf-v6-c-tabs__link--after--BorderInlineEndWidth: 0;
9432
- --pf-v6-c-tabs__link--after--BorderInlineStartWidth: 0;
9433
- --pf-v6-c-tabs__item--m-current__link--after--BorderColor: var(--pf-t--global--border--color--clicked);
9434
- --pf-v6-c-tabs__item--m-current__link--after--BorderWidth: var(--pf-t--global--border--width--extra-strong);
9435
- --pf-v6-c-tabs__scroll-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9436
- --pf-v6-c-tabs__scroll-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9437
- --pf-v6-c-tabs__scroll-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
9438
- --pf-v6-c-tabs__scroll-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9439
- --pf-v6-c-tabs__scroll-button--Width: var(--pf-t--global--spacer--2xl);
9440
- --pf-v6-c-tabs__scroll-button--TransitionDuration--margin: .125s;
9441
- --pf-v6-c-tabs__scroll-button--TransitionDuration--transform: .125s;
9442
- --pf-v6-c-tabs__scroll-button--TransitionDuration--opacity: .125s;
9443
- --pf-v6-c-tabs__scroll-button--before--BorderColor: var(--pf-v6-c-tabs--before--BorderColor);
9444
- --pf-v6-c-tabs__scroll-button--before--border-width--base: var(--pf-t--global--border--width--regular);
9445
- --pf-v6-c-tabs__scroll-button--before--BorderInlineEndWidth: 0;
9446
- --pf-v6-c-tabs__scroll-button--before--BorderBlockEndWidth: var(--pf-v6-c-tabs__scroll-button--before--border-width--base);
9447
- --pf-v6-c-tabs__scroll-button--before--BorderInlineStartWidth: 0;
9448
- --pf-v6-c-tabs__list--ScrollSnapTypeAxis: x;
9449
- --pf-v6-c-tabs__list--ScrollSnapTypeStrictness: proximity;
9450
- --pf-v6-c-tabs__list--ScrollSnapType: var(--pf-v6-c-tabs__list--ScrollSnapTypeAxis) var(--pf-v6-c-tabs__list--ScrollSnapTypeStrictness);
9451
- --pf-v6-c-tabs__item--ScrollSnapAlign: end;
9452
- --pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis: y;
9453
- --pf-v6-c-tabs__toggle--Display: flex;
9454
- --pf-v6-c-tabs__toggle-icon--Transition: all 250ms cubic-bezier(.42, 0, .58, 1);
9455
- --pf-v6-c-tabs__toggle-icon--Rotate: 0;
9456
- --pf-v6-c-tabs--m-expanded__toggle-icon--Rotate: 90deg;
9457
- --pf-v6-c-tabs--m-expandable--RowGap: var(--pf-t--global--spacer--sm);
9458
- --pf-v6-c-tabs--m-expandable--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9459
- --pf-v6-c-tabs--m-expandable--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9460
- --pf-v6-c-tabs--m-expandable--PaddingInlineStart: var(--pf-t--global--spacer--md);
9461
- --pf-v6-c-tabs--m-expandable--PaddingInlineEnd: var(--pf-t--global--spacer--md);
9462
- --pf-v6-c-tabs__item-action--c-button--FontSize: var(--pf-t--global--font--size--sm);
9463
- --pf-v6-c-tabs--m-subtab__item-action--c-button--FontSize: var(--pf-t--global--font--size--xs);
9464
- --pf-v6-c-tabs__item-action-icon--MarginBlockStart: 0.125rem;
9465
- --pf-v6-c-tabs__add--before--BorderColor: var(--pf-v6-c-tabs__link--before--border-color--base);
9466
- --pf-v6-c-tabs__add--before--BorderInlineStartWidth: var(--pf-v6-c-tabs__link--before--border-width--base);
9467
- --pf-v6-c-tabs__add--c-button--FontSize: var(--pf-t--global--font--size--sm);
9468
- --pf-v6-c-tabs--m-subtab__add--c-button--FontSize: var(--pf-t--global--font--size--xs);
9469
- --pf-v6-c-tabs__add--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9470
- --pf-v6-c-tabs__add--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9471
- --pf-v6-c-tabs__add--PaddingInlineStart: var(--pf-t--global--spacer--sm);
9472
- --pf-v6-c-tabs__add--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9473
- --pf-v6-c-tabs__link-toggle-icon--Color: var(--pf-t--global--icon--color--regular);
9474
- --pf-v6-c-tabs__link-toggle-icon--Transition: .2s ease-in 0s;
9475
- --pf-v6-c-tabs__link-toggle-icon--Rotate: 0;
9476
- --pf-v6-c-tabs__link-toggle-icon--FontSize: var(--pf-t--global--font--size--sm);
9477
- --pf-v6-c-tabs__link--m-expanded__toggle-icon--Rotate: 90deg;
9478
- }
9479
- .pfext-quick-start__base :where(:root, .pf-v6-c-text-input-group) {
7889
+ .pfext-quick-start__base .pf-v6-c-text-input-group {
9480
7890
  --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
9481
7891
  --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
9482
7892
  --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
@@ -9491,7 +7901,8 @@ ul) {
9491
7901
  --pf-v6-c-text-input-group--m-hover--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
9492
7902
  --pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
9493
7903
  --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));
9494
- --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
7904
+ --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));
7905
+ --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));
9495
7906
  --pf-v6-c-text-input-group__main--RowGap: var(--pf-t--global--spacer--xs);
9496
7907
  --pf-v6-c-text-input-group__main--ColumnGap: var(--pf-t--global--spacer--xs);
9497
7908
  --pf-v6-c-text-input-group__text--BorderRadius--base: var(--pf-t--global--border--radius--small);
@@ -9512,12 +7923,13 @@ ul) {
9512
7923
  --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
9513
7924
  --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
9514
7925
  --pf-v6-c-text-input-group__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
9515
- --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--sm);
9516
- --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
7926
+ --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
7927
+ --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
7928
+ --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
9517
7929
  --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
9518
- --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
7930
+ --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
9519
7931
  --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
9520
- --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--disabled);
7932
+ --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
9521
7933
  --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
9522
7934
  --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
9523
7935
  --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
@@ -9584,6 +7996,10 @@ ul) {
9584
7996
  .pfext-quick-start__base .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) {
9585
7997
  --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd);
9586
7998
  }
7999
+ .pfext-quick-start__base .pf-v6-c-text-input-group:has(> .pf-v6-c-text-input-group__utilities) {
8000
+ --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd);
8001
+ --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd);
8002
+ }
9587
8003
  .pfext-quick-start__base .pf-v6-c-text-input-group__main {
9588
8004
  display: flex;
9589
8005
  flex: 1;
@@ -9663,47 +8079,7 @@ ul) {
9663
8079
  .pfext-quick-start__base .pf-v6-c-text-input-group__group {
9664
8080
  display: flex;
9665
8081
  }
9666
- .pfext-quick-start__base :where(:root, .pf-v6-c-tile) {
9667
- --pf-v6-c-tile--PaddingBlockStart: var(--pf-t--global--spacer--lg);
9668
- --pf-v6-c-tile--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
9669
- --pf-v6-c-tile--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
9670
- --pf-v6-c-tile--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9671
- --pf-v6-c-tile--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9672
- --pf-v6-c-tile--BorderRadius: var(--pf-t--global--border--radius--medium);
9673
- --pf-v6-c-tile--before--BorderColor: var(--pf-t--global--border--color--default);
9674
- --pf-v6-c-tile--before--BorderWidth: var(--pf-t--global--border--width--box--default);
9675
- --pf-v6-c-tile--before--BorderRadius: var(--pf-v6-c-tile--BorderRadius);
9676
- --pf-v6-c-tile--after--BackgroundColor: transparent;
9677
- --pf-v6-c-tile__icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
9678
- --pf-v6-c-tile__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
9679
- --pf-v6-c-tile__icon--Color: var(--pf-t--global--icon--color--regular);
9680
- --pf-v6-c-tile__title--Color: var(--pf-t--global--text--color--regular);
9681
- --pf-v6-c-tile__title--FontWeight: var(--pf-t--global--font--weight--body--bold);
9682
- --pf-v6-c-tile__body--Color: var(--pf-t--global--text--color--regular);
9683
- --pf-v6-c-tile__body--FontSize: var(--pf-t--global--font--size--body--sm);
9684
- --pf-v6-c-tile--hover--before--BorderColor: var(--pf-t--global--border--color--hover);
9685
- --pf-v6-c-tile--m-selected--before--BorderColor: var(--pf-t--global--border--color--clicked);
9686
- --pf-v6-c-tile--m-selected--before--BorderWidth: var(--pf-t--global--border--width--box--clicked);
9687
- --pf-v6-c-tile--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9688
- --pf-v6-c-tile--m-disabled__title--Color: var(--pf-t--global--text--color--on-disabled);
9689
- --pf-v6-c-tile--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
9690
- --pf-v6-c-tile--m-disabled__body--Color: var(--pf-t--global--text--color--on-disabled);
9691
- --pf-v6-c-tile__header--m-stacked__icon--MarginBlockEnd: var(--pf-t--global--spacer--md);
9692
- --pf-v6-c-tile__header--m-stacked__icon--FontSize: var(--pf-t--global--icon--size--xl);
9693
- --pf-v6-c-tile--m-display-lg__header--m-stacked__icon--FontSize: var(--pf-t--global--icon--size--2xl);
9694
- }
9695
- .pfext-quick-start__base :where(:root, .pf-v6-c-timestamp) {
9696
- --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
9697
- --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
9698
- --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
9699
- --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
9700
- --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
9701
- --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
9702
- --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
9703
- --pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
9704
- --pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
9705
- }
9706
- .pfext-quick-start__base :where(:root, .pf-v6-c-title) {
8082
+ .pfext-quick-start__base .pf-v6-c-title {
9707
8083
  --pf-v6-c-title--FontFamily: var(--pf-t--global--font--family--heading);
9708
8084
  --pf-v6-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
9709
8085
  --pf-v6-c-title--m-4xl--FontSize: var(--pf-t--global--font--size--heading--2xl);
@@ -9806,44 +8182,7 @@ ul) {
9806
8182
  font-weight: var(--pf-v6-c-title--m-h6--FontWeight);
9807
8183
  line-height: var(--pf-v6-c-title--m-h6--LineHeight);
9808
8184
  }
9809
- .pfext-quick-start__base :where(:root, .pf-v6-c-toggle-group) {
9810
- --pf-v6-c-toggle-group__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9811
- --pf-v6-c-toggle-group__button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
9812
- --pf-v6-c-toggle-group__button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
9813
- --pf-v6-c-toggle-group__button--PaddingInlineStart: var(--pf-t--global--spacer--md);
9814
- --pf-v6-c-toggle-group__button--FontSize: var(--pf-t--global--font--size--body--default);
9815
- --pf-v6-c-toggle-group__button--LineHeight: var(--pf-t--global--font--line-height--body);
9816
- --pf-v6-c-toggle-group__button--Color: var(--pf-t--global--text--color--regular);
9817
- --pf-v6-c-toggle-group__button--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
9818
- --pf-v6-c-toggle-group__button--ZIndex: auto;
9819
- --pf-v6-c-toggle-group__button--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
9820
- --pf-v6-c-toggle-group__button--hover--ZIndex: var(--pf-t--global--z-index--xs);
9821
- --pf-v6-c-toggle-group__button--hover--before--BorderColor: var(--pf-t--global--border--color--default);
9822
- --pf-v6-c-toggle-group__button--before--BorderWidth: var(--pf-t--global--border--width--control--default);
9823
- --pf-v6-c-toggle-group__button--before--BorderColor: var(--pf-t--global--border--color--default);
9824
- --pf-v6-c-toggle-group__item--item--MarginInlineStart: calc(-1 * var(--pf-t--global--border--width--control--default));
9825
- --pf-v6-c-toggle-group__item--first-child__button--BorderStartStartRadius: var(--pf-t--global--border--radius--tiny);
9826
- --pf-v6-c-toggle-group__item--first-child__button--BorderEndStartRadius: var(--pf-t--global--border--radius--tiny);
9827
- --pf-v6-c-toggle-group__item--last-child__button--BorderStartEndRadius: var(--pf-t--global--border--radius--tiny);
9828
- --pf-v6-c-toggle-group__item--last-child__button--BorderEndEndRadius: var(--pf-t--global--border--radius--tiny);
9829
- --pf-v6-c-toggle-group__icon--text--MarginInlineStart: var(--pf-t--global--spacer--sm);
9830
- --pf-v6-c-toggle-group__button--m-selected--BackgroundColor: var(--pf-t--global--color--brand--default);
9831
- --pf-v6-c-toggle-group__button--m-selected--Color: var(--pf-t--global--text--color--on-brand--default);
9832
- --pf-v6-c-toggle-group__button--m-selected--before--BorderColor: var(--pf-t--global--border--color--clicked);
9833
- --pf-v6-c-toggle-group__button--m-selected-selected--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
9834
- --pf-v6-c-toggle-group__button--m-selected--ZIndex: var(--pf-t--global--z-index--xs);
9835
- --pf-v6-c-toggle-group__button--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9836
- --pf-v6-c-toggle-group__button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
9837
- --pf-v6-c-toggle-group__button--disabled--before--BorderColor: var(--pf-t--global--border--color--disabled);
9838
- --pf-v6-c-toggle-group__button--disabled-disabled--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
9839
- --pf-v6-c-toggle-group__button--disabled--ZIndex: var(--pf-t--global--z-index--xs);
9840
- --pf-v6-c-toggle-group--m-compact__button--PaddingBlockStart: 0;
9841
- --pf-v6-c-toggle-group--m-compact__button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9842
- --pf-v6-c-toggle-group--m-compact__button--PaddingBlockEnd: 0;
9843
- --pf-v6-c-toggle-group--m-compact__button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
9844
- --pf-v6-c-toggle-group--m-compact__button--FontSize: var(--pf-t--global--font--size--body--default);
9845
- }
9846
- .pfext-quick-start__base :where(:root, .pf-v6-c-toolbar) {
8185
+ .pfext-quick-start__base .pf-v6-c-toolbar {
9847
8186
  --pf-v6-c-toolbar--RowGap: var(--pf-t--global--spacer--md);
9848
8187
  --pf-v6-c-toolbar--PaddingBlockStart: 0;
9849
8188
  --pf-v6-c-toolbar--PaddingBlockEnd: var(--pf-t--global--spacer--md);
@@ -9882,7 +8221,8 @@ ul) {
9882
8221
  --pf-v6-c-toolbar--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
9883
8222
  --pf-v6-c-toolbar--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9884
8223
  --pf-v6-c-toolbar__expand-all-icon--Rotate: 0;
9885
- --pf-v6-c-toolbar__expand-all-icon--Transition: var(--pf-t--global--transition);
8224
+ --pf-v6-c-toolbar__expand-all-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
8225
+ --pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
9886
8226
  --pf-v6-c-toolbar__item--m-expand-all--m-expanded__expand-all-icon--Rotate: 90deg;
9887
8227
  --pf-v6-c-toolbar__group--m-filter-group--ColumnGap: var(--pf-t--global--spacer--gap--control-to-control--default);
9888
8228
  --pf-v6-c-toolbar__item--m-label--FontWeight: var(--pf-t--global--font--weight--body--bold);
@@ -10047,6 +8387,7 @@ ul) {
10047
8387
  padding-block-end: var(--pf-v6-c-toolbar--m-sticky--PaddingBlockEnd);
10048
8388
  box-shadow: var(--pf-v6-c-toolbar--m-sticky--BoxShadow);
10049
8389
  }
8390
+ .pfext-quick-start__base .pf-v6-c-toolbar.pf-m-static,
10050
8391
  .pfext-quick-start__base .pf-v6-c-toolbar.pf-m-static .pf-v6-c-toolbar__content {
10051
8392
  position: static;
10052
8393
  }
@@ -10153,6 +8494,7 @@ ul) {
10153
8494
  }
10154
8495
  .pfext-quick-start__base .pf-v6-c-toolbar__group.pf-m-label-group {
10155
8496
  flex: 1;
8497
+ flex-wrap: wrap;
10156
8498
  column-gap: var(--pf-v6-c-toolbar__group--m-label-group--ColumnGap);
10157
8499
  }
10158
8500
  .pfext-quick-start__base .pf-v6-c-toolbar__group.pf-m-action-group {
@@ -10171,6 +8513,7 @@ ul) {
10171
8513
  .pfext-quick-start__base .pf-v6-c-toolbar__expandable-content {
10172
8514
  position: absolute;
10173
8515
  inset-block-start: 100%;
8516
+ inset-inline-start: 0;
10174
8517
  z-index: var(--pf-v6-c-toolbar__expandable-content--ZIndex);
10175
8518
  display: none;
10176
8519
  row-gap: var(--pf-v6-c-toolbar__expandable-content--RowGap);
@@ -10202,7 +8545,7 @@ ul) {
10202
8545
  }
10203
8546
  .pfext-quick-start__base .pf-v6-c-toolbar__expand-all-icon {
10204
8547
  display: inline-flex;
10205
- transition: var(--pf-v6-c-toolbar__expand-all-icon--Transition);
8548
+ transition: transform var(--pf-v6-c-toolbar__expand-all-icon--TransitionDuration) var(--pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction);
10206
8549
  transform: rotate(var(--pf-v6-c-toolbar__expand-all-icon--Rotate));
10207
8550
  }
10208
8551
  .pfext-quick-start__base :where(.pf-v6-m-dir-rtl, [dir="rtl"]) .pf-v6-c-toolbar__expand-all-icon {
@@ -11727,7 +10070,7 @@ ul) {
11727
10070
  display: inline-flex;
11728
10071
  }
11729
10072
  }
11730
- .pfext-quick-start__base :where(:root, .pf-v6-c-tooltip) {
10073
+ .pfext-quick-start__base .pf-v6-c-tooltip {
11731
10074
  --pf-v6-c-tooltip--MaxWidth: 18.75rem;
11732
10075
  --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
11733
10076
  --pf-v6-c-tooltip__content--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -11845,130 +10188,7 @@ ul) {
11845
10188
  box-shadow: var(--pf-v6-c-tooltip__arrow--BoxShadow);
11846
10189
  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));
11847
10190
  }
11848
- .pfext-quick-start__base :where(:root, .pf-v6-c-truncate) {
11849
- --pf-v6-c-truncate--MinWidth: 6ch;
11850
- --pf-v6-c-truncate__start--MinWidth: 6ch;
11851
- }
11852
- .pfext-quick-start__base :where(:root, .pf-v6-c-number-input) {
11853
- --pf-v6-c-number-input__unit--c-input-group--MarginInlineStart: var(--pf-t--global--spacer--sm);
11854
- --pf-v6-c-number-input__icon--FontSize: var(--pf-t--global--font--size--xs);
11855
- --pf-v6-c-number-input--c-form-control--width-base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-t--global--border--width--box--default) * 2);
11856
- --pf-v6-c-number-input--c-form-control--width-icon: var(--pf-t--global--spacer--xl);
11857
- --pf-v6-c-number-input--c-form-control--width-chars: 4;
11858
- --pf-v6-c-number-input--c-form-control--Width:
11859
- calc(
11860
- calc(
11861
- var(--pf-v6-c-number-input--c-form-control--width-base) + var(--pf-v6-c-number-input--c-form-control--width-chars) * 1ch
11862
- ) + var(--pf-v6-c-number-input--c-form-control--width-icon)
11863
- );
11864
- }
11865
- .pfext-quick-start__base :where(:root, .pf-v6-c-tree-view) {
11866
- --pf-v6-c-tree-view__node--indent--base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-tree-view__node-toggle-icon--MinWidth));
11867
- --pf-v6-c-tree-view__node--nested-indent--base: calc(var(--pf-v6-c-tree-view__node--indent--base) - var(--pf-t--global--spacer--md));
11868
- --pf-v6-c-tree-view__content--BorderRadius: var(--pf-t--global--border--radius--small);
11869
- --pf-v6-c-tree-view__node--PaddingBlockStart: var(--pf-t--global--spacer--sm);
11870
- --pf-v6-c-tree-view__node--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
11871
- --pf-v6-c-tree-view__node--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
11872
- --pf-v6-c-tree-view__node--PaddingInlineStart: var(--pf-v6-c-tree-view__node--indent--base);
11873
- --pf-v6-c-tree-view__node--Color: var(--pf-t--global--text--color--subtle);
11874
- --pf-v6-c-tree-view__node--BackgroundColor: transparent;
11875
- --pf-v6-c-tree-view__node--m-current--Color: var(--pf-t--global--text--color--regular);
11876
- --pf-v6-c-tree-view__node--m-current--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
11877
- --pf-v6-c-tree-view__node--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
11878
- --pf-v6-c-tree-view__node-container--Display: contents;
11879
- --pf-v6-c-tree-view__node-content--RowGap: var(--pf-t--global--spacer--sm);
11880
- --pf-v6-c-tree-view__node-content--Overflow: visible;
11881
- --pf-v6-c-tree-view__list-item__list-item__node-toggle--InsetBlockStart: var(--pf-v6-c-tree-view__node--PaddingBlockStart);
11882
- --pf-v6-c-tree-view__list-item__list-item__node-toggle--InsetInlineStart: var(--pf-v6-c-tree-view__node--PaddingInlineStart);
11883
- --pf-v6-c-tree-view__list-item__list-item__node-toggle--TranslateX: -100%;
11884
- --pf-v6-c-tree-view__node-toggle--Position: absolute;
11885
- --pf-v6-c-tree-view__node-toggle--Color--base: var(--pf-t--global--icon--color--subtle);
11886
- --pf-v6-c-tree-view__node-toggle--Color: var(--pf-v6-c-tree-view__node-toggle--Color--base);
11887
- --pf-v6-c-tree-view__node-toggle--BackgroundColor: transparent;
11888
- --pf-v6-c-tree-view__list-item--m-expanded__node-toggle--Color: var(--pf-t--global--icon--color--regular);
11889
- --pf-v6-c-tree-view__node-toggle-icon--MinWidth: var(--pf-t--global--icon--size--font--body--default);
11890
- --pf-v6-c-tree-view__node-toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
11891
- --pf-v6-c-tree-view__node-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
11892
- --pf-v6-c-tree-view__node-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
11893
- --pf-v6-c-tree-view__node-toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
11894
- --pf-v6-c-tree-view__node-toggle--MarginBlockStart: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingBlockStart) * -1);
11895
- --pf-v6-c-tree-view__node-toggle--MarginBlockEnd: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingBlockStart) * -1);
11896
- --pf-v6-c-tree-view__node-check--MarginInlineEnd: var(--pf-t--global--spacer--sm);
11897
- --pf-v6-c-tree-view__node-count--MarginInlineStart: var(--pf-t--global--spacer--sm);
11898
- --pf-v6-c-tree-view__search--PaddingBlockStart: var(--pf-t--global--spacer--sm);
11899
- --pf-v6-c-tree-view__search--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
11900
- --pf-v6-c-tree-view__search--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
11901
- --pf-v6-c-tree-view__search--PaddingInlineStart: var(--pf-t--global--spacer--sm);
11902
- --pf-v6-c-tree-view__node-icon--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
11903
- --pf-v6-c-tree-view__node-icon--Color: var(--pf-t--global--icon--color--subtle);
11904
- --pf-v6-c-tree-view__node-toggle-icon--base--Rotate: 0;
11905
- --pf-v6-c-tree-view__node-toggle-icon--Rotate: var(--pf-v6-c-tree-view__node-toggle-icon--base--Rotate);
11906
- --pf-v6-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate: 90deg;
11907
- --pf-v6-c-tree-view__node-text--max-lines: 1;
11908
- --pf-v6-c-tree-view__node-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
11909
- --pf-v6-c-tree-view__action--MarginInlineEnd: var(--pf-t--global--spacer--md);
11910
- --pf-v6-c-tree-view--m-guides--guide--InsetInlineStart: var(--pf-v6-c-tree-view--m-guides--guide-left--base);
11911
- --pf-v6-c-tree-view--m-guides--guide-color--base: var(--pf-t--global--border--color--default);
11912
- --pf-v6-c-tree-view--m-guides--guide-width--base: var(--pf-t--global--border--width--divider--default);
11913
- --pf-v6-c-tree-view--m-guides--guide-left--base: calc(var(--pf-v6-c-tree-view__node--PaddingInlineStart) - var(--pf-v6-c-tree-view--m-guides__list-node--guide-width--base));
11914
- --pf-v6-c-tree-view--m-guides--guide-left--base--offset: calc(var(--pf-v6-c-tree-view__list-item__list-item__node-toggle--InsetInlineStart) + var(--pf-v6-c-tree-view__node-toggle-icon--MinWidth) / 2);
11915
- --pf-v6-c-tree-view--m-guides__list-node--guide-width--base: var(--pf-t--global--spacer--lg);
11916
- --pf-v6-c-tree-view--m-guides__list-item--before--InsetBlockStart: 0;
11917
- --pf-v6-c-tree-view--m-guides__list-item--before--Width: var(--pf-v6-c-tree-view--m-guides--guide-width--base);
11918
- --pf-v6-c-tree-view--m-guides__list-item--before--Height: 100%;
11919
- --pf-v6-c-tree-view--m-guides__list-item--before--BackgroundColor: var(--pf-v6-c-tree-view--m-guides--guide-color--base);
11920
- --pf-v6-c-tree-view--m-guides__list-item--last-child--before--InsetBlockStart: var(--pf-v6-c-tree-view--m-guides__node--before--InsetBlockStart);
11921
- --pf-v6-c-tree-view--m-guides__list-item--last-child--before--Height: var(--pf-v6-c-tree-view--m-guides__list-item--last-child--before--InsetBlockStart);
11922
- --pf-v6-c-tree-view--m-guides__list-item--ZIndex: var(--pf-t--global--z-index--xs);
11923
- --pf-v6-c-tree-view--m-guides__node--before--Width: 1rem;
11924
- --pf-v6-c-tree-view--m-guides__node--before--Height: var(--pf-v6-c-tree-view--m-guides--guide-width--base);
11925
- --pf-v6-c-tree-view--m-guides__node--before--InsetBlockStart: 1.125rem;
11926
- --pf-v6-c-tree-view--m-guides__node--before--BackgroundColor: var(--pf-v6-c-tree-view--m-guides--guide-color--base);
11927
- --pf-v6-c-tree-view--m-compact--base-border--InsetInlineStart--offset: var(--pf-t--global--spacer--md);
11928
- --pf-v6-c-tree-view--m-compact--base-border--InsetInlineStart: calc(var(--pf-v6-c-tree-view__node--PaddingInlineStart) - var(--pf-v6-c-tree-view--m-compact--base-border--InsetInlineStart--offset));
11929
- --pf-v6-c-tree-view--m-compact__node--indent--base: var(--pf-v6-c-tree-view__node--indent--base);
11930
- --pf-v6-c-tree-view--m-compact__node--nested-indent--base: var(--pf-t--global--spacer--lg);
11931
- --pf-v6-c-tree-view--m-compact--border--InsetInlineStart: var(--pf-v6-c-tree-view--m-compact--base-border--InsetInlineStart);
11932
- --pf-v6-c-tree-view--m-compact__node--Color: var(--pf-t--global--text--color--regular);
11933
- --pf-v6-c-tree-view--m-compact__node--PaddingBlockStart: 0;
11934
- --pf-v6-c-tree-view--m-compact__node--PaddingBlockEnd: 0;
11935
- --pf-v6-c-tree-view--m-compact__node--nested--PaddingBlockStart: var(--pf-t--global--spacer--sm);
11936
- --pf-v6-c-tree-view--m-compact__node--nested--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
11937
- --pf-v6-c-tree-view--m-compact__list-item__list-item__node-toggle--InsetBlockStart: calc(var(--pf-v6-c-tree-view--m-compact__node-container--PaddingBlockStart));
11938
- --pf-v6-c-tree-view--m-compact__list-item--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
11939
- --pf-v6-c-tree-view--m-compact__list-item--BorderBlockEndColor: var(--pf-t--global--border--color--default);
11940
- --pf-v6-c-tree-view--m-compact__list-item--before--InsetBlockStart: 0;
11941
- --pf-v6-c-tree-view--m-compact__list-item--last-child--before--Height: var(--pf-v6-c-tree-view--m-compact__node--before--InsetBlockStart);
11942
- --pf-v6-c-tree-view--m-compact__list-item--nested--before--InsetBlockStart: calc(var(--pf-v6-c-tree-view--m-compact__node--nested--PaddingBlockStart) * -1);
11943
- --pf-v6-c-tree-view--m-compact__list-item--nested--last-child--before--Height: calc(var(--pf-v6-c-tree-view--m-compact__node--before--InsetBlockStart) + var(--pf-v6-c-tree-view--m-compact__node--nested--PaddingBlockStart));
11944
- --pf-v6-c-tree-view--m-compact__node--PaddingInlineStart: var(--pf-v6-c-tree-view--m-compact__node--indent--base);
11945
- --pf-v6-c-tree-view--m-compact__node--before--InsetBlockStart: calc(var(--pf-v6-c-tree-view--m-compact__node-container--PaddingBlockStart) + var(--pf-v6-c-tree-view--m-compact__node--nested--PaddingBlockStart) + 0.25rem);
11946
- --pf-v6-c-tree-view--m-compact__node--level-2--PaddingInlineStart: var(--pf-v6-c-tree-view--m-compact__node--indent--base);
11947
- --pf-v6-c-tree-view--m-compact__node-toggle--nested--MarginInlineEnd: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingInlineStart) * -.5);
11948
- --pf-v6-c-tree-view--m-compact__node-toggle--nested--MarginInlineStart: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingInlineStart) * -1.5);
11949
- --pf-v6-c-tree-view--m-compact__node-container--Display: flex;
11950
- --pf-v6-c-tree-view--m-compact__node-container--PaddingBlockEnd--base: var(--pf-t--global--spacer--lg);
11951
- --pf-v6-c-tree-view--m-compact__node-container--PaddingBlockStart: var(--pf-t--global--spacer--lg);
11952
- --pf-v6-c-tree-view--m-compact__node-container--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
11953
- --pf-v6-c-tree-view--m-compact__node-container--PaddingBlockEnd: var(--pf-v6-c-tree-view--m-compact__node-container--PaddingBlockEnd--base);
11954
- --pf-v6-c-tree-view--m-compact__node-container--PaddingInlineStart: var(--pf-t--global--spacer--xs);
11955
- --pf-v6-c-tree-view--m-compact__node-container--BorderRadius: var(--pf-t--global--border--radius--small);
11956
- --pf-v6-c-tree-view--m-compact__node-container--nested--PaddingBlockStart: var(--pf-t--global--spacer--md);
11957
- --pf-v6-c-tree-view--m-compact__node-container--nested--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
11958
- --pf-v6-c-tree-view--m-compact__node-container--nested--PaddingBlockEnd: var(--pf-t--global--spacer--md);
11959
- --pf-v6-c-tree-view--m-compact__node-container--nested--PaddingInlineStart: var(--pf-t--global--spacer--lg);
11960
- --pf-v6-c-tree-view--m-compact__node-container--nested--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
11961
- --pf-v6-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBlockEnd: 0;
11962
- --pf-v6-c-tree-view--m-no-background__node-container--BackgroundColor: transparent;
11963
- --pf-v6-c-tree-view--m-compact--m-no-background--base-border--InsetInlineStart--offset: var(--pf-t--global--spacer--sm);
11964
- --pf-v6-c-tree-view--m-compact--m-no-background--base-border--InsetInlineStart: calc(var(--pf-v6-c-tree-view__node--PaddingInlineStart) - var(--pf-v6-c-tree-view--m-compact--m-no-background--base-border--InsetInlineStart--offset));
11965
- --pf-v6-c-tree-view--m-compact--m-no-background__node--indent--base: var(--pf-v6-c-tree-view__node--indent--base);
11966
- --pf-v6-c-tree-view--m-compact--m-no-background__node--nested-indent--base: var(--pf-t--global--spacer--2xl);
11967
- --pf-v6-c-tree-view--m-compact--m-no-background__node--nested--PaddingBlockStart: 0;
11968
- --pf-v6-c-tree-view--m-compact--m-no-background__node--nested--PaddingBlockEnd: 0;
11969
- --pf-v6-c-tree-view--m-compact--m-no-background__node--before--InsetBlockStart: calc(var(--pf-v6-c-tree-view--m-compact__node-container--nested--PaddingBlockStart) + var(--pf-v6-c-tree-view--m-compact__node--nested--PaddingBlockStart) + 0.25rem);
11970
- }
11971
- .pfext-quick-start__base :where(:root, .pf-v6-c-wizard) {
10191
+ .pfext-quick-start__base .pf-v6-c-wizard {
11972
10192
  --pf-v6-c-wizard--Height: initial;
11973
10193
  --pf-v6-c-wizard--Height--base: 100%;
11974
10194
  --pf-v6-c-modal-box--c-wizard--Height--base: 47.625rem;
@@ -12009,7 +10229,8 @@ ul) {
12009
10229
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
12010
10230
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
12011
10231
  --pf-v6-c-wizard__nav-link-toggle--Color: var(--pf-t--global--icon--color--regular);
12012
- --pf-v6-c-wizard__nav-link-toggle-icon--Transition: var(--pf-t--global--transition);
10232
+ --pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
10233
+ --pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
12013
10234
  --pf-v6-c-wizard__nav-link-toggle-icon--Rotate: 0;
12014
10235
  --pf-v6-c-wizard__nav-item--m-expanded__link-toggle-icon--Rotate: 90deg;
12015
10236
  --pf-v6-c-wizard__nav-link--before--Width: var(--pf-t--global--icon--size--font--xl);
@@ -12083,7 +10304,7 @@ ul) {
12083
10304
  --pf-v6-c-wizard__footer--BorderBlockStartColor: var(--pf-t--global--border--color--default);
12084
10305
  }
12085
10306
  @media screen and (min-width: 62rem) {
12086
- .pfext-quick-start__base :where(:root, .pf-v6-c-wizard) {
10307
+ .pfext-quick-start__base .pf-v6-c-wizard {
12087
10308
  --pf-v6-c-wizard__nav--Width: var(--pf-v6-c-wizard__nav--lg--Width);
12088
10309
  --pf-v6-c-wizard__nav--BoxShadow: none;
12089
10310
  }
@@ -12389,7 +10610,7 @@ ul) {
12389
10610
  }
12390
10611
  .pfext-quick-start__base .pf-v6-c-wizard__nav-link-toggle-icon {
12391
10612
  display: inline-block;
12392
- transition: var(--pf-v6-c-wizard__nav-link-toggle-icon--Transition);
10613
+ transition: transform var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration) var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction);
12393
10614
  transform: rotate(var(--pf-v6-c-wizard__nav-link-toggle-icon--Rotate));
12394
10615
  }
12395
10616
  .pfext-quick-start__base :where(.pf-v6-m-dir-rtl, [dir="rtl"]) .pf-v6-c-wizard__nav-link-toggle-icon {
@@ -12426,7 +10647,7 @@ ul) {
12426
10647
  background-color: var(--pf-v6-c-wizard__footer--BackgroundColor);
12427
10648
  border-block-start: var(--pf-v6-c-wizard__footer--BorderBlockStartWidth) solid var(--pf-v6-c-wizard__footer--BorderBlockStartColor);
12428
10649
  }
12429
- .pfext-quick-start__base :where(:root, .pf-v6-l-bullseye) {
10650
+ .pfext-quick-start__base .pf-v6-l-bullseye {
12430
10651
  --pf-v6-l-bullseye--Padding: 0;
12431
10652
  }
12432
10653
  .pfext-quick-start__base .pf-v6-l-bullseye {
@@ -12437,7 +10658,7 @@ ul) {
12437
10658
  padding: var(--pf-v6-l-bullseye--Padding);
12438
10659
  margin: 0;
12439
10660
  }
12440
- .pfext-quick-start__base :where(:root, .pf-v6-l-flex) {
10661
+ .pfext-quick-start__base .pf-v6-l-flex {
12441
10662
  --pf-v6-l-flex--Display: flex;
12442
10663
  --pf-v6-l-flex--FlexWrap: wrap;
12443
10664
  --pf-v6-l-flex--AlignItems: baseline;
@@ -14814,7 +13035,7 @@ ul) {
14814
13035
  --pf-v6-l-flex--spacer--column: 0;
14815
13036
  }
14816
13037
  }
14817
- .pfext-quick-start__base :where(:root, .pf-v6-l-gallery) {
13038
+ .pfext-quick-start__base .pf-v6-l-gallery {
14818
13039
  --pf-v6-l-gallery--m-gutter--GridGap: var(--pf-t--global--spacer--gutter--default);
14819
13040
  --pf-v6-l-gallery--GridTemplateColumns--min: 250px;
14820
13041
  --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min);
@@ -14883,19 +13104,7 @@ ul) {
14883
13104
  --pf-v6-l-gallery--GridTemplateColumns--minmax--max:var(--pf-v6-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max))))));
14884
13105
  }
14885
13106
  }
14886
- .pfext-quick-start__base :where(:root, .pf-v6-l-grid) {
14887
- --pf-v6-l-grid--m-gutter--GridGap: var(--pf-t--global--spacer--gutter--default);
14888
- --pf-v6-l-grid__item--GridColumnStart: auto;
14889
- --pf-v6-l-grid__item--GridColumnEnd: span 12;
14890
- --pf-v6-l-grid--item--Order: 0;
14891
- }
14892
- .pfext-quick-start__base :where(:root, .pf-v6-l-level) {
14893
- --pf-v6-l-level--m-gutter--Gap: var(--pf-t--global--spacer--gutter--default);
14894
- }
14895
- .pfext-quick-start__base :where(:root, .pf-v6-l-split) {
14896
- --pf-v6-l-stack--m-gutter--Gap: var(--pf-t--global--spacer--gutter--default);
14897
- }
14898
- .pfext-quick-start__base :where(:root, .pf-v6-l-stack) {
13107
+ .pfext-quick-start__base .pf-v6-l-stack {
14899
13108
  --pf-v6-l-stack--m-gutter--Gap: var(--pf-t--global--spacer--gutter--default);
14900
13109
  }
14901
13110
  .pfext-quick-start__base .pf-v6-l-stack {